/* Belair Operations — Mobile & Tablet Interface V2
   Desktop remains unchanged. */

#belair-mobile-v2-nav,
#belair-mobile-v2-scan,
#belair-mobile-v2-sheet,
#belair-mobile-v2-home { display:none; }

/* Tablet landscape / larger tablets: compact rail + touch friendly workspace */
@media (min-width: 901px) and (max-width: 1180px) {
  body.belair-mobile-v2 .app-shell { grid-template-columns:88px minmax(0,1fr); }
  body.belair-mobile-v2 .sidebar { width:88px; padding:1rem .55rem; overflow:hidden; }
  body.belair-mobile-v2 .sidebar .brand { justify-content:center; padding:.25rem 0 1rem; }
  body.belair-mobile-v2 .sidebar .belair-brand-logo { width:62px; max-height:52px; object-fit:contain; }
  body.belair-mobile-v2 .sidebar .belair-brand-status,
  body.belair-mobile-v2 .sidebar nav a span:last-child,
  body.belair-mobile-v2 .sidebar-footer span { display:none !important; }
  body.belair-mobile-v2 .sidebar nav { align-items:stretch; gap:.25rem; }
  body.belair-mobile-v2 .sidebar nav a { justify-content:center; min-height:52px; padding:.75rem; border-radius:.9rem; }
  body.belair-mobile-v2 .sidebar nav a svg { width:23px; height:23px; }
  body.belair-mobile-v2 .sidebar-footer { justify-content:center; }
  body.belair-mobile-v2 .topbar { height:70px; padding:0 1.25rem; }
  body.belair-mobile-v2 .page-content { padding:1.25rem 1.25rem 4rem; }
  body.belair-mobile-v2 .metrics-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  body.belair-mobile-v2 .card-grid,
  body.belair-mobile-v2 .job-grid,
  body.belair-mobile-v2 .stock-grid,
  body.belair-mobile-v2 .staff-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body.belair-mobile-v2 .button,
  body.belair-mobile-v2 button,
  body.belair-mobile-v2 input,
  body.belair-mobile-v2 select,
  body.belair-mobile-v2 textarea { min-height:46px; }
  body.belair-mobile-v2 .modal-card.modal-wide { width:min(1040px,96vw); }
  body.belair-mobile-v2 .detail-layout { grid-template-columns:minmax(0,1.4fr) minmax(300px,.8fr); }
}

