/* Consola · Usuarios y actividad: estilos propios de la pantalla. Solo tokens; clases con prefijo .cons-usuarios- */

/* ---------- Resumen de arriba (lo primero que se mira) ---------- */
.cons-usuarios-resumen { margin-bottom: var(--e-6); }
.cons-usuarios-resumen .kpi__valor { font-size: var(--t-24); }
.cons-usuarios-resumen .kpi__pie { color: var(--texto-2); }
.cons-usuarios-resumen .btn--enlace { font-size: var(--t-13); }

/* ---------- Barra de filtros ---------- */
.cons-usuarios-filtros {
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--e-3);
  margin-bottom: var(--e-4);
}
.cons-usuarios-filtros .buscador { flex: 1 1 260px; min-width: 0; }
.cons-usuarios-filtro { display: grid; gap: 4px; min-width: 0; }
.cons-usuarios-filtro .campo__etiqueta { font-size: var(--t-12); color: var(--texto-2); margin: 0; }
.cons-usuarios-filtro .select, .cons-usuarios-filtro .campo__control { width: 190px; max-width: 100%; }
.cons-usuarios-filtro--fecha .campo__control { width: 160px; }
.cons-usuarios-filtros .check { align-self: center; min-height: 40px; align-items: center; }
.cons-usuarios-filtros__limpiar { align-self: center; }
.cons-usuarios-conteo { font-size: var(--t-13); color: var(--texto-3); }

