/* Shared app controls. The mobile shell owns its scrolling area. */
.bb-icon{display:block;width:22px;height:22px;flex:none}
.bb-nav-label{min-width:0}
.mobile-menu-close{display:none}
@media(min-width:768px) and (max-width:1024px){
  .sidebar nav a .bb-nav-label{display:none}
}
@media(max-width:767px), (pointer:coarse) and (max-width:1024px){
  :root{--bb-top:env(safe-area-inset-top,0px);--bb-bottom:env(safe-area-inset-bottom,0px);--bb-left:env(safe-area-inset-left,0px);--bb-right:env(safe-area-inset-right,0px)}
  body{--bg:#f3f5f8;--border:#e4e8ef;--text:#172338;--text2:#647086;--surface2:#f5f7fa;letter-spacing:0;line-height:1.45;-webkit-tap-highlight-color:transparent}
  body.dark{--bg:#101722;--surface:#1a2433;--surface2:#222e40;--border:#303c4e;--text:#edf2fa;--text2:#a5b1c4}
  html.bb-app-viewport,html.bb-app-viewport body{height:100%;min-height:0;overflow:hidden;overscroll-behavior:none}
  .bb-app-viewport #app{display:grid !important;position:fixed;inset:auto 0 auto 0;top:var(--bb-viewport-top,0px);height:100vh;height:var(--bb-viewport-height,100dvh);grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden;background:var(--bg)}
  .bb-app-viewport .mobile-header{grid-row:1;position:relative;inset:auto;display:flex !important;gap:10px;height:calc(68px + var(--bb-top));min-height:calc(68px + var(--bb-top));padding:var(--bb-top) max(16px,var(--bb-right)) 0 max(16px,var(--bb-left));background:var(--surface);color:var(--text);border-bottom:1px solid var(--border);box-shadow:none;z-index:20}
  .mobile-heading{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
  .mobile-business{font-size:10px;font-weight:650;letter-spacing:.07em;text-transform:uppercase;color:var(--text2);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .mobile-page-title{font-size:20px;font-weight:750;line-height:1.2;letter-spacing:-.025em;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .mobile-actions{display:flex;align-items:center;gap:4px}
  .mobile-header .hamburger,.mobile-icon-button{display:flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;padding:10px;border:0;border-radius:14px;background:var(--surface2);color:var(--text);cursor:pointer;transition:background .15s,transform .15s}
  .mobile-header .hamburger{margin-left:-4px}
  .mobile-icon-button[hidden]{display:none}
  .mobile-icon-button:active,.hamburger:active{transform:scale(.95);background:var(--border)}
  .mobile-header button:focus-visible,.bottom-nav button:focus-visible{outline:3px solid var(--primary);outline-offset:-3px}
  .bb-app-viewport #mainContent{grid-row:2;min-height:0;min-width:0;overflow:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;scroll-padding:16px;margin:0 !important;padding:20px max(16px,var(--bb-right)) 24px max(16px,var(--bb-left)) !important}
  .bb-app-viewport .bottom-nav{grid-row:3;position:relative;inset:auto;display:flex;min-height:calc(64px + var(--bb-bottom));height:calc(64px + var(--bb-bottom));padding:4px var(--bb-right) var(--bb-bottom) var(--bb-left);background:var(--surface);border-top:1px solid var(--border);box-shadow:0 -4px 18px rgba(20,35,60,.025);z-index:20}
  .bottom-nav button{gap:4px;min-width:0;min-height:54px;padding:6px 2px;color:var(--text2);font-size:10px;font-weight:600;line-height:1.2;border-radius:12px;touch-action:manipulation}
  .bottom-nav .bn-ico{display:flex;align-items:center;justify-content:center;width:46px;height:28px;border-radius:10px}
  .bottom-nav .bb-icon{width:22px;height:22px;stroke-width:1.8}
  .bottom-nav button.on{color:var(--primary);box-shadow:none}
  .bottom-nav button.on .bn-ico{background:var(--focus-ring)}
  .bottom-nav button:active{transform:scale(.96)}
  .bb-app-viewport .chat-btn{display:none !important}
  .bb-keyboard-open .bottom-nav,.native-keyboard-open .bottom-nav{display:none !important}
  .page-header{gap:10px;margin-bottom:18px;align-items:center}
  .page-header h2{font-size:23px;line-height:1.25;letter-spacing:-.025em;font-weight:750}
  .page:not(#page-today)>.page-header>h2{display:none}
  .page:not(#page-today)>.page-header{justify-content:flex-end}
  .page:not(#page-today)>.page-header:not(:has(.btn,input,select)){display:none}
  .page-header>div{min-width:0;max-width:100%}
  #page-today .page-header{display:block}
  #todayGreeting{font-size:24px;line-height:1.2;letter-spacing:-.03em}
  #todayDate{font-size:12px !important;margin-top:6px;text-transform:capitalize}
  .today-grid{gap:16px}
  .today-kpi-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .today-kpi{display:flex;flex-direction:column;align-items:flex-start;min-width:0;min-height:130px;padding:15px;background:var(--surface) !important;border:1px solid var(--border);border-radius:18px;box-shadow:0 2px 5px rgba(20,35,60,.025);position:relative;transition:background .15s}
  .today-kpi:hover{transform:none;box-shadow:none}
  .today-kpi:active{background:var(--surface2) !important}
  .today-kpi:focus-visible{outline:3px solid var(--primary);outline-offset:2px}
  .today-kpi-icon{display:none}
  .today-kpi-label{order:0;font-size:12px;font-weight:600;color:var(--text2);line-height:1.3}
  .today-kpi-num{order:1;font-size:32px;line-height:1.05;font-weight:750;letter-spacing:-.04em;margin:10px 0 5px;color:var(--text) !important;font-variant-numeric:tabular-nums}
  .today-kpi-sub{order:2;font-size:11px;font-weight:500;margin:0;line-height:1.3;color:var(--text2) !important;overflow-wrap:anywhere}
  .today-kpi:first-child .today-kpi-num{color:var(--err-text) !important}
  .today-kpi:nth-child(3) .today-kpi-num{color:var(--primary) !important}
  .today-card{padding:16px;border:1px solid var(--border);border-radius:18px;box-shadow:0 2px 5px rgba(20,35,60,.025);min-width:0}
  .today-card-title{font-size:15px;font-weight:700;line-height:1.3;letter-spacing:-.015em;margin-bottom:12px}
  .today-row-2{gap:12px}
  .today-order{display:grid !important;grid-template-columns:minmax(0,1fr);gap:10px;padding:14px !important;line-height:1.5;min-width:0}
  .today-order>div:first-child{min-width:0;align-items:flex-start !important;gap:8px !important}
  .today-order>div:first-child>span{min-width:36px !important;font-size:12px;padding-top:2px}
  .today-order>div:first-child>div{min-width:0;overflow-wrap:anywhere;font-size:14px}
  .today-order>div:last-child{padding-left:44px}
  .od-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;padding:14px;background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:none;cursor:pointer}
  .od-row:hover{box-shadow:none}
  .od-main,.od-side{display:contents}
  .od-main>div:first-child{grid-column:1;grid-row:1 / span 2;font-size:14px;line-height:1.5;min-width:0;overflow-wrap:anywhere}
  .od-main>div:first-child b{font-weight:700}
  .od-amount{grid-column:2;grid-row:1;font-size:17px;font-weight:750;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
  .od-days{grid-column:2;grid-row:2;text-align:right;font-size:11px;align-self:start}
  .rem-line{grid-column:1 / -1;font-size:11px;line-height:1.5;margin-top:5px;overflow-wrap:anywhere}
  .rem-off{font-style:normal;opacity:.85}
  .od-actions{grid-column:1 / -1;display:flex !important;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;margin-top:7px;padding-top:10px;border-top:1px solid var(--border)}
  .od-actions .btn{min-height:40px;font-size:12px !important;border-radius:10px;padding:8px 12px !important}
  .od-actions .ovd-mail,.od-actions .rem-mute{min-width:40px;min-height:40px;border-radius:10px}
  .btn,.btn-sm{min-height:44px;border-radius:12px;padding:10px 14px;font-size:14px;font-weight:600;line-height:1.3;display:inline-flex;align-items:center;justify-content:center;gap:6px;touch-action:manipulation}
  input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{font-size:16px !important;line-height:1.4;border:1px solid var(--border);border-radius:12px;min-height:44px;max-width:100%;padding:10px 12px;background:var(--surface);color:var(--text);box-shadow:none;box-sizing:border-box}
  #mainContent h2{font-size:22px;letter-spacing:-.02em;line-height:1.3}
  #page-hours label{display:block;font-size:13px;font-weight:600;color:var(--text2);margin-bottom:6px}
  #page-hours input,#page-hours select{width:100%}
  input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--primary);outline-offset:1px}
  button:disabled{cursor:default;opacity:.5}
  #page-orders .filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:14px}
  #orderSearch{grid-column:1 / -1;width:100% !important}
  #page-orders .filters select{width:100%;min-width:0 !important;font-size:16px !important;padding-right:24px}
  #orderTotals{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px !important}
  #orderTotals>div{padding:8px 10px !important;font-size:12px !important;min-width:0}
  #ordersViewSwitcher{display:flex;width:100%;margin-bottom:14px}
  #ordersViewSwitcher button{flex:1;min-width:0;min-height:40px;padding:8px 4px;font-size:12px}
  #page-orders .table-wrap{max-height:none;overflow:visible;background:transparent;border:0;box-shadow:none}
  .cardable tr{padding:16px;margin-bottom:12px;border:1px solid var(--border);border-radius:18px;box-shadow:0 2px 5px rgba(20,35,60,.025)}
  .cardable tr:hover{box-shadow:none;border-color:var(--border)}
  .cardable td{font-size:14px;line-height:1.45;padding:6px 0;min-width:0;overflow-wrap:anywhere}
  .cardable td::before{font-size:12px;font-weight:500;color:var(--text2);max-width:40%}
  .cardable td[data-label="Заказ"] a{font-size:16px;font-weight:650;line-height:1.4}
  #ordersBody td[data-label="Заказ"] a{text-decoration:none;color:var(--text)}
  .cardable td[data-label=""]{flex-wrap:wrap;gap:8px}
  .cardable td[data-label=""] button{min-width:44px;min-height:44px;border-radius:10px}
  .cardable td .status-select{font-size:16px !important;min-height:44px}
  .tabs{gap:4px;min-height:46px;margin-bottom:16px;border-bottom:1px solid var(--border)}
  .tab{min-height:44px;font-size:14px;padding:11px 13px}
  .view-switcher{border:0;padding:4px;background:var(--border);border-radius:12px}
  .view-switcher button{min-height:40px;border-radius:9px}
  .modal-overlay{top:var(--bb-viewport-top,0px);bottom:auto;height:100vh;height:var(--bb-viewport-height,100dvh);padding:0 !important;align-items:stretch;justify-content:stretch;background:var(--surface);z-index:1100}
  .modal{width:100% !important;max-width:100% !important;height:100%;max-height:100% !important;border-radius:0;padding:calc(20px + var(--bb-top)) max(16px,var(--bb-right)) calc(16px + var(--bb-bottom)) max(16px,var(--bb-left));box-shadow:none;overflow-y:auto;overscroll-behavior:contain;scroll-padding:20px}
  .modal-header{position:sticky;top:calc(-20px - var(--bb-top));margin-top:calc(-20px - var(--bb-top));margin-left:-16px;margin-right:-16px;padding:calc(12px + var(--bb-top)) 16px 12px;background:var(--surface);border-bottom:1px solid var(--border);z-index:5}
  .modal h3{font-size:20px;letter-spacing:-.02em}
  .modal-close{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border-radius:50%;background:var(--surface2);font-size:25px}
  .modal-actions{position:sticky;bottom:calc(-16px - var(--bb-bottom));padding:12px 0 calc(12px + var(--bb-bottom));background:var(--surface);border-top:1px solid var(--border);gap:8px;z-index:4;flex-wrap:wrap}
  .modal-actions>.btn{flex:1;min-width:100px}
  .form-group label{font-size:13px;font-weight:600;margin-bottom:7px}
  .modal div:has(>#aoNewWork){display:grid !important;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 44px;gap:8px}
  #aoNewWork{grid-column:1 / -1;width:100% !important}
  .modal div:has(>#aoNewWork)>input{width:100% !important;min-width:0}
  .chat-panel{top:var(--bb-viewport-top,0px);bottom:auto;right:0;width:100%;height:100vh;height:var(--bb-viewport-height,100dvh);max-height:none;max-width:none;border:0;border-radius:0;padding:var(--bb-top) 0 var(--bb-bottom);z-index:1100}
  .chat-header{background:var(--surface);color:var(--text);border-bottom:1px solid var(--border);padding:12px 16px}
  .chat-header button{background:var(--surface2);color:var(--text);width:44px;height:44px}
  .chat-input-wrap{padding:12px max(12px,var(--bb-right)) 12px max(12px,var(--bb-left));background:var(--surface)}
  .chat-input-wrap button{min-width:44px;min-height:44px}
  .chat-messages{padding:16px;overscroll-behavior:contain;min-height:0}
  .chat-send{background:var(--primary)}
  .sidebar{top:var(--bb-viewport-top,0px);height:var(--bb-viewport-height,100dvh);width:min(340px,calc(100vw - 32px)) !important;max-width:none;border-radius:0 24px 24px 0;padding:calc(24px + var(--bb-top)) 0 calc(12px + var(--bb-bottom));background:var(--surface);color:var(--text);z-index:1051;box-shadow:none;overflow:hidden !important;transition:transform .22s ease;visibility:hidden}
  .sidebar.mobile-open{visibility:visible;box-shadow:16px 0 50px rgba(10,20,40,.18)}
  .sidebar .logo{color:var(--text);font-size:20px;margin-bottom:16px;padding-right:56px !important}
  #sidebarCompanyName{color:var(--text2) !important;font-size:11px !important;margin-top:0 !important;letter-spacing:.03em !important}
  .sidebar .nav-section{font-size:10px;color:var(--text2);border-top:0;padding:20px 20px 6px;letter-spacing:.07em}
  .sidebar nav a{display:flex;align-items:center;gap:13px;min-height:48px;margin:2px 12px;padding:10px 12px !important;border-radius:12px;color:var(--text2);font-size:14px;border-left:0}
  .sidebar nav a.active{color:var(--primary);background:var(--focus-ring);font-weight:650;border-left:0}
  .sidebar nav a:hover{color:var(--text);background:var(--surface2)}
  .sidebar nav .bb-nav-label{display:block !important;flex:1;white-space:normal}
  .sidebar .user-info{background:var(--surface);border-color:var(--border);color:var(--text);padding:14px 20px 0}
  .sidebar .user-info .uname{color:var(--text)}
  .sidebar .user-info .urole{color:var(--text2)}
  .sidebar .theme-toggle{color:var(--text2);border-color:var(--border)}
  .mobile-menu-close{display:flex;position:absolute;right:12px;top:calc(12px + var(--bb-top));align-items:center;justify-content:center;width:44px;height:44px;background:var(--surface2);border:0;border-radius:14px;color:var(--text)}
  .mobile-overlay{top:var(--bb-viewport-top,0px);height:var(--bb-viewport-height,100dvh);bottom:auto;background:rgba(15,25,45,.38);backdrop-filter:blur(3px);z-index:1050}
  .bb-app-viewport .mobile-overlay.active{display:block !important}
  .login-page{min-height:100dvh;padding:calc(24px + var(--bb-top)) 20px calc(24px + var(--bb-bottom));background:var(--bg)}
  .login-box{padding:28px 24px;border:1px solid var(--border);box-shadow:0 10px 40px rgba(20,35,60,.06);border-radius:24px}
  @media(prefers-reduced-motion:reduce){.sidebar,.bottom-nav button,.mobile-icon-button{transition:none}}
}
