/* ==========================================================================
   Arcopet v2 · آرشیو محصولات
   ساختار: templates/archive-product.php و parts/archive/*. فقط var(--v2-*) (رنگ‌ها در tokens.css).
   موبایل اول: ۲ ستون. از ۶۰۰: ۳ ستون. از ۹۹۲: فیلترهای کناری + شبکه‌ی خودکار.
   ========================================================================== */

.v2-archive{ padding-bottom:56px; }

/* ---------- بالای صفحه ---------- */
.v2-archive-banner{ margin:16px 0 0; text-align:center; }
.v2-archive-banner img{ display:block; width:100%; max-width:700px; height:auto; margin-inline:auto; border-radius:var(--v2-radius-l); }

.v2-archive-head{ padding:6px 0 12px; }
.v2-archive-title{
  margin:4px 0 0; font-size:var(--v2-fs-22); line-height:1.6; font-weight:800; color:var(--v2-heading);
  text-wrap:balance;
}
@media (min-width:992px){ .v2-archive-title{ font-size:var(--v2-fs-28); } }

/* چیپ‌ها: زیردسته‌ها و فیلترهای سریع */
.v2-chip{
  display:inline-flex; align-items:center; min-height:38px; padding:0 16px; border-radius:999px;
  border:1px solid var(--v2-border); background:var(--v2-surface); color:var(--v2-text);
  font-size:var(--v2-fs-14); font-weight:500; white-space:nowrap;
  transition:background-color .15s, border-color .15s, color .15s;
}
.v2-chip:hover{ border-color:var(--v2-border-strong); }
.v2-chip.is-active{ background:var(--v2-tint); border-color:var(--v2-brand); color:var(--v2-tint-text); font-weight:700; }

.v2-subcats ul{ display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 0; padding:0; list-style:none; }

/* ---------- چیدمان ---------- */
.v2-archive-layout{ display:block; }
.v2-archive-main{ min-width:0; }
@media (min-width:992px){
  .v2-archive.has-sidebar .v2-archive-layout{ display:grid; grid-template-columns:272px minmax(0,1fr); gap:28px; align-items:start; }
}

/* ---------- ابزار: مرتب‌سازی، فیلترها، تعداد ---------- */
.v2-archive-toolbar{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px;
  padding:4px 0 12px;
}
.v2-tool-btn{
  display:inline-flex; align-items:center; gap:6px; min-height:42px; padding:0 14px;
  border:1px solid var(--v2-border); border-radius:var(--v2-radius-m); background:var(--v2-surface);
  font-size:var(--v2-fs-14); color:var(--v2-text-subtle);
}
.v2-tool-btn strong{ color:var(--v2-text); font-weight:700; }
.v2-tool-btn .v2-icon{ width:20px; height:20px; color:var(--v2-text); }
.v2-tool-btn:hover{ background:var(--v2-surface-subtle); }
.v2-tool-badge{
  display:inline-grid; place-items:center; min-width:20px; height:20px; padding:0 6px; border-radius:999px;
  background:var(--v2-brand); color:var(--v2-on-brand); font-size:12px; font-weight:700; line-height:1;
}
.v2-tool-badge[hidden]{ display:none; }
.v2-archive-count{ margin:0 auto 0 0; font-size:var(--v2-fs-14); color:var(--v2-text-muted); white-space:nowrap; }

/* فهرست مرتب‌سازی: در موبایل کشوی پایین صفحه، از ۷۶۸ ردیف دکمه‌ها */
.v2-sort-list{ display:grid; gap:4px; margin:0; padding:0; list-style:none; }
.v2-sort-btn{
  display:flex; align-items:center; width:100%; min-height:48px; padding:0 14px; border-radius:var(--v2-radius-m);
  font-size:var(--v2-fs-16); color:var(--v2-text); text-align:start;
}
.v2-sort-btn:hover{ background:var(--v2-surface-subtle); }
.v2-sort-btn.is-active{ background:var(--v2-tint); color:var(--v2-tint-text); font-weight:700; }
.v2-sort-label{ display:none; }

