/* =============================================
   GenesysCore — Skin GLASS (glassmorphism)
   Vidrio esmerilado sobre fondo degradado sobrio.
   Se adapta a tema claro/oscuro. Las variables de color
   viven en variables.css ([data-skin="glass"] y su variante oscura).
   ============================================= */

/* ── Fondo: degradado neutro grisáceo liso (sobrio, sin blobs) ── */
:root[data-skin="glass"] body,
:root[data-skin="glass"] .admin-layout {
    background:
        linear-gradient(135deg, #eef0f3 0%, #e2e5ea 50%, #d5d9e0 100%);
    background-attachment: fixed;
}
:root[data-skin="glass"][data-tema="oscuro"] body,
:root[data-skin="glass"][data-tema="oscuro"] .admin-layout {
    background:
        linear-gradient(135deg, #16181d 0%, #121419 50%, #0f1115 100%);
    background-attachment: fixed;
}

/* ── Fondo del login en Glass ── */
:root[data-skin="glass"] .login-pagina {
    background: linear-gradient(135deg, #eef0f3 0%, #e2e5ea 50%, #d5d9e0 100%);
}
:root[data-skin="glass"][data-tema="oscuro"] .login-pagina {
    background: linear-gradient(135deg, #16181d 0%, #121419 50%, #0f1115 100%);
}

/* ── Superficies de vidrio: blur + borde de luz + sombra difusa ── */
:root[data-skin="glass"] .stat-card,
:root[data-skin="glass"] .tabla-contenedor,
:root[data-skin="glass"] .perfil-card,
:root[data-skin="glass"] .pref-panel,
:root[data-skin="glass"] .sidebar-flyout {
    background: var(--color-bg-card);
    border: 1px solid var(--color-borde);
    backdrop-filter: blur(18px) saturate(1.4);
    -webkit-backdrop-filter: blur(18px) saturate(1.4);
    box-shadow: var(--glow);
}

/* Sidebar de vidrio */
:root[data-skin="glass"] .sidebar {
    background: var(--sidebar-bg);
    border-right: 1px solid var(--sidebar-borde);
    backdrop-filter: blur(20px) saturate(1.5);
    -webkit-backdrop-filter: blur(20px) saturate(1.5);
}

/* Topbar de vidrio */
:root[data-skin="glass"] .topbar {
    background: var(--color-bg-card);
    border-bottom: 1px solid var(--color-borde);
    backdrop-filter: blur(20px) saturate(1.5);
    -webkit-backdrop-filter: blur(20px) saturate(1.5);
}

/* Footer de vidrio */
:root[data-skin="glass"] .app-footer {
    background: var(--color-bg-suave);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

/* Ítem activo del menú con acento de vidrio */
:root[data-skin="glass"] .sidebar-item.activo,
:root[data-skin="glass"] .submenu-item.activo {
    background: var(--sidebar-activo);
    box-shadow: inset 0 0 0 1px rgba(var(--color-primario-rgb), .25);
    color: var(--color-primario);
    font-weight: 700;
}

/* Botón primario de vidrio (translúcido con brillo) */
:root[data-skin="glass"] .btn-primario {
    background: linear-gradient(135deg,
        rgba(var(--color-primario-rgb), .95),
        rgba(var(--color-primario-rgb), .80));
    border: 1px solid rgba(255,255,255,.35);
    box-shadow: 0 4px 16px rgba(var(--color-primario-rgb), .30), inset 0 1px 0 rgba(255,255,255,.4);
    color: #ffffff;
}
:root[data-skin="glass"] .btn-primario:hover {
    box-shadow: 0 6px 22px rgba(var(--color-primario-rgb), .42), inset 0 1px 0 rgba(255,255,255,.5);
}

/* Botón secundario de vidrio */
:root[data-skin="glass"] .btn-secundario {
    background: var(--color-bg-card);
    border: 1px solid var(--color-borde);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* Campos de formulario de vidrio */
:root[data-skin="glass"] input,
:root[data-skin="glass"] select,
:root[data-skin="glass"] textarea {
    background: var(--color-bg-suave);
    border: 1px solid var(--color-borde-suave);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
:root[data-skin="glass"] input:focus,
:root[data-skin="glass"] select:focus,
:root[data-skin="glass"] textarea:focus {
    border-color: rgba(var(--color-primario-rgb), .6);
    box-shadow: 0 0 0 3px rgba(var(--color-primario-rgb), .14);
}

/* Modal de vidrio */
:root[data-skin="glass"] .modal {
    --modal-bg:    var(--color-bg-card);
    --modal-borde: var(--color-borde);
    box-shadow: var(--sombra-lg), var(--glow);
    backdrop-filter: blur(28px) saturate(1.6);
    -webkit-backdrop-filter: blur(28px) saturate(1.6);
}

/* Tarjeta de empresa en el sidebar */
:root[data-skin="glass"] .sidebar-empresa-box {
    background: var(--color-bg-suave);
    border: 1px solid var(--color-borde-suave);
    border-radius: var(--radio-lg);
}
