/* Optional shared base classes, built on tokens.css. Prefixed
   (`eisblume-*`) so they never collide with any app's existing class
   names — safe to adopt incrementally, one element at a time, without
   risk of clashing with styles already in place. Not required; an app
   can use just tokens.css and write its own component styles against
   the same variables, which is what rime-timber does today.

   Status per UI_UNIFICATION_PLAN.md as of 2026-09-03: these classes
   exist but no app actually uses them yet — every app independently
   reinvented equivalent card/button styles. Phase 1 of that plan
   formalized what's below (typography scale + the card/button values
   actually used across apps, reconciled into one definition); Phase 2
   is migrating each app onto these classes instead of its own copies.
   Until an app migrates, treat this file as the target, not the
   reality. */

/* ---- typography scale ----
   Values decided in UI_UNIFICATION_PLAN.md's "Open questions" #2 —
   picked as a midpoint of what already existed across apps (h1 ranged
   1.125rem-1.7rem) rather than either extreme, and h3/eyebrow reuses
   the small-caps/uppercase treatment rime-aluminium's h2 and
   rime-timber's h3 had already independently converged on. Bare
   element selectors, not classes — every app already has real
   h1/h2/h3 elements to compare against once it migrates in Phase 2. */

h1 {
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0;
}

h2 {
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0;
}

h3 {
  font-size: 0.95rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--ink-muted);
  margin: 0;
}

body {
  font-size: 0.95rem;
}

.eisblume-text-small {
  font-size: 0.8rem;
}

/* ---- card ----
   Padding matches what rime-core/rime-hrm/rime-timber's own
   card-equivalents already converged on independently (1.25rem
   1.5rem) — base.css's previous 1.5rem-all-around default didn't
   actually match any of them. */

.eisblume-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 1.25rem 1.5rem;
}

/* Accent-stripe variant: for the one emphasized/primary card in a
   view (rime-core's dashboard links, rime-timber's results panel) —
   not for repeated list items or secondary content. Layer onto
   .eisblume-card, e.g. class="eisblume-card eisblume-card--accent". */
.eisblume-card--accent {
  border-left: 4px solid var(--accent);
}

/* ---- buttons ----
   Reconciled from rime-timber's fuller definition (already the
   closest match to the original .eisblume-button/-secondary split)
   plus rime-hrm's active-state feedback. */

.eisblume-button {
  font: inherit;
  font-weight: 600;
  font-size: 0.9rem;
  padding: 0.6rem 1.1rem;
  width: fit-content;
  color: var(--accent-contrast);
  background: var(--accent);
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background 0.15s ease, transform 0.05s ease;
}

.eisblume-button:hover {
  background: var(--accent-strong);
}

.eisblume-button:active {
  transform: translateY(1px);
}

.eisblume-button:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.eisblume-button-secondary {
  background: var(--surface);
  color: var(--accent-strong);
  border-color: var(--border-strong);
}

.eisblume-button-secondary:hover {
  background: var(--surface-muted);
  border-color: var(--accent);
}