/* Pargah ERP Stage 18.8 — Responsive, Accessibility & Final Polish */
:root{
  --stage188-focus:color-mix(in srgb,var(--module-accent,#765ee8) 82%,#121926);
  --stage188-focus-soft:color-mix(in srgb,var(--module-accent,#765ee8) 18%,transparent);
  --stage188-touch:44px;
  --stage188-mobile-gutter:14px;
}
html{scroll-padding-top:calc(var(--shell-sticky-offset,112px) + 18px);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{min-width:320px;overflow-wrap:break-word}
img,svg,video,canvas{max-width:100%}
button,input,select,textarea{font:inherit}
button,a,summary,[role="button"],input,select,textarea{-webkit-tap-highlight-color:transparent}

/* Accessible primitives */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.stage188-skip-link{position:fixed;z-index:1000;top:10px;right:50%;transform:translate(50%,-160%);padding:10px 16px;border:2px solid #fff;border-radius:10px;background:#111722;color:#fff;font-size:.75rem;font-weight:800;box-shadow:0 12px 35px rgba(0,0,0,.25);transition:transform .16s ease}
.stage188-skip-link:focus{transform:translate(50%,0);outline:3px solid var(--module-accent,#8068e8);outline-offset:3px}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--stage188-focus)!important;outline-offset:3px!important;box-shadow:0 0 0 5px var(--stage188-focus-soft)!important}
:where(.nav-item,.nav-subitem,.mobile-dock a,.mobile-dock button,.shell-action,.command-item):focus-visible{border-radius:10px}
#main-content:focus{outline:none!important;box-shadow:none!important}
[aria-invalid="true"]{border-color:#c64a5c!important;box-shadow:0 0 0 3px rgba(198,74,92,.09)!important}
.stage188-field-error-link{scroll-margin-top:calc(var(--shell-sticky-offset,112px) + 16px)}

/* Tap targets and readable controls */
@media (pointer:coarse){
  :where(.button,.icon-button,.text-button,.shell-action,.nav-item,.nav-subitem,.command-item,.mobile-dock a,.mobile-dock button,.pagination a,.pagination button,button[type="submit"]){min-height:var(--stage188-touch)}
  :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea){min-height:var(--stage188-touch)}
  input[type="checkbox"],input[type="radio"]{min-width:20px;min-height:20px}
}

/* Shell resilience */
.topbar-start,.topbar-actions,.topbar-heading,.user-menu,.shell-context-bar,.shell-breadcrumb,.shell-actions{min-width:0}
.topbar-title,.topbar-heading .eyebrow,.shell-breadcrumb a,.shell-breadcrumb strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.page-content{max-width:100%;min-width:0}
.content-card,.form-card,.quality-form-card,.inventory-form-card,.sales-form-card,.hr-form-card,.costing-form-card{min-width:0}
.card-header,.page-toolbar,.toolbar-actions,.page-actions,.hero-actions,.detail-actions{min-width:0;flex-wrap:wrap}
.card-header>*,.page-toolbar>*,.toolbar-actions>*{min-width:0}

/* Forms: final responsive pass */
.form-control,input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea{max-width:100%}
textarea{resize:vertical;min-height:96px}
.form-field label{line-height:1.65}
.form-field .helptext,.form-field small,.field-help{line-height:1.75}
.errorlist{margin:7px 0 0;padding:0;list-style:none;color:#b83e52;font-size:.67rem}
.form-actions,.sticky-form-actions{gap:8px}

/* Tables: robust horizontal access + keyboard discoverability */
.table-wrap{position:relative;max-width:100%;overscroll-behavior-inline:contain;scrollbar-gutter:stable;scroll-snap-type:none}
.table-wrap.stage188-scrollable{outline:1px solid transparent}
.table-wrap.stage188-scrollable:focus-visible{outline:3px solid var(--stage188-focus)!important;outline-offset:2px!important;box-shadow:0 0 0 5px var(--stage188-focus-soft)!important}
.table-wrap.stage188-scrollable:after{content:"↔ برای مشاهده ستون‌های بیشتر، جدول را افقی حرکت دهید";position:sticky;right:10px;bottom:7px;display:inline-flex;pointer-events:none;padding:4px 8px;border-radius:999px;background:rgba(24,31,43,.88);color:#fff;font-size:.54rem;font-weight:700;opacity:0;transform:translateY(3px);transition:.16s ease;z-index:8}
.table-wrap.stage188-scrollable:focus:after,.table-wrap.stage188-scrollable:hover:after{opacity:.9;transform:none}
.data-table{font-variant-numeric:tabular-nums}
.data-table th{white-space:nowrap}
.data-table td,.data-table th{vertical-align:middle}
.data-table :where(a,button){scroll-margin:6px}

/* Long identifiers and Persian/Latin mixed content */
:where(.table-sub,.muted,code,.mono,[data-trace-code],.trace-code,.document-number){overflow-wrap:anywhere;word-break:break-word}
code,.mono,[data-trace-code],.trace-code{direction:ltr;unicode-bidi:isolate;text-align:left}

/* Dashboard / operational grids gracefully compress before mobile */
@media(max-width:1180px){
  :where(.dashboard-grid,.inventory-dashboard-grid,.costing-dashboard-grid,.production-command-grid,.quality-operations-grid,.stage183-overview-grid,.warehouse-grid,.genealogy-grid,.pack-grid-18-6){grid-template-columns:repeat(2,minmax(0,1fr))!important}
  :where(.metric-grid,.kpi-grid,.inventory-kpi-grid,.stage183-metric-grid){grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

@media(max-width:980px){
  .page-content{padding-inline:18px}
  .topbar{padding-inline:16px}
  .topbar-context{display:none}
  .shell-context-bar{padding-inline:16px}
  :where(.two-column-grid,.analytics-grid.two,.quality-chart-grid,.procurement-entry-grid,.supplier-directory-grid){grid-template-columns:1fr!important}
  :where(.metric-grid,.kpi-grid,.inventory-kpi-grid,.stage183-metric-grid,.analytics-kpi-grid,.analytics-kpi-grid.compact){grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(max-width:900px){
  body.sidebar-open{overflow:hidden;touch-action:none}
  .sidebar{padding-top:env(safe-area-inset-top)}
  .sidebar-backdrop{touch-action:none}
  .page-content{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
  .stage187-toast-region{bottom:calc(82px + env(safe-area-inset-bottom))!important}
  .stage187-network-chip{bottom:calc(82px + env(safe-area-inset-bottom))!important}
}

@media(max-width:760px){
  :root{--stage188-mobile-gutter:12px}
  .page-content{padding-inline:var(--stage188-mobile-gutter);padding-top:14px}
  .topbar{padding-inline:12px;gap:8px}
  .topbar-start{gap:8px;flex:1}
  .topbar-heading{flex:1}
  .topbar-title{font-size:.82rem}
  .topbar-heading .eyebrow{font-size:.52rem;max-width:42vw}
  .module-mark{flex:0 0 auto}
  .user-menu{flex:0 0 auto}
  .user-menu form,.user-copy{display:none!important}
  .shell-context-bar{padding-inline:12px}
  .shell-breadcrumb a,.shell-breadcrumb strong{max-width:68vw}
  :where(.dashboard-grid,.inventory-dashboard-grid,.costing-dashboard-grid,.production-command-grid,.quality-operations-grid,.stage183-overview-grid,.warehouse-grid,.genealogy-grid,.pack-grid-18-6,.two-column-grid,.responsive-form-grid,.form-grid,.compact-form-grid,.quality-form-grid,.info-grid,.detail-grid,.customer-grid,.supplier-grid,.contractor-grid,.station-grid,.defect-grid,.hr-shift-grid,.hr-rank-grid,.cost-category-grid,.setup-grid){grid-template-columns:1fr!important}
  :where(.metric-grid,.kpi-grid,.inventory-kpi-grid,.stage183-metric-grid,.analytics-kpi-grid,.analytics-kpi-grid.compact){grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .page-toolbar,.toolbar-actions,.page-actions,.hero-actions,.detail-actions,.floor-actions,.count-actions,.reservation-actions,.finalize-actions{align-items:stretch}
  .page-toolbar>.button,.toolbar-actions>.button,.page-actions>.button,.hero-actions>.button{min-height:42px}
  .filter-bar,.quality-filter,.inventory-filter{grid-template-columns:1fr!important;align-items:stretch!important}
  .filter-bar .button,.quality-filter .button,.inventory-filter .button{width:100%}
  .table-wrap{margin-inline:calc(var(--stage188-mobile-gutter) * -1);padding-inline:var(--stage188-mobile-gutter);width:calc(100% + (var(--stage188-mobile-gutter) * 2))}
  .table-wrap>.data-table:not(.mobile-cards){min-width:720px}
  .command-palette{padding-bottom:calc(10px + env(safe-area-inset-bottom))}
  .command-dialog{max-height:min(82vh,calc(100dvh - 22px))}
  .stage187-toast-region{left:10px!important;right:10px!important;width:auto!important}
  .sticky-form-actions{bottom:calc(73px + env(safe-area-inset-bottom))!important}
}

@media(max-width:520px){
  :where(.metric-grid,.kpi-grid,.inventory-kpi-grid,.stage183-metric-grid,.analytics-kpi-grid,.analytics-kpi-grid.compact){grid-template-columns:1fr!important}
  .topbar .module-mark{display:none}
  .topbar-title{font-size:.78rem}
  .command-search-row{padding-inline:12px}
  .command-search-row input{font-size:.78rem}
  .command-item-copy strong{font-size:.69rem}
  .mobile-dock{padding-inline:4px}
  .mobile-dock a,.mobile-dock button{font-size:.5rem;min-width:0}
  .content-card,.form-card,.quality-form-card,.inventory-form-card,.sales-form-card,.hr-form-card,.costing-form-card{border-radius:13px}
}

@media(max-width:380px){
  .topbar{padding-inline:8px}
  .page-content{padding-inline:9px}
  .mobile-dock{right:5px;left:5px}
  .mobile-dock a,.mobile-dock button{padding-inline:1px}
  .mobile-dock svg{width:18px;height:18px}
}

/* Contrast & OS accessibility preferences */
@media(prefers-contrast:more){
  :root{--line:#bfc5ce;--muted:#5f6875}
  .content-card,.form-card,.data-table,.filter-bar,.shell-context-bar{border-color:#b9c0ca!important}
  .muted,.table-sub,.form-field small,.command-item-copy small{color:#59616c!important}
  .status-badge,.badge,.stage-pill{border-width:1px!important}
}
@media(forced-colors:active){
  *{box-shadow:none!important}
  .stage188-skip-link,.button,.icon-button,.shell-action,.mobile-dock a,.mobile-dock button,.status-badge,.badge{forced-color-adjust:auto;border:1px solid ButtonText}
  :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid Highlight!important}
  .module-mark,.nav-icon,.command-item-icon{forced-color-adjust:none}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  .stage188-skip-link,.table-wrap.stage188-scrollable:after{transition:none!important}
}

/* Print: operationally useful A4 output */
@page{size:A4;margin:12mm}
@media print{
  html,body{background:#fff!important;color:#000!important;font-family:Arial,"Tahoma",sans-serif!important;font-size:10pt!important}
  body{min-width:0!important}
  .sidebar,.sidebar-backdrop,.topbar,.shell-context-bar,.mobile-dock,.command-palette,.stage188-skip-link,.stage188-live-region,.stage187-toast-region,.stage187-route-loader,.stage187-network-chip,.page-toolbar .button,.toolbar-actions,.page-actions,.hero-actions,.filter-bar,.quality-filter,.inventory-filter,.sticky-form-actions,.no-print{display:none!important}
  .app-shell,.main-shell,.page-content{display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important;overflow:visible!important}
  .content-card,.form-card,.quality-form-card,.inventory-form-card,.sales-form-card,.hr-form-card,.costing-form-card,.metric-card,.analytics-kpi{box-shadow:none!important;background:#fff!important;color:#000!important;border:1px solid #bbb!important;break-inside:avoid-page}
  .page-content>h1,.page-content>h2,.page-content>section:first-child{margin-top:0!important}
  .table-wrap{overflow:visible!important;margin:0!important;padding:0!important;width:100%!important}
  .table-wrap:after{display:none!important}
  .data-table{width:100%!important;min-width:0!important;border-collapse:collapse!important;font-size:8.5pt!important}
  .data-table th,.data-table td{padding:5px 4px!important;border:1px solid #bbb!important;background:#fff!important;color:#000!important;white-space:normal!important}
  .data-table thead{display:table-header-group}
  .data-table tr{break-inside:avoid}
  a{color:#000!important;text-decoration:none!important}
  input,select,textarea{background:#fff!important;color:#000!important;border:1px solid #aaa!important}
  .stage187-reveal{opacity:1!important;transform:none!important}
}

/* Login final polish */
.login-form :where(input,button):focus-visible{outline:3px solid #765ee8!important;outline-offset:3px!important;box-shadow:0 0 0 5px rgba(118,94,232,.14)!important}
.login-form .form-error[role="alert"]{border:1px solid #efc4cc}
@media(max-width:620px){
  .login-form-panel{padding:max(26px,env(safe-area-inset-top)) 24px max(26px,env(safe-area-inset-bottom))}
  .login-form{max-width:390px}
}
@media(max-height:650px) and (min-width:621px){
  .login-body{align-items:start;padding-block:16px}
  .login-shell{min-height:0}
  .login-brand-panel,.login-form-panel{padding-block:34px}
}