/* =====================================================
   صرافی سگال — Theme CSS
   ===================================================== */

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

:root {
  /* رنگ‌های هدر و فوتر — تیره */
  --dark-bg:    #0c0c10;
  --dark-bg2:   #111118;
  --dark-card:  #16161e;
  --dark-card2: #1d1d28;
  --dark-border:#272736;
  --dark-text:  #e5e2dc;
  --dark-dim:   #6b6860;
  --dark-mid:   #9e9a92;

  /* رنگ‌های body — روشن */
  --bg:         #f5f5f7;
  --bg2:        #eeeef0;
  --card:       #ffffff;
  --card2:      #f8f8fa;
  --border:     #e0e0e6;
  --text:       #1a1a2e;
  --text-dim:   #6b6880;
  --text-mid:   #4a4a6a;

  /* رنگ‌های مشترک */
  --gold:       #b8860b;
  --gold-light: #d4a017;
  --gold-dark:  #8a6400;
  --gold-bg:    rgba(184,134,11,.08);
  --green:      #1a9e6e;
  --red:        #d63031;

  --header-h:   70px;
  --container:  1200px;
  --radius:     12px;
}

html { scroll-behavior: smooth; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: 'Peyda', Tahoma, sans-serif;
  font-size: 15px;
  line-height: 1.7;
  direction: rtl;
}

body[lang="en"] { font-family: 'Inter', system-ui, sans-serif; direction: ltr; }

/* ── Container ── */
.container { max-width:var(--container); margin:0 auto; padding:0 1.25rem; }

