@import url('tokens.css');

/* Fontes locais (funcionam offline e respeitam a CSP). Subconjunto latino cobre o português. */
@font-face { font-family: 'Lora'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/lora-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Lora'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/lora-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Lora'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/lora-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Lora'; font-style: italic; font-weight: 400; font-display: swap; src: url('../fonts/lora-400-italic.woff2') format('woff2'); }
@font-face { font-family: 'Nunito Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/nunito-sans-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Nunito Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/nunito-sans-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Nunito Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/nunito-sans-700-normal.woff2') format('woff2'); }
@font-face { font-family: 'Nunito Sans'; font-style: normal; font-weight: 800; font-display: swap; src: url('../fonts/nunito-sans-800-normal.woff2') format('woff2'); }

*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  color-scheme: light;
  background: var(--pd-bg);
}
html[data-theme="dark"] { color-scheme: dark; }

body {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  background: var(--pd-bg);
  color: var(--pd-text);
  font-family: var(--pd-font-sans);
  font-size: 1rem;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, p, blockquote, figure { margin: 0; }
h1:focus { outline: none; }
a { color: var(--pd-primary-text); }
button { font: inherit; color: inherit; }
img, svg { display: block; max-width: 100%; }

/* Foco visível em tudo que é interativo (navegação por teclado) */
:focus-visible { outline: 3px solid var(--pd-primary-text); outline-offset: 2px; border-radius: 4px; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

.skip-link {
  position: absolute; left: 8px; top: -64px; z-index: 100;
  background: var(--pd-primary); color: var(--pd-on-primary);
  padding: 12px 16px; border-radius: 12px; font-weight: 700; text-decoration: none;
}
.skip-link:focus { top: 8px; }

.overline {
  font: 700 .75rem/1.4 var(--pd-font-sans);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--pd-text-muted);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* Splash: aparece enquanto o Blazor carrega e some quando o app é renderizado */
.splash {
  min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
  background: var(--pd-bg); animation: splash-entra .35s ease both;
}
.splash-logo { width: 112px; height: 112px; border-radius: 26px; box-shadow: 0 10px 30px rgba(47, 71, 52, .22); }
.splash-nome { font: 500 1.75rem/1.2 var(--pd-font-serif); color: var(--pd-text); }
.splash-barra { width: 140px; height: 4px; border-radius: 4px; background: var(--pd-border); overflow: hidden; margin-top: 10px; }
.splash-barra span { display: block; height: 100%; width: 40%; border-radius: 4px; background: var(--pd-primary); animation: splash-barra 1.3s ease-in-out infinite; }
.splash-texto { font: 700 .875rem var(--pd-font-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--pd-text-muted); }
@keyframes splash-entra { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes splash-barra { 0% { transform: translateX(-110%); } 100% { transform: translateX(350%); } }

#blazor-error-ui {
  color-scheme: light only;
  background: #FBE9E5;
  color: #5B1F18;
  bottom: 0; left: 0; right: 0;
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
  display: none; padding: 0.75rem 1.25rem 0.9rem 1.25rem;
  position: fixed; z-index: 1000;
}
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: 0.75rem; top: 0.5rem; }
#blazor-error-ui a { color: inherit; font-weight: 700; }

/* Altura da barra de abas (usada para posicionar o toast e o botão fixo) */
:root { --pd-tabbar-h: 72px; }
@media (min-width: 1024px) { :root { --pd-tabbar-h: 0px; } }