/*
Theme Name: GoldSite
Theme URI: https://example.com/
Author: Your Name
Author URI: https://example.com/
Description: قالب سبک و حرفه‌ای برای سایت قیمت طلا، ارز و سکه
Version: 1.5.0
Requires at least: 5.8
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: goldsite
Tags: rtl-language-support, custom-logo, custom-menu, featured-images, translation-ready
*/

/* ============ متغیرها ============ */
:root {
  --gold: #c9a227;
  --gold-dark: #a8841c;
  --gold-light: #f0d97a;
  --dark: #1a1a1a;
  --dark-2: #2a2a2a;
  --light: #fffdf7;
  --text: #333;
  --gray: #777;
  --border: #eee;
  --up: #16a34a;
  --down: #dc2626;
}

/* ============ پایه ============ */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: Tahoma, "Segoe UI", Arial, sans-serif;
  background: var(--light);
  color: var(--text);
  line-height: 1.8;
  direction: rtl;
  text-align: right;
  font-size: 15px;
}

a { color: var(--gold-dark); text-decoration: none; transition: color 0.2s; }
a:hover { color: var(--gold); }
img { max-width: 100%; height: auto; display: block; }

h1, h2, h3, h4, h5, h6 { color: var(--dark); line-height: 1.4; margin: 0 0 15px; }
h1 { font-size: 28px; }
h2 { font-size: 24px; }
h3 { font-size: 20px; }
p { margin: 0 0 15px; }

.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