/* ── Header — تیره ── */
.site-header {
  position: sticky;
  top: 0;
  z-index: 200;
  background: rgba(12,12,16,.97);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--dark-border);
  height: var(--header-h);
}
.header-inner {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  height: var(--header-h);
}
.site-logo { display:flex; align-items:center; text-decoration:none; flex-shrink:0; }
.site-logo img { height:42px; }
.logo-text { font-size:1.3rem; font-weight:800; color:#c9a84c; letter-spacing:-.5px; }

/* ── Nav — تیره ── */
.main-nav { display:flex; align-items:center; gap:.2rem; flex:1; justify-content:center; }
.nav-item { position:relative; }
.nav-link {
  display:flex; align-items:center; gap:.3rem;
  padding:.5rem .8rem;
  color:var(--dark-mid);
  text-decoration:none;
  font-size:.88rem;
  border-radius:8px;
  transition:color .2s,background .2s;
  white-space:nowrap;
}
.nav-link:hover, .nav-link.active { color:#c9a84c; background:rgba(201,168,76,.08); }

/* Dropdown */
.dropdown {
  position:absolute;
  top:calc(100% + .5rem);
  right:0;
  background:var(--dark-card2);
  border:1px solid var(--dark-border);
  border-radius:var(--radius);
  min-width:180px;
  padding:.4rem 0;
  box-shadow:0 12px 40px rgba(0,0,0,.4);
  opacity:0;
  pointer-events:none;
  transform:translateY(-6px);
  transition:opacity .2s,transform .2s;
  z-index:100;
}
.has-dropdown:hover .dropdown { opacity:1; pointer-events:auto; transform:translateY(0); }
.dropdown-item { display:block; padding:.5rem 1rem; color:var(--dark-mid); text-decoration:none; font-size:.85rem; transition:color .15s,background .15s; }
.dropdown-item:hover { color:#c9a84c; background:rgba(201,168,76,.08); }

/* ── Header Actions ── */
.header-actions { display:flex; align-items:center; gap:.8rem; margin-right:auto; }
[dir="ltr"] .header-actions { margin-right:0; margin-left:auto; }
.quick-rate { display:flex; align-items:center; gap:.4rem; font-size:.82rem; }
.rate-label { color:var(--dark-dim); }
.rate-value { color:#c9a84c; font-weight:700; font-size:.95rem; }
.lang-switch {
  padding:.3rem .6rem;
  border:1px solid var(--dark-border);
  border-radius:6px;
  color:var(--dark-mid);
  text-decoration:none;
  font-size:.78rem;
  font-weight:600;
  transition:all .2s;
}
.lang-switch:hover { border-color:#c9a84c; color:#c9a84c; }

/* Hamburger */
.hamburger { display:none; background:none; border:none; cursor:pointer; padding:.3rem; flex-direction:column; gap:5px; }
.hamburger span { display:block; width:22px; height:2px; background:var(--dark-mid); border-radius:2px; transition:all .3s; }

/* ── Mobile Nav — تیره ── */
.mobile-nav {
  position:fixed; top:var(--header-h); right:0; bottom:0; width:280px;
  background:var(--dark-card);
  border-left:1px solid var(--dark-border);
  z-index:150;
  transform:translateX(100%);
  transition:transform .3s;
  overflow-y:auto;
  padding:1rem 0;
}
.mobile-nav.open { transform:translateX(0); }
.mobile-overlay { position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:149; display:none; }
.mobile-overlay.open { display:block; }
.mobile-nav-link { display:block; padding:.7rem 1.5rem; color:var(--dark-mid); text-decoration:none; font-size:.9rem; border-bottom:1px solid rgba(255,255,255,.04); }
.mobile-child { padding-right:2.5rem; font-size:.82rem; }
.mobile-nav-link:hover { color:#c9a84c; }

/* ── Main ── */
.site-main { min-height:calc(100vh - var(--header-h) - 300px); }

/* ── Sections ── */
.section { padding:4rem 0; }
.section-sm { padding:2.5rem 0; }
.section-title { font-size:1.8rem; font-weight:800; color:var(--text); margin-bottom:.5rem; }
.section-subtitle { color:var(--text-dim); font-size:1rem; margin-bottom:2.5rem; }
.section-header { text-align:center; margin-bottom:3rem; }
.section-header .section-title::after {
  content:'';
  display:block;
  width:50px;
  height:3px;
  background:var(--gold);
  margin:.8rem auto 0;
}

/* بخش‌های تیره داخل صفحه روشن */
.section-dark { background: var(--dark-bg2); color: var(--dark-text); }
.section-dark .section-title { color: var(--dark-text); }
.section-dark .section-subtitle { color: var(--dark-dim); }

/* ── Cards ── */
.card {
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1.5rem;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
  transition:border-color .2s,transform .2s,box-shadow .2s;
}
.card:hover { border-color:rgba(184,134,11,.3); transform:translateY(-2px); box-shadow:0 6px 24px rgba(0,0,0,.1); }

/* ── Buttons ── */
.btn-gold {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.6rem 1.4rem;
  background:var(--gold);
  color:#fff;
  font-weight:700;
  border-radius:8px;
  border:none;
  cursor:pointer;
  text-decoration:none;
  font-family:inherit;
  font-size:.9rem;
  transition:opacity .2s,transform .2s;
}
.btn-gold:hover { opacity:.88; transform:translateY(-1px); }
.btn-outline-gold {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.6rem 1.4rem;
  background:transparent;
  color:var(--gold);
  font-weight:600;
  border-radius:8px;
  border:1px solid var(--gold);
  cursor:pointer;
  text-decoration:none;
  font-family:inherit;
  font-size:.9rem;
  transition:all .2s;
}
.btn-outline-gold:hover { background:var(--gold); color:#fff; }

/* ── Rate Table ── */
.rate-table { width:100%; border-collapse:collapse; }
.rate-table th { padding:.6rem 1rem; text-align:right; color:var(--text-dim); font-size:.8rem; border-bottom:2px solid var(--border); }
.rate-table td { padding:.7rem 1rem; border-bottom:1px solid var(--border); font-size:.9rem; }
.rate-table tr:last-child td { border-bottom:none; }
.rate-table tr:hover td { background:var(--card2); }
.rate-up   { color:var(--green); }
.rate-down { color:var(--red); }
.rate-name { display:flex; align-items:center; gap:.5rem; font-weight:500; }
.currency-icon { font-size:1.2rem; }

/* ── نرخ ارز section — تیره ── */
.rates-section { background: var(--dark-bg2); border-bottom: 1px solid var(--dark-border); }
.rates-section .rate-table th { color:var(--dark-dim); border-bottom-color:var(--dark-border); }
.rates-section .rate-table td { border-bottom-color:rgba(255,255,255,.05); color:var(--dark-text); }
.rates-section .rate-table tr:hover td { background:rgba(255,255,255,.03); }
.rates-section .rate-name { color:var(--dark-text); }

/* ── TOC ── */
.toc-box {
  background:var(--card2);
  border:1px solid var(--border);
  border-right:3px solid var(--gold);
  border-radius:var(--radius);
  padding:1.25rem 1.5rem;
  margin-bottom:2rem;
}
.toc-title { font-size:.9rem; font-weight:700; color:var(--gold); margin-bottom:.8rem; }
.toc-list { list-style:none; }
.toc-list li { margin-bottom:.3rem; }
.toc-list a { color:var(--text-mid); text-decoration:none; font-size:.85rem; display:flex; align-items:center; gap:.4rem; transition:color .2s; }
.toc-list a::before { content:'›'; color:var(--gold); }
.toc-list a:hover { color:var(--gold); }

/* ── Article Content ── */
.article-content h2 { font-size:1.25rem; font-weight:700; margin:2rem 0 .8rem; color:var(--text); padding-bottom:.4rem; border-bottom:2px solid var(--border); scroll-margin-top:calc(var(--header-h) + 1rem); }
.article-content h3 { font-size:1.05rem; font-weight:600; margin:1.5rem 0 .6rem; color:var(--gold-dark); }
.article-content p { margin-bottom:1rem; color:var(--text-mid); }
.article-content a { color:var(--gold); text-decoration:underline; }
.article-content ul, .article-content ol { margin:0 1.5rem 1rem; color:var(--text-mid); }
.article-content li { margin-bottom:.4rem; }
.article-content img { max-width:100%; border-radius:var(--radius); margin:1rem 0; }
.article-content blockquote { border-right:3px solid var(--gold); padding:.8rem 1rem; background:var(--card2); border-radius:0 8px 8px 0; margin:1.5rem 0; color:var(--text-mid); }
.article-content table { width:100%; border-collapse:collapse; margin:1.5rem 0; }
.article-content table th { background:var(--card2); padding:.6rem .8rem; border:1px solid var(--border); font-size:.85rem; }
.article-content table td { padding:.6rem .8rem; border:1px solid var(--border); font-size:.85rem; color:var(--text-mid); }

/* ── Breadcrumb ── */
.breadcrumb { display:flex; align-items:center; gap:.4rem; font-size:.8rem; color:var(--text-dim); margin-bottom:1.5rem; flex-wrap:wrap; }
.breadcrumb a { color:var(--gold); text-decoration:none; }
.breadcrumb span { color:var(--text-dim); }

/* ── Footer — تیره ── */
.site-footer { background:var(--dark-bg2); border-top:none; padding:3rem 0 1.5rem; margin-top:0; color:var(--dark-text); }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.5fr; gap:2.5rem; margin-bottom:2.5rem; }
.footer-logo { font-size:1.3rem; font-weight:800; color:#c9a84c; margin-bottom:.8rem; }
.footer-desc { font-size:.82rem; color:var(--dark-dim); line-height:1.7; }
.footer-title { font-size:.9rem; font-weight:700; color:var(--dark-text); margin-bottom:1rem; }
.footer-links { list-style:none; }
.footer-links li { margin-bottom:.5rem; }
.footer-links a { color:var(--dark-dim); text-decoration:none; font-size:.83rem; transition:color .2s; }
.footer-links a:hover { color:#c9a84c; }
.contact-item { display:flex; align-items:center; gap:.6rem; margin-bottom:.6rem; font-size:.83rem; color:var(--dark-dim); }
.contact-item a { color:var(--dark-dim); text-decoration:none; }
.contact-item a:hover { color:#c9a84c; }
.social-links { display:flex; gap:.6rem; margin-top:1rem; }
.social-link { display:flex; align-items:center; justify-content:center; width:36px; height:36px; border:1px solid var(--dark-border); border-radius:8px; color:var(--dark-dim); text-decoration:none; transition:all .2s; }
.social-link:hover { border-color:#c9a84c; color:#c9a84c; }
.footer-bottom { border-top:1px solid var(--dark-border); padding-top:1.2rem; font-size:.78rem; color:var(--dark-dim); text-align:center; }

/* ── Inputs ── */
.theme-input {
  width:100%;
  padding:.6rem .9rem;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:8px;
  color:var(--text);
  font-family:inherit;
  font-size:.9rem;
  transition:border-color .2s;
}
.theme-input:focus { outline:none; border-color:var(--gold); }
.theme-input::placeholder { color:var(--text-dim); }
select.theme-input { cursor:pointer; }

/* ── Floating Buttons ── */
.float-btns { position:fixed; bottom:1.5rem; left:1.5rem; display:flex; flex-direction:column; gap:.5rem; z-index:190; }
.float-btn {
  display:flex; align-items:center; justify-content:center;
  width:46px; height:46px;
  border-radius:50%;
  text-decoration:none;
  transition:transform .2s,box-shadow .2s;
  box-shadow:0 4px 16px rgba(0,0,0,.25);
}
.float-btn:hover { transform:scale(1.1); }
.float-btn svg { fill:white; }
.float-tg    { background:#0088cc; }
.float-wa    { background:#25d366; }
.float-phone { background:var(--gold); }
.float-phone svg { fill:#fff; }

/* ── Page Header — با انحنا ── */
.page-header {
  background: linear-gradient(135deg, #0d0d14 0%, #1a1a28 100%);
  border-bottom: none;
  padding: 2.5rem 0 0;
  margin-bottom: 0;
  color: var(--dark-text);
  position: relative;
}
.page-header .container { padding-bottom: 2rem; }
.page-header::after {
  content: '';
  display: block;
  width: 100%;
  height: 48px;
  background: var(--bg);
  clip-path: ellipse(55% 100% at 50% 100%);
}
.page-header h1 { font-size:1.8rem; font-weight:800; color:var(--dark-text); }
.page-header p { color:var(--dark-dim); margin-top:.4rem; }
.page-header .breadcrumb a { color:#c9a84c; }
.page-header .breadcrumb { color:var(--dark-dim); margin-bottom:1rem; }
.page-header .breadcrumb span { color:var(--dark-dim); }

/* ── Grid layouts ── */
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.grid-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1.5rem; }
.grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:1.25rem; }
.grid-auto { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1.5rem; }

/* ── Badge ── */
.badge { display:inline-block; padding:.2rem .55rem; border-radius:5px; font-size:.72rem; font-weight:600; }
.badge-gold  { background:rgba(184,134,11,.12); color:var(--gold); }
.badge-green { background:rgba(26,158,110,.12); color:var(--green); }
.badge-red   { background:rgba(214,48,49,.12);  color:var(--red); }
.badge-gray  { background:rgba(0,0,0,.07); color:var(--text-dim); }

/* ── Sidebar widget ── */
.sidebar-widget { background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:1.25rem; margin-bottom:1rem; box-shadow:0 2px 8px rgba(0,0,0,.05); }
.widget-title { font-size:.9rem; font-weight:700; color:var(--gold); margin-bottom:1rem; }

/* ── Scrollbar ── */
::-webkit-scrollbar { width:5px; }
::-webkit-scrollbar-track { background:var(--bg2); }
::-webkit-scrollbar-thumb { background:var(--border); border-radius:3px; }

/* ── Responsive ── */
@media (max-width:1024px) {
  .footer-grid { grid-template-columns:1fr 1fr; }
  .grid-4 { grid-template-columns:1fr 1fr; }
}
@media (max-width:768px) {
  .main-nav { display:none; }
  .hamburger { display:flex; }
  .quick-rate { display:none; }
  .footer-grid { grid-template-columns:1fr; gap:1.5rem; }
  .grid-2,.grid-3 { grid-template-columns:1fr; }
  .section { padding:2.5rem 0; }
  .section-title { font-size:1.4rem; }
  .page-header h1 { font-size:1.4rem; }
  .page-header::after { height:32px; }
}
@media (max-width:480px) {
  .grid-4 { grid-template-columns:1fr; }
  .float-btns { bottom:1rem; left:1rem; }
}