@font-face { font-family: "Sora"; font-weight: 600; font-style: normal; font-display: swap; src: url("../fonts/sora-600.woff") format("woff"); }
@font-face { font-family: "Sora"; font-weight: 700; font-style: normal; font-display: swap; src: url("../fonts/sora-700.woff") format("woff"); }
@font-face { font-family: "DM Sans"; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/dm-sans-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "DM Sans"; font-weight: 500; font-style: normal; font-display: swap; src: url("../fonts/dm-sans-latin-500-normal.woff2") format("woff2"), url("../fonts/dmsans-500.woff") format("woff"); }

:root {
  --ftf-ink: #0B2E1C;
  --ftf-green: #119447;
  --ftf-deep-green: #0A6530;
  --ftf-orange: #FF7A1A;
  --ftf-muted: #55675C;
  --ftf-line: #DCE5DF;
  --ftf-background: #F6F8F6;
  --ftf-surface: #FFFFFF;
  --ftf-text: var(--ftf-ink);
  --ftf-primary: var(--ftf-deep-green);
  --ftf-accent: var(--ftf-orange);
  --ftf-font-heading: "Sora", Helvetica, Arial, sans-serif;
  --ftf-font-body: "DM Sans", Helvetica, Arial, sans-serif;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ftf-background: #0C1712;
    --ftf-surface: #12211A;
    --ftf-text: #E6EFE9;
    --ftf-muted: #9DB1A5;
    --ftf-line: #24382D;
    --ftf-primary: #3BCB74;
    --ftf-accent: #FF9A52;
  }
}

:root[data-theme="dark"] {
  --ftf-background: #0C1712;
  --ftf-surface: #12211A;
  --ftf-text: #E6EFE9;
  --ftf-muted: #9DB1A5;
  --ftf-line: #24382D;
  --ftf-primary: #3BCB74;
  --ftf-accent: #FF9A52;
}

body {
  background: var(--ftf-background);
  color: var(--ftf-text);
  font-family: var(--ftf-font-body);
}

h1, h2, h3, h4, h5, h6 { font-family: var(--ftf-font-heading); }

/* Circuit error banner: hidden until blazor.web.js shows it after an unhandled error or a lost connection. */
#blazor-error-ui {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2000;
  padding: 12px 48px 12px 16px;
  background: var(--ftf-surface);
  color: var(--ftf-text);
  border-top: 4px solid var(--ftf-accent);
  box-shadow: 0 -2px 8px rgba(11, 46, 28, 0.15);
  font-family: var(--ftf-font-body);
}
#blazor-error-ui .reload { color: var(--ftf-primary); font-weight: 500; margin-left: 8px; }
#blazor-error-ui .dismiss { position: absolute; right: 16px; top: 10px; cursor: pointer; color: var(--ftf-muted); }