@media (min-width:768px){
  .v2-tool-sort{ display:none; }
  .v2-archive-toolbar .v2-sort{ order:-1; }
  .v2-sort.v2-sheet{ position:static; display:block; }
  .v2-sort .v2-sheet-backdrop, .v2-sort .v2-sheet-head{ display:none; }
  .v2-sort .v2-sheet-panel{
    position:static; display:flex; flex-direction:row; align-items:center; gap:6px; flex-wrap:wrap;
    width:auto; max-height:none; padding:0; background:none; box-shadow:none; border-radius:0; transform:none;
  }
  .v2-sort-label{
    display:inline-flex; align-items:center; gap:4px; margin-inline-end:4px;
    font-size:var(--v2-fs-14); color:var(--v2-text-subtle);
  }
  .v2-sort-label .v2-icon{ width:20px; height:20px; }
  .v2-sort-list{ display:flex; flex-wrap:wrap; gap:6px; }
  .v2-sort-btn{
    min-height:36px; padding:0 14px; border-radius:999px; border:1px solid transparent;
    font-size:var(--v2-fs-14); color:var(--v2-text-subtle);
  }
  .v2-sort-btn.is-active{ border-color:var(--v2-brand); }
}
@media (min-width:992px){
  .v2-archive.has-sidebar .v2-tool-filter{ display:none; }
}

/* فیلترهای سریع: یک ردیف قابل اسکرول */
.v2-quick-filters{ margin:0 calc(var(--v2-gutter-r) * -1) 14px calc(var(--v2-gutter-l) * -1); }
.v2-quick-filters ul{
  display:flex; gap:8px; margin:0; padding:2px var(--v2-gutter-r) 6px var(--v2-gutter-l); list-style:none;
  overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x proximity; scrollbar-width:none;
}
.v2-quick-filters ul::-webkit-scrollbar{ display:none; }
.v2-quick-filters li{ flex:none; scroll-snap-align:start; }
@media (min-width:768px){
  .v2-quick-filters{ margin-inline:0; }
  .v2-quick-filters ul{ flex-wrap:wrap; overflow:visible; padding:2px 0 6px; }
}

/* ---------- کشو (فیلترها و مرتب‌سازی) ---------- */
.v2-sheet{ position:fixed; inset:0; z-index:100001; display:none; }
.v2-sheet.is-open{ display:block; }
.v2-sheet-backdrop{ position:absolute; inset:0; background:var(--v2-overlay); }
.v2-sheet-panel{
  position:absolute; display:flex; flex-direction:column; background:var(--v2-surface);
  box-shadow:var(--v2-shadow-raised);
}
.v2-sheet-head{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:10px 16px 10px 8px; border-bottom:1px solid var(--v2-border);
}
.v2-sheet-title{ margin:0; font-size:var(--v2-fs-18); font-weight:800; color:var(--v2-heading); }
.v2-sheet-close{
  display:inline-grid; place-items:center; width:var(--v2-tap); height:var(--v2-tap); border-radius:50%; color:var(--v2-text);
}
.v2-sheet-close:hover{ background:var(--v2-surface-subtle); }
.v2-sheet-body{ flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:8px 16px 16px; }

/* مرتب‌سازی: از پایین */
.v2-sort .v2-sheet-panel{
  inset:auto 0 0; max-height:80vh; padding:0 12px calc(16px + env(safe-area-inset-bottom,0px));
  border-radius:var(--v2-radius-xl) var(--v2-radius-xl) 0 0;
}
.v2-sort .v2-sheet-head{ margin:0 -12px 8px; }

