/* Panel (/gestion y /user). Usa las variables de principal.css. */

body.panel { display: flex; flex-direction: column; min-height: 100vh; background: var(--au-fondo-alterno); }
.panel .topbar .form-select { width: auto; min-width: 14rem; }
.panel .site-nav .nav-link.active, .panel .site-nav .dropdown-item.active { color: var(--au-acento); background: transparent; font-weight: 600; }
.panel .site-nav .dropdown-item.active { color: var(--au-acento) !important; }
.panel .tarjeta:hover { transform: none; box-shadow: none; }
.panel .tarjeta-enlace { color: var(--au-texto); }
.panel .tarjeta-enlace:hover { border-color: var(--au-primario); box-shadow: 0 6px 18px rgba(20,58,84,.08); }
.panel .table { --bs-table-bg: transparent; }
.panel .table th { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--au-texto-suave); font-weight: 600; }
.panel .table td, .panel .table th { padding: .75rem 1rem; }
.cifra { font-family: var(--au-fuente-titulos); font-size: 1.5rem; font-weight: 700; color: var(--au-primario); }
.panel-pie { background: #fff; border-top: 1px solid var(--au-borde); color: var(--au-texto-suave); }
.panel-pie a { color: inherit; }

.estado-borrador { background: #ffc107; color: #000; }
.estado-activa { background: #198754; }
.estado-suspendida { background: #dc3545; }

.logo-previa { background: repeating-conic-gradient(#eee 0% 25%, #fff 0% 50%) 0 0 / 16px 16px; border: 1px solid var(--au-borde); border-radius: .5rem; padding: 1rem; text-align: center; }
.logo-previa img { max-width: 100%; max-height: 120px; }

/* Matriz de permisos: cabeceras de rol en vertical para que quepan. */
.matriz thead th { vertical-align: bottom; }
.matriz .rol-col { display: inline-block; writing-mode: vertical-rl; transform: rotate(180deg); white-space: nowrap; font-size: .75rem; text-transform: none; letter-spacing: 0; }
.matriz .rol-admin { color: var(--au-primario); }

/* Acceso */
.pagina-acceso { align-items: center; justify-content: center; padding: 2rem 16px; }
.acceso { width: 100%; max-width: 400px; }
.acceso-marca { color: var(--au-primario); font-family: var(--au-fuente-titulos); font-size: 1.5rem; font-weight: 700; }