/* TAIF Mobile App Mode
   Desktop remains untouched. These rules activate only on phone/tablet widths. */
@media (max-width: 860px){
  :root{
    --top:52px;
    --pad:0px;
    --side:0px;
    --mobile-drawer-width:min(86vw, 330px);
    --mobile-safe-top:env(safe-area-inset-top, 0px);
    --mobile-safe-bottom:env(safe-area-inset-bottom, 0px);
    --mobile-app-bar-height:calc(var(--top) + var(--mobile-safe-top));
    --mobile-trail-height:36px;
    --mobile-radius:16px;
    --mobile-field-height:44px;
    --mobile-shadow:0 22px 54px rgba(15,23,42,.18);
  }

  html,
  body{
    width:100%;
    min-width:0;
    height:100%;
    overflow:hidden;
    overscroll-behavior:none;
    touch-action:manipulation;
    background:#dbe7ff;
  }

  body{
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
  }

  .shell{
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:var(--mobile-app-bar-height) minmax(0,1fr) !important;
    grid-template-areas:"top" "main" !important;
    direction:rtl;
    overflow:hidden;
    box-shadow:none;
  }

  .topbar{
    position:relative;
    z-index:5200;
    min-height:var(--mobile-app-bar-height);
    height:var(--mobile-app-bar-height);
    padding:var(--mobile-safe-top) 10px 0;
    justify-content:space-between;
    gap:10px;
    box-shadow:0 10px 30px rgba(15,23,42,.16);
    border-bottom:1px solid rgba(255,255,255,.22);
  }

  .topbar::after{
    content:"TAIF V5 Online";
    position:absolute;
    left:50%;
    top:calc(var(--mobile-safe-top) + 50%);
    transform:translate(-50%, -50%);
    color:#fff;
    font:800 15px/1 var(--taif-font-family, system-ui, sans-serif);
    letter-spacing:.01em;
    white-space:nowrap;
    pointer-events:none;
    text-shadow:0 1px 2px rgba(15,23,42,.18);
  }

  .mobile-menu-toggle{
    display:grid;
    place-items:center;
    width:42px;
    height:38px;
    border:1px solid rgba(255,255,255,.42);
    border-radius:14px;
    background:rgba(255,255,255,.20);
    color:#fff;
    box-shadow:0 10px 22px rgba(15,23,42,.14), inset 0 1px 0 rgba(255,255,255,.28);
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
    touch-action:manipulation;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }

  .mobile-menu-toggle:active{transform:scale(.97)}
  .mobile-menu-toggle:focus,
  .mobile-menu-toggle:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(255,255,255,.24), 0 10px 22px rgba(15,23,42,.14)}
  .mobile-menu-toggle__icon{
    width:20px;
    height:15px;
    display:grid;
    gap:4px;
  }
  .mobile-menu-toggle__icon span{
    display:block;
    height:2px;
    border-radius:999px;
    background:currentColor;
    transition:transform .18s ease, opacity .18s ease;
  }
  :root[data-sidebar="open"] .mobile-menu-toggle__icon span:nth-child(1){transform:translateY(6px) rotate(45deg)}
  :root[data-sidebar="open"] .mobile-menu-toggle__icon span:nth-child(2){opacity:0}
  :root[data-sidebar="open"] .mobile-menu-toggle__icon span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

  .content{
    padding:var(--mobile-trail-height) 0 0 !important;
    overflow:hidden;
    background:linear-gradient(180deg, #edf4ff 0%, #e7efff 46%, #dce8ff 100%);
  }

  .content-trail{
    min-height:var(--mobile-trail-height);
    height:var(--mobile-trail-height);
    padding:0 12px;
    justify-content:flex-start;
    z-index:4;
    background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(238,245,255,.92));
    border-bottom:1px solid rgba(37,99,235,.12);
    box-shadow:0 8px 22px rgba(15,23,42,.06);
  }

  .content-trail__path{
    max-width:100%;
    gap:5px;
    font-size:12.8px;
    font-weight:900;
  }

  .content-trail__separator{width:11px;height:11px}

  .panel{
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    overflow:auto !important;
    -webkit-overflow-scrolling:touch;
    background:linear-gradient(180deg, #f7fbff 0%, #eff6ff 100%) !important;
    isolation:isolate;
  }

  .panel::before{display:none !important}

  .shell::after{
    content:"";
    position:fixed;
    inset:var(--mobile-app-bar-height) 0 0 0;
    z-index:5000;
    opacity:0;
    pointer-events:none;
    background:rgba(15,23,42,.38);
    backdrop-filter:blur(2px);
    -webkit-backdrop-filter:blur(2px);
    transition:opacity .2s ease;
  }

  :root[data-sidebar="open"] .shell::after{
    opacity:1;
    pointer-events:auto;
  }

  .sidebar{
    grid-area:unset !important;
    position:fixed !important;
    top:var(--mobile-app-bar-height) !important;
    right:0 !important;
    bottom:0 !important;
    left:auto !important;
    z-index:5100;
    width:var(--mobile-drawer-width) !important;
    max-width:var(--mobile-drawer-width) !important;
    min-width:0 !important;
    border-left:1px solid rgba(255,255,255,.24);
    border-radius:22px 0 0 0;
    box-shadow:-18px 0 48px rgba(15,23,42,.22);
    overflow:hidden;
    transform:translateX(108%);
    transition:transform .24s ease;
    will-change:transform;
    pointer-events:none;
  }

  :root[data-sidebar="open"] .sidebar{
    transform:translateX(0);
    pointer-events:auto;
  }

  .sidebar::before{display:none !important}

  .side-scroll{
    height:100%;
    padding:8px 10px calc(18px + var(--mobile-safe-bottom));
    direction:ltr;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
  }

  :root[data-sidebar="collapsed"] .side-scroll{padding:8px 10px calc(18px + var(--mobile-safe-bottom))}

  .side-toggle{
    height:48px;
    min-height:48px;
    margin:0 0 8px;
    justify-content:flex-start !important;
    padding:0 4px;
  }

  .side-toggle .toggle{
    width:42px;
    height:38px;
    margin:0;
    border:1px solid rgba(255,255,255,.45);
    background:rgba(255,255,255,.95);
  }

  .nav{
    gap:8px;
    padding:0 0 12px;
    --nav-btn-height:48px;
    --nav-ico-box:38px;
    --nav-img-size:32px;
    --nav-img-size-collapsed:32px;
  }

  .navbtn{
    height:var(--nav-btn-height);
    min-height:var(--nav-btn-height);
    padding:0 12px;
    border-radius:16px;
    gap:10px;
    box-shadow:0 10px 22px rgba(15,23,42,.08);
    font-size:14px;
  }

  .navbtn:hover{transform:none}
  .navbtn:active{transform:scale(.985)}

  :root[data-sidebar="collapsed"] .nav-txt,
  :root[data-sidebar="open"] .nav-txt{display:block}

  :root[data-sidebar="collapsed"] .navbtn,
  :root[data-sidebar="open"] .navbtn{
    justify-content:flex-start;
    padding:0 12px;
  }

  :root[data-sidebar="collapsed"] .nav-ico,
  :root[data-sidebar="open"] .nav-ico{
    width:var(--nav-ico-box);
    height:var(--nav-ico-box);
  }

  :root[data-sidebar="collapsed"] .nav-ico img,
  :root[data-sidebar="collapsed"] .nav-img,
  :root[data-sidebar="open"] .nav-ico img,
  :root[data-sidebar="open"] .nav-img{
    width:var(--nav-img-size);
    height:var(--nav-img-size);
  }

  /* App-like controls: touch friendly and no iOS text zoom. */
  :where(input, textarea, select, button){
    font-size:max(16px, 1em);
  }

  :where(input:not([type="checkbox"]):not([type="radio"]), textarea, select){
    min-height:var(--mobile-field-height);
  }

  :where(button, [role="button"], .coa-btn, .entries-toolbar-btn, .entries-action-btn, .currency-management-btn, .customer-card-toolbar-btn){
    min-height:40px;
    touch-action:manipulation;
  }

  /* Main sections become scrolling app pages. */
  :where(
    .currency-management-shell,
    .price-screen,
    .chart-accounts,
    .chart-accounts-shell,
    .cash-boxes-surface,
    .entries-workbench,
    .sales-purchase-workbench,
    .customer-card-view,
    .general-ledger-shell
  ){
    min-height:100%;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
    padding:8px !important;
    box-sizing:border-box;
  }

  :where(
    .currency-management-topbar,
    .currency-management-toolbar,
    .chart-accounts__toolbar,
    .entries-toolbar,
    .sales-purchase-toolbar,
    .customer-card-toolbar,
    .general-ledger-toolbar
  ){
    position:sticky !important;
    top:0 !important;
    z-index:20 !important;
    border-radius:16px !important;
    overflow:visible !important;
  }

  .entries-toolbar,
  .sales-purchase-toolbar{
    grid-template-columns:minmax(0,1fr) !important;
    gap:8px !important;
    min-height:0 !important;
    padding:8px !important;
  }

  .entries-toolbar__search,
  .sales-purchase-toolbar__search{
    width:100% !important;
    padding:0 !important;
    justify-self:stretch !important;
  }

  .entries-toolbar__group,
  .sales-purchase-toolbar__group{
    width:100% !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:8px !important;
    overflow:visible !important;
    padding:0 !important;
  }

  .entries-toolbar__actions,
  .sales-purchase-toolbar__actions{
    width:100% !important;
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
    overflow:visible !important;
  }

  .entries-toolbar__stats,
  .sales-purchase-toolbar__stats{
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:6px !important;
  }

  .entries-toolbar-btn{
    width:100% !important;
    justify-content:center !important;
    min-width:0 !important;
    padding-inline:8px !important;
  }

  .entries-toolbar-btn__text{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  /* Records as mobile cards instead of crushed desktop tables. */
  .entries-records__head,
  .currency-management-headrow,
  .currency-management-headrow--split-scroll,
  .chart-accounts__table-head-shell{
    display:none !important;
  }

  .entries-records__viewport,
  .entries-records__scroller,
  .entries-records__body{
    overflow:visible !important;
    height:auto !important;
    max-height:none !important;
  }

  .entries-record-row{
    display:block !important;
    margin:8px 0 !important;
    border-radius:16px !important;
    overflow:hidden !important;
    background:#fff !important;
    box-shadow:0 10px 24px rgba(15,23,42,.08) !important;
  }

  .entries-record-row__grid,
  .entries-records__grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    min-width:0 !important;
    width:100% !important;
    gap:6px !important;
    padding:8px !important;
  }

  .entries-record-cell{
    min-width:0 !important;
    min-height:44px !important;
    padding:8px !important;
    border-radius:12px !important;
    background:rgba(239,246,255,.92) !important;
    display:grid !important;
    align-content:center !important;
  }

  .entries-records__col--notes,
  .entries-records__col--type-status,
  .entries-records__col--from,
  .entries-records__col--to{
    grid-column:1 / -1 !important;
  }

  /* Currency list as compact cards on mobile. */
  .currency-management-table,
  .currency-management-table--split-scroll{
    overflow:visible !important;
    height:auto !important;
    max-height:none !important;
  }

  .currency-management-row{
    display:grid !important;
    grid-template-columns:auto auto minmax(0,1fr) !important;
    gap:7px !important;
    min-width:0 !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    margin:8px 0 !important;
    padding:9px !important;
    border-radius:16px !important;
    background:#fff !important;
    box-shadow:0 10px 24px rgba(15,23,42,.08) !important;
  }

  .currency-management-row > *{
    min-width:0 !important;
  }

  .currency-management-row > .currency-management-num-pill{
    grid-column:auto !important;
    min-height:34px !important;
    padding-inline:8px !important;
  }

  .currency-management-row > .currency-management-num-pill:nth-of-type(n){
    font-size:12.5px !important;
  }

  .currency-management-name-stack,
  .currency-management-row > div:nth-child(4){
    grid-column:1 / -1 !important;
  }

  .currency-management-row-actions,
  .currency-management-actions{
    grid-column:1 / -1 !important;
    display:grid !important;
    grid-template-columns:repeat(4, minmax(0,1fr)) !important;
    gap:6px !important;
  }

  /* Split desktop layouts into one mobile column. */
  .cash-boxes-layout,
  .customer-card-view,
  .general-ledger-layout,
  .general-ledger-shell,
  .general-ledger-workspace,
  .sales-purchase-stage,
  .sales-purchase-empty-shell,
  .sales-purchase-deal,
  .sales-purchase-deal__fields-grid,
  .customer-card-group__grid,
  .cash-boxes-fields__grid,
  .coa-form__grid,
  .currency-management-form-grid,
  .currency-management-form-grid--two{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:10px !important;
  }

  .cash-boxes-panel,
  .general-ledger-board,
  .general-ledger-sidebar,
  .customer-card-group,
  .chart-accounts__table-shell,
  .price-screen__body,
  .price-screen__list,
  .currency-management-table,
  .entries-log,
  .sales-purchase-log{
    min-width:0 !important;
    width:100% !important;
    max-width:100% !important;
  }

  .chart-accounts__table-shell,
  .price-screen__body,
  .general-ledger-board{
    overflow:auto !important;
    -webkit-overflow-scrolling:touch;
  }

  /* All desktop modal windows become full mobile screens under the blue app bar. */
  .taif-currency-management-window-layer,
  .coa-window-layer,
  .entries-window-layer,
  .sales-purchase-window-layer{
    position:fixed !important;
    inset:var(--mobile-app-bar-height) 0 0 0 !important;
    z-index:5300 !important;
    width:auto !important;
    height:auto !important;
    pointer-events:auto !important;
    overflow:hidden !important;
    background:#f3f7ff !important;
  }

  .taif-currency-management-modal-backdrop,
  .coa-modal-backdrop,
  .entries-modal-backdrop,
  .sales-purchase-modal-backdrop{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    padding:0 !important;
    margin:0 !important;
    pointer-events:auto !important;
    overflow:hidden !important;
    background:#f3f7ff !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }

  .taif-currency-management-modal,
  .coa-modal,
  .entries-modal-window,
  .sales-purchase-modal-window{
    position:absolute !important;
    inset:0 !important;
    left:0 !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:100% !important;
    min-height:0 !important;
    max-height:100% !important;
    border-radius:0 !important;
    border:0 !important;
    box-shadow:none !important;
    transform:none !important;
    margin:0 !important;
    contain:none !important;
    overflow:hidden !important;
  }

  .taif-currency-management-modal.is-maximized,
  .coa-modal.is-maximized,
  .entries-modal-window.is-maximized,
  .sales-purchase-modal-window.is-maximized{
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    max-width:100% !important;
    max-height:100% !important;
  }

  .taif-currency-management-modal__head,
  .coa-modal__head,
  .entries-sheet__head,
  .sales-purchase-sheet__head{
    min-height:46px !important;
    height:46px !important;
    padding:0 10px !important;
    border-radius:0 !important;
    flex:0 0 auto !important;
  }

  .taif-currency-management-modal__title,
  .coa-modal__title,
  .entries-sheet__title,
  .sales-purchase-sheet__title{
    font-size:16px !important;
    line-height:1.15 !important;
  }

  .taif-currency-management-modal__subtitle,
  .taif-currency-management-modal__eyebrow{
    display:none !important;
  }

  .taif-currency-management-modal__window-actions,
  .coa-window-actions,
  .entries-sheet__window-actions,
  .sales-purchase-sheet__window-actions{
    left:10px !important;
    gap:6px !important;
  }

  .taif-currency-management-modal__expand,
  .coa-expand,
  .entries-sheet__expand,
  .sales-purchase-sheet__expand{
    display:none !important;
  }

  .taif-currency-management-modal__chrome-btn,
  .coa-chrome-btn,
  .entries-sheet__chrome-btn,
  .entries-sheet__close,
  .sales-purchase-sheet__chrome-btn,
  .sales-purchase-sheet__close{
    width:34px !important;
    height:34px !important;
    border-radius:12px !important;
  }

  .taif-currency-management-modal__body,
  .coa-modal__body,
  .entries-sheet__body,
  .sales-purchase-sheet__body{
    flex:1 1 auto !important;
    min-height:0 !important;
    overflow:auto !important;
    -webkit-overflow-scrolling:touch;
    padding:10px !important;
    padding-bottom:calc(12px + var(--mobile-safe-bottom)) !important;
  }

  .entries-sheet__workspace,
  .entries-sheet__workspace--voucher,
  .sales-purchase-sheet__shell-space,
  .sales-purchase-sheet__shell-space--settlement{
    min-height:0 !important;
    height:auto !important;
    overflow:visible !important;
    padding:8px !important;
    gap:10px !important;
  }

  .entries-voucher-panel,
  .entries-voucher-form,
  .entries-voucher-movement,
  .sales-purchase-stage-section,
  .sales-purchase-side-panel,
  .sales-purchase-side-panel__extras,
  .sales-purchase-deal__fields-grid--hybrid,
  .sales-purchase-topdock-layout,
  .sales-purchase-topdock-layout--hybrid-header,
  .sales-purchase-topdock-layout--inline-fields{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:10px !important;
    min-width:0 !important;
    max-width:100% !important;
  }

  .entries-actions,
  .entries-actions__group,
  .entries-actions__group--primary-actions,
  .currency-management-modal-actions,
  .currency-management-modal-actions--dock,
  .coa-form__actions,
  .coa-form__actions-group{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
    width:100% !important;
  }

  .entries-action-btn,
  .currency-management-modal-actions .currency-management-btn,
  .coa-form__actions .coa-btn{
    width:100% !important;
    justify-content:center !important;
  }

  [data-taif-dropdown-popup="true"],
  .entries-voucher-choice-popover,
  .entries-voucher-date__popover,
  .currency-management-method-popover,
  .currency-management-flag-popover,
  .coa-choice-popover,
  .sales-purchase-currency-popover,
  .sales-purchase-top-field__popover{
    max-width:calc(100vw - 28px) !important;
    max-height:min(58svh, 420px) !important;
    overflow:auto !important;
    -webkit-overflow-scrolling:touch;
    z-index:5600 !important;
  }

  body.taif-mobile-sidebar-open,
  body.taif-mobile-modal-open{
    overflow:hidden !important;
  }
}

@media (min-width: 861px){
  .mobile-menu-toggle{display:none !important}
}

/* TAIF Mobile Real App Pass V2
   This layer is intentionally mobile-only. Desktop layout remains untouched. */
@media (max-width: 860px){
  :root{
    --mobile-appbar-h: var(--mobile-app-bar-height, 52px);
    --mobile-trail-h: 34px;
    --mobile-page-pad: 10px;
    --mobile-card-radius: 18px;
    --mobile-card-shadow: 0 12px 30px rgba(15,23,42,.10);
    --mobile-line: rgba(37,99,235,.12);
    --mobile-blue-soft: #eef6ff;
    --mobile-control-h: 46px;
  }

  html,
  body,
  .shell,
  .content,
  .panel{
    max-width:100vw !important;
  }

  *{
    box-sizing:border-box;
  }

  body.taif-mobile-mode{
    margin:0 !important;
    min-width:0 !important;
    width:100vw !important;
    height:100svh !important;
    overflow:hidden !important;
    background:#eaf2ff !important;
  }

  body.taif-mobile-mode *{
    -webkit-tap-highlight-color: rgba(37,99,235,.10);
  }

  body.taif-mobile-mode .shell{
    width:100vw !important;
    min-width:0 !important;
    height:100svh !important;
    min-height:100svh !important;
    max-height:100svh !important;
    overflow:hidden !important;
  }

  body.taif-mobile-mode .topbar{
    position:sticky !important;
    top:0 !important;
    right:0 !important;
    left:0 !important;
    z-index:5500 !important;
    width:100% !important;
    max-width:100% !important;
  }

  body.taif-mobile-mode .content{
    position:relative !important;
    height:calc(100svh - var(--mobile-appbar-h)) !important;
    min-height:0 !important;
    max-height:calc(100svh - var(--mobile-appbar-h)) !important;
    overflow:hidden !important;
    padding-top:var(--mobile-trail-h) !important;
  }

  body.taif-mobile-mode .content-trail{
    position:absolute !important;
    top:0 !important;
    right:0 !important;
    left:0 !important;
    height:var(--mobile-trail-h) !important;
    min-height:var(--mobile-trail-h) !important;
    max-height:var(--mobile-trail-h) !important;
    overflow:hidden !important;
  }

  body.taif-mobile-mode .panel{
    width:100% !important;
    height:100% !important;
    max-height:100% !important;
    min-width:0 !important;
    padding:0 !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    overscroll-behavior:contain !important;
    -webkit-overflow-scrolling:touch !important;
  }

  /* Universal mobile constraints: nothing may push the viewport horizontally. */
  body.taif-mobile-mode :where(section, article, div, form, header, footer, main, aside, nav, ul, li){
    max-width:100%;
  }

  body.taif-mobile-mode :where(img, svg, canvas, video){
    max-width:100%;
  }

  body.taif-mobile-mode :where(input, textarea, select, button){
    font-family:var(--taif-font-family, system-ui, sans-serif) !important;
    font-size:16px !important;
  }

  body.taif-mobile-mode :where(input:not([type="checkbox"]):not([type="radio"]), textarea, select, .entries-voucher-field__control, .sales-purchase-top-field__control, .general-ledger-field__control, .customer-card-field__control, .cash-boxes-field__control, .coa-field__control, .currency-management-input){
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    min-height:var(--mobile-control-h) !important;
    border-radius:14px !important;
    padding-inline:12px !important;
  }

  body.taif-mobile-mode :where(textarea){
    min-height:92px !important;
    line-height:1.55 !important;
    resize:vertical;
  }

  body.taif-mobile-mode :where(button, [role="button"], .coa-btn, .entries-toolbar-btn, .entries-action-btn, .currency-management-btn, .customer-card-toolbar-btn, .general-ledger-sidebar__action, .sales-purchase-top-field__button){
    min-width:0 !important;
    max-width:100% !important;
    min-height:42px !important;
    border-radius:14px !important;
    white-space:normal !important;
    line-height:1.25 !important;
  }

  body.taif-mobile-mode :where(.taif-control-text, .entries-toolbar-btn__text, .general-ledger-sidebar__action-text){
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  /* Mobile page surfaces */
  body.taif-mobile-mode :where(
    .currency-management-shell,
    .price-screen,
    .chart-accounts,
    .chart-accounts-shell,
    .cash-boxes-surface,
    .entries-workbench,
    .sales-purchase-workbench,
    .customer-card-view,
    .general-ledger-shell
  ){
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    padding:var(--mobile-page-pad) !important;
    overflow:visible !important;
  }

  body.taif-mobile-mode :where(
    .currency-management-topbar,
    .chart-accounts__toolbar,
    .entries-toolbar,
    .sales-purchase-toolbar,
    .customer-card-toolbar,
    .general-ledger-toolbar,
    .cash-boxes-toolbar
  ){
    position:sticky !important;
    top:0 !important;
    z-index:60 !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:8px !important;
    padding:8px !important;
    border-radius:18px !important;
    background:rgba(255,255,255,.94) !important;
    box-shadow:0 10px 26px rgba(15,23,42,.08) !important;
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }

  body.taif-mobile-mode :where(.entries-toolbar__actions, .sales-purchase-toolbar__actions, .currency-management-topbar-tools, .currency-management-toolbar, .customer-card-toolbar__actions, .chart-accounts__toolbar-group, .general-ledger-sidebar__actions){
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
    overflow:visible !important;
  }

  body.taif-mobile-mode :where(.entries-toolbar__search, .sales-purchase-toolbar__search, .currency-management-search-shell, .chart-accounts__search, .customer-card-search, .general-ledger-field--search){
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
  }

  body.taif-mobile-mode :where(.entries-toolbar__stats, .sales-purchase-toolbar__stats, .currency-management-stats, .price-screen__stats){
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
    width:100% !important;
    min-width:0 !important;
  }

  body.taif-mobile-mode :where(.entries-toolbar-chip, .sales-purchase-toolbar-chip, .currency-management-stat, .price-screen__stat){
    min-width:0 !important;
    padding:8px !important;
    border-radius:14px !important;
  }

  /* Drawer: real mobile menu. */
  body.taif-mobile-mode .sidebar{
    width:min(88vw, 360px) !important;
    max-width:min(88vw, 360px) !important;
  }

  body.taif-mobile-mode .navbtn{
    width:100% !important;
    min-width:0 !important;
  }

  /* Convert entries and sales/purchase logs to readable mobile cards. */
  body.taif-mobile-mode .entries-log,
  body.taif-mobile-mode .sales-purchase-log,
  body.taif-mobile-mode .entries-log__records,
  body.taif-mobile-mode .entries-log__records--split-scroll,
  body.taif-mobile-mode .entries-records__viewport,
  body.taif-mobile-mode .entries-records__scroller,
  body.taif-mobile-mode .entries-records__body{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }

  body.taif-mobile-mode .entries-records__head{ display:none !important; }

  body.taif-mobile-mode .entries-record-row{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:10px 0 !important;
    padding:0 !important;
    border-radius:var(--mobile-card-radius) !important;
    background:#fff !important;
    border:1px solid rgba(37,99,235,.10) !important;
    box-shadow:var(--mobile-card-shadow) !important;
    overflow:hidden !important;
  }

  body.taif-mobile-mode .entries-record-row__grid,
  body.taif-mobile-mode .entries-records__grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    padding:10px !important;
  }

  body.taif-mobile-mode .entries-record-row__state-slot{
    position:absolute !important;
    top:12px !important;
    right:12px !important;
    z-index:2 !important;
  }

  body.taif-mobile-mode .entries-record-cell{
    position:relative !important;
    display:grid !important;
    gap:5px !important;
    align-content:start !important;
    min-width:0 !important;
    min-height:58px !important;
    padding:9px 10px !important;
    border-radius:14px !important;
    background:#f5f9ff !important;
    border:1px solid rgba(37,99,235,.08) !important;
    overflow:hidden !important;
  }

  body.taif-mobile-mode .entries-record-cell::before{
    content:attr(data-mobile-label);
    display:block;
    color:#64748b;
    font-size:11.5px;
    font-weight:900;
    line-height:1.2;
    margin-bottom:1px;
  }

  body.taif-mobile-mode .entries-record-cell:not([data-mobile-label])::before,
  body.taif-mobile-mode .entries-record-cell[data-mobile-label=""]::before{display:none;}

  body.taif-mobile-mode :where(.entries-records__col--notes, .entries-records__col--type-status, .entries-records__col--from, .entries-records__col--to){
    grid-column:1 / -1 !important;
  }

  body.taif-mobile-mode :where(.entries-record-cell__value, .entries-record-cell__meta, .entries-record-cell__stack, .entries-record-cell__badges){
    min-width:0 !important;
    max-width:100% !important;
    overflow-wrap:anywhere !important;
    white-space:normal !important;
  }

  body.taif-mobile-mode .entries-record-cell__badges{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:6px !important;
  }

  body.taif-mobile-mode .entries-badge{
    max-width:100%;
    white-space:normal !important;
  }

  /* Currency management: cards with clear labels, no crushed columns. */
  body.taif-mobile-mode .currency-management-table,
  body.taif-mobile-mode .currency-management-scroll,
  body.taif-mobile-mode .currency-management-scroll-inner{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }

  body.taif-mobile-mode .currency-management-headrow{ display:none !important; }

  body.taif-mobile-mode .currency-management-row{
    display:grid !important;
    grid-template-columns:58px minmax(0,1fr) !important;
    grid-template-areas:
      "state code"
      "flag name"
      "pair pair"
      "buy sell"
      "mid mid"
      "dbuy dsell"
      "actions actions" !important;
    gap:8px !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:10px 0 !important;
    padding:10px !important;
    border-radius:var(--mobile-card-radius) !important;
    background:#fff !important;
    border:1px solid rgba(37,99,235,.10) !important;
    box-shadow:var(--mobile-card-shadow) !important;
  }

  body.taif-mobile-mode .currency-management-state-slot{ grid-area:state; align-self:center; justify-self:center; }
  body.taif-mobile-mode .currency-management-flag{ grid-area:flag; align-self:center; justify-self:center; }
  body.taif-mobile-mode .currency-management-code-pill{ grid-area:code; }
  body.taif-mobile-mode .currency-management-name-col{ grid-area:name; }
  body.taif-mobile-mode .currency-management-pair-col{ grid-area:pair; }
  body.taif-mobile-mode .currency-management-num-pill--buy{ grid-area:buy; }
  body.taif-mobile-mode .currency-management-num-pill--sell{ grid-area:sell; }
  body.taif-mobile-mode .currency-management-num-pill--mid{ grid-area:mid; }
  body.taif-mobile-mode .currency-management-num-pill--ratio-buy{ grid-area:dbuy; }
  body.taif-mobile-mode .currency-management-num-pill--ratio-sell{ grid-area:dsell; }
  body.taif-mobile-mode .currency-management-actions{ grid-area:actions; }

  body.taif-mobile-mode :where(.currency-management-code-pill, .currency-management-name-col, .currency-management-pair-col, .currency-management-num-pill){
    position:relative !important;
    min-width:0 !important;
    width:100% !important;
    min-height:54px !important;
    justify-content:center !important;
    align-content:center !important;
    border-radius:14px !important;
    overflow:hidden !important;
  }

  body.taif-mobile-mode :where(.currency-management-code-pill, .currency-management-name-col, .currency-management-pair-col, .currency-management-num-pill)::before{
    content:attr(data-mobile-label);
    display:block;
    color:#64748b;
    font-size:11.5px;
    font-weight:900;
    line-height:1.2;
    margin-bottom:3px;
    text-align:center;
  }

  body.taif-mobile-mode .currency-management-actions{
    display:grid !important;
    grid-template-columns:repeat(4, minmax(0,1fr)) !important;
    gap:7px !important;
    width:100% !important;
  }

  body.taif-mobile-mode .currency-management-actions :where(button){
    width:100% !important;
    min-height:40px !important;
  }

  /* Chart of accounts as cards on mobile. */
  body.taif-mobile-mode .chart-accounts__table-head-shell{ display:none !important; }
  body.taif-mobile-mode .chart-accounts__table-shell,
  body.taif-mobile-mode .chart-accounts__table-scroll{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow:visible !important;
    height:auto !important;
    max-height:none !important;
  }

  body.taif-mobile-mode .chart-accounts__table,
  body.taif-mobile-mode .chart-accounts__table tbody,
  body.taif-mobile-mode .chart-accounts__table tr,
  body.taif-mobile-mode .chart-accounts__table td{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
  }

  body.taif-mobile-mode .chart-accounts__table colgroup{display:none !important;}

  body.taif-mobile-mode .chart-accounts__table tr[data-center-id]{
    display:grid !important;
    grid-template-columns:64px minmax(0,1fr) !important;
    gap:8px !important;
    margin:10px 0 !important;
    padding:10px !important;
    border-radius:var(--mobile-card-radius) !important;
    background:#fff !important;
    border:1px solid rgba(37,99,235,.10) !important;
    box-shadow:var(--mobile-card-shadow) !important;
  }

  body.taif-mobile-mode .chart-accounts__state-cell,
  body.taif-mobile-mode .chart-accounts__avatar-cell{grid-column:1;}

  body.taif-mobile-mode .chart-accounts__table td:not(.chart-accounts__state-cell):not(.chart-accounts__avatar-cell){
    grid-column:1 / -1;
    display:grid !important;
    grid-template-columns:104px minmax(0,1fr) !important;
    gap:8px !important;
    align-items:center !important;
    padding:9px 10px !important;
    border-radius:14px !important;
    background:#f5f9ff !important;
    border:1px solid rgba(37,99,235,.08) !important;
    overflow:hidden !important;
  }

  body.taif-mobile-mode .chart-accounts__table td:not(.chart-accounts__state-cell):not(.chart-accounts__avatar-cell)::before{
    content:attr(data-mobile-label);
    color:#64748b;
    font-size:11.5px;
    font-weight:900;
    line-height:1.25;
  }

  body.taif-mobile-mode .chart-accounts__actions{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
    width:100% !important;
  }

  /* General ledger: readable mobile cards. */
  body.taif-mobile-mode .general-ledger-workspace,
  body.taif-mobile-mode .general-ledger-sidebar,
  body.taif-mobile-mode .general-ledger-board,
  body.taif-mobile-mode .general-ledger-board__body,
  body.taif-mobile-mode .general-ledger-currency-list,
  body.taif-mobile-mode .general-ledger-currency-card,
  body.taif-mobile-mode .general-ledger-detail-table,
  body.taif-mobile-mode .general-ledger-detail-table__body{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow:visible !important;
  }

  body.taif-mobile-mode .general-ledger-workspace{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:10px !important;
  }

  body.taif-mobile-mode .general-ledger-filters,
  body.taif-mobile-mode .general-ledger-filters__row,
  body.taif-mobile-mode .general-ledger-sidebar__content{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:8px !important;
    width:100% !important;
    min-width:0 !important;
  }

  body.taif-mobile-mode .general-ledger-table__row--head{display:none !important;}

  body.taif-mobile-mode .general-ledger-table__row:not(.general-ledger-table__row--head){
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:10px 0 !important;
    padding:10px !important;
    border-radius:var(--mobile-card-radius) !important;
    background:#fff !important;
    border:1px solid rgba(37,99,235,.10) !important;
    box-shadow:var(--mobile-card-shadow) !important;
  }

  body.taif-mobile-mode .general-ledger-table__cell{
    display:grid !important;
    gap:5px !important;
    min-width:0 !important;
    padding:9px 10px !important;
    border-radius:14px !important;
    background:#f5f9ff !important;
    border:1px solid rgba(37,99,235,.08) !important;
    overflow:hidden !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }

  body.taif-mobile-mode .general-ledger-table__cell::before{
    content:attr(data-mobile-label);
    color:#64748b;
    font-size:11.5px;
    font-weight:900;
    line-height:1.2;
  }

  body.taif-mobile-mode :where(.general-ledger-table__cell--statement, .general-ledger-table__cell--counterpart){
    grid-column:1 / -1 !important;
  }

  body.taif-mobile-mode :where(.general-ledger-footer__strip, .general-ledger-pricing__strip, .general-ledger-currency-row){
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:8px !important;
    width:100% !important;
    min-width:0 !important;
  }

  body.taif-mobile-mode :where(.general-ledger-balance-inline, .general-ledger-table__statement, .general-ledger-table__subtext){
    max-width:100% !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }

  /* Forms and windows: app screens, not desktop floating windows. */
  body.taif-mobile-mode :where(
    .taif-currency-management-window-layer,
    .coa-window-layer,
    .entries-window-layer,
    .sales-purchase-window-layer
  ){
    inset:var(--mobile-appbar-h) 0 0 0 !important;
    height:calc(100svh - var(--mobile-appbar-h)) !important;
    max-height:calc(100svh - var(--mobile-appbar-h)) !important;
    overflow:hidden !important;
  }

  body.taif-mobile-mode :where(
    .taif-currency-management-modal,
    .coa-modal,
    .entries-modal-window,
    .sales-purchase-modal-window
  ){
    display:flex !important;
    flex-direction:column !important;
    width:100% !important;
    height:100% !important;
    max-width:100% !important;
    max-height:100% !important;
    min-width:0 !important;
    border-radius:0 !important;
    overflow:hidden !important;
    background:#f3f7ff !important;
  }

  body.taif-mobile-mode :where(
    .taif-currency-management-modal__head,
    .coa-modal__head,
    .entries-sheet__head,
    .sales-purchase-sheet__head
  ){
    position:sticky !important;
    top:0 !important;
    z-index:20 !important;
    flex:0 0 auto !important;
    width:100% !important;
    min-width:0 !important;
    min-height:48px !important;
    height:auto !important;
    padding:8px 10px !important;
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    background:linear-gradient(135deg,#2563eb,#1d4ed8) !important;
  }

  body.taif-mobile-mode :where(.entries-sheet__title, .sales-purchase-sheet__title, .coa-modal__title, .taif-currency-management-modal__title){
    min-width:0 !important;
    max-width:calc(100vw - 105px) !important;
    font-size:15.5px !important;
    line-height:1.25 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }

  body.taif-mobile-mode :where(
    .taif-currency-management-modal__body,
    .coa-modal__body,
    .entries-sheet__body,
    .sales-purchase-sheet__body
  ){
    flex:1 1 auto !important;
    min-height:0 !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    padding:10px !important;
    padding-bottom:calc(86px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.taif-mobile-mode :where(
    .entries-sheet__workspace,
    .entries-sheet__workspace--voucher,
    .sales-purchase-sheet__shell-space,
    .sales-purchase-sheet__shell-space--settlement,
    .entries-voucher-form,
    .entries-voucher-panel,
    .entries-voucher-movement,
    .sales-purchase-stage-section,
    .sales-purchase-side-panel,
    .sales-purchase-topdock-layout,
    .sales-purchase-topdock-layout--hybrid-header,
    .sales-purchase-topdock-layout--inline-fields,
    .sales-purchase-deal__fields-grid,
    .sales-purchase-deal__fields-grid--hybrid,
    .currency-management-form-grid,
    .currency-management-form-grid--two,
    .coa-form__grid,
    .cash-boxes-fields__grid,
    .customer-card-group__grid
  ){
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:10px !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow:visible !important;
  }

  body.taif-mobile-mode :where(
    .entries-voucher-field,
    .sales-purchase-top-field,
    .general-ledger-field,
    .customer-card-field,
    .cash-boxes-field,
    .coa-form__field,
    .currency-management-field
  ){
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
  }

  /* Sticky mobile action dock inside full-screen windows. */
  body.taif-mobile-mode :where(
    .entries-actions,
    .entries-actions__group,
    .entries-actions__group--primary-actions,
    .sales-purchase-sheet__actions,
    .currency-management-modal-actions,
    .currency-management-modal-actions--dock,
    .coa-form__actions,
    .coa-form__actions-group
  ){
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
  }

  body.taif-mobile-mode :where(.entries-actions, .currency-management-modal-actions--dock, .coa-form__actions){
    position:sticky !important;
    bottom:0 !important;
    z-index:30 !important;
    padding:8px !important;
    margin:10px -2px -2px !important;
    border-radius:18px 18px 0 0 !important;
    background:rgba(255,255,255,.96) !important;
    box-shadow:0 -12px 30px rgba(15,23,42,.12) !important;
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }

  body.taif-mobile-mode :where(.entries-action-btn, .currency-management-modal-actions .currency-management-btn, .coa-form__actions .coa-btn){
    width:100% !important;
    min-width:0 !important;
    justify-content:center !important;
  }

  /* Dropdowns/popovers must fit inside phone viewport. */
  body.taif-mobile-mode :where(
    [data-taif-dropdown-popup="true"],
    .entries-account-search__popover,
    .entries-voucher-choice-popover,
    .entries-voucher-date__popover,
    .currency-management-method-popover,
    .currency-management-flag-popover,
    .coa-choice-popover,
    .sales-purchase-currency-popover,
    .sales-purchase-top-field__popover,
    .general-ledger-account-search__popover
  ){
    position:fixed !important;
    right:10px !important;
    left:10px !important;
    top:auto !important;
    bottom:calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    width:auto !important;
    max-width:calc(100vw - 20px) !important;
    max-height:min(58svh, 430px) !important;
    overflow:auto !important;
    -webkit-overflow-scrolling:touch !important;
    border-radius:18px !important;
    z-index:7000 !important;
    box-shadow:0 24px 60px rgba(15,23,42,.24) !important;
  }

  body.taif-mobile-mode .entries-account-search__result,
  body.taif-mobile-mode :where([data-taif-dropdown-item="true"], .coa-choice-option, .currency-management-flag-option){
    min-height:44px !important;
  }

  /* Price screen and compact lists. */
  body.taif-mobile-mode :where(.price-screen__body, .price-screen__list, .price-screen__grid, .price-screen__cards){
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:10px !important;
    width:100% !important;
    min-width:0 !important;
    overflow:visible !important;
  }

  body.taif-mobile-mode :where(.price-screen__card, .cash-boxes-panel, .customer-card-group, .general-ledger-sidebar__card, .sales-purchase-stage-section, .entries-voucher-panel){
    border-radius:var(--mobile-card-radius) !important;
    box-shadow:var(--mobile-card-shadow) !important;
    overflow:hidden !important;
  }

  /* Micro breakpoint: one button per row for very narrow phones only. */
  @media (max-width: 390px){
    body.taif-mobile-mode :where(.entries-toolbar__actions, .sales-purchase-toolbar__actions, .currency-management-topbar-tools, .currency-management-toolbar, .entries-actions, .currency-management-modal-actions, .coa-form__actions, .general-ledger-sidebar__actions){
      grid-template-columns:minmax(0,1fr) !important;
    }
    body.taif-mobile-mode .entries-record-row__grid,
    body.taif-mobile-mode .entries-records__grid,
    body.taif-mobile-mode .general-ledger-table__row:not(.general-ledger-table__row--head){
      grid-template-columns:minmax(0,1fr) !important;
    }
  }
}

@media (max-width: 860px){
  body.taif-mobile-mode .entries-record-row{ position:relative !important; }
  body.taif-mobile-mode .currency-management-row{ position:relative !important; }
  body.taif-mobile-mode .chart-accounts__table tr[data-center-id]{ position:relative !important; }
}

@media (max-width: 860px){
  body.taif-mobile-mode .price-screen__board-head{display:none !important;}
  body.taif-mobile-mode .price-screen__board-body{
    overflow:visible !important;
    height:auto !important;
    max-height:none !important;
    width:100% !important;
  }
  body.taif-mobile-mode .price-screen__row{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    min-height:0 !important;
    margin:0 0 10px !important;
    padding:10px !important;
    border-radius:var(--mobile-card-radius) !important;
    background:#fff !important;
    box-shadow:var(--mobile-card-shadow) !important;
    border:1px solid rgba(37,99,235,.10) !important;
  }
  body.taif-mobile-mode .price-screen__row > *{
    width:100% !important;
    min-width:0 !important;
    min-height:54px !important;
    height:auto !important;
    border-radius:14px !important;
    display:grid !important;
    place-items:center !important;
    align-content:center !important;
    gap:3px !important;
    overflow:hidden !important;
  }
  body.taif-mobile-mode .price-screen__code{grid-column:1 / 2 !important;}
  body.taif-mobile-mode .price-screen__name{grid-column:2 / 3 !important;}
  body.taif-mobile-mode .price-screen__pair-col{grid-column:1 / -1 !important;}
  body.taif-mobile-mode .price-screen__flag,
  body.taif-mobile-mode .price-screen__usd-flag{min-height:58px !important;}
  body.taif-mobile-mode .price-screen__flag-image{width:34px !important;height:34px !important;}
  body.taif-mobile-mode .price-screen__row > *::before{
    display:block;
    color:#64748b;
    font-size:11.5px;
    font-weight:900;
    line-height:1.2;
    text-align:center;
  }
  body.taif-mobile-mode .price-screen__code::before{content:'الكود';}
  body.taif-mobile-mode .price-screen__name::before{content:'اسم العملة';}
  body.taif-mobile-mode .price-screen__pair-col::before{content:'زوج العملة';}
  body.taif-mobile-mode .price-screen__num--buy::before{content:'شراء';}
  body.taif-mobile-mode .price-screen__flag::before{content:'علم العملية';}
  body.taif-mobile-mode .price-screen__num--sell::before{content:'بيع';}
  body.taif-mobile-mode .price-screen__num--dollar-buy::before{content:'شراء دولار';}
  body.taif-mobile-mode .price-screen__usd-flag::before{content:'علم الدولار';}
  body.taif-mobile-mode .price-screen__num--dollar-sell::before{content:'بيع دولار';}
}
