/* ==========================================================================
   Portal do Aluno UNIP — fundamentos visuais compartilhados
   ========================================================================== */

:root {
  /* Azuis institucionais do app */
  --azul-topo: #0C2FA6;
  --azul-meio: #0A2896;
  --azul-fundo: #041F80;
  --azul-base: #001A66;
  --azul-marca: #002B7F;
  --azul-escuro: #001C63;

  /* Cores de apoio */
  --amarelo: #FFE800;
  --vermelho: #D8121C;
  --verde-claro: #17A64B;
  --verde-escuro: #06611F;

  /* Vidro sobre o azul */
  --vidro: rgba(255, 255, 255, 0.08);
  --vidro-forte: rgba(255, 255, 255, 0.12);
  --borda-vidro: rgba(255, 255, 255, 0.16);
  --texto: #FFFFFF;
  --texto-suave: rgba(255, 255, 255, 0.62);
  --placeholder: rgba(255, 255, 255, 0.42);

  --raio: 12px;
  --raio-card: 22px;
  --fonte: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

html,
body {
  height: 100%;
}

body {
  font-family: var(--fonte);
  color: var(--texto);
  background: var(--azul-base);
  overscroll-behavior-y: none;
  -webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

button {
  border: 0;
  background: none;
  cursor: pointer;
}

a {
  color: inherit;
  text-decoration: none;
}

/* Fundo azul com os dois círculos suaves — usado na splash e no login */
.fundo-azul {
  position: fixed;
  inset: 0;
  background: linear-gradient(180deg, var(--azul-topo) 0%, var(--azul-meio) 38%, var(--azul-fundo) 70%, var(--azul-base) 100%);
  overflow: hidden;
  z-index: 0;
}

.fundo-azul::before,
.fundo-azul::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.05);
}

.fundo-azul::before {
  width: 87vw;
  height: 87vw;
  top: -40vw;
  right: -27vw;
}

.fundo-azul::after {
  width: 68vw;
  height: 68vw;
  bottom: -34vw;
  left: -31vw;
  background: rgba(255, 255, 255, 0.05);
}

/* Aviso flutuante (toast) */
.toast {
  position: fixed;
  left: 50%;
  bottom: calc(28px + env(safe-area-inset-bottom, 0px));
  transform: translate(-50%, 20px);
  max-width: min(88vw, 420px);
  padding: 13px 18px;
  border-radius: 14px;
  background: rgba(0, 20, 70, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.34);
  color: #fff;
  font-size: 14px;
  line-height: 1.35;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease, transform 0.22s ease;
  z-index: 90;
}

.toast.visivel {
  opacity: 1;
  transform: translate(-50%, 0);
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
