/* elegance/tokens.css — shared design tokens for the "elegance" design language.
   Loaded by every elegance module; safe to include more than once. */

:root {
  /* Sıcak "terracotta" palet: krem zemin, kömür metin, turuncu vurgu.
     Kontrastlar (WCAG): metin 10.7:1, ikincil 5.4:1, buton beyaz yazı 4.98:1. */

  /* Ink & text */
  --elg-ink: #1f1e1d;          /* display headings */
  --elg-text: #3d3a35;         /* body copy */
  --elg-muted: #6b665d;        /* secondary text, AA on ivory and white */
  --elg-faint: #77726a;        /* tertiary / small caps labels; AA on ivory */

  /* Accent */
  --elg-accent: #d97757;       /* dekoratif: çizgi, ikon, odak halkası */
  --elg-accent-ink: #a84a2a;   /* metin içinde link ve vurgu (5.4:1) */
  --elg-accent-soft: #fbeee6;
  --elg-primary: #b4532f;      /* birincil buton zemini, beyaz yazı */
  --elg-primary-hover: #a84a2a;

  /* Surfaces & lines */
  --elg-page: #faf9f5;         /* sayfa zemini (krem) */
  --elg-bg: #ffffff;           /* kart ve navbar */
  --elg-bg-soft: #f5f1ea;
  --elg-line: #ebe6db;
  --elg-line-strong: #ddd6c8;

  /* Tag pastels (bg / text pairs, all WCAG AA on their bg) */
  --elg-tag-blue-bg: #fbeee6;    --elg-tag-blue-fg: #9a4424;
  --elg-tag-sky-bg: #f4efe4;     --elg-tag-sky-fg: #6b4e1f;
  --elg-tag-indigo-bg: #f1ece6;  --elg-tag-indigo-fg: #5b4636;
  --elg-tag-green-bg: #eef3ea;   --elg-tag-green-fg: #3f5a2c;
  --elg-tag-purple-bg: #f5ecef;  --elg-tag-purple-fg: #7a3b52;

  /* Type */
  --elg-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
              "Helvetica Neue", Arial, "Noto Sans", sans-serif;

  /* Rhythm */
  --elg-radius: 14px;
  --elg-radius-pill: 999px;

  /* Bootstrap 5.2: link ve odak rengi palete uysun */
  --bs-link-color: #a84a2a;
  --bs-link-hover-color: #9a4424;
  --bs-primary: #b4532f;
  --bs-primary-rgb: 180, 83, 47;
  --bs-body-bg: #faf9f5;
}

body {
  background: var(--elg-page);
}

::selection {
  background: #f3d3c3;
}

/* Visible keyboard focus everywhere in elegance scopes */
.elg-scope a:focus-visible,
.elg-scope button:focus-visible {
  outline: 2px solid var(--elg-accent);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Motion discipline: the elegance language animates very little, and not at all
   for users who ask for reduced motion. */
@media (prefers-reduced-motion: reduce) {
  .elg-scope *,
  .elg-scope *::before,
  .elg-scope *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Bootstrap bileşenleri palete uysun (açık tema). Siyah tema kendi
   dosyasında (theme-black.css) bunları yeniden ezer. */
.nav-pills .nav-link {
  color: var(--elg-accent-ink);
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background: var(--elg-primary);
  color: #fff;
}

.btn-primary {
  --bs-btn-bg: #b4532f;
  --bs-btn-border-color: #b4532f;
  --bs-btn-hover-bg: #a84a2a;
  --bs-btn-hover-border-color: #a84a2a;
  --bs-btn-active-bg: #9a4424;
  --bs-btn-active-border-color: #9a4424;
}

.btn-outline-primary {
  --bs-btn-color: #a84a2a;
  --bs-btn-border-color: #d97757;
  --bs-btn-hover-bg: #b4532f;
  --bs-btn-hover-border-color: #b4532f;
  --bs-btn-hover-color: #fff;
}

.text-primary {
  color: var(--elg-accent-ink) !important;
}

.bg-primary {
  background-color: var(--elg-primary) !important;
}

.badge.bg-info {
  background-color: var(--elg-accent-soft) !important;
  color: #9a4424;
}

.badge.bg-secondary {
  background-color: #6b665d !important;
}

.alert-info {
  background: #fbeee6;
  border-color: #f1d5c6;
  color: #7a3a20;
}

.form-control:focus,
.form-select:focus {
  border-color: #d97757;
  box-shadow: 0 0 0 0.2rem rgba(217, 119, 87, 0.18);
}

.form-check-input:checked {
  background-color: #b4532f;
  border-color: #b4532f;
}

.dropdown-item.active,
.dropdown-item:active {
  background-color: var(--elg-primary);
  color: #fff;
}
