/* ==========================================================================
   Zarinkala design tokens — self-hosted Vazirmatn + brand re-theme of
   Bootstrap 5 RTL.

   Bootstrap 5.3's compiled CSS bakes each component's colors into its own
   local custom properties (e.g. .btn-primary{--bs-btn-bg:#0d6efd}) rather
   than reading a root --bs-primary at runtime — so re-theming means
   overriding those component-level properties on the same selector, not
   just redefining --bs-primary once. See each block below.
   ========================================================================== */

/* ---- Self-hosted type (see public/assets/vendor/README.md) ------------- */

@font-face {
  font-family: 'Vazirmatn';
  font-style: normal;
  font-weight: 100 900; /* variable font — one file covers every weight we use */
  font-display: swap;
  src: url('/assets/vendor/fonts/vazirmatn-variable.woff2') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+FB50-FDFF, U+FE70-FEFC, U+200C-200E, U+2010-2011;
}

/* ---- Brand palette --------------------------------------------------------
   "Zarin" = گلد — an antique-gold primary (trust, value, the platform's own
   name) + a deep navy accent, on a warm cream ground instead of plain white
   or a generic red/blue e-commerce look. */
:root {
  --ink:        #22190E;
  --ink-soft:   #5A4C38;
  --ink-faint:  #8B7C63;
  --paper:      #FBF6EC;
  --surface:    #FFFFFF;
  --surface-2:  #F1E9D8;
  --border:     #E3D8BE;
  --gold:       #B8842A;
  --gold-ink:   #8C6420;
  --gold-soft:  #F6EAD2;
  --navy:       #1F3A4D;
  --navy-soft:  #E7EEF1;
  /* دو رنگ مکمل، فقط برای تنوع بصری (آیکون دسته‌بندی‌ها/مزیت‌ها) — هیچ
     معنای دیتایی ندارن، فقط چرخشی به‌کار می‌رن تا صفحه یک‌دست و بی‌روح
     نباشه. */
  --teal:       #2F6E62;
  --teal-soft:  #E3EFEB;
  --terracotta: #B1502F;
  --terracotta-soft: #F7E4DC;

  /* سایه‌های استاندارد — همه‌جا به‌جای rgba دستی، از همینا استفاده می‌شه
     تا عمق بصری سایت یک‌دست بمونه. */
  --shadow-sm: 0 2px 8px -2px rgba(34, 25, 14, .10);
  --shadow-md: 0 14px 28px -16px rgba(34, 25, 14, .22);
  --shadow-lg: 0 28px 56px -24px rgba(34, 25, 14, .30);

  --font-family: 'Vazirmatn', system-ui, -apple-system, 'Segoe UI', Tahoma, sans-serif;

  --bs-body-font-family: var(--font-family);
  --bs-body-color: var(--ink);
  --bs-body-bg: var(--paper);
  --bs-border-color: var(--border);
  --bs-link-color: var(--gold-ink);
  --bs-link-color-rgb: 140, 100, 32;
  --bs-link-hover-color: var(--ink);
}

body { background: var(--paper); }

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .navbar-brand {
  font-family: var(--font-family);
  font-weight: 700;
}

/* ---- Component re-theme (brand color = --gold) --------------------------- */

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--gold);
  --bs-btn-border-color: var(--gold);
  --bs-btn-hover-bg: var(--gold-ink);
  --bs-btn-hover-border-color: var(--gold-ink);
  --bs-btn-active-bg: var(--gold-ink);
  --bs-btn-active-border-color: var(--gold-ink);
  --bs-btn-disabled-bg: var(--gold);
  --bs-btn-disabled-border-color: var(--gold);
  --bs-btn-focus-shadow-rgb: 184, 132, 42;
}
.btn-outline-primary {
  --bs-btn-color: var(--gold-ink);
  --bs-btn-border-color: var(--gold);
  --bs-btn-hover-bg: var(--gold);
  --bs-btn-hover-border-color: var(--gold);
  --bs-btn-focus-shadow-rgb: 184, 132, 42;
}
.btn-outline-secondary {
  --bs-btn-color: var(--ink-soft);
  --bs-btn-border-color: var(--border);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--ink);
  --bs-btn-hover-border-color: var(--ink);
}
.nav-pills {
  --bs-nav-pills-link-active-bg: var(--gold);
}
.progress-bar {
  background-color: var(--gold);
}
.form-control:focus, .form-select:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 0.25rem rgba(184, 132, 42, 0.15);
}
.card {
  border-color: var(--border);
}
.badge.text-bg-primary {
  background-color: var(--navy) !important;
}
.form-check-input:checked {
  background-color: var(--gold);
  border-color: var(--gold);
}
.form-check-input:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 0.25rem rgba(184, 132, 42, 0.15);
}
.form-switch .form-check-input:focus:not(:checked) {
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23B8842A'/%3e%3c/svg%3e");
}
