/* =============================================================================
   Starna Institute — base stylesheet (SPEC 00 §10)
   Brand: ink #1d1d1f · midnight #0F1E3A · ember gold #E9B44C · parchment #F6F1E7
   Fonts: Lusitana (headings) · Inter (body)
   Structural only — the distinctive design system is a later pass.
   ============================================================================= */

:root {
  --tindra-ink:       #1d1d1f;
  --tindra-midnight:  #0F1E3A;
  --tindra-ember:     #E9B44C;
  --tindra-parchment: #F6F1E7;

  /* LDC runtime floors (defaults; student session may raise these) */
  --tindra-font-min:   16px;
  --tindra-tap-min:    44px;
  --tindra-fg:         var(--tindra-ink);
  --tindra-bg:         var(--tindra-parchment);
  --tindra-focus-ring: 3px solid var(--tindra-ember);

  --bs-body-font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color: var(--tindra-fg);
  background-color: var(--tindra-bg);
  font-size: var(--tindra-font-min);
}

h1, h2, h3, h4, h5, h6, .navbar-brand, .tindra-heading {
  font-family: 'Lusitana', Georgia, serif;
}

a { color: var(--tindra-midnight); }
a:hover { color: var(--tindra-ember); }

/* --- Chrome ---------------------------------------------------------------- */

.tindra-navbar {
  background-color: var(--tindra-midnight);
}
.tindra-navbar .navbar-brand,
.tindra-navbar .nav-link {
  color: var(--tindra-parchment);
}
.tindra-navbar .nav-link:hover,
.tindra-navbar .nav-link.active {
  color: var(--tindra-ember);
}
.tindra-navbar .navbar-brand .brand-mark {
  color: var(--tindra-ember);
}

.btn-tindra {
  background-color: var(--tindra-midnight);
  border-color: var(--tindra-midnight);
  color: var(--tindra-parchment);
}
.btn-tindra:hover, .btn-tindra:focus {
  background-color: #16294d;
  border-color: #16294d;
  color: var(--tindra-ember);
}
.btn-tindra-gold {
  background-color: var(--tindra-ember);
  border-color: var(--tindra-ember);
  color: var(--tindra-midnight);
  font-weight: 600;
}
.btn-tindra-gold:hover, .btn-tindra-gold:focus {
  background-color: #d9a53f;
  border-color: #d9a53f;
  color: var(--tindra-midnight);
}

.card { border-color: rgba(15, 30, 58, .1); }

/* focus visibility everywhere */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: var(--tindra-focus-ring);
  outline-offset: 2px;
}

/* --- Auth pages ------------------------------------------------------------ */

.tindra-auth-wrap {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
}
.tindra-auth-card {
  width: 100%;
  max-width: 420px;
}

/* --- Student variant: large-touch, high-contrast, minimal chrome ------------ */

body.tindra-student {
  --tindra-font-min: 18px;
  font-size: var(--tindra-font-min);
}
body.tindra-student .btn,
body.tindra-student .form-control,
body.tindra-student a.tindra-tap {
  min-height: var(--tindra-tap-min);
  min-width: var(--tindra-tap-min);
}
body.tindra-student .btn {
  font-size: 1.15rem;
  padding: .75rem 1.5rem;
  border-radius: 1rem;
}

.tindra-avatar-btn {
  width: 132px;
  height: 152px;
  border: 3px solid transparent;
  border-radius: 1.25rem;
  background: #fff;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .5rem;
}
.tindra-avatar-btn:hover, .tindra-avatar-btn:focus {
  border-color: var(--tindra-ember);
}
.tindra-avatar-btn img, .tindra-avatar-btn .avatar-fallback {
  width: 84px;
  height: 84px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--tindra-midnight);
  color: var(--tindra-parchment);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  font-family: 'Lusitana', Georgia, serif;
}

/* PIN pad */
.tindra-pinpad {
  display: grid;
  grid-template-columns: repeat(3, minmax(72px, 1fr));
  gap: .75rem;
  max-width: 300px;
  margin: 0 auto;
}
.tindra-pinpad .btn { font-size: 1.5rem; min-height: 64px; }

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