/* ============================
   فونت‌ها
   ============================ */
@font-face {
  font-family: 'YekanBakhFaNum';
  src: url('https://varchinkala.com/wp-content/uploads/2025/05/YekanBakhFaNum-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'YekanBakhFaNum-Bold';
  src: url('https://varchinkala.com/wp-content/uploads/2025/05/YekanBakhFaNum-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ============================
   استایل پایه
   ============================ */
html, body {
  margin: 0;
  padding: 0;
  font-family: 'YekanBakhFaNum', sans-serif;
  font-weight: 300; /* پیش‌فرض: لایت */
  direction: rtl;
  background: #fff;
  color: #333;
  line-height: 1.6;
}

/* تیترها با وزن بولد */
h1, h2, h3, h4, h5, h6, strong, b {
  font-family: 'YekanBakhFaNum-Bold', sans-serif;
  font-weight: 700;
  color: #111;
}

/* لینک‌ها */
a {
  color: #333;
  text-decoration: none;
  transition: color 0.3s;
}
a:hover {
  color: #000;
  text-decoration: underline;
}

/* فرم‌ها */
input, textarea, select, button {
  font-family: 'YekanBakhFaNum', sans-serif;
  font-weight: 300;
}
button {
  cursor: pointer;
}

/* نمونه برای پیام فرم */
.form-message {
  padding: 12px;
  background: #e0ffe0;
  color: #2e7d32;
  margin: 15px auto;
  text-align: center;
  border-radius: 5px;
  max-width: 400px;
}
.form-message.error {
  background: #ffe0e0;
  color: #c62828;
}











/* ========== Header layout (RTL) ========== */
.header-wrap{
  position: sticky; top:0; z-index:999;
  background: rgba(255,255,255,.9);
  border-bottom: 1px solid #e9e9e9;
  backdrop-filter: blur(10px);
}
.header-row{
  max-width:1200px; margin:0 auto; padding:10px 15px;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  flex-wrap: nowrap;
}
.logo img{ height:46px; display:block; }

/* Menu */
.main-nav{ flex: 1; }
.main-menu{ list-style:none; margin:0; padding:0; display:flex; gap:10px; }
.main-menu > li{ position:relative; padding-bottom:10px; } /* پل برای hover */
.main-menu > li > a{
  display:block; padding:10px 12px; color:#222; text-decoration:none; border-radius:8px;
}
.main-menu > li > a:hover{ background:rgba(0,0,0,.05); color:#000; }
.sub-menu{
  display:none; position:absolute; right:0; top:100%; margin:0; padding:8px 6px;
  min-width:220px; background:#fff; border:1px solid #e7e7e7; border-radius:10px;
  box-shadow:0 10px 24px rgba(0,0,0,.08); z-index:10;
  opacity:0; transform:translateY(6px); transition:opacity .18s, transform .18s;
}
.main-menu > li:hover > .sub-menu,
.main-menu > li:focus-within > .sub-menu{ display:block; opacity:1; transform:translateY(0); }
.sub-menu li{ white-space:nowrap; }
.sub-menu a{ display:block; padding:10px 12px; color:#555; border-radius:8px; }
.sub-menu a:hover{ background:rgba(0,0,0,.05); color:#000; }

/* Hamburger */
.menu-toggle{ display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; }
.menu-toggle span{ width:22px; height:2px; background:#333; }

/* Icons */
.header-icons{ display:flex; gap:12px; align-items:center; }
.header-icons .icon-link svg{ width:24px; height:24px; fill:#333; transition:fill .2s; }
.header-icons .icon-link:hover svg{ fill:#000; }

/* ========== AJAX Search (RTL) ========== */
.search-box{ position:relative; display:flex; align-items:center; gap:8px; }
.search-trigger{ display:none; background:transparent; border:0; cursor:pointer; padding:6px; border-radius:8px; }

.search-input-wrap{ position:relative; min-width:260px; }
.search-input-wrap input[type="search"]{
  width:100%; padding:10px 36px 10px 12px; border:1px solid #ccc; border-radius:10px; background:#fff;
  outline:none; transition:border-color .2s, box-shadow .2s;
}
.search-input-wrap input[type="search"]:focus{ border-color:#9ad; box-shadow:0 0 0 4px rgba(100,150,255,.15); }

.search-loading{
  position:absolute; right:10px; top:50%; transform:translateY(-50%);
  width:16px; height:16px; border-radius:50%;
  border:2px solid #bbb; border-top-color:transparent; opacity:0; pointer-events:none;
}
.search-loading.show{ animation: upseo-spin .7s linear infinite; opacity:1; }
@keyframes upseo-spin{ to{ transform: translateY(-50%) rotate(360deg); } }

.search-results{
  position:absolute; right:0; left:0; top:calc(100% + 8px);
  background:#fff; border:1px solid #e5e5e5; border-radius:12px;
  box-shadow:0 10px 24px rgba(0,0,0,.08); padding:10px; display:none; z-index:1000;
}
.search-results.visible{ display:block; }
.search-empty{ text-align:center; color:#666; padding:10px 0; }

.search-more{ display:none; margin-top:8px; width:100%; padding:10px 12px; border:1px solid #ddd; border-radius:10px; background:#fafafa; cursor:pointer; }
.search-more[hidden]{ display:none !important; }
.search-more:not([hidden]){ display:block; }

.search-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:10px;
}
.search-item{
  display:grid; grid-template-columns:72px 1fr; gap:10px; align-items:center;
  text-decoration:none; color:#222; padding:8px; border-radius:10px; transition:background .15s;
}
.search-item:hover{ background:rgba(0,0,0,.04); }
.search-item .thumb img{ width:72px; height:72px; object-fit:cover; border-radius:8px; background:#f5f5f5; display:block; }
.search-item .title{ font-weight:600; margin-bottom:4px; line-height:1.4; overflow-wrap:anywhere; }
.search-item .price{ color:#444; }

/* ========== Responsive ========== */
@media (max-width: 992px){
  .main-nav{ display:none; } /* اگر خواستی نمایش بدی، این خط رو بردار و منو را موبایلی کن */
  .menu-toggle{ display:flex; }
}

@media (max-width:768px){
  .header-row{ gap:10px; }
  .main-nav{ display:none; }  /* منو مخفی؛ می‌تونی یک پنل off-canvas جدا اضافه کنی */
  .menu-toggle{ display:flex; order:2; }
  .logo{ order:1; }
  .search-box{ order:3; flex:1; }
  .header-icons{ order:4; gap:10px; }

  /* فقط آیکون جستجو دیده شود تا وقتی باز شد */
  .search-trigger{ display:inline-flex; }
  .search-box:not(.open) .search-input-wrap,
  .search-box:not(.open) .search-results,
  .search-box:not(.open) .search-more{ display:none !important; }

  /* حالت اُورلی موبایل */
  .search-box.open{
    position:fixed; right:0; left:0; top:0; z-index:10000;
    padding:12px; background:rgba(255,255,255,.98);
    box-shadow:0 8px 24px rgba(0,0,0,.15);
    display:flex; flex-direction:column; gap:8px;
  }
  .search-overlay-open, .search-overlay-open body{ overflow:hidden; }

  .search-input-wrap{ width:100% !important; min-width:0; z-index:2; }
  .search-results{
    position:static !important; right:auto !important; left:auto !important; top:auto !important;
    width:100% !important; margin-top:8px; max-height:calc(100vh - 140px); overflow:auto; z-index:1;
  }
  .search-results.visible{ display:block; }

  /* نتایج دو ستونه روی موبایل */
  .search-grid{ grid-template-columns:1fr 1fr; }
}