/* Dashboards dentro del portal: pantalla de carga y botones Portal / Salir.
   La pantalla de carga usa el mismo degradado que la tarjeta del portal, así la transición
   (tarjeta que se expande -> carga -> dashboard) se ve continua. Ver portal.css (.tarjeta). */
[data-tablero="cx"]{--g1:#00807C;--g2:#003C68;--brillo:rgba(95,224,212,.35);}
[data-tablero="tv"]{--g1:#0083BE;--g2:#002A4A;--brillo:rgba(127,216,245,.35);}

body.cargando{overflow:hidden;}

.cargador{
  position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:24px;
  background:
    radial-gradient(circle at 20% 15%,var(--brillo),transparent 45%),
    linear-gradient(140deg,var(--g1) 0%,var(--g2) 75%);
  color:#fff;transition:opacity .55s ease,transform .55s cubic-bezier(.2,.8,.2,1);
}
.cargador.salir{opacity:0;transform:scale(1.03);pointer-events:none;}
.cargador-contenido{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;}
.cargador-icono{
  width:72px;height:72px;border-radius:20px;display:grid;place-items:center;
  background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);
  margin-bottom:6px;
}
.cargador-icono svg{width:34px;height:34px;}
.cargador-titulo{margin:0;font:700 30px/1.15 'Outfit','Fira Sans',sans-serif;letter-spacing:-.3px;}
.cargador-texto{margin:0;font-size:15px;color:rgba(255,255,255,.82);max-width:360px;}
.cargador-barra{width:180px;height:4px;border-radius:99px;background:rgba(255,255,255,.18);overflow:hidden;margin-top:8px;}
.cargador-barra span{display:block;width:40%;height:100%;border-radius:inherit;background:#fff;animation:barra 1.1s ease-in-out infinite;}
@keyframes barra{0%{transform:translateX(-100%);}100%{transform:translateX(260%);}}
.cargador.con-error .cargador-barra{display:none;}
.cargador.con-error .cargador-texto{color:#FFE1EF;}
.cargador-volver{
  margin-top:10px;min-height:44px;display:inline-flex;align-items:center;padding:0 20px;border-radius:999px;
  background:#fff;color:var(--g2);font-weight:600;text-decoration:none;
}

.btn-tablero{
  order:2;display:flex;align-items:center;gap:6px;min-height:38px;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);border-radius:999px;
  padding:8px 14px;font-size:12.5px;color:#EAF3F8;text-decoration:none;transition:background .15s;
}
.btn-tablero:hover{background:rgba(255,255,255,.2);}
.btn-tablero svg{width:15px;height:15px;}

@media (prefers-reduced-motion: reduce){
  .cargador{transition:none;}
  .cargador-barra span{animation:none;width:100%;opacity:.6;}
}