/* NHPQ Tablet UX V38.16
   Dedicated compact workspace for iPad and narrow laptops.
   Desktop (>1180px) and phone (<=760px) keep their existing layouts. */

@media (min-width:761px) and (max-width:1180px),
       (min-width:761px) and (max-width:1400px) and (any-pointer:coarse) {
  :root {
    --nhpq-tablet-header:64px;
    --nhpq-tablet-edge:14px;
    --nhpq-tablet-dock-h:66px;
    --nhpq-tablet-panel-gap:14px;
  }

  html,body { width:100%; max-width:100%; overflow:hidden; }
  body { min-height:100dvh; }

  /* Header: preserve identity, move secondary actions into one clean menu. */
  .topbar {
    height:var(--nhpq-tablet-header);
    min-width:0;
    display:flex !important;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 max(16px,env(safe-area-inset-left)) 0 max(16px,env(safe-area-inset-right));
    background:rgba(255,255,255,.98);
    box-shadow:0 2px 14px rgba(14,45,60,.09);
  }
  .topbar .brand { min-width:0; gap:10px; }
  .topbar .brand-mark { width:40px; height:40px; flex:0 0 40px; border-radius:12px; font-size:11px; }
  .topbar .brand > span:last-child { min-width:0; }
  .topbar .brand strong { overflow:hidden; font-size:14px; line-height:1.15; text-overflow:ellipsis; white-space:nowrap; }
  .topbar .brand small { margin-top:2px; font-size:11px; }
  .topbar .support-header,
  .topbar .top-actions,
  .topbar > .nhpq-intro-header-btn { display:none !important; }

  .nhpq-mobile-menu-toggle {
    width:44px;
    height:44px;
    flex:0 0 44px;
    display:grid;
    place-items:center;
    padding:0;
    border:1px solid #c8dcdf;
    border-radius:13px;
    color:#155062;
    background:#fff;
    box-shadow:0 5px 16px rgba(20,63,78,.1);
  }
  .nhpq-mobile-menu-toggle svg { width:22px; height:22px; }
  .nhpq-mobile-menu-toggle[aria-expanded="true"] { color:#fff; background:var(--teal); border-color:var(--teal); }

  .map-shell { height:calc(100dvh - var(--nhpq-tablet-header)); min-height:0; }
  .mobile-map-toolbar { display:none !important; }
  .disclaimer { display:none !important; }
  .nhpq-intro-floating-btn { display:none !important; }

  /* One dock replaces the five floating card clusters seen on iPad. */
  .nhpq-mobile-dock {
    position:absolute;
    z-index:40;
    left:50%;
    bottom:max(var(--nhpq-tablet-edge),env(safe-area-inset-bottom));
    width:min(490px,calc(100% - 28px));
    height:var(--nhpq-tablet-dock-h);
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:5px;
    padding:6px;
    border:1px solid rgba(190,214,219,.96);
    border-radius:20px;
    background:rgba(255,255,255,.965);
    box-shadow:0 12px 34px rgba(12,44,58,.24);
    transform:translateX(-50%);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
  }
  .nhpq-mobile-dock button {
    min-width:0;
    min-height:52px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:7px 9px;
    border:0;
    border-radius:14px;
    color:#486778;
    background:transparent;
    font-size:12px;
    font-weight:850;
    line-height:1;
    white-space:nowrap;
  }
  .nhpq-mobile-dock button svg { width:21px; height:21px; flex:0 0 21px; stroke-width:2; }
  .nhpq-mobile-dock button.active,
  .nhpq-mobile-dock button[aria-pressed="true"] { color:#fff; background:var(--teal); }
  .nhpq-mobile-dock button:focus-visible,
  .nhpq-mobile-menu-toggle:focus-visible,
  .nhpq-mobile-sheet-close:focus-visible { outline:3px solid rgba(6,119,129,.28); outline-offset:2px; }

  /* Hide all legacy floating cards until the user explicitly opens a tool. */
  .map-shell > .controls-card,
  .map-shell > .opacity-card { display:none !important; }
  .search-card,
  .data-browser-card,
  .left-map-stack .documents-card,
  .left-map-stack .legend-card,
  .nhpq-mobile-support-sheet {
    position:absolute !important;
    z-index:32 !important;
    top:var(--nhpq-tablet-edge) !important;
    bottom:calc(var(--nhpq-tablet-dock-h) + var(--nhpq-tablet-panel-gap) + max(var(--nhpq-tablet-edge),env(safe-area-inset-bottom))) !important;
    width:min(430px,calc(100% - 28px)) !important;
    max-height:none !important;
    margin:0 !important;
    border:1px solid rgba(205,223,227,.98) !important;
    border-radius:22px !important;
    overflow:auto !important;
    overscroll-behavior:contain;
    background:rgba(255,255,255,.99) !important;
    box-shadow:0 18px 50px rgba(13,43,57,.27) !important;
    -webkit-overflow-scrolling:touch;
  }

  .search-card { left:var(--nhpq-tablet-edge) !important; right:auto !important; display:none; padding:0 !important; }
  .search-card.search-open { display:block; }
  .search-card .mobile-search-toggle {
    position:sticky;
    z-index:6;
    top:0;
    width:100%;
    min-height:56px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:13px 12px 13px 18px;
    border:0;
    border-bottom:1px solid #e0eaed;
    color:#17394d;
    background:rgba(255,255,255,.985);
    font-size:15px;
    font-weight:900;
    text-align:left;
  }
  .search-card .mobile-search-toggle span:last-child { width:38px; height:38px; display:grid; place-items:center; border-radius:11px; color:transparent; font-size:0; background:#edf4f5; }
  .search-card .mobile-search-toggle span:last-child::after { content:'×'; color:#557383; font-size:24px; font-weight:500; line-height:1; }
  .search-card .search-card-body { display:block; max-height:none; padding:15px 17px 20px; overflow:visible; background:#fff; }
  .search-card .search-mode-tab,
  .search-card input,
  .search-card button { min-height:44px; }
  .search-card .parcel-grid { grid-template-columns:1fr 1fr; }

  .data-browser-card,
  .left-map-stack .documents-card,
  .left-map-stack .legend-card { right:var(--nhpq-tablet-edge) !important; left:auto !important; display:none; }
  .data-browser-card.mobile-open,
  .left-map-stack .documents-card.mobile-open,
  .left-map-stack .legend-card.mobile-open { display:block; }
  .left-map-stack { position:static !important; display:block !important; width:auto !important; }

  .nhpq-mobile-sheet-head {
    position:sticky;
    z-index:7;
    top:0;
    min-height:57px;
    display:grid;
    grid-template-columns:1fr 42px;
    align-items:center;
    gap:10px;
    padding:9px 10px 9px 17px;
    border-bottom:1px solid #e0eaed;
    background:rgba(255,255,255,.985);
  }
  .nhpq-mobile-sheet-head::before {
    content:"";
    position:absolute;
    top:7px;
    left:50%;
    width:40px;
    height:4px;
    border-radius:999px;
    background:#cfdee1;
    transform:translateX(-50%);
  }
  .nhpq-mobile-sheet-head strong { padding-top:5px; color:#17394d; font-size:15px; }
  .nhpq-mobile-sheet-close {
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    padding:0;
    border:0;
    border-radius:11px;
    color:#557383;
    background:#edf4f5;
    font-size:24px;
    line-height:1;
  }

  /* Controls, opacity, legal documents and legend live inside the layer panel. */
  .data-browser-card > .controls-card {
    position:static !important;
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    max-width:none !important;
    padding:12px 14px !important;
    border:0;
    border-bottom:1px solid #e0eaed;
    border-radius:0;
    box-shadow:none;
    background:#f7fbfb;
  }
  .data-browser-card > .controls-card .control-button { min-height:44px; padding:8px 6px; font-size:11px; }
  .data-browser-card > .controls-card .gps-control-button { display:none !important; }
  .data-browser-card > .controls-card .pdf-control-button { grid-column:1/-1; }
  .data-browser-card > .opacity-card {
    position:static !important;
    display:grid !important;
    width:auto !important;
    margin:0 !important;
    padding:12px 15px !important;
    border:0;
    border-bottom:1px solid #e0eaed;
    border-radius:0;
    box-shadow:none;
    background:#fff;
  }
  .data-browser-card .data-browser-section { padding:14px 15px; }
  .data-browser-card .layer-row { min-height:43px; }
  .data-browser-card .sheet-filter { min-height:44px; }
  .data-browser-card .sheet-row { min-height:42px; }
  .data-browser-card .data-sheet-section .sheet-list { max-height:none; overflow:visible; }

  .nhpq-mobile-layer-info {
    display:grid;
    gap:8px;
    padding:12px 14px 14px;
    border-bottom:1px solid #dfeaec;
    background:#f5fafb;
  }
  .nhpq-mobile-layer-info-heading { display:grid; gap:2px; padding:0 2px 3px; }
  .nhpq-mobile-layer-info-heading strong { color:#17394d; font-size:13px; font-weight:900; }
  .nhpq-mobile-layer-info-heading small { color:#6b8290; font-size:10.5px; line-height:1.35; }
  .nhpq-mobile-layer-info-item { border:1px solid #d6e5e8; border-radius:14px; overflow:hidden; background:#fff; }
  .nhpq-mobile-layer-info-item > summary {
    min-height:54px;
    display:grid;
    grid-template-columns:minmax(0,1fr) 28px;
    align-items:center;
    gap:8px;
    padding:9px 10px 9px 13px;
    color:#1b4053;
    cursor:pointer;
    list-style:none;
    -webkit-tap-highlight-color:transparent;
  }
  .nhpq-mobile-layer-info-item > summary::-webkit-details-marker { display:none; }
  .nhpq-mobile-layer-info-item > summary > span:first-child { min-width:0; display:grid; gap:2px; }
  .nhpq-mobile-layer-info-item > summary strong { overflow:hidden; font-size:12.5px; font-weight:900; line-height:1.3; text-overflow:ellipsis; white-space:nowrap; }
  .nhpq-mobile-layer-info-item > summary small { color:#718894; font-size:10px; line-height:1.3; }
  .nhpq-mobile-layer-info-chevron { width:28px; height:28px; display:grid; place-items:center; border-radius:9px; color:#4d7180; background:#edf5f6; font-size:0; }
  .nhpq-mobile-layer-info-chevron::before { content:""; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:translateY(-2px) rotate(45deg); transition:transform .18s ease; }
  .nhpq-mobile-layer-info-item[open] .nhpq-mobile-layer-info-chevron::before { transform:translateY(2px) rotate(225deg); }
  .nhpq-mobile-layer-info-content { border-top:1px solid #e2ecee; background:#fff; }
  .nhpq-mobile-layer-info-content .document-body,
  .nhpq-mobile-layer-info-content .legend-list { max-height:min(42dvh,390px) !important; margin:0; overflow:auto !important; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
  .nhpq-mobile-layer-info-content .document-body { padding:13px 13px 15px !important; }
  .nhpq-mobile-layer-info-content .legend-list { padding:12px 13px 15px !important; }

  /* Parcel details and GPS become focused panels instead of overlapping cards. */
  .gps-status-card {
    z-index:34;
    top:var(--nhpq-tablet-edge);
    right:var(--nhpq-tablet-edge);
    bottom:calc(var(--nhpq-tablet-dock-h) + var(--nhpq-tablet-panel-gap) + max(var(--nhpq-tablet-edge),env(safe-area-inset-bottom)));
    left:auto;
    width:min(430px,calc(100% - 28px));
    max-height:none;
    padding:17px 50px 17px 17px;
    overflow:auto;
    border-radius:22px;
    box-shadow:0 18px 48px rgba(13,42,55,.27);
  }
  .nhpq-gps-card-toggle {
    position:absolute;
    top:10px;
    right:10px;
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    padding:0;
    border:0;
    border-radius:11px;
    color:#4b6b79;
    background:#edf5f5;
    font-size:18px;
  }
  .gps-status-card.nhpq-collapsed { top:auto; max-height:98px; overflow:hidden; }
  .gps-status-card.nhpq-collapsed .gps-parcel-result,
  .gps-status-card.nhpq-collapsed .gps-parcel-actions,
  .gps-status-card.nhpq-collapsed > small { display:none !important; }

  .info-panel {
    z-index:35;
    top:var(--nhpq-tablet-edge);
    right:var(--nhpq-tablet-edge);
    bottom:calc(var(--nhpq-tablet-dock-h) + var(--nhpq-tablet-panel-gap) + max(var(--nhpq-tablet-edge),env(safe-area-inset-bottom)));
    left:auto;
    width:min(430px,calc(100% - 28px));
    max-height:none;
    padding:22px 20px;
    overflow:auto;
    border-radius:22px;
    transform:translateX(calc(100% + 40px));
  }
  .info-panel.open { transform:translateX(0); }
  .info-details { grid-template-columns:118px minmax(0,1fr); gap:8px 11px; }

  .maplibregl-ctrl-bottom-right,
  .maplibregl-ctrl-bottom-left { bottom:calc(var(--nhpq-tablet-dock-h) + 25px + env(safe-area-inset-bottom)); }

  /* Support uses the same panel language. */
  .advisor-contact { right:0; bottom:0; }
  .advisor-contact-toggle { display:none !important; }
  .advisor-contact-panel {
    z-index:5205;
    top:var(--nhpq-tablet-edge) !important;
    right:var(--nhpq-tablet-edge) !important;
    bottom:calc(var(--nhpq-tablet-dock-h) + var(--nhpq-tablet-panel-gap) + max(var(--nhpq-tablet-edge),env(safe-area-inset-bottom))) !important;
    left:auto !important;
    width:min(430px,calc(100% - 28px)) !important;
    max-height:none !important;
    border:1px solid rgba(199,221,215,.96) !important;
    border-radius:22px !important;
    padding-bottom:18px !important;
  }
  .advisor-contact-backdrop { z-index:5204; }
  body.advisor-contact-open .nhpq-mobile-dock { opacity:.55; pointer-events:none; }

  .nhpq-mobile-support-sheet { right:var(--nhpq-tablet-edge) !important; left:auto !important; display:block; padding:0 15px 18px; }
  .nhpq-mobile-support-sheet[hidden] { display:none !important; }
  .nhpq-mobile-support-sheet .nhpq-mobile-sheet-head { margin:0 -15px 14px; }
  .nhpq-mobile-support-list { display:grid; gap:9px; }
  .nhpq-mobile-support-list .support-contact { min-height:58px; padding:11px 13px; }
  .nhpq-mobile-support-list .support-contact a { min-height:30px; display:flex; align-items:center; }

  /* Compact global menu. */
  .nhpq-mobile-menu-backdrop {
    position:fixed;
    z-index:5298;
    inset:0;
    display:block;
    background:rgba(10,31,42,.42);
    backdrop-filter:blur(3px);
    -webkit-backdrop-filter:blur(3px);
  }
  .nhpq-mobile-menu-backdrop[hidden],
  .nhpq-mobile-menu[hidden] { display:none !important; }
  .nhpq-mobile-menu {
    position:fixed;
    z-index:5299;
    top:calc(var(--nhpq-tablet-header) + 9px);
    right:max(14px,env(safe-area-inset-right));
    width:320px;
    display:grid;
    gap:7px;
    padding:12px;
    border:1px solid #d6e4e7;
    border-radius:18px;
    background:#fff;
    box-shadow:0 20px 55px rgba(12,40,54,.28);
  }
  .nhpq-mobile-menu button {
    min-height:50px;
    display:flex;
    align-items:center;
    gap:12px;
    width:100%;
    padding:10px 12px;
    border:0;
    border-radius:13px;
    color:#193d50;
    background:#f4f8f9;
    font-size:14px;
    font-weight:800;
    text-align:left;
  }
  .nhpq-mobile-menu button svg { width:21px; height:21px; color:var(--teal); }
  .nhpq-mobile-menu small { padding:2px 8px 5px; color:#6b808d; font-size:11px; line-height:1.45; }

  .map-idle-guide { width:min(410px,calc(100% - 40px)); }
}

/* Portrait iPad: panels become spacious bottom sheets and preserve map context above. */
@media (min-width:761px) and (max-width:1180px) and (orientation:portrait),
       (min-width:761px) and (max-width:1400px) and (orientation:portrait) and (any-pointer:coarse) {
  .search-card,
  .data-browser-card,
  .left-map-stack .documents-card,
  .left-map-stack .legend-card,
  .nhpq-mobile-support-sheet,
  .advisor-contact-panel {
    top:auto !important;
    right:var(--nhpq-tablet-edge) !important;
    bottom:calc(var(--nhpq-tablet-dock-h) + var(--nhpq-tablet-panel-gap) + max(var(--nhpq-tablet-edge),env(safe-area-inset-bottom))) !important;
    left:var(--nhpq-tablet-edge) !important;
    width:auto !important;
    max-height:min(70dvh,720px) !important;
  }
  .gps-status-card,
  .info-panel {
    top:auto;
    right:var(--nhpq-tablet-edge);
    bottom:calc(var(--nhpq-tablet-dock-h) + var(--nhpq-tablet-panel-gap) + max(var(--nhpq-tablet-edge),env(safe-area-inset-bottom)));
    left:var(--nhpq-tablet-edge);
    width:auto;
    max-height:min(64dvh,660px);
  }
  .info-panel { transform:translateY(calc(100% + 100px)); }
  .info-panel.open { transform:translateY(0); }
  .search-card .parcel-grid { grid-template-columns:1fr 1fr; }
}

@media (prefers-reduced-motion:reduce) {
  .nhpq-mobile-menu,
  .search-card,
  .data-browser-card,
  .gps-status-card,
  .info-panel { scroll-behavior:auto; transition:none !important; animation:none !important; }
}