.btn {
  display: inline-block;
  background: var(--gold);
  color: #1a1a1a;
  padding: 12px 30px;
  border-radius: 4px;
  font-weight: bold;
  border: none;
  cursor: pointer;
  font-family: inherit;
  font-size: 15px;
  transition: background 0.2s;
}
.btn:hover { background: var(--gold-light); color: #000; }

/* ============ هدر و منو ============ */
.site-header {
  background: #fff;
  border-bottom: 2px solid var(--gold);
  position: sticky;
  top: 0;
  z-index: 999;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.site-header .container {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  padding: 12px 20px;
  gap: 15px 40px;
}

.site-branding { display: flex; flex-direction: column; }
.site-title { margin: 0; font-size: 22px; font-weight: bold; }
.site-title a { color: var(--dark); }
.site-title a:hover { color: var(--gold-dark); }
.site-description { margin: 0; font-size: 12px; color: var(--gray); }

/* منوی اصلی */
.main-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  direction: rtl;
  justify-content: flex-start;
  gap: 10px 22px;
  align-items: center;
}

.main-navigation li { position: relative; }

.main-navigation a {
  color: var(--dark);
  font-weight: 500;
  font-size: 15px;
  padding: 6px 0;
  position: relative;
  display: block;
}

.main-navigation a:hover { color: var(--gold-dark); }
.main-navigation .current-menu-item > a {
  color: var(--gold-dark);
  border-bottom: 2px solid var(--gold);
}

/* ============ منوی کشویی (آبشاری) ============ */
.main-navigation .sub-menu {
  position: absolute;
  top: 100%;
  right: 0;
  background: #fff;
  min-width: 220px;
  box-shadow: 0 8px 25px rgba(0,0,0,0.15);
  border-radius: 8px;
  border-top: 3px solid var(--gold);
  padding: 10px 0;
  margin: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(15px);
  transition: all 0.3s ease;
  z-index: 999;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.main-navigation li:hover > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.main-navigation .sub-menu li { width: 100%; margin: 0; }
.main-navigation .sub-menu a {
  padding: 10px 20px;
  border-bottom: 1px solid var(--border);
  transition: all 0.2s;
}
.main-navigation .sub-menu li:last-child a { border-bottom: none; }
.main-navigation .sub-menu a:hover {
  background: var(--light);
  color: var(--gold-dark);
  padding-right: 25px;
}

.main-navigation .menu-item-has-children > a::after {
  content: ' ▾';
  font-size: 12px;
  color: var(--gold-dark);
  margin-right: 5px;
}

/* ============ استایل دکمه‌های ورود و عضویت ============ */
.main-navigation .menu-btn a {
  background: var(--gold);
  color: #1a1a1a !important;
  padding: 8px 20px !important;
  border-radius: 5px;
  font-weight: bold;
  transition: all 0.3s ease;
  border-bottom: none !important;
}
.main-navigation .menu-btn a:hover {
  background: var(--gold-light);
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(201,162,39,0.3);
}

.main-navigation .menu-btn-outline a {
  border: 1px solid var(--gold) !important;
  color: var(--gold-dark) !important;
  padding: 7px 20px !important;
  border-radius: 5px;
  font-weight: bold;
  transition: all 0.3s ease;
}
.main-navigation .menu-btn-outline a:hover {
  background: var(--gold);
  color: #fff !important;
}

/* ============ هیرو قیمت (کاشی‌های کوچک و ۳ بعدی) ============ */
.hero-price {
  background: linear-gradient(135deg, #1a1a1a 0%, #3d2f0a 100%);
  color: #fff;
  padding: 40px 15px;
  text-align: center;
}
.hero-price h1 { color: var(--gold); font-size: 32px; margin-bottom: 8px; }
.hero-date { color: #ccc; font-size: 14px; margin-bottom: 25px; }

.price-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); /* عرض کارت‌ها کوچک‌تر شد */
  gap: 10px; /* فاصله کارت‌ها کمتر شد */
  margin-bottom: 20px;
}

.price-card {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 8px;
  padding: 12px 8px; /* پدینگ کمتر برای ظاهر جمع‌وجور */
  color: var(--dark);
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-top: 3px solid var(--gold);
  display: flex;
  flex-direction: column;
  gap: 2px;
  box-shadow: 0 4px 15px 0 rgba(0, 0, 0, 0.1);
  transition: box-shadow 0.3s ease;
  transform-style: preserve-3d;
}

.price-card:hover { box-shadow: 0 8px 25px 0 rgba(201, 162, 39, 0.4); }
.price-card > * { transform: translateZ(15px); }
.price-card.up { border-top-color: var(--up); }
.price-card.down { border-top-color: var(--down); }

.price-name { font-size: 11px; color: var(--gray); }
.price-value { font-size: 15px; font-weight: bold; color: var(--dark); }
.price-unit { font-size: 10px; color: #999; }
.price-change { font-size: 11px; font-weight: bold; }
.price-card.up .price-change { color: var(--up); }
.price-card.down .price-change { color: var(--down); }

.update-note { font-size: 12px; color: #999; margin: 0; }

/* ============ بنر صفحه اول ============ */
.banner-section {
  padding: 30px 0;
  background: #fff;
}

.banner-section a {
  display: block;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 5px 15px rgba(0,0,0,0.08);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.banner-section img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.4s ease;
}

.banner-section a:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(201,162,39,0.2);
}

.banner-section a:hover img {
  transform: scale(1.02);
}

/* ============ بخش‌های عمومی و جدول ============ */
.section { padding: 50px 0; }
.section-title {
  color: var(--dark);
  border-right: 4px solid var(--gold);
  padding-right: 12px;
  margin-bottom: 25px;
  font-size: 22px;
}

.table-section { padding: 50px 0; }
.price-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
  border-radius: 8px;
  overflow: hidden;
}
.price-table th, .price-table td {
  padding: 14px;
  text-align: right;
  border-bottom: 1px solid var(--border);
  font-size: 14px;
}
.price-table th { background: var(--dark); color: var(--gold); font-weight: bold; }
.price-table tr:last-child td { border-bottom: none; }
.price-table tr:hover { background: #fafaf4; }
.price-table td.up { color: var(--up); font-weight: bold; }
.price-table td.down { color: var(--down); font-weight: bold; }

/* ============ اخبار ============ */
.news-section { padding: 50px 0; background: #fff; }
.news-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}
.news-card {
  background: var(--light);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
  padding: 0 0 15px;
  transition: transform 0.2s;
}
.news-card:hover { transform: translateY(-4px); }
.news-card img { width: 100%; height: 180px; object-fit: cover; }
.news-card h3 { padding: 12px 15px 0; font-size: 17px; margin: 0 0 8px; }
.news-card h3 a { color: var(--dark); }
.news-card h3 a:hover { color: var(--gold-dark); }
.news-card p { padding: 0 15px; color: var(--gray); font-size: 14px; margin: 0 0 10px; }
.read-more { padding: 0 15px; font-weight: bold; font-size: 14px; }

/* ============ ماشین‌حساب ============ */
.calc-section { padding: 50px 0; }
.calc-box {
  background: #fff;
  padding: 25px;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  align-items: flex-end;
}
.calc-box label {
  display: flex;
  flex-direction: column;
  gap: 5px;
  font-weight: bold;
  color: var(--dark);
  font-size: 14px;
}
.calc-box input, .calc-box select {
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-family: inherit;
  font-size: 14px;
  min-width: 140px;
}
.calc-result {
  width: 100%;
  font-size: 18px;
  font-weight: bold;
  color: var(--dark);
  margin-top: 10px;
  padding-top: 15px;
  border-top: 1px dashed #ddd;
}
.calc-result span { color: var(--gold-dark); }

/* ============ محتوای صفحه و نوشته‌ها ============ */
.site-content { padding: 40px 0; min-height: 400px; }
.page-content, .entry-content {
  background: #fff;
  padding: 30px;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.03);
}
.entry-content h2 { margin-top: 25px; }
.entry-content ul, .entry-content ol { padding-right: 25px; }

.post-card {
  background: #fff;
  padding: 25px;
  border-radius: 8px;
  margin-bottom: 20px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.03);
}
.post-card h2 { font-size: 20px; margin-bottom: 10px; }
.post-card h2 a { color: var(--dark); }
.post-card h2 a:hover { color: var(--gold-dark); }
.post-thumbnail { margin: 20px 0; border-radius: 8px; overflow: hidden; }

/* ============ صفحه‌بندی ============ */
.pagination { text-align: center; margin: 30px 0; }
.pagination .page-numbers {
  display: inline-block;
  padding: 8px 14px;
  margin: 0 3px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--dark);
}
.pagination .page-numbers.current {
  background: var(--gold);
  color: #fff;
  border-color: var(--gold);
}

