/* ═══════════════════════════════════════════════════════
   MediRecord — Administración: «Ver usuarios» y el interruptor del modo de prueba (2 pasos)
═══════════════════════════════════════════════════════ */

/* ── Barra superior con el interruptor ── */
.sg-barra { border-bottom: 1px solid var(--line); background: var(--paper); transition: background .5s var(--ease, ease), border-color .5s; }
.sg-barra[hidden] { display: none; }
.sg-barra.sg-prueba   { background: #f3e8ff; border-bottom-color: #d8b4fe; }
.sg-barra.sg-estricto { background: var(--ok-bg);   border-bottom-color: #86efac; }
.sg-in { display: flex; align-items: center; gap: 1rem; padding-top: .5rem; padding-bottom: .5rem; }
.sg-txt { display: grid; gap: .1rem; min-width: 0; flex: 1; }
.sg-txt strong { font-size: .92rem; color: var(--ink); display: flex; flex-wrap: wrap; align-items: center; gap: .2rem .6rem; }
.sg-txt span#sg-estado { font-size: .82rem; color: var(--ink-soft); line-height: 1.35; }
.sg-chip { font-size: .72rem; font-weight: 700; padding: .12rem .55rem; border-radius: 999px; background: rgba(255,255,255,.75); color: var(--ink); border: 1px solid rgba(15,23,42,.1); animation: sg-pop .4s var(--ease, ease) both; }
.sg-chip[hidden] { display: none; }
.sg-sw-wrap { display: flex; align-items: center; gap: .6rem; flex-shrink: 0; }
.sg-sw-lbl { font-size: .78rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-soft); min-width: 5.6rem; text-align: right; }
.sg-prueba .sg-sw-lbl { color: #6d28d9; }
.sg-estricto .sg-sw-lbl { color: var(--ok); }

.sg-sw { position: relative; width: 3.4rem; height: 1.9rem; border: 0; border-radius: 999px; padding: 0; cursor: pointer; background: #94a3b8;
  box-shadow: inset 0 1px 3px rgba(15,23,42,.25); transition: background .35s var(--ease, ease), box-shadow .3s; flex-shrink: 0; }
.sg-sw[aria-checked="true"] { background: #7c3aed; }
.sg-sw[aria-checked="false"] { background: #16a34a; }
.sg-sw:focus-visible { outline: 3px solid var(--primary-300); outline-offset: 2px; }
.sg-sw:disabled { cursor: not-allowed; opacity: .6; }
.sg-knob { position: absolute; top: .2rem; left: .2rem; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: #fff;
  box-shadow: 0 2px 5px rgba(15,23,42,.35); transition: transform .38s cubic-bezier(.34, 1.56, .64, 1); }
.sg-sw[aria-checked="true"] .sg-knob { transform: translateX(1.5rem); }
.sg-sw:active:not(:disabled) .sg-knob { width: 1.8rem; }
.sg-sw[aria-checked="true"]:active:not(:disabled) .sg-knob { transform: translateX(1.2rem); }
.sg-ocupado .sg-knob::after { content: ""; position: absolute; inset: .3rem; border-radius: 50%; border: 2px solid #cbd5e1; border-top-color: var(--primary); animation: sg-gira .7s linear infinite; }

@keyframes sg-gira { to { transform: rotate(360deg); } }
@keyframes sg-pop { from { opacity: 0; transform: scale(.85); } to { opacity: 1; transform: none; } }

/* ── Ventanita «Ver usuarios» ── */
dialog.ventana.sg-ventana[open] { animation: sg-abre .45s cubic-bezier(.34, 1.4, .64, 1); }
@keyframes sg-abre { from { opacity: 0; transform: translateY(30px) scale(.9); } to { opacity: 1; transform: none; } }
.sg-ayuda { margin: 0 0 .6rem; color: var(--ink-soft); font-size: .9rem; line-height: 1.45; }
.sg-carga { display: flex; align-items: center; gap: .6rem; color: var(--ink-soft); margin: .5rem 0; }
.sg-gira { width: 1.1rem; height: 1.1rem; border-radius: 50%; border: 3px solid var(--primary-100); border-top-color: var(--primary); animation: sg-gira .8s linear infinite; }
.sg-lista { list-style: none; margin: .4rem 0 0; padding: 0; display: grid; gap: .55rem; }
.sg-u { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .85rem; padding: .7rem .85rem;
  border: 1px solid var(--line); border-radius: 12px; background: #fff; animation: sg-entra .45s var(--ease, ease) both; animation-delay: calc(var(--i, 0) * 55ms); }
.sg-u.inactivo { opacity: .65; background: var(--paper); }
@keyframes sg-entra { from { opacity: 0; transform: translateX(-14px); } to { opacity: 1; transform: none; } }
.sg-av { width: 2.4rem; height: 2.4rem; border-radius: 50%; display: grid; place-items: center; font-weight: 800; color: var(--primary-dark);
  background: linear-gradient(135deg, var(--primary-100), #e0e7ff); }
.sg-u-dat { display: grid; gap: .15rem; min-width: 0; }
.sg-u-correo { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sg-u-pills { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .1rem; }
.pill.sg-origen { background: #f1f5f9; color: var(--ink-soft); }
.sg-u-2fa { display: flex; flex-direction: column; align-items: flex-end; gap: .4rem; }


/* ── Presencia en vivo ── */
.sg-top { display: flex; align-items: flex-start; justify-content: space-between; gap: .8rem; }
.sg-vivo { display: inline-flex; align-items: center; gap: .35rem; flex-shrink: 0; font-size: .72rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--ok); background: var(--ok-bg); padding: .2rem .6rem; border-radius: 999px; }
.sg-vivo i { width: .5rem; height: .5rem; border-radius: 50%; background: #16a34a; animation: sg-pulso 1.6s ease-out infinite; }
.sg-pres { display: flex; align-items: center; gap: .4rem; color: var(--ink-soft); }
.sg-punto { width: .55rem; height: .55rem; border-radius: 50%; background: #cbd5e1; flex-shrink: 0; }
.sg-punto.en { background: #16a34a; animation: sg-pulso 1.6s ease-out infinite; }
.sg-pres-t.en { color: var(--ok); font-weight: 700; }
.sg-av { position: relative; }
.sg-av.en::after { content: ""; position: absolute; right: -1px; bottom: -1px; width: .7rem; height: .7rem; border-radius: 50%; background: #16a34a; border: 2px solid #fff; }
.sg-nota { margin: .8rem 0 0; line-height: 1.4; }
@keyframes sg-pulso { 0% { box-shadow: 0 0 0 0 rgba(22,163,74,.55); } 70% { box-shadow: 0 0 0 .5rem rgba(22,163,74,0); } 100% { box-shadow: 0 0 0 0 rgba(22,163,74,0); } }
.sg-sin-anim .sg-u { animation: none; }
.sg-u.sg-destello { animation: sg-destello 1.2s ease; }
@keyframes sg-destello { 0% { background: var(--ok-bg); transform: scale(1.02); } 100% { background: #fff; transform: none; } }

/* ── Onda de color a pantalla completa al cambiar el interruptor ── */
.sg-onda { position: fixed; inset: 0; z-index: 30000; pointer-events: none; overflow: hidden; --c: 124, 58, 237; }
.sg-onda.estricto { --c: 22, 163, 74; }
.sg-onda-velo { position: absolute; inset: 0; background: rgba(var(--c), .26); opacity: 0; animation: sg-velo .75s ease-out both; }
.sg-onda-aro, .sg-onda-aro2 { position: absolute; left: var(--x); top: var(--y); width: var(--d); height: var(--d); margin: calc(var(--d) / -2) 0 0 calc(var(--d) / -2); border-radius: 50%;
  background: radial-gradient(circle closest-side, rgba(var(--c), 0) 0%, rgba(var(--c), 0) 62%, rgba(var(--c), .55) 80%, rgba(var(--c), .9) 90%, rgba(var(--c), 0) 100%);
  transform: scale(0); opacity: 1; animation: sg-aro .85s cubic-bezier(.12, .7, .2, 1) both; }
.sg-onda-aro2 { animation-duration: .7s; animation-delay: .1s; opacity: .7; }
.sg-onda-nucleo { position: absolute; left: var(--x); top: var(--y); width: 5rem; height: 5rem; margin: -2.5rem 0 0 -2.5rem; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.95), rgba(var(--c), .8) 45%, rgba(var(--c), 0) 70%); transform: scale(0); animation: sg-nucleo .55s ease-out both; }
@keyframes sg-velo { 0% { opacity: 0; } 12% { opacity: 1; } 100% { opacity: 0; } }
@keyframes sg-aro { 0% { transform: scale(0); opacity: 1; } 75% { opacity: .9; } 100% { transform: scale(1); opacity: 0; } }
@keyframes sg-nucleo { 0% { transform: scale(0); opacity: 1; } 100% { transform: scale(2.6); opacity: 0; } }

@media (max-width: 640px) {
  .sg-in { flex-wrap: wrap; }
  .sg-sw-wrap { margin-left: auto; }
  .sg-u { grid-template-columns: auto 1fr; }
  .sg-u-2fa { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; align-items: center; }
}
@media (prefers-reduced-motion: reduce) {
  .sg-sw, .sg-knob, .sg-barra { transition: none; }
  .sg-u, .sg-chip, dialog.ventana.sg-ventana[open], .sg-u.sg-destello, .sg-vivo i, .sg-punto.en, .sg-onda * { animation: none; }
  .sg-onda { display: none; }
}

/* Cuenta única: etiqueta «Portal ✓» en la fila del doctor */
.pill.sg-portal { background: #dbeafe; color: #1d4ed8; }