/* ──────────────────────────────────────────────────────────────────
   Takedown brand tokens — sourced from feat/revamp tip bf3e6b8.
   Dark is default; .tkdn-light flips bg/fg only.
   ────────────────────────────────────────────────────────────────── */

@import url("https://fonts.googleapis.com/css2?family=Figtree:wght@400;600;700&display=swap");

:root,
.tkdn-dark {
  /* core */
  --bg-primary: #0D0808;       /* warm near-black ground */
  --bg-secondary: #1A1414;     /* elevated panel */
  --bg-tertiary: #2A2222;      /* deeper inset */
  --surface-card: #140E0E;
  --surface-raised: #1F1818;

  --text-primary: #FFFFFF;
  --text-secondary: #ACAAAA;
  --text-tertiary: #595959;
  --text-disabled: #595959;
  --text-on-accent: #FFFFFF;

  --accent: #C61D1D;
  --accent-hover: #D34312;
  --accent-active: #0D0808;

  --error: #C32222;
  --error-light: #FF6B6B;
  --success: #9AC78B;
  --info: #1D8EC7;

  --border-subtle: #2A2222;
  --border-default: #3A3030;
  --border-strong: #FFFFFF;

  --ring-focus: #F04B24;
  --ring-selected: #FFFFFF;

  --scrim: rgba(13, 8, 8, 0.72);
}

.tkdn-light {
  --bg-primary: #FFFFFF;
  --bg-secondary: #F5F3F0;
  --bg-tertiary: #ECE9E4;
  --surface-card: #FFFFFF;
  --surface-raised: #FAF8F4;

  --text-primary: #0D0808;
  --text-secondary: #595959;
  --text-tertiary: #949494;

  --border-subtle: #E5E2DC;
  --border-default: #ACAAAA;
  --border-strong: #0D0808;
  --logo-filter: invert(1);

  --scrim: rgba(13, 8, 8, 0.48);
}

/* module tints — navigational color-coding (whites / blues / reds palette) */
:root {
  --module-dojo:    #1A3A6C;   /* deep navy */
  --module-builder: #F04B24;   /* brand orange-red */
  --module-store:   #1D8EC7;   /* mid blue */
  --module-scout:   #C61D1D;   /* flag-red */
  --module-athlete: #E5E2DC;   /* off-white */
}

/* radius — binary scale */
:root {
  --r-xs: 3px;     /* chips, badges, micro-pills */
  --r-sm: 8px;     /* cards, buttons, inputs — the default */
  --r-pill: 120px;
  --r-full: 9999px;
}

/* spacing — 4-pt breaks on 8-pt grid */
:root {
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-6: 24px;
  --s-8: 32px;
  --s-12: 48px;
  --screen-margin: 16px;
  --tab-bar-h: 83px;
}

/* motion */
:root {
  --t-fast: 150ms ease-in;
  --t-base: 250ms ease-in-out;
  --t-slow: 300ms ease-in-out;
  --t-reveal: 350ms ease;
}

/* ──────────────────────────────────────────────────────────────────
   Typography — Figtree, weights 400/600/700 only.
   Display sizes carry POSITIVE letter-spacing (+0.015 to +0.03em).
   ────────────────────────────────────────────────────────────────── */
.tkdn,
.tkdn * {
  font-family: "Figtree", "Avenir Next", -apple-system, BlinkMacSystemFont,
    "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  box-sizing: border-box;
}

.t-h1 { font-size: 45px; line-height: 49px; font-weight: 700; letter-spacing: 0.03em; }
.t-h2 { font-size: 36px; line-height: 40px; font-weight: 700; letter-spacing: 0.02em; }
.t-h3 { font-size: 32px; line-height: 35px; font-weight: 700; letter-spacing: 0.015em; }
.t-h4 { font-size: 28px; line-height: 32px; font-weight: 700; letter-spacing: 0.01em; }
.t-h5 { font-size: 20px; line-height: 23px; font-weight: 700; }
.t-h6 { font-size: 18px; line-height: 24px; font-weight: 600; }
.t-sub-lg { font-size: 16px; line-height: 22px; font-weight: 600; }
.t-sub-sm { font-size: 14px; line-height: 20px; font-weight: 600; }
.t-body-lg { font-size: 16px; line-height: 24px; font-weight: 400; }
.t-body { font-size: 14px; line-height: 20px; font-weight: 400; }
.t-body-bold { font-size: 14px; line-height: 20px; font-weight: 600; }
.t-caption-lg { font-size: 12px; line-height: 16px; font-weight: 400; }
.t-caption { font-size: 11px; line-height: 14px; font-weight: 400; }
.t-button { font-size: 14px; line-height: 20px; font-weight: 600; }
.t-overline {
  font-size: 11px; line-height: 14px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.1em;
}

/* default body */
.tkdn {
  color: var(--text-primary);
  background: var(--bg-primary);
}

/* utility: no scrollbar */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { scrollbar-width: none; }

/* utility: focus ring */
.tkdn-focus {
  box-shadow: 0 0 0 2px var(--ring-focus);
}