/* فیلترها: از کنار (راست) */
.v2-filters .v2-sheet-panel{
  inset-block:0; inset-inline-start:0; width:min(420px, 92vw);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-reduced-motion:no-preference){
  .v2-sheet.is-open .v2-sheet-backdrop{ animation:v2-fade .2s ease-out; }
  .v2-sort.is-open .v2-sheet-panel{ animation:v2-rise .24s ease-out; }
  .v2-filters.is-open .v2-sheet-panel{ animation:v2-slide .24s ease-out; }
}
@keyframes v2-fade{ from{ opacity:0; } }
@keyframes v2-rise{ from{ transform:translateY(24px); opacity:0; } }
@keyframes v2-slide{ from{ transform:translateX(24px); opacity:0; } }

/* فیلترهای کناری در دسکتاپ */
@media (min-width:992px){
  .v2-filters.is-sidebar{ position:sticky; inset:auto; top:calc(var(--v2-bar-h) + 64px); z-index:1; display:block; }
  .admin-bar .v2-filters.is-sidebar{ top:calc(var(--v2-bar-h) + 96px); }
  .v2-filters.is-sidebar .v2-sheet-backdrop, .v2-filters.is-sidebar .v2-sheet-close{ display:none; }
  .v2-filters.is-sidebar .v2-sheet-panel{
    position:static; width:auto; max-height:calc(100vh - var(--v2-bar-h) - 96px);
    border:1px solid var(--v2-border); border-radius:var(--v2-radius-l); box-shadow:none; animation:none; overflow:hidden;
  }
  .v2-filters.is-sidebar .v2-sheet-head{ padding:12px 16px; }
  .v2-filters.is-sidebar .v2-sheet-title{ font-size:var(--v2-fs-16); }
  .v2-filters.is-sidebar .v2-filter-options.is-long{ max-height:264px; overflow-y:auto; overscroll-behavior:contain; }
}

/* ---------- بخش‌های فیلتر ---------- */
.v2-filter{ border-bottom:1px solid var(--v2-border); }
.v2-filter:last-child{ border-bottom:0; }
.v2-filter-head{ margin:0; font-size:inherit; }
.v2-filter-toggle{
  display:flex; align-items:center; gap:8px; width:100%; min-height:52px;
  font-size:var(--v2-fs-16); font-weight:700; color:var(--v2-text); text-align:start;
}
.v2-filter-toggle > span{ flex:1; }
.v2-filter-total{ font-size:12px; font-weight:500; color:var(--v2-text-muted); }
.v2-filter-chevron{ width:20px; height:20px; color:var(--v2-text-muted); transition:transform .2s; }
.v2-filter.is-open .v2-filter-chevron{ transform:rotate(180deg); }
.v2-filter-body{ display:none; padding-bottom:14px; }
.v2-filter.is-open .v2-filter-body{ display:block; }
html:not(.v2-js) .v2-filter-body{ display:block; }

.v2-filter-options{ display:grid; gap:2px; }
.v2-filter-option{
  display:flex; align-items:center; gap:10px; min-height:44px; padding:6px 10px; border-radius:var(--v2-radius-s);
  cursor:pointer; font-size:var(--v2-fs-14); color:var(--v2-text); transition:background-color .15s;
}
.v2-filter-option:hover{ background:var(--v2-surface-subtle); }
.v2-filter-option.is-active{ background:var(--v2-tint); }
.v2-filter-option input{ flex:none; width:18px; height:18px; margin:0; accent-color:var(--v2-brand); cursor:pointer; }
.v2-filter-label{ flex:1; min-width:0; overflow-wrap:anywhere; }
.v2-filter-option.is-active .v2-filter-label{ font-weight:700; color:var(--v2-tint-text); }
.v2-filter-count{
  flex:none; min-width:28px; padding:1px 8px; border-radius:999px; background:var(--v2-surface-subtle);
  font-size:12px; color:var(--v2-text-muted); text-align:center;
}

