/* ═══════════════════════════════════════════════════════════════════════
   UIS-1 — لایهٔ مقیاس‌پذیری متن و کنترل‌ها
   هدف: در اندازهٔ عادی ظاهر موجود را نگه می‌دارد؛ در Zoom/Large Text از برش،
   هم‌پوشانی و خروج اقدام‌های عملیاتی از viewport جلوگیری می‌کند.
   این فایل تنها محل مشترکِ قواعد دسترس‌پذیری مقیاس است.
   ═══════════════════════════════════════════════════════════════════════ */
:root{
  --uis-edge:max(12px, env(safe-area-inset-left), env(safe-area-inset-right));
  --uis-overlay-gap:max(14px, env(safe-area-inset-top));
  --uis-header-h:64px;
  --uis-bottom-reserve:130px;
}
:where(button,input,select,textarea){max-inline-size:100%;}
:where(button,input,select,textarea,.uis-breakable){overflow-wrap:anywhere;}
:where(.toolbar,.vrow,.askbtns,.wh-actions,.die-actions,.driver-actions,.nt-acts,.srx-actions,.bm-controls,.bm-footer){min-width:0;}

/* ── PWA مشترک مشتری و پرسنل ───────────────────────────────────────── */
body.alo-app{padding-bottom:max(130px,calc(var(--uis-bottom-reserve) + env(safe-area-inset-bottom)));}
body.alo-app .tabs{align-items:stretch;}
body.alo-app .tab{min-block-size:44px;line-height:1.18;overflow-wrap:anywhere;}
body.alo-app .cartbar{min-block-size:44px;flex-wrap:wrap;}
body.alo-app .cartbar .go{min-block-size:40px;display:inline-flex;align-items:center;justify-content:center;}
body.alo-app :is(.toolbar,.vrow,.askbtns,.wh-actions,.wh-top,.wh-page-head,.wh-priority-summary){flex-wrap:wrap;}
body.alo-app :is(.prod,.citem,.sh-top,.wh-top)>:not(.pimg):not(.sh-img):not(.wh-chk):not(.wh-collapse){min-width:0;}
body.alo-app .wh-stp{white-space:normal;overflow:visible;text-overflow:clip;min-block-size:2.7em;display:flex;align-items:center;justify-content:center;}
body.alo-app .wh-search-in input{min-block-size:44px;padding-inline:52px;}
body.alo-app :is(.wh-search-mode,.wh-search-clr){inline-size:34px;block-size:34px;min-inline-size:34px;min-block-size:34px;}
body.alo-app .wh-search-mode{right:8px;}
body.alo-app .wh-search-clr{left:8px;}
body.alo-app .askbtns button{min-block-size:44px;}

