/* ═══════════════════════════════════════════════════════════════════
   گله‌بان — لایهٔ موبایل سراسری
   جدول‌ها: جدول کوچک ← کارت، جدول پهن ← اسکرول با ستون اول ثابت (تصمیم با gb-mobile.js)
   بر اساس عرض خود بخش (container query)، نه عرض کل گوشی.
   فرم‌ها ۱۶px (بدون زوم آیفون)، لمس ۴۴px، تب‌های قابل‌کشیدن، پنجره‌ها از پایین.
   ═══════════════════════════════════════════════════════════════════ */

/* ── جدول: نگه‌دارندهٔ اسکرول با سایهٔ لبه (نشانهٔ ادامه) ── */
.gbt-wrap {
  position: relative;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  container-type: inline-size;
  scrollbar-width: thin;
}
.gbt-wrap.gbt-more {                   /* لبهٔ چپ محو می‌شود وقتی ستون‌های دیگری هست */
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 28px);
          mask-image: linear-gradient(to right, transparent 0, #000 28px);
}
.gbt-hint { display: none; font-size: 12px; color: var(--text-3, #a89572); padding: 4px 2px 0; }
.gbt-more + .gbt-hint { display: block; }

/* جدول پهن: ستون اول (سمت راست) ثابت می‌ماند */
.gbt-scroll table { min-width: max-content; }
.gbt-scroll table th, .gbt-scroll table td { white-space: nowrap; }
.gbt-scroll table tr > :first-child {
  position: sticky; right: 0; z-index: 1;
  background: var(--surface, #fff);
  box-shadow: -1px 0 0 var(--border, #f0deb8);
}
.gbt-scroll table thead tr > :first-child { background: var(--surface2, #f6ecd6); z-index: 2; }

/* جدول کوچک ← کارت، وقتی بخش باریک است */
@container (max-width: 560px) {
  table.gbt-cards, table.gbt-cards tbody, table.gbt-cards tr,
  table.gbt-cards td, table.gbt-cards tbody th { display: block; width: 100% !important; }
  table.gbt-cards thead, table.gbt-cards tr.gbt-head { display: none; }
  table.gbt-cards { min-width: 0 !important; border-collapse: separate; }
  table.gbt-cards tbody tr {
    background: var(--surface, #fff);
    border: 1px solid var(--border, #f0deb8);
    border-radius: 14px;
    padding: 8px 12px;
    margin-bottom: 10px;
  }
  table.gbt-cards tbody tr:hover td { background: transparent; }
  table.gbt-cards td, table.gbt-cards tbody th {
    display: flex; justify-content: space-between; align-items: center; gap: 12px;
    padding: 7px 0 !important; border: 0 !important;
    border-bottom: 1px dashed var(--border, #f0deb8) !important;
    text-align: left; white-space: normal !important; min-height: 36px;
    direction: rtl;                       /* خانه‌های dir=ltr (شماره) هم برچسبشان سمت راست بماند */
  }
  table.gbt-cards td > * { unicode-bidi: isolate; }
  table.gbt-cards tr > :last-child { border-bottom: 0 !important; }
  table.gbt-cards td::before, table.gbt-cards tbody th::before {
    content: attr(data-label);
    flex: 0 0 38%;
    text-align: right;
    font-size: 12px; font-weight: 700;
    color: var(--text-2, #5c4f33);
  }
  /* خانهٔ اول هر کارت، عنوان کارت است */
  table.gbt-cards tr > :first-child { font-weight: 800; font-size: 15px; justify-content: flex-start; text-align: right; }
  table.gbt-cards tr > :first-child::before { display: none; }
  table.gbt-cards td:empty { display: none; }
}

/* ── فقط موبایل و تبلت کوچک ── */
@media (max-width: 768px) {
  /* محتوا دیگر بریده نمی‌شود: عنصرهای پهن کوچک می‌شوند، جدول‌ها خودشان اسکرول دارند */
  html body .content { overflow-x: clip !important; }      /* clip به‌جای hidden: چیزهای sticky داخلش کار می‌کنند */
  /* فرزندهای grid و flex بدون min-width:0 از ستونشان بیرون می‌زنند */
  .grid-2 > *, .grid-3 > *, .grid-4 > *, .metrics > *, .form-grid > *, .flex > *, .page-header > * { min-width: 0; }
  .page-header .flex, .page-header > div { flex-wrap: wrap; }
  .content select { max-width: 100%; }
  .content label { max-width: 100%; }
  .content img, .content video, .content iframe, .content canvas, .content embed { max-width: 100%; height: auto; }
  .content [style*="width:"]:not(table):not(td):not(th):not(svg):not(svg *):not(.gbt-wrap *),
  .content [style*="width: "]:not(table):not(td):not(th):not(svg):not(svg *):not(.gbt-wrap *) { max-width: 100% !important; }
  .content [style*="min-width"]:not(table):not(td):not(th):not(.gbt-wrap *) { min-width: 0 !important; }
  .content pre, .content code { white-space: pre-wrap; word-break: break-word; }
  .card, .content p, .content li, .content td { overflow-wrap: anywhere; }
  .content h1, .content h2, .content h3, .page-title { text-wrap: balance; }
  .content p { text-wrap: pretty; }

  /* فرم: ۱۶px تا آیفون زوم نکند؛ یک‌ستونه */
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]), select, textarea { font-size: 16px !important; }
  .form-grid { grid-template-columns: 1fr !important; }
  .form-control, select, input[type=text], input[type=tel], input[type=number], input[type=search], input[type=date] { min-height: 44px; }

  /* نوشتهٔ ریز: حداقل ۱۲ پیکسل روی گوشی (خوانایی؛ حتی وقتی اندازه درون‌خطی نوشته شده) */
  .text-sm, .form-hint, .table th, .badge, small { font-size: max(12px, 1em) !important; }
  .content [style*="font-size:9px"], .content [style*="font-size: 9px"], .content [style*="font-size:10px"], .content [style*="font-size: 10px"],
  .content [style*="font-size:10.5px"], .content [style*="font-size:11px"], .content [style*="font-size: 11px"] { font-size: 12px !important; }
  .content input[type=checkbox], .content input[type=radio] { width: 20px; height: 20px; }

  /* لمس: حداقل ۴۴ پیکسل */
  .btn { min-height: 44px; }
  .btn-sm { min-height: 40px; padding-inline: 12px; }
  .btn-icon { min-width: 44px; min-height: 44px; }
  .mobile-nav a, .gbn a { min-height: 48px; }

  /* سربرگ صفحه و ردیف دکمه‌ها می‌شکنند، بیرون نمی‌زنند */
  .page-header { flex-wrap: wrap; gap: 10px; }
  .page-header > * { min-width: 0; }
  .flex.justify-between { flex-wrap: wrap; gap: 8px; }

  /* تب‌ها و ردیف فیلترها: نوار افقی قابل‌کشیدن به‌جای چند خط */
  .tabs, [role="tablist"], .gbu-tabs, .gbm-tabs, .rf-tabs, .gb-tabs, .nav-tabs, .tab-bar {
    display: flex !important; flex-wrap: nowrap !important;
    overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none;
    -webkit-mask-image: linear-gradient(to left, transparent 0, #000 18px, #000 calc(100% - 18px), transparent 100%);
            mask-image: linear-gradient(to left, transparent 0, #000 18px, #000 calc(100% - 18px), transparent 100%);
    padding-inline: 4px;
  }
  .tabs::-webkit-scrollbar, [role="tablist"]::-webkit-scrollbar, .gbu-tabs::-webkit-scrollbar, .rf-tabs::-webkit-scrollbar { display: none; }
  .tabs > *, [role="tablist"] > *, .gbu-tabs > *, .gbm-tabs > *, .rf-tabs > *, .gb-tabs > *, .nav-tabs > *, .tab-bar > * { flex: 0 0 auto; scroll-snap-align: start; }

  /* پنجره‌های بازشو: از پایین، تمام‌عرض، با اسکرول داخلی */
  .modal, [class*="modal"] > .card, [style*="position:fixed"][style*="inset:0"] > .card {
    max-height: 92dvh; overflow-y: auto;
  }
  [style*="position:fixed"][style*="inset:0"][style*="align-items:center"] { align-items: flex-end !important; padding: 0 !important; }
  [style*="position:fixed"][style*="inset:0"] > .card { width: 100% !important; max-width: 100% !important; border-radius: 20px 20px 0 0 !important; margin: 0 !important; padding-bottom: calc(16px + env(safe-area-inset-bottom)); }

  /* منوی پایین روی نوار سیستم نمی‌افتد */
  .mobile-nav, .gbn { padding-bottom: env(safe-area-inset-bottom); }
  .content { padding-bottom: calc(92px + env(safe-area-inset-bottom)); }
}

/* نوار بالا روی گوشی باریک: عنوان یک‌خطی، راهنما و پشتیبانی (که در منو هم هستند) پنهان */
@media (max-width: 480px) {
  .topbar { gap: 6px; }
  .topbar > .flex:first-child { min-width: 0; flex: 1 1 auto; gap: 6px !important; }
  .gb-top-title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; font-size: 14px !important; }
  .gb-top-help, .gb-top-sup, .pwa-install-btn { display: none !important; }
  .topbar .btn-icon { min-width: 40px; min-height: 40px; }
  .topbar > .flex:last-child { gap: 4px !important; flex: 0 0 auto; }
}
@media (max-width: 380px) { .topbar > .flex:first-child > span:first-child { display: none; } }

/* ارتفاع درست وقتی کیبورد یا نوار مرورگر باز و بسته می‌شود */
@supports (height: 100dvh) {
  .layout { min-height: 100dvh; }
}

/* حرکت کمتر برای کسانی که خواسته‌اند */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}