/* کلید روشن/خاموش (فقط موجود، فقط تخفیف‌دار) */
.v2-filter-switch input{
  appearance:none; -webkit-appearance:none; position:relative; width:40px; height:24px; border-radius:999px;
  background:var(--v2-check-border); transition:background-color .15s;
}
.v2-filter-switch input::after{
  content:""; position:absolute; top:3px; inset-inline-start:3px; width:18px; height:18px; border-radius:50%;
  background:var(--v2-white); transition:inset-inline-start .15s;
}
.v2-filter-switch input:checked{ background:var(--v2-brand); }
.v2-filter-switch input:checked::after{ inset-inline-start:19px; }

/* بازه‌ی قیمت (دو اسلایدر روی هم) */
.v2-price-values{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:12px; }
.v2-price-values > div{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:4px; padding:8px 12px; border-radius:var(--v2-radius-m);
  background:var(--v2-surface-subtle); font-size:12px; color:var(--v2-text-muted);
}
.v2-price-values strong{ font-size:var(--v2-fs-14); font-weight:700; color:var(--v2-text); }
.v2-price-range{ --from:0%; --to:100%; position:relative; height:32px; margin:0 10px; }
.v2-price-track{ position:absolute; inset-inline:0; top:14px; height:4px; border-radius:2px; background:var(--v2-border); }
.v2-price-fill{
  position:absolute; inset-block:0; inset-inline-start:var(--from); inset-inline-end:calc(100% - var(--to));
  border-radius:2px; background:var(--v2-brand);
}
.v2-price-range input{
  position:absolute; inset:0; width:100%; height:32px; margin:0; background:none; pointer-events:none;
  appearance:none; -webkit-appearance:none;
}
.v2-price-range input::-webkit-slider-runnable-track{ background:none; border:0; }
.v2-price-range input::-moz-range-track{ background:none; border:0; }
.v2-price-range input::-webkit-slider-thumb{
  -webkit-appearance:none; pointer-events:auto; width:24px; height:24px; border-radius:50%; cursor:grab;
  background:var(--v2-white); border:2px solid var(--v2-brand); box-shadow:var(--v2-shadow-float);
}
.v2-price-range input::-moz-range-thumb{
  pointer-events:auto; width:20px; height:20px; border-radius:50%; cursor:grab;
  background:var(--v2-white); border:2px solid var(--v2-brand); box-shadow:var(--v2-shadow-float);
}
.v2-price-range input:focus-visible{ outline:none; }
.v2-price-range input:focus-visible::-webkit-slider-thumb{ outline:2px solid var(--v2-text); outline-offset:2px; }
.v2-price-range input:focus-visible::-moz-range-thumb{ outline:2px solid var(--v2-text); outline-offset:2px; }

.v2-filter-actions{
  display:flex; gap:8px; padding:12px 16px; border-top:1px solid var(--v2-border); background:var(--v2-surface);
}
.v2-filter-actions .v2-btn{ flex:1; min-height:46px; padding-inline:12px; }
.v2-filter-actions .v2-btn-ghost{ flex:0 0 auto; border:1px solid var(--v2-border); }

/* ---------- شبکه‌ی محصولات ---------- */
.v2-products{
  display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px;
  margin:0; padding:0; list-style:none;
}
@media (min-width:600px){ .v2-products{ grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px; } }
@media (min-width:992px){ .v2-products{ grid-template-columns:repeat(auto-fill, minmax(208px, 1fr)); gap:16px; } }

/* کارت محصول در cards.css است (مشترک با «محصولات مشابه» صفحه‌ی محصول). */

.v2-archive-empty{
  grid-column:1 / -1; padding:48px 16px; border:1px dashed var(--v2-border); border-radius:var(--v2-radius-l);
  text-align:center; color:var(--v2-text-muted);
}
.v2-archive-error{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 14px; padding:12px 16px;
  border-radius:var(--v2-radius-m); background:var(--v2-tint); color:var(--v2-error); font-weight:500;
}
.v2-archive-error[hidden]{ display:none; }

