/* ═══════════════════════════════════════════════════════════════════════
   MOLMS — phone & tablet layout. Loaded after every other stylesheet.
   Goals: nothing wider than the screen, every button easy to tap (44px),
   menus in a slide-in drawer, tables scroll sideways, modals fit the screen,
   forms never zoom on iPhone, notifications / install button always reachable.
   ═══════════════════════════════════════════════════════════════════════ */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overflow-x:hidden}
img,video,canvas,svg{max-width:100%}
a,button,label,select,summary{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.main-content{min-width:0}
.install-btn{background:var(--cream,#faf8f2);border:1px solid var(--fog,#e6e1d6);border-radius:99px;padding:7px 14px;font-weight:700;font-size:.8rem;cursor:pointer;color:var(--forest-light);font-family:inherit;white-space:nowrap}
.install-btn[hidden]{display:none!important}
.js-install[hidden]{display:none!important}

/* ── tablets and phones: menu becomes a drawer ───────────────────────── */
@media (max-width:900px){
  .main-content{margin-left:0!important;width:100%;max-width:100vw}
  .sidebar{transform:translateX(-105%);width:min(86vw,320px)!important;z-index:1001;box-shadow:12px 0 40px rgba(0,0,0,.35);padding-bottom:env(safe-area-inset-bottom)}
  .sidebar.open{transform:none!important}
  .sidebar-overlay{z-index:1000}
  .mobile-menu-btn{display:inline-flex!important;align-items:center;justify-content:center;flex-shrink:0}
  .sidebar-nav{-webkit-overflow-scrolling:touch}
  .topbar{padding:0 12px!important;gap:8px;height:58px}
  .topbar > div:first-child,.topbar-left{min-width:0;display:flex;align-items:center;gap:10px}
  .page-title,.topbar-title,.topbar h1{font-size:1.05rem!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46vw}
  .topbar-right{gap:6px!important}
  .shortcut-btn{display:none!important}
  .page-content{padding:16px 14px calc(90px + env(safe-area-inset-bottom))!important}
  .back-to-top{bottom:calc(16px + env(safe-area-inset-bottom));right:14px}
}

/* ── phones ──────────────────────────────────────────────────────────── */
@media (max-width:760px){
  /* inline two/three-column grids collapse to one column (auto-fit grids keep working) */
  [style*="grid-template-columns"]:not([style*="auto-fit"]):not([style*="auto-fill"]){grid-template-columns:1fr!important}
  .form-row{grid-template-columns:1fr!important;display:grid;gap:0}
  .section-header{flex-wrap:wrap;gap:10px}
  .section-header > .btn,.section-header > a.btn{width:100%;text-align:center;justify-content:center}
  .panel-header{flex-wrap:wrap;gap:8px}
  .panel-body{overflow-x:auto}
  .stat-card,.stat-grid > *{min-width:0}
  /* tables scroll sideways inside their card instead of stretching the page */
  .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:12px;position:relative}
  .table-wrap table{min-width:620px}
  table th,table td{padding:9px 10px!important;font-size:.82rem}
  /* touch-sized controls; 16px text stops iPhone zooming into fields */
  .form-control,input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],input[type=search],input[type=tel],select,textarea{font-size:16px!important;min-height:46px}
  textarea.form-control{min-height:92px}
  .btn{min-height:44px;padding:10px 16px;justify-content:center}
  .btn-sm,.btn-xs{min-height:40px;padding:8px 13px;font-size:.82rem}
  .nav-item{min-height:46px}
  .form-group label{font-size:.84rem}
  /* modals become bottom sheets */
  .modal-overlay{align-items:flex-end!important;padding:0!important}
  .modal{width:100%!important;max-width:100%!important;max-height:92vh;overflow-y:auto;border-radius:20px 20px 0 0!important;margin:0!important;-webkit-overflow-scrolling:touch}
  .modal-footer{position:sticky;bottom:0;background:var(--white,#fff);flex-wrap:wrap;gap:8px;padding-bottom:calc(12px + env(safe-area-inset-bottom))}
  .modal-footer .btn{flex:1 1 140px}
  /* maps and charts */
  #zim-map,#farm-map{height:58vh!important;min-height:340px}
  .map-legend{display:none}
  .leaflet-control-layers{max-width:70vw}
  canvas{max-width:100%}
  /* chat */
  .chat-layout,.messages-layout,.chat-wrap{grid-template-columns:1fr!important;display:block!important}
  .chat-messages{max-height:55vh}
  /* topbar details */
  .topbar-user-chip .chip-name{display:none}
  .topbar-user-chip{padding:3px!important}
  .install-btn span{display:none}.install-btn{padding:7px 10px}
  #themeBtn{padding:6px 9px;font-size:.78rem}
  #toastPanel,.notif-panel,#toastContainer{left:10px!important;right:10px!important;bottom:calc(14px + env(safe-area-inset-bottom))!important;max-width:none!important}
  .toast{max-width:none!important;width:100%}
  .cmdk-overlay{padding:14px}.cmdk{width:100%}
  .pagination,.pager{flex-wrap:wrap;justify-content:center;gap:6px}
  .empty-state{padding:30px 16px}
  /* pages built in this release */
  .st-user{flex-direction:column;align-items:flex-start}.st-user .quick{margin-left:0;width:100%}
  .st-user .quick a,.st-user .quick button{flex:1;text-align:center}
  .st-hub{grid-template-columns:1fr}.st-card{padding:16px 40px 16px 16px}
  .st-swatches{grid-template-columns:repeat(auto-fill,minmax(84px,1fr))}.st-fonts{grid-template-columns:1fr}
  .st-preview{position:static}.st-actions .btn{flex:1 1 100%}
  .pf-hero{flex-direction:column;text-align:center;padding:20px 16px}.pf-chips{justify-content:center}
  .pf-actions{grid-template-columns:1fr 1fr}.pf-info{grid-template-columns:1fr}.pf-tabs{overflow-x:auto}
  .ca-side{position:static;max-height:none;order:-1}.ca-wrap{gap:14px}
  .ck .opts span{padding:9px 13px}
  .ad-top{grid-template-columns:1fr;text-align:center;justify-items:center}
  .ff-hero{text-align:center;justify-items:center}.ff-chips{justify-content:center}.kvg{grid-template-columns:1fr}
  .an-cards,.fm-cards,.rg-cards,.au-cards,.ff-cards,.cd-cards,.lv-cards,.cm-cards,.fa-cards{grid-template-columns:1fr 1fr!important}
  .lv-stock{grid-template-columns:1fr 1fr!important}.cm-crops,.cm-grid.cm-crops{grid-template-columns:1fr!important}
  .cm-tabs,.fm-tabs,.ff-tabs,#cmTabs{overflow-x:auto;flex-wrap:nowrap}.fm-tab{white-space:nowrap}
  .mv-chart{height:130px}
  .gm-wrap{grid-template-columns:1fr!important}.gm-side{max-height:none;min-height:0}.gm-list{max-height:260px}
  #provBtns{overflow-x:auto;flex-wrap:nowrap;padding-bottom:6px}#provBtns .btn{white-space:nowrap}
}
@media (max-width:420px){
  .an-cards,.fm-cards,.rg-cards,.au-cards,.ff-cards,.cd-cards,.lv-cards,.cm-cards,.fa-cards,.lv-stock{grid-template-columns:1fr!important}
  .pf-actions{grid-template-columns:1fr}
  h1{font-size:1.5rem!important}h2{font-size:1.25rem!important}
  .stat-value,.big{font-size:1.5rem!important}
  .topbar-right > .btn-outline#themeBtn{display:none}
}
/* installed app (standalone window): respect notches / home indicator */
@media (display-mode: standalone){
  .topbar{padding-top:env(safe-area-inset-top)}
  .sidebar{padding-top:env(safe-area-inset-top)}
  body{overscroll-behavior-y:contain}
}