/* ترندنگار — توکن‌های طراحی مشترک
   فیروزه‌ای (کاشی ایرانی) رنگ اصلی؛ رنگ‌های گرم فقط برای «حرارت» ترند و خبر فوری. */
@font-face {
  font-family: "Vazirmatn";
  src: url("../lib/fonts/Vazirmatn-Variable.woff2") format("woff2-variations"),
       url("../lib/fonts/Vazirmatn-Variable.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "Naskh";
  src: url("../lib/fonts/NotoNaskhArabic-Regular.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Naskh";
  src: url("../lib/fonts/NotoNaskhArabic-Bold.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
}

:root {
  --ink: #1b2430;
  --ink-2: #3a4656;
  --slate: #6b7785;
  --line: #e2e6ea;
  --paper: #f3f5f7;
  --surface: #ffffff;
  --turq: #0e7c86;
  --turq-deep: #0a5d65;
  --turq-soft: #e3f2f3;
  --saffron: #e9a23b;
  --crimson: #d7263d;
  --crimson-soft: #fbe6e9;
  --radius: 10px;
  --font-ui: "Vazirmatn", Tahoma, sans-serif;
  --font-read: "Naskh", "Vazirmatn", serif;

  --bs-body-font-family: var(--font-ui);
  --bs-body-color: var(--ink);
  --bs-body-bg: var(--paper);
  --bs-border-color: var(--line);
  --bs-link-color: var(--turq-deep);
  --bs-link-color-rgb: 10, 93, 101;
  --bs-link-hover-color: var(--turq);
  --bs-primary: var(--turq);
  --bs-primary-rgb: 14, 124, 134;
  --bs-danger: var(--crimson);
  --bs-danger-rgb: 215, 38, 61;
  --bs-warning: var(--saffron);
  --bs-warning-rgb: 233, 162, 59;
  --bs-border-radius: var(--radius);
}

body { font-family: var(--font-ui); font-feature-settings: "ss01"; -webkit-font-smoothing: antialiased; }
a { text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 4px; }
:focus-visible { outline: 3px solid rgba(14, 124, 134, .45); outline-offset: 2px; }

.btn-primary {
  --bs-btn-bg: var(--turq); --bs-btn-border-color: var(--turq);
  --bs-btn-hover-bg: var(--turq-deep); --bs-btn-hover-border-color: var(--turq-deep);
  --bs-btn-active-bg: var(--turq-deep); --bs-btn-active-border-color: var(--turq-deep);
  --bs-btn-disabled-bg: var(--turq); --bs-btn-disabled-border-color: var(--turq);
}
.btn-outline-primary {
  --bs-btn-color: var(--turq-deep); --bs-btn-border-color: var(--turq);
  --bs-btn-hover-bg: var(--turq); --bs-btn-hover-border-color: var(--turq);
  --bs-btn-active-bg: var(--turq-deep);
}
.btn { font-weight: 500; }
.form-control:focus, .form-select:focus { border-color: var(--turq); box-shadow: 0 0 0 .2rem rgba(14, 124, 134, .15); }
.form-check-input:checked { background-color: var(--turq); border-color: var(--turq); }
.text-primary { color: var(--turq-deep) !important; }
.bg-primary { background-color: var(--turq) !important; }
.text-muted { color: var(--slate) !important; }
.badge { font-weight: 500; }

/* نوار حرارت ترند: تنها عنصر رنگ گرم در کل طراحی */
.heat { height: 6px; border-radius: 3px; background: #e9edf0; overflow: hidden; }
.heat > span { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--crimson), var(--saffron) 55%, var(--turq)); background-size: 300% 100%; }
.heat-cool > span { background-position: 100% 0; }
.heat-warm > span { background-position: 50% 0; }
.heat-hot > span { background-position: 0 0; }
.dot-hot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--crimson); box-shadow: 0 0 0 3px rgba(215,38,61,.18); }

.num { unicode-bidi: isolate; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