/* هر overlay عملیاتی PWA باید صفحهٔ خودش را scroll کند و کارت در viewport بماند. */
body.alo-app :is(#askOv,#recvOv,#recvGroupOv,#capsOv,#acctOv,#retOv,#invOv,#invLinkOv,#payOv,#commOv,#chequeDateOv,#loyOv,#rewOv){
  overflow-y:auto;overscroll-behavior:contain;padding:var(--uis-overlay-gap) var(--uis-edge);
  align-items:safe center;
}
body.alo-app :is(#askOv,#recvOv,#recvGroupOv,#capsOv,#acctOv,#retOv,#invOv,#invLinkOv,#payOv,#commOv,#chequeDateOv,#loyOv,#rewOv)>div{
  max-inline-size:100%;max-block-size:calc(100dvh - (var(--uis-overlay-gap) * 2));overflow:auto;
}
body.alo-app :is(#sheet,#rateSheet>div,.spot-card,.wncard,.notify-card){max-block-size:calc(100dvh - (var(--uis-overlay-gap) * 2));overflow-y:auto;overscroll-behavior:contain;}
body.alo-app #sheet{padding-bottom:max(20px,env(safe-area-inset-bottom));}

/* ── پنل ویزیتور / راننده / انبار ───────────────────────────────────── */
body.alo-visitor .head-in{align-items:flex-start;flex-wrap:wrap;}
body.alo-visitor .head-t{flex:1 1 160px;}
body.alo-visitor :is(.head-t h1,.head-t .sub,.cust-chip){white-space:normal;overflow:visible;text-overflow:clip;}
body.alo-visitor .cust-chip{max-inline-size:100%;line-height:1.65;}
body.alo-visitor .head-in>button:not(.back-btn){min-block-size:40px;}
body.alo-visitor :is(.tabs,.toolbar,.driver-queues,.driver-card .toolbar){flex-wrap:wrap;}
body.alo-visitor .tab{min-block-size:44px;min-inline-size:7rem;line-height:1.25;}
body.alo-visitor .rowc{align-items:flex-start;}
body.alo-visitor .rowc>div:not(.img){min-width:0;}
body.alo-visitor #whSearchV{min-block-size:44px!important;padding-inline:48px!important;}
body.alo-visitor :is(#whSearchModeV,#whSearchClrV){width:34px!important;height:34px!important;min-width:34px;min-height:34px;}
body.alo-visitor :is(#askOv,#payOvV,#chequeDateOvV,#invOvV,#invLinkOvV,#retOvV,#recvOvV){
  overflow-y:auto!important;overscroll-behavior:contain;padding:var(--uis-overlay-gap) var(--uis-edge)!important;align-items:safe center!important;
}
body.alo-visitor :is(#askOv,#payOvV,#chequeDateOvV,#invOvV,#invLinkOvV,#retOvV,#recvOvV)>div{
  max-inline-size:100%;max-block-size:calc(100dvh - (var(--uis-overlay-gap) * 2));overflow:auto;
}
body.alo-visitor :is(#sheet,.askcard,.sales-ov-card){max-block-size:calc(100dvh - (var(--uis-overlay-gap) * 2));overflow-y:auto;overscroll-behavior:contain;}
body.alo-visitor #sheet{padding-bottom:max(20px,env(safe-area-inset-bottom));}

/* ── مدیر، حسابدار و مدیر فروش ─────────────────────────────────────── */
body.alo-panel .head-in{align-items:flex-start;flex-wrap:wrap;}
body.alo-panel .head-in>div:not(.sp){min-width:0;}
body.alo-panel .vchip{white-space:normal;line-height:1.55;}
body.alo-panel :is(.icon-btn,.nav-btn){min-block-size:40px;}
body.alo-panel :is(.bottomnav,.cap-tabs){max-inline-size:100%;overflow-x:auto;overscroll-behavior-inline:contain;}
body.alo-panel :is(.bottomnav,.toolbar,.bm-controls,.bm-footer,.sec-title,.chq-rules-top){flex-wrap:wrap;}
body.alo-panel :is(.tools-overlay,.more-ov){overflow-y:auto;overscroll-behavior:contain;}
body.alo-panel :is(.tools-sheet,.more-sheet){max-block-size:calc(100dvh - (var(--uis-overlay-gap) * 2));overflow-y:auto;}
body.alo-panel :is(#bonEditOv,#unitOv){overflow-y:auto!important;overscroll-behavior:contain;align-items:safe center!important;}
body.alo-panel :is(#bonEditOv,#unitOv)>div{max-block-size:calc(100dvh - (var(--uis-overlay-gap) * 2));overflow:auto;}
body.alo-panel :is(.rank,.bm-stat,.bm-un-top){flex-wrap:wrap;}
body.alo-panel .rank .rn{white-space:normal;overflow:visible;text-overflow:clip;}

/* مدیر/راننده: ویرایشگر اقلام در متن بزرگ هیچ‌گاه اقدام‌ها را پنهان نمی‌کند. */
.die-mask{padding:var(--uis-overlay-gap) var(--uis-edge);overflow-y:auto;align-items:safe flex-end;}
.die-sheet{width:min(620px,100%);max-block-size:calc(100dvh - (var(--uis-overlay-gap) * 2));}
.die-head,.die-actions{flex-wrap:wrap;}
.die-x{min-inline-size:36px;min-block-size:36px;flex:0 0 auto;}
.die-actions button{min-block-size:44px;}

/* ── صفحهٔ عمومی مشتری و صفحات مدیریتی جانبی ───────────────────────── */
body:not(.alo-app):not(.alo-panel):not(.alo-visitor) :is(.notice,.section-head,.brand-section-head,.hero-actions,.card-foot,.row,.form){flex-wrap:wrap;}
body:not(.alo-app):not(.alo-panel):not(.alo-visitor) .modal{max-block-size:calc(100dvh - (var(--uis-overlay-gap) * 2));overflow-y:auto;}
body:not(.alo-app):not(.alo-panel):not(.alo-visitor) .modal-close{min-inline-size:36px;min-block-size:36px;}

/* bottom navigation پنل تا ۸۶۰px فعال است؛ فضای پایان محتوا از ارتفاع واقعی آن می‌آید. */
@media (max-width:860px){
  body.alo-panel main{padding-bottom:calc(var(--navh,64px) + 24px);}
  body.alo-panel #toast{bottom:calc(var(--navh,64px) + 20px);}
}

/* وقتی عرض مؤثر به‌علت Zoom یا موبایل کوچک شد، اقدام‌ها و گریدها اولویت خوانایی دارند. */
@media (max-width:640px){
  :where(.askbtns,.die-actions,.bm-footer,.tools-sheet>div[style*="display:flex"],.modal-actions){flex-wrap:wrap;}
  :where(.askbtns,.die-actions)>button{flex:1 1 10rem;}
  body.alo-app :is(.prod,.citem,.sh-top){align-items:flex-start;}
  body.alo-app .units{flex-wrap:wrap;}
  body.alo-panel main{padding-inline:max(14px,env(safe-area-inset-left));padding-bottom:calc(var(--navh,64px) + 24px);}
  body.alo-panel .bottomnav{padding-bottom:max(8px,env(safe-area-inset-bottom));}
  body.alo-panel #toast{bottom:calc(var(--navh,64px) + 20px);}
  body.alo-visitor main{padding-inline:max(14px,env(safe-area-inset-left));}
}

@media (max-width:390px){
  body.alo-app .tab{font-size:10.5px;}
  body.alo-visitor .head-t{flex-basis:140px;}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;}
}

/* ═══════════════════════════════════════════════════════════════════════
   LAYOUT-GUARD v672 — قفل عرض صفحه (پیگیر + الوچسب)
   قانون: هیچ صفحه‌ای نباید از عرض گوشی بیرون بزند یا به چپ/راست جابه‌جا شود؛
   حتی با Large Text / Zoom / تغییر اندازهٔ فونت. هر چیز عریض‌تر از صفحه،
   یا داخل کادر خودش می‌پیچد (wrap) یا داخل کادر خودش اسکرول می‌شود.
   ═══════════════════════════════════════════════════════════════════════ */

/* ۱) ریشه: اسکرول افقی صفحه ممنوع (روی html تا sticky/fixed خراب نشود) */
html{
  -webkit-text-size-adjust:100%;text-size-adjust:100%;
  max-width:100%;overflow-x:hidden;
}
body{max-width:100%;overflow-wrap:break-word}

/* ۲) رسانه و کنترل‌های فرم هیچ‌وقت از والد پهن‌تر نشوند */
img,svg,video,canvas,iframe{max-width:100%}
input,select,textarea{max-width:100%;min-width:0}
pre,code{white-space:pre-wrap;overflow-wrap:anywhere}

/* ۳) جدول‌ها: اگر پهن بودند داخل کادر خودشان اسکرول شوند */
.lg-scroll-x{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ───────────────────────── پیگیر (.field-page) ───────────────────────── */
.field-page .app,.field-page .main,.field-page .panel{min-width:0;max-width:100%}
.field-page .stack,.field-page .stack>*,
.field-page .two>*,.field-page .fields>*,
.field-page .card,.field-page .summary,
.field-page .head>div,
.field-page .sec-title>*,.field-page .row-between>*,
.field-page .lane,.field-page .lane .lt,
.field-page .cust .ct,.field-page .check .ct,.field-page .work .wt,
.field-page .mode-row,.field-page .member,.field-page .stop,
.field-page .person .who,.field-page .brand{min-width:0;max-width:100%}

.field-page .head>div:first-child{flex:1 1 auto}
.field-page .head h1,.field-page .eyebrow{overflow-wrap:anywhere}
.field-page .sec-title{flex-wrap:wrap}
.field-page .chip{max-width:100%}
.field-page .cust,.field-page .check,.field-page .ho .r1,.field-page .row-between{min-width:0}

/* ردیف‌های تب‌مانند: اگر جا نشد داخل خودشان اسکرول شوند، نه بیرون بزنند */
.field-page .seg{max-width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.field-page .seg::-webkit-scrollbar{display:none}
.field-page .seg>button{flex:0 0 auto}

/* انتخاب هفته: دو دکمهٔ هم‌عرض، بازهٔ تاریخ زیر عنوان (به‌جای یک خط بسیار بلند) */
.field-page .wksw{display:flex;width:100%;overflow:visible}
.field-page .wksw>button{flex:1 1 0;min-width:0;white-space:normal;line-height:1.55;padding-inline:8px}
.field-page .wksw>button small{display:block;margin-top:1px}

.field-page .week{max-width:100%;min-width:0;overscroll-behavior-x:contain}
.field-page .pchips,.field-page .city-chips{min-width:0}

/* ───────────────────────── الوچسب (.alo-app / پنل‌ها) ───────────────────────── */
body.alo-app,body.alo-panel,body.alo-visitor{max-width:100%}
body.alo-app :is(main,section,article,aside,header,nav,form,ul,li,.card,.box,.panel,.row,.item,.tabs,.tab){min-width:0}
body.alo-app :is(h1,h2,h3,h4,p,label,small,b,strong){overflow-wrap:anywhere}
body.alo-panel :is(.card,.panel,.box,section,article){min-width:0;max-width:100%}
body.alo-visitor :is(.card,.panel,.box,section,article){min-width:0;max-width:100%}

/* ── سبد خرید ── ردیف‌ها همیشه فاصله دارند و ستون نام کالا هیچ‌وقت له نمی‌شود:
   اگر قیمت و دکمهٔ حذف جا نشدند، به خط دوم همان کارت می‌روند */
body.alo-app #clist>.citem{margin-bottom:8px}
body.alo-app #pgCart .citem{flex-wrap:wrap;row-gap:6px;min-width:0;max-width:100%}
body.alo-app #pgCart .citem .pimg{flex:0 0 44px}
body.alo-app #pgCart .cinfo{flex:1 1 9em;min-width:0;overflow-wrap:anywhere}
body.alo-app #pgCart .cname{overflow-wrap:anywhere}
body.alo-app #pgCart .cprice{flex:0 0 auto;white-space:nowrap;margin-inline-start:auto}
body.alo-app #pgCart .cdel-btn{flex:0 0 auto}
/* لایهٔ قرمز «حذف» فقط وقتی کارت واقعاً کشیده شده دیده شود (نه از گوشه‌های کارت) */
@supports selector(:has(*)){
  body.alo-app .cswipe .cdel{opacity:0;transition:opacity .12s}
  body.alo-app .cswipe:has(.citem[style*="translateX(-"]) .cdel{opacity:1}
}

/* ── فوتر سبد (ثبت‌کنندهٔ سفارش) ── برچسب‌ها هم‌عرض ⇒ همهٔ فیلدها هم‌تراز و هم‌اندازه */
body.alo-app #cfoot label{flex:0 0 auto;min-width:5.4em;white-space:nowrap}
body.alo-app #cfoot :is(input,textarea,select,#payMethodView,.cheque-chip){min-width:0;max-width:100%}
body.alo-app #cfoot .totalbox{flex-wrap:wrap;gap:6px 12px;align-items:center}
body.alo-app #cfoot .totalbox>span{min-width:0}

/* ── صفحهٔ روز ارسال/آدرس/کوپن ── */
body.alo-app .ship-opt{min-width:0;max-width:100%}
body.alo-app .ship-day{min-width:0;flex:1 1 auto;overflow-wrap:anywhere}
body.alo-app .ship-dot{flex:0 0 auto}
body.alo-app #pgShipDate :is(input,textarea,button){min-width:0;max-width:100%}

/* ── همهٔ مودال‌ها (پرداخت، چک، دریافت، حسابداری، …): اگر بلندتر از صفحه شدند اسکرول شوند، نه اینکه بالا و پایینشان بریده شود */
body.alo-app div[id$="Ov"][style*="position:fixed"][style*="align-items:center"]{
  overflow-y:auto;align-items:flex-start!important;
  -webkit-overflow-scrolling:touch;overscroll-behavior:contain;
}
body.alo-app div[id$="Ov"][style*="position:fixed"][style*="align-items:center"]>*{
  margin:auto;max-width:100%;box-sizing:border-box;
}
body.alo-app .payopt{min-width:0;max-width:100%;white-space:normal;line-height:1.7}

/* نمایه‌های همه‌جا: عنصر علامت‌خورده توسط JS محافظ */
[data-lg-fix]{box-sizing:border-box}