/* =====================================================================
   Seguridad y datos personales (js/vistas/privacidad.js, ficha y Configuración).
   Prefijos: .sg- (módulo), .fi-priv- (ficha), .cf-tabs-6 (Configuración con 6 pestañas).
   ===================================================================== */

/* ---------- Configuración con 6 pestañas (Llamadas, Correo, Meta, IA, Cuenta, Privacidad) ---------- */
.cf-tabs.cf-tabs-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.cf-tabs-6 .cf-tab-txt b { white-space: normal; line-height: 1.2; }
@media (max-width: 1700px) {
  .cf-tabs.cf-tabs-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cf-tabs-6 .cf-tab-det { display: inline; }
}
@media (max-width: 640px) { .cf-tabs.cf-tabs-6 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.cf-bitacora { min-width: 0; }

/* ---------- Ficha: datos personales ---------- */
.fi-privacidad { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--tlc-border-2); }
.fi-privacidad .seccion-titulo .ico { color: var(--tlc-blue); }
.fi-privacidad .enlace { margin-left: auto; }
.fi-priv-intro { margin: 0 0 12px; font-size: 12.5px; line-height: 1.5; color: var(--tlc-tinta-3); }
.fi-priv-fila { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--tlc-border); background: #fff; }
.fi-priv-fila + .fi-priv-fila { margin-top: 8px; }
.fi-priv-fila b { display: block; font-size: 13px; color: var(--tlc-navy); }
.fi-priv-fila small { display: block; margin-top: 2px; font-size: 12px; line-height: 1.45; color: var(--tlc-tinta-3); }
.fi-priv-fila.activa { border-color: #F0C9C6; background: #FEF8F7; }
.fi-priv-fila.activa b { color: var(--tlc-peligro); }
.fi-priv-fila .btn, .fi-peligro .btn { flex: none; }
.fi-peligro small { display: block; margin-top: 2px; line-height: 1.45; }
.fi-peligro.suave { margin-top: 8px; border-style: dashed; background: transparent; }
.fi-peligro.suave b { color: var(--tlc-tinta-2); }
@media (max-width: 640px) {
  .fi-priv-fila { flex-direction: column; align-items: flex-start; }
}

/* ---------- Modales de reautenticación y resultados ---------- */
.sg-reaut .sg-pw { padding-top: 12px; border-top: 1px dashed var(--tlc-border); }
/* «Contraseña del hub»: con candado, botón para ver lo escrito (.cf-secreto/.cf-ver de vistas.css) y aviso de mayúsculas. */
.sg-pw-caja .input { font-family: var(--tlc-sans); font-size: 14px; }
.sg-mayus { display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; font-size: 12.5px; font-weight: 600; color: var(--tlc-gold-osc); }
.sg-mayus[hidden] { display: none; }
.sg-mayus .ico { width: 14px; height: 14px; }
.sg-casilla { align-items: flex-start; line-height: 1.45; }
.sg-casilla input { margin-top: 2px; flex: none; }
.sg-lista { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; font-size: 13px; color: var(--tlc-tinta-2); }
.sg-lista li { display: flex; align-items: flex-start; gap: 8px; }
.sg-lista .ico { margin-top: 2px; flex: none; color: var(--tlc-tinta-3); }
.sg-conteo { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.sg-conteo li { display: flex; align-items: baseline; gap: 6px; padding: 6px 10px; border-radius: 10px; background: var(--tlc-cream-2); font-size: 12.5px; color: var(--tlc-tinta-2); }
.sg-conteo b { font-family: var(--tlc-titulo); font-size: 15px; color: var(--tlc-navy); }
.sg-comprobantes { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--tlc-border-2); background: #FDFBF7; font-size: 13px; }
.sg-comprobantes ul { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 6px 0 0; padding: 0; list-style: none; }
.sg-comprobantes a { display: inline-flex; align-items: center; gap: 6px; min-height: 28px; color: var(--tlc-blue); font-weight: 600; }

/* ---------- Configuración › Privacidad ---------- */
.sg-rejilla { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
@media (max-width: 1280px) { .sg-rejilla { grid-template-columns: minmax(0, 1fr); } }
.sg-resumen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.sg-resumen li { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--tlc-border-2); background: #FDFBF7; font-size: 12px; color: var(--tlc-tinta-3); }
.sg-resumen b { font-family: var(--tlc-titulo); font-size: 20px; color: var(--tlc-navy); }
.sg-resumen li.rojo { border-color: #F0C9C6; background: #FEF8F7; }
.sg-resumen li.rojo b { color: var(--tlc-peligro); }
.sg-resumen li.amarillo { border-color: #F2DDA4; background: var(--tlc-gold-claro); }
.sg-resumen li.amarillo b { color: var(--tlc-gold-osc); }
.sg-filtro { display: flex; justify-content: flex-end; }
.sg-tabla td { vertical-align: top; }
/* Los .sr (position:absolute) dentro de la tabla no deben escaparse del contenedor con scroll. */
.tabla-envoltura:has(.sg-tabla) { position: relative; }
.sg-derecho { color: var(--tlc-navy); font-weight: 700; white-space: nowrap; }
.sg-folio { white-space: nowrap; font-size: 11px; }
/* Secreto enmascarado (••••a1b2): el valor en su renglón y los botones abajo, para que se vean los últimos 4. */
.cf-url-fila.sg-fila-secreto { flex-wrap: wrap; }
.cf-url-fila.sg-fila-secreto .input { flex: 1 1 100%; letter-spacing: .08em; }
.sg-sub { display: block; margin-top: 2px; font-size: 11.5px; color: var(--tlc-tinta-3); }
.sg-plazo { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--tlc-border-2); }
.sg-plazo label { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 13px; color: var(--tlc-navy); cursor: pointer; }
.sg-plazo small { font-size: 11.5px; line-height: 1.4; color: var(--tlc-tinta-3); }
.sg-plazo-valor { display: flex; align-items: center; gap: 8px; flex: none; font-size: 12.5px; color: var(--tlc-tinta-3); }
.sg-plazo-valor .input { width: 86px; text-align: right; font-variant-numeric: tabular-nums; }
.sg-enlaces { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.sg-enlaces a { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; font-size: 13px; font-weight: 600; color: var(--tlc-blue); }
.sg-incidente { padding: 0; }
.sg-incidente summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 16px 20px; cursor: pointer; list-style: none; font-size: 13.5px; color: var(--tlc-navy); }
.sg-incidente summary::-webkit-details-marker { display: none; }
.sg-incidente summary span { display: flex; align-items: center; gap: 10px; }
.sg-incidente summary .ico { color: var(--tlc-peligro); }
.sg-incidente .sg-chev { color: var(--tlc-tinta-3); transition: transform var(--t); }
.sg-incidente[open] .sg-chev { transform: rotate(180deg); }
.sg-pasos { margin: 0; padding: 0 20px 18px 40px; display: flex; flex-direction: column; gap: 8px; font-size: 12.5px; line-height: 1.55; color: var(--tlc-tinta-2); }
.sg-pasos b { color: var(--tlc-navy); }

/* ---------- Configuración › Cuenta y sesiones ---------- */
.sg-sesiones { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.sg-sesiones li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; border: 1px solid var(--tlc-border); background: #fff; }
.sg-sesiones li.este { border-color: #BFD3EC; background: var(--tlc-sky-claro); }
.sg-ses-ic { width: 34px; height: 34px; flex: none; display: grid; place-items: center; border-radius: 10px; background: var(--tlc-cream-2); color: var(--tlc-navy); }
.sg-ses-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.sg-ses-txt b { font-size: 13px; color: var(--tlc-navy); }
.sg-ses-txt small { font-size: 11.5px; line-height: 1.4; color: var(--tlc-tinta-3); overflow-wrap: anywhere; }
.sg-este { display: inline-block; margin-left: 4px; padding: 1px 8px; border-radius: 999px; background: var(--tlc-navy); color: #fff; font-size: 10.5px; font-weight: 700; vertical-align: 1px; }
.sg-2fa { display: flex; align-items: flex-start; gap: 6px; line-height: 1.45; }
.sg-2fa .ico { margin-top: 2px; flex: none; color: var(--tlc-blue); }
.sg-dos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.sg-fijos { overflow-wrap: anywhere; }
.sg-ev { display: inline-flex; align-items: center; gap: 6px; color: var(--tlc-navy); font-weight: 600; }
.sg-ev .ico { color: var(--tlc-blue); flex: none; }
.sg-malo .sg-ev, .sg-malo .sg-ev .ico { color: var(--tlc-peligro); }
.sg-det { max-width: 340px; font-size: 12px; color: var(--tlc-tinta-3); overflow-wrap: anywhere; }
@media (max-width: 640px) {
  .sg-dos { grid-template-columns: minmax(0, 1fr); }
  .sg-resumen li { padding: 8px 10px; font-size: 11.5px; }
  .sg-resumen b { font-size: 18px; }
  .sg-sesiones li { flex-wrap: wrap; }
  .sg-sesiones li .btn { width: 100%; }
  .sg-plazo { flex-direction: column; align-items: flex-start; }
}
