/* SNABYTEK CRM 0.9.17 – one responsive web UI for desktop, tablet, and small phones.
   Loaded LAST even after lazy module styles. No database, login, or API changes. */
:root{--safe-bottom:env(safe-area-inset-bottom,0px)}
*,*::before,*::after{box-sizing:border-box}
html,body{width:100%;max-width:100%;margin:0}
body{overflow:hidden}
.app-shell,.main,.content,.page{min-width:0}
.content{overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
.sidebar-backdrop[hidden]{display:none!important}
.sidebar-backdrop{display:none;position:fixed;inset:0;border:0;background:rgba(10,21,40,.51);z-index:35;cursor:pointer;touch-action:manipulation}
/* Constrain icon sizes to known navigation and toolbar icon holders. Do NOT affect photos/maps or bespoke module illustrations. */
.brand .svg-icon,.topbar .svg-icon,.nav-item .svg-icon,.icon-btn .svg-icon,.icon-ghost .svg-icon{width:19px!important;height:19px!important;max-width:19px!important;max-height:19px!important;flex:none}
.nav-item,.icon-btn,.profile,.global-search{touch-action:manipulation}
.orders-table-wrap,.customers-panel,.diary-table-wrap,.construction-wrap,.construction-own-wrap,.template-sheet-wrap,.gantt-scroll,.sn-chat-rooms{scrollbar-width:thin;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.orders-page .orders-table-wrap,.customers-page .customers-panel{overflow-x:auto!important}
.orders-page .orders-table-wrap:focus-visible,.gantt-scroll:focus-visible{outline:2px solid #3b82f6;outline-offset:-2px}
/* Distinct tablet mode: preserve useful horizontal content but let the menu slide in. */
@media(max-width:1100px){
 .sidebar{max-width:min(320px,86vw);width:min(300px,86vw)!important;transition:transform .18s ease!important;box-shadow:13px 0 40px rgba(0,0,0,.18)}
 .sidebar.collapsed{width:min(300px,86vw)!important}
 .sidebar.open{transform:translateX(0)!important}
 .sidebar.open~.sidebar-backdrop:not([hidden]){display:block}
 .sidebar.collapsed .brand-copy,.sidebar.collapsed .nav-item b,.sidebar.collapsed .nav-label,.sidebar.collapsed .nav-item em,.sidebar.collapsed .live-state div,.sidebar.collapsed .version{display:initial}
 .sidebar.collapsed .brand{padding:0 14px;justify-content:initial}
 .sidebar.collapsed .nav-item{justify-content:flex-start;padding:0 11px}
 .sidebar.collapsed .nav-item>span:first-child{margin:0}
 .sidebar .nav-item{min-height:45px;height:auto;padding-block:10px}
 .mobile-menu{display:grid!important;min-width:44px;min-height:44px}
 .main,.sidebar.collapsed~.main{margin-left:0!important;width:100%;min-width:0;height:100dvh}
 .topbar{grid-template-columns:minmax(0,1fr) minmax(160px,.65fr) auto;gap:11px;padding:0 16px}
 .global-search{display:flex;min-width:0}
 .topbar-actions{min-width:0}
 .topbar .ui-scale-control{display:none}
 .content{padding:16px 15px calc(28px + var(--safe-bottom))}
 .orders-page .orders-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
 .gantt-page .gantt-scroll{height:min(600px,70dvh);min-height:340px;touch-action:pan-x pan-y}
 .gantt-page .gantt-board{min-width:0}
 .sn-chat-page .sn-chat-layout{height:min(730px,73dvh);min-height:440px}
 .xp-page .xp-layout{grid-template-columns:minmax(240px,290px) minmax(0,1fr);gap:10px}
 .diary-page .diary-workspace{grid-template-columns:minmax(0,1fr)!important}
 .adm-page .adm-tabs{max-width:100%;overflow-x:auto;flex-wrap:nowrap;justify-content:flex-start}
 .adm-page .adm-tabs button{white-space:nowrap;flex:0 0 auto}
 .budget-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .customer-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .drawer,.drawer-wide{width:min(820px,96vw)}
}
@media(max-width:760px){
 .topbar{height:64px;grid-template-columns:minmax(0,1fr) 44px auto;padding:0 11px;gap:6px}
 .topbar-left{gap:6px;min-width:0}.topbar-left>div{min-width:0}
 .topbar h1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .eyebrow{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:155px}
 .global-search{width:44px;height:44px;justify-content:center;padding:0;min-width:44px}
 .global-search>span:nth-child(2),.global-search kbd{display:none}
 .topbar-actions{gap:4px}.topbar-actions .icon-btn{width:42px;height:42px}
 .topbar-actions .notify,.topbar-actions .online-pill{display:none}
 .profile{padding:0;min-width:40px}.profile>span:last-child{display:none}.profile .avatar{width:39px;height:39px}
 .content{padding:12px 10px calc(26px + var(--safe-bottom))}
 .page-head{align-items:stretch;gap:11px}.page-head h2{font-size:22px}
 .page-actions{gap:7px;max-width:100%}.page-actions .btn{min-height:42px}
 .drawer,.drawer-wide{width:100vw!important;max-width:100vw;top:0;bottom:0;border-radius:0}
 .drawer-head,.drawer-header{position:sticky;top:0;z-index:5;background:#fff}
 .search-overlay{padding:8px;place-items:start stretch}.search-panel{width:100%;max-width:100%;max-height:88dvh}
 .toast-root{left:10px;right:10px;bottom:calc(12px + var(--safe-bottom))}.toast{min-width:0}
 .orders-page .orders-kpis{gap:7px;grid-template-columns:repeat(2,minmax(0,1fr))}
 .orders-page .orders-kpi{padding:12px}.orders-page .orders-kpi strong{font-size:22px}
 .orders-page .orders-filter-main{flex-wrap:wrap}.orders-page .orders-filters{min-width:0}
 .orders-page .orders-table-wrap{max-width:100%;overflow-x:auto!important}
 .orders-page .orders-table-full{min-width:1240px}
 .customers-page .customer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .customer-map-header{padding:12px!important}
 .customer-map-actions{width:100%;flex-direction:column;align-items:stretch}
 .customer-map-switch{width:100%;justify-content:space-around}
 .customer-map-frame{height:260px!important;margin:0 10px!important}
 .sn-chat-page .sn-chat-layout{display:flex;flex-direction:column;height:min(780px,calc(100dvh - 150px));min-height:410px}
 .sn-chat-page .sn-chat-sidebar{max-height:210px;min-height:135px;border-right:0;border-bottom:1px solid #e8eef6}
 .sn-chat-page .sn-chat-conversation{flex:1;min-height:180px}
 .sn-chat-page .sn-chat-messages{padding:12px}
 .sn-chat-page .sn-chat-compose{padding:9px;gap:6px}.sn-chat-page .sn-chat-send{padding:10px;min-height:44px}
 .sn-chat-page .sn-chat-bubble{max-width:90%}
 .gantt-page .gantt-head{flex-direction:column;align-items:stretch}
 .gantt-page .gantt-tools{align-items:stretch}.gantt-page .gantt-tools-right{width:100%;justify-content:flex-start}
 .gantt-page .gantt-search{flex:1 1 100%}.gantt-page .gantt-scroll{height:min(620px,calc(100dvh - 235px));min-height:300px}
 .gantt-page .gantt-fixed{position:sticky;left:0;z-index:9}
 .gantt-page .gantt-grid{min-width:max-content}
 .gantt-page .gantt-edit-form{grid-template-columns:minmax(0,1fr)}
 .xp-page .xp-layout{grid-template-columns:1fr}.xp-page .xp-list,.xp-page .xp-detail{min-height:0}
 .xp-page .xp-items{max-height:270px;overflow-y:auto}
 .xp-page .xp-head{align-items:stretch;flex-wrap:wrap}
 .sn-todo-grid{grid-template-columns:1fr}.sn-todo-head{flex-wrap:wrap}
 .sn-todo-grid .sn-list-nav{order:1}.sn-todo-grid .sn-todo-main{order:2}
 .diary-page .diary-filter-bar{grid-template-columns:repeat(2,minmax(0,1fr))}
 .diary-page .diary-overview-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .diary-page .diary-detail-grid{grid-template-columns:1fr}
 .adm-page .adm-summary,.adm-page .adm-two,.adm-page .adm-grants,.adm-page .adm-roles-grid{grid-template-columns:1fr}
 .adm-page .adm-body{padding:11px}
 .budget-vat-inline{grid-template-columns:1fr}
 .budget-order-hero,.budget-editor-header{flex-wrap:wrap;align-items:flex-start}
 .budget-card-grid{grid-template-columns:1fr}
 .budget-table-panel,.construction-wrap,.template-sheet-wrap,.construction-own-wrap{max-width:100%;overflow-x:auto}
 .customer-detail-grid{grid-template-columns:1fr}
 .snab-login-panel{padding:25px 21px!important}
}
@media(max-width:420px){
 .topbar .eyebrow{display:none}
 .topbar .global-search{height:40px;width:40px;min-width:40px}
 .mobile-menu{min-width:40px;min-height:40px}
 .topbar .icon-btn{width:40px;height:40px}
 .content{padding:10px 8px calc(24px + var(--safe-bottom))}
 .orders-page .orders-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
 .orders-page .orders-kpi strong{font-size:19px}
 .customers-page .customer-grid{grid-template-columns:1fr}
 .sn-chat-page .sn-chat-top{align-items:stretch}.sn-chat-page .sn-chat-create{width:100%;justify-content:center}
 .gantt-page .gantt-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(hover:none) and (pointer:coarse){
 button,select,input[type=button],input[type=submit]{touch-action:manipulation}
 .orders-page .choice-button,.orders-page .orders-detail-arrow,.gantt-page button,.sn-chat-page button,.xp-page button,.sn-todo button{min-height:40px}
 .gantt-page .gantt-grip{min-width:18px}
 .gantt-page .gantt-scroll{touch-action:pan-x pan-y}
}
@media(prefers-reduced-motion:reduce){.sidebar,.drawer,.nav-item{transition:none!important;animation:none!important}}
