/* Alva Marketing · marca v7.1 · páginas públicas do Listmonk
   As páginas de descadastro e preferências atendem as quatro marcas,
   por isso o logo aparece só na tela de login da equipe. */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,600&family=Instrument+Sans:wght@400;500;600&display=swap');

:root {
  --alva-brand: #286EEA;
  --alva-brand-dark: #1655C9;
  --alva-ink: #101828;
  --alva-muted: #667085;
  --alva-surface: #F7F9FC;
  --alva-line: #E7ECF3;
}

html, body {
  background: var(--alva-surface);
  color: var(--alva-ink);
  font-family: 'Instrument Sans', 'Helvetica Neue', Arial, sans-serif;
}

a { color: var(--alva-brand); }
a:hover { color: var(--alva-brand-dark); }

h2, h3, h4 {
  font-family: 'Bricolage Grotesque', 'Instrument Sans', sans-serif;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--alva-ink);
}

.wrap {
  background: #FFFFFF;
  border: 1px solid var(--alva-line);
  border-radius: 16px;
  box-shadow: 0 20px 50px -30px rgba(16, 24, 40, 0.25);
}

.header .logo { display: none; }
.wrap:has(.login) .header .logo { display: block; }
.wrap:has(.login) .header .logo img {
  content: url('/uploads/alva-symbol-blue.png');
  width: auto;
  max-width: none;
  height: 44px;
}

input[type="text"], input[type="email"], input[type="password"], select {
  border: 1px solid var(--alva-line);
  border-radius: 10px;
  font-family: inherit;
}
input:focus { border-color: var(--alva-brand); box-shadow: 0 0 0 3px rgba(40, 110, 234, 0.18); }

.button, .login button {
  background: var(--alva-brand);
  border-color: var(--alva-brand);
  border-radius: 10px;
  font-family: inherit;
  font-weight: 600;
}
.button:hover, .login button:hover { background: var(--alva-brand-dark); border-color: var(--alva-brand-dark); }
.button.button-outline { background: transparent; color: var(--alva-brand); border-color: var(--alva-brand); }
.button.button-outline:hover { background: #EAF2FF; color: var(--alva-brand-dark); }

.lists .description, .small, .archive .date { color: var(--alva-muted); }
.pg-page.pg-selected { background: var(--alva-brand); color: #FFFFFF; }

footer.container, footer a { color: var(--alva-muted); }