/* بارگذاری صفحه‌ی بعد (اسکرول بی‌پایان) */
.v2-archive-more{
  display:flex; align-items:center; justify-content:center; gap:8px; margin:20px 0 0;
  font-size:var(--v2-fs-14); color:var(--v2-text-muted);
}
.v2-archive-more[hidden]{ display:none; }
.v2-archive-more.is-loading::before{
  content:""; width:16px; height:16px; border-radius:50%;
  border:2px solid currentColor; border-top-color:transparent; animation:v2-spin .75s linear infinite;
}
@keyframes v2-spin{ to{ transform:rotate(360deg); } }

/* اعلان کوچک (اعمال فیلتر، مرتب‌سازی، صفحه) */
.v2-archive-notice{
  position:fixed; left:50%; bottom:calc(20px + env(safe-area-inset-bottom,0px)); z-index:100002;
  display:flex; align-items:center; gap:8px; max-width:calc(100vw - 32px); padding:10px 18px; border-radius:999px;
  background:var(--v2-text); color:var(--v2-page); font-size:var(--v2-fs-14); font-weight:500; line-height:1.5;
  box-shadow:var(--v2-shadow-raised); opacity:0; pointer-events:none; transform:translate(-50%, 12px);
  transition:opacity .18s, transform .18s;
}
.v2-archive-notice.is-active{ opacity:1; transform:translate(-50%, 0); }
.v2-archive-notice.is-loading::before{
  content:""; width:14px; height:14px; border-radius:50%;
  border:2px solid currentColor; border-top-color:transparent; animation:v2-spin .75s linear infinite;
}

/* ---------- صفحه‌بندی ---------- */
.v2-pagination{ display:flex; flex-wrap:wrap; justify-content:center; gap:6px; margin-top:28px; }
.v2-pagination:empty{ display:none; }
.v2-page{
  display:inline-grid; place-items:center; min-width:42px; height:42px; padding:0 10px; border-radius:var(--v2-radius-m);
  border:1px solid var(--v2-border); background:var(--v2-surface); font-size:var(--v2-fs-14); font-weight:500; color:var(--v2-text);
}
a.v2-page:hover{ border-color:var(--v2-border-strong); }
.v2-page.current{ background:var(--v2-brand); border-color:var(--v2-brand); color:var(--v2-on-brand); font-weight:700; }
.v2-page.dots{ border-color:transparent; background:none; min-width:24px; padding:0; }
.v2-page .v2-icon{ width:20px; height:20px; }

/* ---------- متن دسته و سوالات متداول ---------- */
.v2-archive-about{ display:grid; gap:40px; max-width:880px; margin:56px auto 0; }

.v2-archive-desc{ position:relative; }
.v2-archive-desc-body{ font-size:var(--v2-fs-16); }
.v2-js .v2-archive-desc.is-collapsed .v2-archive-desc-body{
  max-height:420px; overflow:hidden;
  -webkit-mask-image:linear-gradient(to bottom, black 62%, transparent);
  mask-image:linear-gradient(to bottom, black 62%, transparent);
}
/* کادرهای رنگی متن (کلاس از arco_v2_archive_clean_html) */
.v2-prose .v2-callout{
  margin:1.4em 0; padding:14px 18px; border-radius:var(--v2-radius-m);
  background:var(--v2-tint); border-inline-start:3px solid var(--v2-brand);
}
.v2-prose .v2-callout > :last-child{ margin-bottom:0; }

.v2-faq{
  padding:20px 16px; border-radius:var(--v2-radius-xl); background:var(--v2-surface-subtle);
}
@media (min-width:768px){ .v2-faq{ padding:28px; } }
.v2-faq-title{
  display:flex; align-items:center; gap:10px; margin:0 0 16px;
  font-size:var(--v2-fs-22); font-weight:800; line-height:1.6; color:var(--v2-heading);
}
.v2-faq-kicker{
  display:inline-grid; place-items:center; flex:none; width:36px; height:36px; border-radius:50%;
  background:var(--v2-brand); color:var(--v2-on-brand); font-size:var(--v2-fs-18); font-weight:800;
}