/* ---------- Tablas de usuarios ---------- */
.cons-usuarios-tabla .persona__nombre { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.cons-usuarios-tabla .persona__nombre .etiqueta { height: 20px; padding: 0 6px; font-size: var(--t-11); }
.cons-usuarios-tabla td { vertical-align: middle; }
.cons-usuarios-tabla td.tarjeta-titulo { min-width: 220px; }
#tabla-actividad td.tarjeta-titulo { min-width: 0; }
.cons-usuarios-tabla .persona { min-width: 200px; }
.cons-usuarios-tabla .celda-sub { white-space: normal; max-width: 180px; }
.cons-usuarios-celda { max-width: 190px; }
#tabla-equipo td[data-celda="alcance"], #tabla-ops td[data-etiqueta="Operador"] { white-space: normal; min-width: 130px; max-width: 170px; }
.cons-usuarios-marca { white-space: normal; height: auto; min-height: 22px; padding-block: 3px; line-height: 1.25; }
#tabla-equipo td[data-celda="rol"], #tabla-ops td[data-etiqueta="Rol"] { white-space: normal; min-width: 120px; max-width: 190px; }
#tabla-actividad td[data-etiqueta="Acción"], #tabla-actividad td[data-etiqueta="Objeto"], #tabla-actividad td[data-etiqueta="Motivo"] { white-space: normal; min-width: 160px; }
#tabla-actividad td[data-etiqueta="Motivo"] { max-width: 260px; }
/* Botón de solo ícono en escritorio; en el celular (tarjetas) muestra su texto */
.cons-usuarios-btn-texto { display: none; }
.cons-usuarios-celda { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.cons-usuarios-celda .celda-sub { margin-top: 0; }
.cons-usuarios-alcance { display: grid; gap: 1px; }
.cons-usuarios-alcance span:first-child { font-weight: 500; }
.cons-usuarios-acciones { display: inline-flex; flex-wrap: nowrap; align-items: center; justify-content: flex-end; gap: var(--e-1); }
.cons-usuarios-acciones--apiladas { flex-direction: column; align-items: flex-end; gap: 6px; }
.cons-usuarios-yo { font-size: var(--t-12); color: var(--texto-3); white-space: normal; max-width: 150px; text-align: right; display: inline-block; }
.cons-usuarios-marca--alerta { background: var(--alerta-fondo); color: var(--alerta); }
.cons-usuarios-marca--neutro { background: var(--neutro-fondo); color: var(--neutro); }
.cons-usuarios-fila-vacia td { white-space: normal; }
.cons-usuarios-fila-vacia:hover td { background: transparent !important; }
.tabla tr.cons-usuarios-resaltada td { animation: cons-usuarios-resalte 2.4s var(--curva) 1; }
.tabla tr.cons-usuarios-resaltada td:first-child { box-shadow: inset 3px 0 0 var(--primario); }
@keyframes cons-usuarios-resalte { 0%, 60% { background: var(--primario-suave); } 100% { background: transparent; } }
.tabla tr.cons-usuarios-nueva td { animation: cons-usuarios-resalte 2.4s var(--curva) 1; }

/* Tooltips de la columna de acciones: se abren hacia la izquierda para no salirse de la tabla */
.cons-usuarios-acciones [data-tooltip]::after { left: auto; right: 0; transform: translate(0, 4px); }
.cons-usuarios-acciones [data-tooltip]:hover::after,
.cons-usuarios-acciones [data-tooltip]:focus-visible::after { transform: translate(0, 0); }

/* Acciones con aria-disabled: siguen enfocables para que el tooltip explique por qué */
.cons-usuarios-acciones .btn[aria-disabled="true"]:hover { background: transparent; }

/* ---------- Matriz de roles ---------- */
.cons-usuarios-matriz thead th { vertical-align: bottom; }
.cons-usuarios-matriz thead .celda-sub { font-weight: 500; letter-spacing: 0; }
.cons-usuarios-matriz tbody th {
  position: sticky; left: 0; top: auto; z-index: 2;
  background: var(--superficie); color: var(--texto); font-size: var(--t-14); font-weight: 500; letter-spacing: 0;
  white-space: normal; min-width: 260px; padding: 8px 12px; border-bottom: 1px solid var(--borde); text-align: left;
}
.cons-usuarios-matriz tbody tr:hover th { background: var(--superficie-2); }
.cons-usuarios-matriz tbody tr:last-child th { border-bottom: 0; }
.cons-usuarios-matriz td { min-width: 120px; }
.cons-usuarios-parcial { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; color: var(--exito); }
.cons-usuarios-parcial__texto { font-size: var(--t-12); font-weight: 600; line-height: 1.2; color: var(--texto-2); white-space: nowrap; }
.cons-usuarios-leyenda { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2) var(--e-5); }
.cons-usuarios-leyenda__item { display: inline-flex; align-items: center; gap: 6px; }
.cons-usuarios-si { color: var(--exito); display: inline-grid; place-items: center; }
.cons-usuarios-deslizar { display: none; margin-bottom: var(--e-2); }

/* ---------- Modales: rol, operadores ---------- */
.cons-usuarios-roles .opcion-tarjeta { align-items: flex-start; }
.cons-usuarios-ops {
  list-style: none; margin: 0; padding: 0; display: grid;
  border: 1px solid var(--borde); border-radius: var(--radio-3); overflow: hidden; max-height: 280px; overflow-y: auto;
}
.cons-usuarios-ops li { border-bottom: 1px solid var(--borde); }
.cons-usuarios-ops li:last-child { border-bottom: 0; }
.cons-usuarios-ops .check { display: flex; width: 100%; padding: var(--e-3) var(--e-4); min-height: 48px; align-items: center; }
.cons-usuarios-ops .check:hover { background: var(--superficie-2); }
.cons-usuarios-ops__vacio { padding: var(--e-4); color: var(--texto-3); font-size: var(--t-14); text-align: center; }
.cons-usuarios-quien { display: flex; align-items: center; gap: var(--e-3); padding: var(--e-3) var(--e-4); border-radius: var(--radio-3); background: var(--superficie-2); border: 1px solid var(--borde); }
.cons-usuarios-quien .persona__meta { word-break: break-all; }
.cons-usuarios-error-grupo .campo__error { display: none; }
.cons-usuarios-error-grupo.campo--error .campo__error { display: flex; }
.cons-usuarios-explica { font-size: var(--t-14); color: var(--texto-2); }

/* ---------- Mi cuenta (bloques de seguridad, mismos que Ajustes del panel) ---------- */
.cons-usuarios-cuenta { align-items: start; }
.cons-usuarios-cuenta > .pila { min-width: 0; }

.cons-usuarios-perfil { display: flex; align-items: center; gap: var(--e-4); padding: var(--e-5); border-bottom: 1px solid var(--borde); }
.cons-usuarios-perfil__nombre { font-family: var(--fuente-titulo); font-size: var(--t-18); font-weight: 700; }
.cons-usuarios-perfil .avatar { width: 56px; height: 56px; font-size: var(--t-18); }
.cons-usuarios-cuenta .datos { padding: var(--e-4) var(--e-5); }
.cons-usuarios-cuenta .datos dd { word-break: break-word; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .cons-usuarios-filtro .select, .cons-usuarios-filtro .campo__control { width: 170px; }
}
@media (max-width: 767px) {
  .cons-usuarios-deslizar { display: block; }
  .cons-usuarios-filtros { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; }
  .cons-usuarios-filtros .buscador { grid-column: 1 / -1; }
  .cons-usuarios-filtro .select, .cons-usuarios-filtro .campo__control,
  .cons-usuarios-filtro--fecha .campo__control { width: 100%; }
  .cons-usuarios-filtros .check, .cons-usuarios-filtros__limpiar { justify-self: start; }
  .cons-usuarios-matriz tbody th { min-width: 180px; }
  .cons-usuarios-matriz td { min-width: 96px; }
}
@media (max-width: 640px) {
  /* En tarjetas, las acciones van a todo el ancho y envuelven */
  .tabla--tarjetas td.acciones .cons-usuarios-acciones,
  .tabla--tarjetas td.acciones .cons-usuarios-acciones--apiladas { flex-direction: row; flex-wrap: wrap; justify-content: flex-start; width: 100%; }
  .tabla--tarjetas td.acciones .cons-usuarios-yo { text-align: left; max-width: none; }
  .tabla--tarjetas td.acciones { justify-items: start; }
  .cons-usuarios-tabla td.tarjeta-titulo, .cons-usuarios-tabla .persona { min-width: 0; }
  .cons-usuarios-tabla .celda-sub, .cons-usuarios-celda { max-width: none; }
  .cons-usuarios-celda { align-items: flex-end; }
  #tabla-equipo td[data-celda="rol"], #tabla-ops td[data-etiqueta="Rol"],
  #tabla-equipo td[data-celda="alcance"], #tabla-ops td[data-etiqueta="Operador"],
  #tabla-actividad td[data-etiqueta] { min-width: 0; max-width: none; }
  .cons-usuarios-alcance { justify-items: end; text-align: right; }
  .cons-usuarios-btn-ico.btn--icono { width: auto; padding: 0 var(--e-3); }
  .cons-usuarios-btn-texto { display: inline; }
  .cons-usuarios-acciones [data-tooltip]::after { display: none; }
  .cons-usuarios-tabla td.tarjeta-titulo .persona { width: 100%; }
}
@media (max-width: 480px) {
  .cons-usuarios-filtros { grid-template-columns: minmax(0, 1fr); }
  .cons-usuarios-perfil { padding: var(--e-4); }
}