/* v123.29 Mobile Field Consistency Layer
   Cross-page phone shell, safe-area, keyboard, landscape, focus, wrapping,
   status and touch behavior. Page-specific mobile workflows remain in pro.css. */

@keyframes odafim-mobile-spin{to{transform:rotate(360deg)}}

@media (max-width:760px), (max-width:960px) and (max-height:520px) and (orientation:landscape){
  :root{
    --mobile-header-height:112px;
    --mobile-navigation-height:62px;
    --mobile-header-total:calc(var(--mobile-header-height) + env(safe-area-inset-top,0px));
    --mobile-navigation-total:calc(var(--mobile-navigation-height) + env(safe-area-inset-bottom,0px));
    --mobile-page-gap:9px;
    --mobile-control-height:44px;
    --mobile-card-radius:11px;
    --mobile-card-padding:11px;
  }

  *,*::before,*::after{box-sizing:border-box}
  html,body,.pro-app,.main-shell,.workspace-body,.page{max-width:100%;min-width:0}
  html{overflow-x:clip;scroll-padding-top:calc(var(--mobile-header-total) + 8px)}
  body{overflow-x:clip!important;padding-bottom:calc(var(--mobile-navigation-total) + 6px)!important}
  body,
  button,
  input,
  select,
  textarea{touch-action:manipulation}

  /* The phone header is two clear rows: page identity/actions, then all languages. */
  .topbar{
    position:sticky!important;
    top:0!important;
    z-index:70!important;
    min-height:var(--mobile-header-total)!important;
    height:var(--mobile-header-total)!important;
    padding:calc(7px + env(safe-area-inset-top,0px)) 8px 58px!important;
    align-items:center!important;
    overflow:visible!important;
    border-bottom:1px solid var(--line)!important;
    background:color-mix(in srgb,var(--surface) 96%,transparent)!important;
    backdrop-filter:blur(14px);
  }
  .page-context{align-self:center!important;min-width:0!important;padding-inline-end:6px}
  .page-context h1{max-width:100%;font-size:17px!important;line-height:1.2!important;white-space:normal!important;overflow-wrap:anywhere}
  .topbar-actions{align-self:center!important;gap:6px!important}
  .topbar-actions>#commandBtn{display:none!important}
  .topbar-actions>.button,.global-search{width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important}
  .global-search{cursor:pointer}
  .global-search>span{display:none!important}
  .global-search input{display:none!important}
  .pro-language-control{
    position:absolute!important;
    inset-inline:8px!important;
    bottom:6px!important;
    width:auto!important;
    max-width:none!important;
    min-height:48px!important;
    height:48px!important;
    padding:2px!important;
    overflow:hidden!important;
    border-radius:8px!important;
  }
  .pro-language-buttons{width:100%!important;min-width:0!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:2px!important}
  .pro-language-button{
    min-width:0!important;
    min-height:44px!important;
    height:44px!important;
    padding:3px 4px!important;
    overflow:hidden!important;
    font-size:10px!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  /* Bottom navigation: stable, role-aware and safe-area aware. */
  .sidebar{
    height:var(--mobile-navigation-total)!important;
    min-height:var(--mobile-navigation-total)!important;
    padding-bottom:env(safe-area-inset-bottom,0px)!important;
    transition:transform .18s ease,opacity .18s ease!important;
  }
  .sidebar-nav{height:var(--mobile-navigation-height)!important;min-height:var(--mobile-navigation-height)!important;scroll-padding-inline:8px!important;overscroll-behavior-x:contain!important}
  .sidebar .nav-item{
    min-height:52px!important;
    height:52px!important;
    scroll-snap-align:center;
    -webkit-tap-highlight-color:transparent;
  }
  .sidebar .nav-item>span:nth-child(2){line-height:1.08!important}
  .sidebar .nav-item.active{outline:1px solid rgba(255,255,255,.14);outline-offset:-1px}
  body.role-requester .sidebar-nav,
  body.role-warehouse-operator .sidebar-nav{scroll-snap-type:none!important}
  body.role-administrator .sidebar-nav{scroll-snap-type:x proximity!important}

  /* One scroll owner and predictable page spacing across all phone workspaces. */
  .workspace-body{
    width:100%!important;
    max-width:100%!important;
    min-height:calc(var(--mobile-visual-height,100dvh) - var(--mobile-header-total))!important;
    padding:8px 7px calc(var(--mobile-navigation-total) + 14px)!important;
    overflow:visible!important;
  }
  .page.active,.page[data-page].active{width:100%!important;max-width:100%!important;min-width:0!important;gap:var(--mobile-page-gap)!important;overflow-x:clip!important}
  .page.active>*{max-width:100%;min-width:0}
  .page[data-page="overview"] .workspace-modebar,
  .page[data-page="inventory"]>.module-commandbar,
  .page[data-page="orders"]>.orders-modebar{
    top:var(--mobile-header-total)!important;
  }
  .mobile-order-composer-exit{
    width:100%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:8px!important;
    min-height:44px!important;
    padding:9px 12px!important;
    border:1px solid var(--line)!important;
    border-radius:10px!important;
    background:var(--surface)!important;
    color:var(--text)!important;
    font-weight:700!important;
  }
  .mobile-order-composer-steps{top:calc(var(--mobile-header-total) + 56px)!important}
  .mobile-order-composer-actions{bottom:calc(var(--mobile-navigation-total) + 6px)!important}

  /* Shared field-card rhythm. */
  .mobile-order-filter-card,
  .mobile-order-detail-card,
  .mobile-order-composer-card,
  .mobile-location-control-card,
  .mobile-location-detail-card,
  .mobile-location-category-card,
  .mobile-barcode-scan-card,
  .mobile-barcode-result-card,
  .mobile-barcode-recent-card,
  .mobile-barcode-label-card,
  .mobile-barcode-label-preview-card,
  .inventory-request-mobile-card,
  .inventory-mobile-card,
  .briefing-card,
  .surface,
  .app-pane{
    max-width:100%;
    min-width:0;
    border-radius:var(--mobile-card-radius);
  }
  .mobile-order-filter-head,
  .mobile-order-composer-heading,
  .mobile-location-control-head,
  .mobile-barcode-card-head,
  .mobile-barcode-section-head,
  .surface-header,
  .app-pane-header{
    min-width:0;
  }
  .mobile-order-filter-head>div,
  .mobile-order-composer-heading>div,
  .mobile-location-control-head>div,
  .mobile-barcode-card-head>div,
  .mobile-barcode-section-head>div,
  .surface-header>div,
  .app-pane-header>div{min-width:0}

  /* Universal phone interaction floor. */
  button:not(.inventory-update-close):not(.mobile-inspector-close),
  .button,
  [role="button"],
  .workspace-mode-tab,
  .nav-item,
  input[type="text"],
  input[type="search"],
  input[type="number"],
  input[type="date"],
  input[type="email"],
  input[type="password"],
  select{
    min-height:var(--mobile-control-height);
  }
  button,.button,[role="button"]{-webkit-tap-highlight-color:transparent}
  button:active,.button:active,[role="button"]:active{transform:translateY(1px)}
  button:disabled,.button:disabled,[aria-disabled="true"]{transform:none!important}
  :where(button,.button,input,select,textarea,[tabindex]):focus-visible{
    outline:3px solid color-mix(in srgb,var(--accent) 52%,transparent)!important;
    outline-offset:2px!important;
  }
  input,select,textarea{max-width:100%;scroll-margin-block:calc(var(--mobile-header-total) + 10px) calc(var(--mobile-navigation-total) + 18px)}

  /* Long translated labels must wrap instead of pushing the viewport. */
  :where(.button,.workspace-mode-tab,.workspace-submodebar button,.filter-group button,.request-scope-buttons button,.mobile-order-open-label,.mobile-location-open-label,.mobile-barcode-status,.empty-state,.mobile-order-empty,.mobile-location-empty,.mobile-barcode-empty,.pro-data-access-notice) {
    overflow-wrap:anywhere;
    word-break:normal;
  }
  :where(.button,.workspace-mode-tab,.workspace-submodebar button,.filter-group button,.request-scope-buttons button){white-space:normal!important;line-height:1.2!important}
  html[lang="ru"] .sidebar .nav-item>span:nth-child(2),
  html[lang="he"] .sidebar .nav-item>span:nth-child(2),
  html[lang="ar"] .sidebar .nav-item>span:nth-child(2){font-size:9.5px!important;white-space:normal!important;display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  html[dir="rtl"] .mobile-order-card-accent,
  html[dir="rtl"] .mobile-location-card-accent{left:auto;right:0}

  /* Shared empty, error and loading treatment. */
  .empty-state,
  .mobile-order-empty,
  .mobile-location-empty,
  .mobile-barcode-empty,
  .inventory-request-mobile-empty,
  .inventory-mobile-empty{
    width:100%;
    min-height:124px!important;
    padding:18px!important;
    border:1px dashed var(--line-strong)!important;
    border-radius:var(--mobile-card-radius)!important;
    background:var(--surface)!important;
    color:var(--muted)!important;
    line-height:1.45!important;
    text-align:center!important;
  }
  .pro-data-access-notice{
    position:relative!important;
    width:calc(100% - 14px)!important;
    margin:8px 7px 0!important;
    padding:12px!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    border-radius:var(--mobile-card-radius)!important;
  }
  .pro-data-access-notice[hidden]{display:none!important}
  .pro-data-access-notice .button{width:100%!important}
  :where(.native-import-status,.native-admin-status,.native-count-status,.order-composer-status,.order-review-status,.mobile-barcode-status).busy{
    min-height:44px!important;
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
  }
  :where(.native-import-status,.native-admin-status,.native-count-status,.order-composer-status,.order-review-status,.mobile-barcode-status).busy::before{
    content:"";
    flex:0 0 auto;
    width:18px;
    height:18px;
    border:2px solid color-mix(in srgb,var(--accent) 26%,transparent);
    border-top-color:var(--accent);
    border-radius:50%;
    animation:odafim-mobile-spin .75s linear infinite;
  }

  /* Command/search palette occupies the useful phone viewport. */
  .command-overlay{
    padding:calc(env(safe-area-inset-top,0px) + 8px) 7px calc(var(--mobile-navigation-total) + 8px)!important;
    place-items:start stretch!important;
  }
  .command-palette{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(var(--mobile-visual-height,100dvh) - var(--mobile-navigation-total) - env(safe-area-inset-top,0px) - 16px)!important;
    border-radius:12px!important;
    grid-template-rows:56px 34px minmax(0,1fr) 36px!important;
  }
  .command-search input{font-size:16px!important}

  /* The on-screen keyboard owns the bottom edge while an input is active. */
  body.mobile-keyboard-open{padding-bottom:0!important}
  body.mobile-keyboard-open .sidebar{transform:translateY(110%);opacity:0;pointer-events:none}
  body.mobile-keyboard-open .workspace-body{padding-bottom:18px!important}
  body.mobile-keyboard-open .mobile-order-composer-actions{bottom:8px!important}
  body.mobile-keyboard-open .inventory-update-pane .inventory-update-actions{bottom:0!important}

  @media (prefers-reduced-motion:reduce){
    *,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
  }
}

/* Compact landscape field mode: keep both navigation bars usable without
   letting sticky layers consume the whole screen. */
@media (max-width:960px) and (orientation:landscape) and (max-height:520px){
  :root{
    --mobile-header-height:96px;
    --mobile-navigation-height:50px;
  }
  .topbar{
    padding:calc(4px + env(safe-area-inset-top,0px)) 7px 52px!important;
  }
  .page-context h1{font-size:15px!important;white-space:nowrap!important;text-overflow:ellipsis!important;overflow:hidden!important}
  .topbar-actions>.button,.global-search{width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important}
  .pro-language-control{bottom:4px!important;height:44px!important;min-height:44px!important}
  .pro-language-button{min-height:44px!important;height:44px!important;font-size:9px!important}
  .sidebar .nav-item{height:44px!important;min-height:44px!important;flex-direction:row!important;gap:5px!important}
  .sidebar .nav-item .nav-icon{width:18px!important;height:18px!important;flex-basis:18px!important}
  .sidebar .nav-item>span:nth-child(2){max-width:72px!important;-webkit-line-clamp:1!important;white-space:nowrap!important}
  .workspace-body{padding-top:6px!important}
  .mobile-order-composer-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .mobile-order-composer-actions .danger{grid-column:auto!important}
  .mobile-barcode-camera{min-height:132px!important;aspect-ratio:2.2/1!important}
}


/* v124.8 — mobile label containment */
@media (max-width:760px), (max-width:960px) and (max-height:520px) and (orientation:landscape){
  .sidebar .nav-item kbd{display:none!important;visibility:hidden!important;position:absolute!important;pointer-events:none!important}
  .sidebar .nav-item>span:nth-child(2){position:relative;z-index:1;max-width:64px!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .surface-header h2,.surface-header span,.app-pane-header h2,.app-pane-header span{max-width:100%!important;overflow-wrap:anywhere!important}
  .history-event-row{grid-template-columns:92px minmax(0,1fr)!important;gap:6px 9px!important}
  .history-event-row>.app-date-time{grid-column:1;grid-row:1/3;align-self:start}
  .history-event-row>.history-source-badge{grid-column:2;grid-row:1;justify-self:start}
  .history-event-row>.history-event-copy{grid-column:2;grid-row:2}
  .history-event-row>.history-event-user{grid-column:2;grid-row:3;text-align:start!important}
  .app-date{font-size:10px}
  .workspace-mode-tab span{white-space:normal!important;line-height:1.15!important}
}

/* v124.8 — History has four stable destinations; show them all instead of hiding two behind horizontal swiping. */
@media (max-width:760px){
  .page[data-page="history"]>.history-modebar{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;overflow:visible!important;scroll-snap-type:none!important;gap:5px!important}
  .page[data-page="history"]>.history-modebar .workspace-mode-tab{width:100%!important;min-width:0!important;max-width:none!important;padding-inline:8px!important}
}


/* v124.9.3 — swipeable mobile navigation and readable labels */
@media (max-width:760px), (max-width:960px) and (max-height:520px) and (orientation:landscape){
  .sidebar-nav{
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-x!important;
    scroll-snap-type:x proximity!important;
    scroll-behavior:smooth;
    padding-inline:7px!important;
  }
  .sidebar .nav-item{
    flex:0 0 78px!important;
    width:78px!important;
    min-width:78px!important;
    max-width:78px!important;
    padding:4px 4px!important;
    overflow:hidden!important;
  }
  .sidebar .nav-item>span:nth-child(2){
    display:-webkit-box!important;
    max-width:72px!important;
    min-height:20px!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    font-size:9.5px!important;
    line-height:1.05!important;
  }
  body.role-requester .sidebar-nav>.nav-item{
    flex:1 1 0!important;
    width:auto!important;
    min-width:72px!important;
    max-width:none!important;
  }
  body.role-warehouse-operator .sidebar-nav>.nav-item{
    flex:0 0 78px!important;
    width:78px!important;
    min-width:78px!important;
    max-width:78px!important;
  }
}

/* v124.9.3 specificity guard for persisted collapsed desktop state on phones */
@media (max-width:760px), (max-width:960px) and (max-height:520px) and (orientation:landscape){
  body.sidebar-collapsed .sidebar .nav-item>span:nth-child(2),
  body:not(.sidebar-collapsed) .sidebar .nav-item>span:nth-child(2){
    display:-webkit-box!important;
    max-width:72px!important;
    min-height:20px!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    font-size:9.5px!important;
    line-height:1.05!important;
  }
}


/* v124.9.3 — mobile workflow visibility and History guidance */
.orders-demand-mode-help{margin:0 8px 7px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:var(--surface-subtle,var(--surface));color:var(--muted);font-size:10px;line-height:1.35}
@media (max-width:760px), (max-width:960px) and (max-height:520px) and (orientation:landscape){
  .page[data-page="work"] .bulk-action-bar[hidden]{display:none!important}
  .mobile-order-quick-complete-action{width:100%;min-height:44px}
  .orders-demand-mode-help{margin-inline:4px;font-size:10px}
}


/* v124.9.3 — barcode paper selector */
.mobile-barcode-paper-control{display:grid;gap:7px;margin-top:10px}.mobile-barcode-paper-control>span{color:var(--text-muted);font-size:11px;font-weight:800}.mobile-barcode-paper-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.mobile-barcode-paper-strip button{min-width:0;min-height:42px;padding:7px 5px;border:1px solid var(--border);border-radius:10px;background:var(--surface-muted,#f8fafc);color:inherit;font:inherit;font-size:11px;font-weight:800}.mobile-barcode-paper-strip button.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--surface-solid,#fff));color:var(--accent)}

/* v124.9.14.9.16 — mobile collector footer labels remain single-line. */
.order-collection-footer-actions .button{
  white-space:nowrap!important;
  line-height:1.1!important;
}


/* v124.9.14.9.53 — staging identity and semantic Collection controls. */
.collection-v4 .order-collection-count-input{width:54px;min-width:54px;height:38px;padding:4px 5px;border:1px solid var(--border);border-radius:8px;background:var(--surface-solid,#fff);color:inherit;text-align:center;font:inherit;font-weight:900;-moz-appearance:textfield}.collection-v4 .order-collection-count-input::-webkit-inner-spin-button,.collection-v4 .order-collection-count-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.collection-v4 .order-collection-line.flexible-verification{border-color:color-mix(in srgb,var(--warning) 45%,var(--border));background:color-mix(in srgb,var(--warning) 5%,var(--surface-solid,#fff))}.collection-v4 .order-collection-line.flexible-verification .order-collection-line-info>small:last-child{color:var(--text-muted);font-weight:700}.collection-v4 .order-collection-line.saving .order-collection-count-input,.collection-v4 .order-collection-line.pending .order-collection-count-input{border-color:var(--collection-pending,var(--accent))}
@media(max-width:760px){.collection-v4 .order-collection-count-input{width:48px;min-width:48px;height:36px}}

/* v124.9.14.9.53 — order completion remains visible above collector navigation. */
.order-collection-order-completion{padding-bottom:8px}
.order-collection-order-completion .button{min-height:46px;white-space:normal;line-height:1.2}