/* themes/fanny.css — tema infantil, alegre e acessível */
@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@600&family=Nunito:wght@400;700&display=swap');

:root{
  --bg:#fff9fb;          /* fundo rosado clarinho */
  --card:#ffffff;        /* cartões brancos */
  --txt:#2a2230;         /* texto escuro (bom contraste) */
  --muted:#7a6b77;       /* texto secundário */
  --line:#f3d9e1;        /* linhas suaves */
  --brand:#ff6fa9;       /* rosa vibrante para ênfases/links */
  --brand-2:#ffd06b;     /* amarelo pastel de apoio */
  --grad: linear-gradient(90deg, #ffadd6, #ffd280, #b8e1ff, #c7f5a4); /* navbar/botões */
  --font-size-base: 18px;
  --radius: 16px;        /* cantos mais arredondados */
  --login-accent:var(--brand);
}
.auth-left{ 
	background: var(--grad); 
	color: var(--txt); 
}

html, body { font-family: 'Nunito', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
h1, h2, h3, .navbar-brand { font-family: 'Baloo 2', cursive; }

/* Fundo com textura sutil (sem imagens externas) */
body{
  background:
    radial-gradient(circle at 24px 24px, rgba(255, 173, 214, .12) 2px, transparent 2px) 0 0 / 48px 48px,
    radial-gradient(circle at 12px 12px, rgba(184, 225, 255, .12) 2px, transparent 2px) 0 0 / 48px 48px,
    var(--bg);
  color: var(--txt);
}

/* Navbar colorida e alta (usa a altura definida no layout) */
.navbar{ background: var(--grad) !important; }
.navbar .navbar-brand, .navbar .nav-link, .navbar .btn{ color:#fff !important; }

/* Cartões fofos */
.card{
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 6px 18px rgba(255, 111, 169, .12);
}

/* Botões */
.btn-grad{
  background: var(--grad) !important;
  border: none !important;
  color: #fff !important;
  transition: transform .08s ease, box-shadow .08s ease;
  box-shadow: 0 3px 0 rgba(255, 111, 169, .25);
}
.btn-grad:hover{ transform: translateY(-1px); }
.btn-outline{
  border: 1px solid var(--line);
  color: var(--txt);
  background: #fff;
}
.btn-outline:hover{
  border-color: var(--brand);
}

/* Inputs */
.form-control, .form-select{
  background: #fff;
  color: var(--txt);
  border-color: var(--line);
}
.form-control:focus, .form-select:focus{
  border-color: var(--brand);
  box-shadow: 0 0 0 .2rem rgba(255, 111, 169, .18);
}

/* Links */
a, .link-muted:hover{ color: var(--brand); }

/* Avatares com “borda balão” */
.avatar{
  width: 44px; height: 44px;
  border-radius: 50%;
  object-fit: cover;
  background: #fff1f6;
  border: 3px solid #ffe5f0;
}

/* Upload estilizado */
.file-btn .btn{ border-color: var(--line); }
.file-btn .btn:hover{ border-color: var(--brand); }

/* Footer links */
footer small a{ color: var(--muted); }
footer small a:hover{ color: var(--brand); }