/* Phone / portrait tablet shell */
@media (max-width: 900px) {
  :root { --belair-mobile-nav-height:76px; --belair-mobile-green:#173f34; --belair-mobile-soft:#eef5f0; }
  html { scroll-behavior:smooth; }
  body.belair-mobile-v2 { padding-bottom:calc(var(--belair-mobile-nav-height) + env(safe-area-inset-bottom)); background:#f4f7f4; }
  body.belair-mobile-v2 .mobile-nav { display:none !important; }
  body.belair-mobile-v2 .sidebar { display:none !important; }
  body.belair-mobile-v2 .app-shell { display:block; min-height:100dvh; }
  body.belair-mobile-v2 .main-column { min-height:100dvh; }
  body.belair-mobile-v2 .topbar {
    height:auto; min-height:64px; padding:calc(.55rem + env(safe-area-inset-top)) .85rem .55rem;
    gap:.65rem; background:rgba(248,250,247,.96); box-shadow:0 2px 14px rgba(21,52,40,.08);
  }
  body.belair-mobile-v2 .topbar .belair-topbar-mark { width:36px; height:36px; flex:none; }
  body.belair-mobile-v2 .topbar > div:first-of-type { min-width:0; flex:1; }
  body.belair-mobile-v2 .topbar small { max-width:100%; font-size:.67rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  body.belair-mobile-v2 .topbar strong { font-size:1.02rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  body.belair-mobile-v2 .mode-pill,
  body.belair-mobile-v2 .pool-mobile-button,
  body.belair-mobile-v2 .job-photo-mobile-button,
  body.belair-mobile-v2 .bin-collection-top-button,
  body.belair-mobile-v2 .first-aid-top-button,
  body.belair-mobile-v2 .test-tag-top-button,
  body.belair-mobile-v2 .management-projects-top-button { display:none !important; }

  body.belair-mobile-v2 .page-content { padding:.9rem .8rem calc(var(--belair-mobile-nav-height) + 2.3rem); max-width:none; }
  body.belair-mobile-v2 .page-stack { gap:.9rem; }
  body.belair-mobile-v2 .page-header { align-items:stretch; gap:.65rem; }
  body.belair-mobile-v2 .page-header h1 { font-size:1.42rem; letter-spacing:-.03em; }
  body.belair-mobile-v2 .page-header p { font-size:.83rem; line-height:1.45; }
  body.belair-mobile-v2 .page-header > .button,
  body.belair-mobile-v2 .page-header > button { width:100%; }

  body.belair-mobile-v2 .button,
  body.belair-mobile-v2 button,
  body.belair-mobile-v2 input,
  body.belair-mobile-v2 select,
  body.belair-mobile-v2 textarea { min-height:50px; font-size:16px; }
  body.belair-mobile-v2 .button { border-radius:.85rem; padding:.78rem 1rem; }
  body.belair-mobile-v2 .icon-button { width:46px; min-height:46px; }
  body.belair-mobile-v2 input[type="checkbox"],
  body.belair-mobile-v2 input[type="radio"] { min-height:0; width:26px; height:26px; flex:none; accent-color:#246347; }

  body.belair-mobile-v2 .metrics-grid,
  body.belair-mobile-v2 .metrics-grid.four,
  body.belair-mobile-v2 .card-grid,
  body.belair-mobile-v2 .job-grid,
  body.belair-mobile-v2 .stock-grid,
  body.belair-mobile-v2 .staff-grid,
  body.belair-mobile-v2 .template-grid { grid-template-columns:1fr !important; gap:.72rem; }
  body.belair-mobile-v2 .metric-card,
  body.belair-mobile-v2 .site-card,
  body.belair-mobile-v2 .job-card,
  body.belair-mobile-v2 .stock-card,
  body.belair-mobile-v2 .incident-card,
  body.belair-mobile-v2 .panel,
  body.belair-mobile-v2 .table-card { border-radius:1rem; box-shadow:0 5px 18px rgba(31,53,43,.055); }
  body.belair-mobile-v2 .site-card,
  body.belair-mobile-v2 .job-card,
  body.belair-mobile-v2 .stock-card,
  body.belair-mobile-v2 .incident-card { padding:1rem; }
  body.belair-mobile-v2 .job-card > p { height:auto; max-height:none; }
  body.belair-mobile-v2 .toolbar { position:sticky; top:70px; z-index:16; background:#f4f7f4; padding:.15rem 0 .55rem; }
  body.belair-mobile-v2 .search-box { min-height:50px; }

  /* Cleaner and inspection checks become large, simple touch rows. */
  body.belair-mobile-v2 .check-item { min-height:58px; padding:.85rem .25rem; }
  body.belair-mobile-v2 .check-item > span { font-size:.96rem; line-height:1.35; }
  body.belair-mobile-v2 .fake-check { width:27px; height:27px; border-width:2.5px; }
  body.belair-mobile-v2 .inspection-row { background:#fff; border:1px solid #dfe6e0; border-radius:1rem; padding:1rem; gap:.75rem; box-shadow:0 4px 15px rgba(31,53,43,.045); }
  body.belair-mobile-v2 .inspection-number { width:36px; height:36px; }
  body.belair-mobile-v2 .segmented { display:grid; grid-template-columns:1fr 1fr; gap:.5rem; }
  body.belair-mobile-v2 .segmented button { min-height:50px; justify-content:center; font-size:.88rem; }
  body.belair-mobile-v2 .segmented button:last-child { grid-column:1 / -1; }
  body.belair-mobile-v2 .inspection-form .form-actions,
  body.belair-mobile-v2 .form-actions { position:sticky; bottom:calc(var(--belair-mobile-nav-height) + env(safe-area-inset-bottom)); z-index:18; background:rgba(255,255,255,.97); border-top:1px solid #dfe6e0; margin:0 -.2rem; padding:.7rem .2rem; display:grid; grid-template-columns:1fr 1.45fr; }

  /* Full-screen, phone-friendly dialogs and compliance overlays. */
  body.belair-mobile-v2 .modal-backdrop { padding:0; place-items:stretch; }
  body.belair-mobile-v2 .modal-card,
  body.belair-mobile-v2 .modal-card.modal-wide { width:100%; max-height:100dvh; height:100dvh; border-radius:0; }
  body.belair-mobile-v2 .modal-card > header { position:sticky; top:0; z-index:4; background:#fff; padding:calc(.85rem + env(safe-area-inset-top)) .9rem .75rem; }
  body.belair-mobile-v2 .modal-card > header h2 { font-size:1.18rem; }
  body.belair-mobile-v2 .modal-content { padding:.9rem .8rem calc(var(--belair-mobile-nav-height) + 1rem); }
  body.belair-mobile-v2 .detail-layout { display:flex; flex-direction:column; }
  body.belair-mobile-v2 .detail-sidebar { order:-1; padding:.8rem; }
  body.belair-mobile-v2 .detail-sidebar form.stack > button:last-child { position:sticky; bottom:.25rem; }

  body.belair-mobile-v2 #belair-pool-root.active,
  body.belair-mobile-v2 #belair-bin-collection-root.active,
  body.belair-mobile-v2 #belair-first-aid-root.active,
  body.belair-mobile-v2 #belair-test-tag-root.active,
  body.belair-mobile-v2 #belair-management-projects-root.active,
  body.belair-mobile-v2 #belair-management-records-root.active { padding-bottom:calc(var(--belair-mobile-nav-height) + env(safe-area-inset-bottom)); }

  /* Table pages use cards/scroll rather than crushed columns. */
  body.belair-mobile-v2 table { font-size:.8rem; }
  body.belair-mobile-v2 .table-card,
  body.belair-mobile-v2 [class*="table-wrap"] { overflow-x:auto; -webkit-overflow-scrolling:touch; }

  /* Custom bottom navigation */
  #belair-mobile-v2-nav {
    display:grid; grid-template-columns:repeat(5,1fr); position:fixed; z-index:950; left:0; right:0; bottom:0;
    height:calc(var(--belair-mobile-nav-height) + env(safe-area-inset-bottom)); padding:5px 4px env(safe-area-inset-bottom);
    border-top:1px solid rgba(40,67,55,.14); background:rgba(255,255,255,.975); backdrop-filter:blur(18px);
    box-shadow:0 -10px 28px rgba(17,40,30,.12);
  }
  #belair-mobile-v2-nav a,
  #belair-mobile-v2-nav button { min-width:0; min-height:62px; border:0; background:transparent; color:#6e7e75; padding:.35rem .15rem; border-radius:.75rem; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.16rem; font:inherit; }
  #belair-mobile-v2-nav .v2-nav-icon { font-size:1.3rem; line-height:1; }
  #belair-mobile-v2-nav .v2-nav-label { font-size:.66rem; font-weight:750; white-space:nowrap; }
  #belair-mobile-v2-nav a.active,
  #belair-mobile-v2-nav button.active { color:#173f34; background:#edf5f0; }

  #belair-mobile-v2-scan {
    display:flex; position:fixed; z-index:960; right:14px; bottom:calc(var(--belair-mobile-nav-height) + env(safe-area-inset-bottom) + 12px);
    width:auto; min-height:48px; border:0; border-radius:999px; padding:.7rem .95rem; color:#fff; background:#173f34;
    align-items:center; gap:.45rem; font-weight:850; box-shadow:0 10px 25px rgba(23,63,52,.28);
  }
  #belair-mobile-v2-scan span:first-child { font-size:1.2rem; }

  /* Bottom-sheet menus */
  #belair-mobile-v2-sheet { display:none; position:fixed; z-index:1100; inset:0; background:rgba(13,29,22,.45); padding-top:12vh; }
  #belair-mobile-v2-sheet.open { display:flex; align-items:flex-end; }
  #belair-mobile-v2-sheet .v2-sheet-panel { width:100%; max-height:88dvh; overflow:auto; background:#f7faf7; border-radius:1.3rem 1.3rem 0 0; padding:.8rem .8rem calc(1rem + env(safe-area-inset-bottom)); box-shadow:0 -20px 55px rgba(10,30,20,.25); }
  #belair-mobile-v2-sheet .v2-sheet-handle { width:44px; height:5px; border-radius:99px; background:#bcc8c0; margin:.15rem auto .75rem; }
  #belair-mobile-v2-sheet .v2-sheet-head { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:.75rem; }
  #belair-mobile-v2-sheet .v2-sheet-head h2 { margin:0; font-size:1.25rem; }
  #belair-mobile-v2-sheet .v2-sheet-close { border:1px solid #d8e0da; background:#fff; border-radius:999px; width:44px; min-height:44px; }
  #belair-mobile-v2-sheet .v2-sheet-grid { display:grid; grid-template-columns:1fr 1fr; gap:.65rem; }
  #belair-mobile-v2-sheet .v2-sheet-item { min-height:84px; border:1px solid #dce4de; background:#fff; border-radius:1rem; padding:.8rem; display:flex; align-items:flex-start; gap:.65rem; text-align:left; color:#203029; }
  #belair-mobile-v2-sheet .v2-sheet-item .v2-item-icon { width:38px; height:38px; border-radius:.75rem; display:grid; place-items:center; background:#edf5f0; flex:none; font-size:1.15rem; }
  #belair-mobile-v2-sheet .v2-sheet-item strong { display:block; font-size:.88rem; margin-top:.05rem; }
  #belair-mobile-v2-sheet .v2-sheet-item small { display:block; color:#748078; font-size:.69rem; margin-top:.15rem; line-height:1.3; }

  /* Mobile role home */
  #belair-mobile-v2-home { display:block; margin-bottom:.85rem; }
  .v2-home-hero { color:#fff; background:linear-gradient(140deg,#173f34,#2b7059); border-radius:1.2rem; padding:1rem; box-shadow:0 12px 28px rgba(23,63,52,.2); }
  .v2-home-kicker { display:block; font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; opacity:.78; font-weight:850; }
  .v2-home-hero h1 { color:#fff; margin:.22rem 0 .25rem; font-size:1.5rem; }
  .v2-home-hero p { color:rgba(255,255,255,.82); margin:0; font-size:.83rem; }
  .v2-home-actions { display:grid; grid-template-columns:1fr 1fr; gap:.65rem; margin-top:.75rem; }
  .v2-home-action { min-height:82px; border:1px solid #dfe6e0; background:#fff; color:#203029; border-radius:1rem; padding:.8rem; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:.18rem; text-align:left; box-shadow:0 4px 15px rgba(31,53,43,.045); }
  .v2-home-action span { font-size:1.2rem; }
  .v2-home-action strong { font-size:.9rem; }
  .v2-home-action small { color:#748078; font-size:.68rem; }
  .v2-home-action.primary { background:#fff8e9; border-color:#ead9aa; }

  body.belair-mobile-v2[data-belair-path="/"] .page-header { display:none; }
  body.belair-mobile-v2[data-belair-path="/"] .page-stack > .metrics-grid,
  body.belair-mobile-v2[data-belair-path="/"] .page-stack > .dashboard-grid { display:none; }
  body.belair-mobile-v2[data-belair-path="/"] #belair-role-dashboard { margin:.75rem 0; padding:.8rem; }
  body.belair-mobile-v2[data-belair-path="/"] .role-dashboard-head { margin-bottom:.65rem; }
  body.belair-mobile-v2[data-belair-path="/"] .role-dashboard-head h2 { font-size:1.12rem; }
  body.belair-mobile-v2[data-belair-path="/"] .role-dashboard-head p { font-size:.76rem; }
  body.belair-mobile-v2[data-belair-path="/"] .role-metrics { grid-template-columns:1fr 1fr; gap:.55rem; }
  body.belair-mobile-v2[data-belair-path="/"] .role-metric { min-height:90px; padding:.75rem; }
  body.belair-mobile-v2[data-belair-path="/"] .role-metric strong { font-size:1.25rem; }
  body.belair-mobile-v2[data-belair-path="/"] .role-alert-panel { grid-template-columns:1fr; gap:.55rem; }

  /* Messages use the screen instead of two crushed columns. */
  body.belair-mobile-v2 .messages-layout { grid-template-columns:1fr; }
  body.belair-mobile-v2 .channel-list,
  body.belair-mobile-v2 .chat-panel { min-height:auto; }
  body.belair-mobile-v2 .chat-panel { min-height:62dvh; }
  body.belair-mobile-v2 .chat-thread { min-height:42dvh; }
  body.belair-mobile-v2 .chat-bubble { max-width:92%; }

  /* Cleaning video/photo panel is part of the task and full width. */
  body.belair-mobile-v2 .clean-media-panel { margin-top:1rem; }
  body.belair-mobile-v2 .clean-media-actions { display:grid; grid-template-columns:1fr; }
  body.belair-mobile-v2 .clean-media-button { width:100%; }

  /* Optional one-at-a-time inspection controls, injected by JS. */
  .v2-step-controls { display:none; }
  body.belair-mobile-v2 .inspection-form.v2-step-mode .inspection-row { display:none; }
  body.belair-mobile-v2 .inspection-form.v2-step-mode .inspection-row.v2-current-step { display:flex; }
  body.belair-mobile-v2 .inspection-form.v2-step-mode .v2-step-controls { display:grid; grid-template-columns:1fr 1fr; gap:.55rem; position:sticky; bottom:calc(var(--belair-mobile-nav-height) + 70px); z-index:17; background:#f7faf7; padding:.55rem 0; }
  .v2-step-progress { grid-column:1 / -1; height:7px; overflow:hidden; border-radius:999px; background:#dfe7e1; }
  .v2-step-progress span { display:block; height:100%; background:#246347; transition:width .2s ease; }
  .v2-step-count { grid-column:1 / -1; text-align:center; color:#6f7c74; font-size:.72rem; font-weight:750; }
}

@media (max-width: 380px) {
  #belair-mobile-v2-sheet .v2-sheet-grid,
  .v2-home-actions,
  body.belair-mobile-v2[data-belair-path="/"] .role-metrics { grid-template-columns:1fr; }
  #belair-mobile-v2-nav .v2-nav-label { font-size:.59rem; }
}

@media (max-width: 900px) {
  body.belair-v2-auth-screen #belair-mobile-v2-nav,
  body.belair-v2-auth-screen #belair-mobile-v2-scan,
  body.belair-v2-auth-screen #belair-mobile-v2-sheet,
  body.belair-v2-overlay-open #belair-mobile-v2-nav,
  body.belair-v2-overlay-open #belair-mobile-v2-scan { display:none !important; }
  body.belair-v2-auth-screen { padding-bottom:0; }
  body.belair-v2-overlay-open .inspection-form .form-actions,
  body.belair-v2-overlay-open .form-actions { bottom:0; }
}
