/* =========================================================================
   Header — Sticky، کوچک‌شدن هنگام اسکرول، منو، جعبه سرچ AJAX
   -------------------------------------------------------------------------
   کلاس‌های ts-* از assets/css/base.css توکن می‌گیرند (:root). این فایل فقط
   وقتی لود می‌شود که واقعاً یک منو ثبت شده باشد یا هدر رندر شود —
   inc/enqueue.php این را همیشه enqueue می‌کند چون هدر در همه صفحات هست.
   ========================================================================= */

.ts-site-header{
  position: sticky;
  top: 0;
  z-index: 500;
  background: var(--ts-bg);
  border-bottom: 1px solid var(--ts-border);
  transition: box-shadow .2s ease;
}
.ts-site-header.is-scrolled{
  box-shadow: var(--ts-shadow-sm);
}

.ts-site-header__inner{
  max-width: var(--ts-container);
  margin-inline: auto;
  padding: 1.1rem 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  transition: padding .2s ease;
}
/* کوچک‌شدن هنگام اسکرول — فقط padding/اندازه لوگو تغییر می‌کند، نه Layout */
.ts-site-header.is-scrolled .ts-site-header__inner{
  padding-block: .55rem;
}
.ts-site-header.is-scrolled .custom-logo{
  max-height: 36px;
}
.ts-site-header.is-scrolled .ts-site-title{
  font-size: 1.1rem;
}

.ts-site-branding{ display:flex; flex-direction:column; flex: 0 0 auto; }
.ts-site-title{
  font-size: 1.3rem; font-weight: 800; color: var(--ts-text-strong); text-decoration: none;
  transition: font-size .2s ease;
}
.ts-site-tagline{ margin:0; font-size:.8rem; color: var(--ts-muted); }
.custom-logo{ max-height: 52px; width:auto; transition: max-height .2s ease; }

.ts-header-actions{ display:flex; align-items:center; gap:.6rem; margin-inline-start:auto; }

/* --- دکمه‌ی سرچ --- */
.ts-search-toggle{
  border:1px solid var(--ts-border); background: var(--ts-bg);
  border-radius: 50%; width:40px; height:40px;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; color: var(--ts-text-strong);
  transition: background .15s ease, color .15s ease;
}
.ts-search-toggle:hover{ background: var(--ts-primary-soft); color: var(--ts-primary); }

/* --- منوی دسکتاپ --- */
.ts-nav-toggle{
  display:none;
  border:1px solid var(--ts-border); background: var(--ts-bg);
  border-radius: var(--ts-radius-sm); width:42px; height:42px;
  align-items:center; justify-content:center; cursor:pointer; color: var(--ts-text-strong);
}
.ts-primary-nav__list{
  display:flex; align-items:center; gap:1.6rem; list-style:none; margin:0; padding:0;
}
.ts-primary-nav__list a{ color: var(--ts-text); font-weight:600; font-size:.95rem; }
.ts-primary-nav__list a:hover{ color: var(--ts-primary); text-decoration:none; }
.ts-primary-nav__list .current-menu-item > a{ color: var(--ts-primary); }
.ts-primary-nav__list ul{ list-style:none; }

/* --- جعبه سرچ AJAX — پاپ‌آپ تمام‌صفحه (نه یک پنل کوچک زیر هدر) --- */
.ts-search-panel{
  position: fixed;
  inset: 0;
  z-index: 2000;
  background: rgba(16, 22, 31, .55);
  opacity: 0;
  visibility: hidden;
  transition: opacity .22s ease, visibility .22s ease;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  overflow-y: auto;
  padding: 6vh 1.25rem 2rem;
}
.ts-search-panel.is-open{
  opacity: 1;
  visibility: visible;
}
.ts-search-panel__inner{
  width: 100%;
  max-width: 640px;
  background: var(--ts-bg);
  border-radius: var(--ts-radius-lg);
  box-shadow: var(--ts-shadow-md);
  padding: 1.4rem 1.4rem 1.6rem;
  transform: translateY(-16px);
  opacity: 0;
  transition: transform .24s ease, opacity .24s ease;
}
.ts-search-panel.is-open .ts-search-panel__inner{
  transform: translateY(0);
  opacity: 1;
}
.ts-search-panel__close{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-inline-start: auto;
  margin-bottom: .8rem;
  width: 36px; height: 36px;
  border: 1px solid var(--ts-border);
  border-radius: 50%;
  background: var(--ts-surface);
  color: var(--ts-muted);
  cursor: pointer;
}
.ts-search-panel__close:hover{ color: var(--ts-primary); border-color: var(--ts-primary-soft); }
.ts-search-form{ display:flex; gap:.6rem; }
.ts-search-form__input{
  flex:1 1 auto; padding:.9rem 1.1rem; border:1px solid var(--ts-border-strong);
  border-radius: var(--ts-radius-sm); font-size:1.05rem; background: var(--ts-surface);
}
.ts-search-form__submit{
  background: var(--ts-primary); color:#fff; border:0; border-radius: var(--ts-radius-sm);
  padding:.7rem 1.2rem; cursor:pointer; font-weight:600;
}
body.ts-search-lock{ overflow: hidden; }

.ts-search-results{
  margin-top: 1rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  max-height: 320px;
  overflow-y: auto;
}
.ts-search-result{
  display:flex; align-items:center; gap:.8rem;
  padding:.6rem; border-radius: var(--ts-radius-sm);
  text-decoration:none; color:inherit;
  transition: background .15s ease;
}
.ts-search-result:hover{ background: var(--ts-bg); }
.ts-search-result__thumb{
  flex:0 0 auto; width:52px; height:52px; border-radius: var(--ts-radius-sm);
  overflow:hidden; background: var(--ts-border);
}
.ts-search-result__thumb img{ width:100%; height:100%; object-fit:cover; }
.ts-search-result__body{ min-width:0; }
.ts-search-result__cat{ font-size:.74rem; color: var(--ts-primary); font-weight:700; margin-bottom:.15rem; }
.ts-search-result__title{
  font-size:.92rem; font-weight:600; color: var(--ts-text-strong);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.ts-search-status{ font-size:.85rem; color: var(--ts-muted); margin-top:.6rem; }

/* -------------------------------------------------------------------------
   موبایل
   ------------------------------------------------------------------------- */
@media (max-width: 780px){
  .ts-nav-toggle{ display:flex; }
  .ts-primary-nav{
    position:absolute; inset-inline:0; top: 100%;
    background: var(--ts-bg); border-bottom: 1px solid var(--ts-border);
    box-shadow: var(--ts-shadow-sm);
    max-height:0; overflow:hidden; transition: max-height .25s ease;
  }
  .ts-primary-nav.is-open{ max-height: 500px; overflow-y:auto; }
  .ts-primary-nav__list{ flex-direction:column; align-items:flex-start; gap:0; padding: .5rem 1.25rem 1rem; }
  .ts-primary-nav__list li{ width:100%; border-top: 1px solid var(--ts-border); }
  .ts-primary-nav__list li:first-child{ border-top:0; }
  .ts-primary-nav__list a{ display:block; padding: .75rem 0; }
  .ts-primary-nav__list ul{ padding-inline-start: 1rem; }
  .ts-site-header{ position: sticky; }
}