/* ============ فوتر ============ */
.site-footer {
  background: var(--dark);
  color: #ccc;
  padding: 40px 0 20px;
  margin-top: 40px;
}
.site-footer a { color: var(--gold); }
.site-footer a:hover { color: var(--gold-light); }
.footer-widgets {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 25px;
  margin-bottom: 25px;
  padding-bottom: 25px;
  border-bottom: 1px solid #333;
}
.footer-widget h4 { color: var(--gold); margin-bottom: 15px; font-size: 16px; }
.footer-widget ul { list-style: none; padding: 0; margin: 0; }
.footer-widget li { padding: 5px 0; font-size: 14px; }
.copyright { text-align: center; font-size: 13px; color: #888; margin: 0; }

/* ============ سایدبار ============ */
.widget {
  background: #fff;
  padding: 20px;
  border-radius: 8px;
  margin-bottom: 20px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.03);
}
.widget-title {
  font-size: 17px;
  color: var(--dark);
  border-right: 3px solid var(--gold);
  padding-right: 10px;
  margin-bottom: 15px;
}
.widget ul { list-style: none; padding: 0; margin: 0; }
.widget ul li {
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
  font-size: 14px;
}
.widget ul li:last-child { border-bottom: none; }

/* ============ واکنش‌گرا (موبایل و تبلت) ============ */
@media (max-width: 768px) {
  .site-header .container {
    flex-direction: column;
    gap: 15px;
    text-align: center;
    justify-content: center;
  }
  .main-navigation ul {
    justify-content: center;
    gap: 10px 15px;
  }
  
  /* منوی آبشاری در موبایل */
  .main-navigation .sub-menu {
    position: static;
    box-shadow: none;
    border-top: none;
    background: #f9f9f9;
    opacity: 1;
    visibility: visible;
    transform: none;
    display: none;
    padding-right: 15px;
    margin-top: 5px;
    border-radius: 0;
  }
  .main-navigation .sub-menu.mobile-active { display: flex; }
  .main-navigation .sub-menu a { border-bottom: 1px dashed #ddd; }

  /* دکمه‌های ورود و عضویت در موبایل */
  .main-navigation .menu-btn a, .main-navigation .menu-btn-outline a {
    display: inline-block;
    margin-top: 5px;
  }

  .hero-price h1 { font-size: 24px; }
  .price-value { font-size: 14px; }
  /* در موبایل ۲ ستون نمایش داده شود */
  .price-grid { grid-template-columns: repeat(2, 1fr); }
  
  .banner-section { padding: 15px 0; }
  
  .calc-box { flex-direction: column; align-items: stretch; }
  .calc-box input, .calc-box select { width: 100%; }
  .page-content, .entry-content { padding: 20px; }
  .price-table th, .price-table td { padding: 10px 8px; font-size: 13px; }
}

@media (max-width: 480px) {
  /* در موبایل‌های خیلی کوچک، کاشی‌ها ۲ ستونه بمانند اما فشرده‌تر */
  .price-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .price-card { padding: 10px 5px; }
  .price-name { font-size: 10px; }
  .price-value { font-size: 13px; }
  
  h1 { font-size: 22px; }
  h2 { font-size: 19px; }
}