/* ==========================================================================
   RepairDock RENOVATION — reno.css
   Loaded AFTER assets/css/style.css, so this wins on equal specificity.
   Design rule for this file, on purpose:
     - NO purple -> blue / indigo -> sky rainbow gradients (that was the
       old look, and it is exactly what makes a site read as generic AI
       output). Gradients here are single-hue, low-contrast, and used
       only for the hero / nav depth — everything else is solid colour,
       hairline borders and real spacing.
     - NO neon yellow, no glass blobs, no emoji-as-design.
     - One workshop palette by default: warm paper, deep green-teal ink,
       one clay accent for the single most important action per screen.
   Themes are switched with <html data-theme="..."> by assets/js/reno.js
   (localStorage only — no database change, no migration, nothing for
   InfinityFree's free MySQL to do). The per-shop PUBLIC PROFILE theme
   in Settings is a different feature and is deliberately untouched.
   ========================================================================== */

/* ---- Tokens: Workshop (default) --------------------------------------- */
:root,
html[data-theme="workshop"]{
  --rd-bg:#f6f3ec;
  --rd-surface:#fffefa;
  --rd-surface2:#efe9dd;
  --rd-ink:#1a211f;
  --rd-muted:#66716e;
  --rd-faint:#8a948f;
  --rd-border:#e3ddd0;
  --rd-border-strong:#d2c9b8;
  --rd-accent:#0e5a4e;
  --rd-accent-deep:#0a4239;
  --rd-accent-soft:#ddebe6;
  --rd-accent-ink:#ffffff;
  --rd-accent2:#c25e3a;
  --rd-accent2-deep:#a84c2c;
  --rd-accent2-soft:#f7e5dc;
  --rd-nav-bg:#122e2a;
  --rd-nav-ink:#eaf2ef;
  --rd-hero-bg:linear-gradient(160deg,#16423a 0%,#0e2f2a 100%);
  --rd-shadow:0 8px 24px rgba(26,33,31,.08);
  --rd-shadow-lg:0 18px 40px rgba(26,33,31,.14);
  --rd-success:#1e7a4c;
  --rd-success-soft:#e2f2e8;
  --rd-warning:#8a5a00;
  --rd-warning-soft:#f6ead0;
  --rd-danger:#b42318;
  --rd-danger-soft:#fbe9e6;
  --bs-primary:var(--rd-accent);
  --bs-link-color:var(--rd-accent);
  --bs-link-hover-color:var(--rd-accent-deep);
}

/* ---- Slate: cooler, plainer, for shops that want it strictly business -- */
html[data-theme="slate"]{
  --rd-bg:#f2f4f5;
  --rd-surface:#ffffff;
  --rd-surface2:#e9edee;
  --rd-ink:#101a22;
  --rd-muted:#5d6b74;
  --rd-faint:#8a98a0;
  --rd-border:#dde3e6;
  --rd-border-strong:#c3ccd1;
  --rd-accent:#1d4e5e;
  --rd-accent-deep:#143a46;
  --rd-accent-soft:#dcebee;
  --rd-accent-ink:#ffffff;
  --rd-accent2:#b4532a;
  --rd-accent2-deep:#96421f;
  --rd-accent2-soft:#f6e6da;
  --rd-nav-bg:#12222b;
  --rd-nav-ink:#e8eef1;
  --rd-hero-bg:linear-gradient(160deg,#1d3a47 0%,#11222b 100%);
}

/* ---- Clay: warm, brown-paper shop-front feel -------------------------- */
html[data-theme="clay"]{
  --rd-bg:#faf5ef;
  --rd-surface:#fffdf9;
  --rd-surface2:#f1e6d8;
  --rd-ink:#2a1e17;
  --rd-muted:#75665b;
  --rd-faint:#9a8a7d;
  --rd-border:#e8dccb;
  --rd-border-strong:#d8c5ac;
  --rd-accent:#7c2d12;
  --rd-accent-deep:#5f220d;
  --rd-accent-soft:#f3e0d4;
  --rd-accent-ink:#ffffff;
  --rd-accent2:#0e5a4e;
  --rd-accent2-deep:#0a4239;
  --rd-accent2-soft:#ddebe6;
  --rd-nav-bg:#2b1a12;
  --rd-nav-ink:#f5ede6;
  --rd-hero-bg:linear-gradient(160deg,#5f2a16 0%,#38180c 100%);
}

/* ---- Midnight: true dark mode (respects the theme picker, and is the
   fallback when the OS is in dark mode and no theme was ever picked) --- */
html[data-theme="midnight"]{
  --rd-bg:#0d1312;
  --rd-surface:#16201e;
  --rd-surface2:#1e2b28;
  --rd-ink:#e9f0ed;
  --rd-muted:#9aa8a3;
  --rd-faint:#6f7d78;
  --rd-border:#26342f;
  --rd-border-strong:#35473f;
  --rd-accent:#5ed3a8;
  --rd-accent-deep:#3fb98e;
  --rd-accent-soft:#1d3a30;
  --rd-accent-ink:#0b1a15;
  --rd-accent2:#e8a87c;
  --rd-accent2-deep:#d98f5c;
  --rd-accent2-soft:#3a2a20;
  --rd-nav-bg:#0a0f0e;
  --rd-nav-ink:#e9f0ed;
  --rd-hero-bg:linear-gradient(160deg,#162a26 0%,#0a0f0e 100%);
  --rd-shadow:0 8px 24px rgba(0,0,0,.35);
  --rd-shadow-lg:0 18px 40px rgba(0,0,0,.5);
  --rd-success:#5ed3a8;
  --rd-success-soft:#1d3a30;
  --rd-warning:#e8c87c;
  --rd-warning-soft:#3a2f1a;
  --rd-danger:#f08a80;
  --rd-danger-soft:#3a201d;
}

/* RD-NAV-V2-KHATA-BLOCK: Khata theme (inspired-by, values chosen from
   the observed description — NOT Khata's exact stylesheet values, which
   were never exposed). Very pale grey-blue page, white cards, thin
   light-grey borders, near-black ink, burnt-orange/rust accent, pale
   peach active wash. Dark warm-brown nav bar is deliberate: header.php
   renders dark-bar nav icons with filter:invert(1) (white icons),
   which would vanish on a light bar. Follows the Slate/Clay subset
   pattern: success/warning/danger/shadow are inherited from Workshop
   (all light-theme values, correct on this light theme). */
html[data-theme="khata"]{
  --rd-bg:#f3f5f7;
  --rd-surface:#ffffff;
  --rd-surface2:#e8edf0;
  --rd-ink:#1a1d20;
  --rd-muted:#5c6670;
  --rd-faint:#8d979f;
  --rd-border:#dde3e7;
  --rd-border-strong:#c4ccd2;
  --rd-accent:#b34a24;
  --rd-accent-deep:#8f3a1a;
  --rd-accent-soft:#fbe9dd;
  --rd-accent-ink:#ffffff;
  --rd-accent2:#1d5c4d;
  --rd-accent2-deep:#14473b;
  --rd-accent2-soft:#e2efe9;
  --rd-nav-bg:#2b1d16;
  --rd-nav-ink:#f7ede4;
  --rd-hero-bg:linear-gradient(160deg,#4a2c1a 0%,#2b1d16 100%);
}

/* ---- Base: typography + surfaces -------------------------------------- */
/* Drop Poppins (geometric, over-used) for the system stack + Hind
   Siliguri, which already handles Bengali properly. Tighter headings,
   normal body weight — a repair tool should read like a ledger, not a
   landing-page template. */
body{
  font-family:'Hind Siliguri',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  background:var(--rd-bg);
  color:var(--rd-ink);
}
h1,h2,h3,h4,h5,h6,.fw-bold{letter-spacing:-.01em;}
.text-muted{color:var(--rd-muted) !important;}
.card,.stat-card,.feature-card,.portal-card,.crm-stat,.auth-card{
  background:var(--rd-surface);
  border:1px solid var(--rd-border);
  box-shadow:var(--rd-shadow);
}
.card-header,.modal-header{border-color:var(--rd-border);}
.modal-content{background:var(--rd-surface);color:var(--rd-ink);border:1px solid var(--rd-border);}
.dropdown-menu{background:var(--rd-surface);border:1px solid var(--rd-border);box-shadow:var(--rd-shadow-lg);}
.dropdown-item{color:var(--rd-ink);}
.dropdown-item:hover,.dropdown-item:focus{background:var(--rd-accent-soft);color:var(--rd-ink);}
.table{color:var(--rd-ink);}
.table thead th{border-color:var(--rd-border);color:var(--rd-muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;}
.table td,.table th{border-color:var(--rd-border);}
.form-control,.form-select{
  background:var(--rd-surface);
  color:var(--rd-ink);
  border:1px solid var(--rd-border-strong);
  border-radius:.6rem;
}
.form-control:focus,.form-select:focus{
  border-color:var(--rd-accent);
  box-shadow:0 0 0 .2rem color-mix(in srgb,var(--rd-accent) 18%,transparent);
}
.form-control::placeholder{color:var(--rd-faint);}
.list-group-item{background:var(--rd-surface);border-color:var(--rd-border);color:var(--rd-ink);}
hr{border-color:var(--rd-border);}

/* Bootstrap utilities that read --bs-primary-rgb (which we do NOT set,
   because --rd-accent is a hex token) — pin them to the token directly. */
.text-primary{color:var(--rd-accent) !important;}
.text-success{color:var(--rd-success) !important;}
.bg-primary{background-color:var(--rd-accent) !important;}
.border-primary{border-color:var(--rd-accent) !important;}
.btn-outline-light{color:var(--rd-nav-ink);}

/* ---- Nav + hero: solid ink, one restrained single-hue wash ----------- */
.app-navbar,.portal-nav{background:var(--rd-nav-bg) !important;background-image:none !important;}
.app-navbar{position:sticky;top:0;z-index:1030;}
.app-navbar .nav-link,.icon-nav-link{color:var(--rd-nav-ink);}
.icon-nav-link:hover,.icon-nav-link:focus,.icon-nav-link.active{background:rgba(255,255,255,.1);color:#fff;}
.hero{
  background:var(--rd-hero-bg);
  border-radius:0 0 1.5rem 1.5rem;
  color:#fff;
}
.hero .lead{color:rgba(255,255,255,.86) !important;}
.trust-strip{color:rgba(255,255,255,.86);}
.trust-strip i{color:var(--rd-accent2);}

/* ---- Buttons: solid, one accent, clay only for the primary CTA -------- */
.btn{border-radius:.6rem;font-weight:600;}
.btn-primary{
  background:var(--rd-accent) !important;
  background-image:none !important;
  border-color:var(--rd-accent) !important;
  color:var(--rd-accent-ink) !important;
}
.btn-primary:hover,.btn-primary:focus-visible{
  background:var(--rd-accent-deep) !important;
  border-color:var(--rd-accent-deep) !important;
  box-shadow:0 8px 20px rgba(0,0,0,.18);
}
.btn-outline-primary{color:var(--rd-accent);border-color:var(--rd-accent);}
.btn-outline-primary:hover{background:var(--rd-accent);border-color:var(--rd-accent);color:var(--rd-accent-ink);}
.btn-cta-clay{background:var(--rd-accent2);border-color:var(--rd-accent2);color:#fff;}
.btn-cta-clay:hover{background:var(--rd-accent2-deep);border-color:var(--rd-accent2-deep);color:#fff;}
/* The old "PRO" tag was bright warning-yellow — now a quiet clay chip. */
.badge.bg-warning{background:var(--rd-accent2-soft) !important;color:var(--rd-accent2) !important;}

/* ---- Icons, badges, chat, timeline: solid accent, no rainbow ---------- */
.feature-icon,.portal-hero-badge{background:var(--rd-accent) !important;background-image:none !important;color:var(--rd-accent-ink);}
.shop-cover{background:var(--rd-hero-bg);}
.shop-cover.banner-solid{background:var(--rd-accent);}
.shop-cover.banner-dark{background:var(--rd-nav-bg);}
.chat-bubble-row.mine .chat-bubble{background:var(--rd-accent) !important;background-image:none !important;color:var(--rd-accent-ink);}
.status-track-step.done .status-track-icon{background:var(--rd-accent) !important;background-image:none !important;}
.status-track-step.done:not(:last-child)::after{background:var(--rd-accent);}
.lock-tab-btn.active{background:var(--rd-accent);color:var(--rd-accent-ink);}
.lock-dot-active{fill:var(--rd-accent);stroke:var(--rd-accent);}
.lock-line{stroke:var(--rd-accent);}
.theme-preset-swatch{box-shadow:0 0 0 1px var(--rd-border),0 2px 6px rgba(0,0,0,.1);}
.faq-accordion .accordion-button:not(.collapsed){background:var(--rd-accent);color:var(--rd-accent-ink);}
.faq-accordion .accordion-button{background:var(--rd-surface);color:var(--rd-ink);}
.faq-accordion .accordion-item{background:var(--rd-surface);border:1px solid var(--rd-border);}
.accordion-body{color:var(--rd-ink);}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.btn:focus-visible,.nav-link:focus-visible{
  outline:3px solid var(--rd-accent2);
  outline-offset:2px;
}

/* Status badges — muted, ledger-like, still instantly scannable. */
.badge-status-received{background:#e8ecef;color:#334155;}
.badge-status-diagnosing{background:var(--rd-warning-soft);color:var(--rd-warning);}
.badge-status-in_progress{background:var(--rd-accent-soft);color:var(--rd-accent);}
.badge-status-waiting_parts{background:var(--rd-danger-soft);color:var(--rd-danger);}
.badge-status-completed{background:var(--rd-success-soft);color:var(--rd-success);}
.badge-status-delivered{background:var(--rd-surface2);color:var(--rd-muted);}
.badge-status-cancelled{background:var(--rd-surface2);color:var(--rd-faint);}
html[data-theme="midnight"] .badge-status-received{background:#243138;color:#cbd5e1;}

/* Alerts follow the theme instead of Bootstrap's loud defaults. */
.alert-primary{background:var(--rd-accent-soft);border-color:var(--rd-border);color:var(--rd-ink);}
.alert-primary .btn-primary{color:var(--rd-accent-ink);}

/* ---- Dashboard renovation pieces (dashboard.php) ---------------------- */
.rd-quick-strip{display:flex;gap:.6rem;overflow-x:auto;padding-bottom:.35rem;scrollbar-width:none;}
.rd-quick-strip::-webkit-scrollbar{display:none;}
.rd-quick-strip .btn{flex:0 0 auto;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center;}
.rd-focus-card{border:1px solid var(--rd-border);border-radius:.9rem;background:var(--rd-surface);padding:.9rem 1rem;box-shadow:var(--rd-shadow);text-decoration:none;color:var(--rd-ink);display:block;}
.rd-focus-card:hover{color:var(--rd-ink);border-color:var(--rd-accent);}
.rd-focus-card .rd-focus-num{font-size:1.55rem;font-weight:800;line-height:1.1;letter-spacing:-.02em;}
.rd-focus-card .rd-focus-lbl{font-size:.76rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--rd-muted);}
.rd-focus-card.rd-focus-warn{border-left:4px solid var(--rd-accent2);}
.rd-focus-card.rd-focus-danger{border-left:4px solid var(--rd-danger);}
.rd-focus-card.rd-focus-ok{border-left:4px solid var(--rd-success);}
.dash-stat{background:var(--rd-surface);border:1px solid var(--rd-border);box-shadow:var(--rd-shadow);}
.dash-stat-lbl{color:var(--rd-muted);}
.top-brand-bar{background:var(--rd-accent) !important;background-image:none !important;}
.inv-mini-card{background:var(--rd-nav-bg) !important;background-image:none !important;color:var(--rd-nav-ink);}
.chart-card{background:var(--rd-surface);border:1px solid var(--rd-border);}

/* ---- Theme picker (injected into the More menu + footer) --------------- */
.rd-theme-row{display:flex;gap:.5rem;padding:.5rem 1rem;flex-wrap:wrap;}
.rd-theme-btn{
  flex:1 1 auto;border:1px solid var(--rd-border);background:var(--rd-surface);
  color:var(--rd-ink);border-radius:.6rem;padding:.5rem .4rem;font-size:.78rem;
  font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.4rem;justify-content:center;
}
.rd-theme-btn[aria-pressed="true"]{border-color:var(--rd-accent);box-shadow:0 0 0 2px var(--rd-accent-soft);}
.rd-theme-dot{width:14px;height:14px;border-radius:50%;flex-shrink:0;border:1px solid rgba(0,0,0,.15);}
.rd-theme-dot-workshop{background:linear-gradient(135deg,#0e5a4e 50%,#c25e3a 50%);}
.rd-theme-dot-slate{background:linear-gradient(135deg,#1d4e5e 50%,#b4532a 50%);}
.rd-theme-dot-clay{background:linear-gradient(135deg,#7c2d12 50%,#0e5a4e 50%);}
.rd-theme-dot-midnight{background:linear-gradient(135deg,#16201e 50%,#5ed3a8 50%);}
/* RD-NAV-V2-KHATA-DOT */
.rd-theme-dot-khata{background:linear-gradient(135deg,#e8edf0 50%,#b34a24 50%);}

/* ---- Mobile bottom navigation (logged-in shops only, footer.php) ----- */
.rd-bottom-nav{display:none;}
@media (max-width:991.98px){
  .rd-bottom-nav{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:1040;
    background:var(--rd-surface);border-top:1px solid var(--rd-border);
    box-shadow:0 -6px 20px rgba(0,0,0,.1);
    padding:.35rem .25rem calc(.35rem + env(safe-area-inset-bottom,0px));
  }
  .rd-bottom-nav a{
    flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;
    padding:.35rem .1rem .15rem;color:var(--rd-muted);text-decoration:none;
    font-size:.66rem;font-weight:600;min-height:52px;border-radius:.6rem;
  }
  .rd-bottom-nav a i{font-size:1.25rem;line-height:1;}
  .rd-bottom-nav a.active{color:var(--rd-accent);}
  .rd-bottom-nav .rd-nav-plus{
    flex:0 0 56px;height:56px;margin-top:-26px;border-radius:50%;
    background:var(--rd-accent2);color:#fff;justify-content:center;
    box-shadow:0 8px 20px rgba(0,0,0,.25);font-size:1.5rem;
  }
  .rd-bottom-nav .rd-nav-plus i{font-size:1.5rem;}
  .rd-bottom-nav .rd-nav-plus span{display:none;}
  /* Room for the bottom bar + the help button above it. */
  .app-main{padding-bottom:calc(118px + env(safe-area-inset-bottom,0px)) !important;}
  .contact-admin-fab{bottom:calc(84px + env(safe-area-inset-bottom,0px)) !important;left:14px !important;}
  .mobile-cta-bar{z-index:1039;}
  /* Thumb-size everything, and stop iOS zooming on focus (16px floor). */
  .btn{min-height:44px;}
  .btn-sm{min-height:38px;}
  input[type="text"],input[type="tel"],input[type="email"],input[type="number"],input[type="search"],input[type="password"],select,textarea{font-size:16px !important;}
  h1,.display-5{font-size:1.75rem;}
  .hero{border-radius:0 0 1rem 1rem;}
  .hero .container{padding-top:2rem !important;padding-bottom:2rem !important;}
}
@media (min-width:992px){
  .app-main{padding-bottom:calc(86px + env(safe-area-inset-bottom,0px));}
}

/* ---- Midnight component fixes (Bootstrap defaults assume light) -------- */
html[data-theme="midnight"] .card,html[data-theme="midnight"] .modal-content,html[data-theme="midnight"] .dropdown-menu{color:var(--rd-ink);}
html[data-theme="midnight"] .table{--bs-table-bg:transparent;--bs-table-color:var(--rd-ink);}
html[data-theme="midnight"] .table-hover tbody tr:hover{--bs-table-hover-bg:var(--rd-surface2);}
html[data-theme="midnight"] .btn-outline-secondary{color:var(--rd-ink);border-color:var(--rd-border-strong);}
html[data-theme="midnight"] .btn-light{background:var(--rd-surface2);border-color:var(--rd-border);color:var(--rd-ink);}
html[data-theme="midnight"] .btn-outline-light{color:var(--rd-ink);border-color:var(--rd-border-strong);}
html[data-theme="midnight"] .text-dark{color:var(--rd-ink) !important;}
html[data-theme="midnight"] .bg-white,html[data-theme="midnight"] .bg-light{background:var(--rd-surface) !important;}
html[data-theme="midnight"] .chat-scroll{background:var(--rd-surface2);border-color:var(--rd-border);}
html[data-theme="midnight"] .chat-bubble-row.theirs .chat-bubble{background:var(--rd-surface2);border-color:var(--rd-border);color:var(--rd-ink);}
html[data-theme="midnight"] .chat-input-row{background:var(--rd-surface);border-color:var(--rd-border);}
html[data-theme="midnight"] .table-responsive:not(.no-mobile-cards) > table.table tbody tr{background:var(--rd-surface);border-color:var(--rd-border);}
html[data-theme="midnight"] .btn-close{filter:invert(1);}

@media (prefers-reduced-motion:reduce){
  .rd-quick-strip{scroll-behavior:auto;}
}

/* ---- STREAM 1 — header responsive fixes (PWA pass, code audit only) --
   Appended last in this file so these win over earlier reno.css rules
   on equal specificity. Nothing here changes the >=1200px desktop nav
   layout: the stretch rule only fires below the xl breakpoint, the
   clearance rule only fires where the bottom nav exists, and the
   scroll-padding / menu-width rules only take effect when an anchor
   jump or an over-wide menu would otherwise hit the sticky header or
   the viewport edge. ----------------------------------------------- */
/* Anchor jumps under a sticky header (all widths): .app-navbar is
   sticky (52-68px tall) and reserves no space for jump targets, so a
   same-page #anchor (e.g. /index.php#pricing from the logged-out
   header) used to land with the target's top hidden underneath the
   bar. scroll-padding-top offsets every viewport anchor scroll by
   more than the tallest header, without moving any layout. */
html{ scroll-padding-top:84px; scroll-padding-top:calc(84px + env(safe-area-inset-top,0px)); }
/* LIVE-TEST FIX (2026-10-29, sticky edge): on narrow phones the sticky
   bar is taller than the 84px above (narrow navbar + notch safe-area,
   which style.css adds to .app-navbar's top padding), so anchor jumps
   and scroll-to-top landings could still tuck first content under the
   bar. 96px + safe-area at <=991px covers it. At rest the in-flow
   sticky bar cannot overlap .app-main (it carries py-4), so this
   targets jump/scroll landings, not normal layout. */
@media (max-width:991.98px){
  html{ scroll-padding-top:96px; scroll-padding-top:calc(96px + env(safe-area-inset-top,0px)); }
}
/* The body-relocated More menu must never exceed the viewport: at
   360px its theme row (4 buttons + padding) can measure ~350px wide,
   wider than the 344px the JS clamp assumes, so the right edge could
   spill off-screen. The JS clamp still does the positioning; this
   only caps the width, and the theme row already wraps. */
#moreDropdownMenu{ max-width:calc(100vw - 16px); }
/* Collapsed hamburger list, 1024-1199px only in effect: the <ul> carries
   Bootstrap's align-items-lg-center (!important, >=992px), which in the
   collapsed COLUMN layout centres every row and shrinks each link to
   its text width instead of full-width thumb rows (below 992px the
   default stretch already applied, so this was a 1024-1199-only
   regression). !important is required to beat the utility, and the
   max-width:1199.98px scope keeps the >=1200px row layout identical. */
@media (max-width:1199.98px){
  .app-navbar .navbar-nav{ align-items:stretch !important; }
}
/* Collapsed menu clearance for the fixed bottom nav + help FAB
   (<=991px, logged-in pages only): style.css caps the open menu at
   100vh-60px, so its bottom strip sat UNDER the fixed bottom bar
   (~63px tall, plus the + button protruding ~26px above it, z-index
   1040 over the header's 1030) and the help FAB (z-index 9999) -- the
   last menu row's centre could be covered. Subtracting 96px puts the
   menu's scrollable bottom fully above both. The bottom nav itself
   (footer.php, another stream's file) is NOT touched. */
@media (max-width:991.98px){
  .app-navbar .navbar-collapse.show,
  .app-navbar .navbar-collapse.collapsing{
    max-height:calc(100vh - 60px - 96px);
    max-height:calc(100dvh - 60px - 96px);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    /* LIVE-TEST FIX (2026-10-29): the last row used to sit flush at the
       menu's clipped bottom edge ("Discover PRO" cut off). Bottom
       padding inside the scrollable menu keeps it fully reachable. */
    padding-bottom:24px;
  }
}
/* LIVE-TEST FIX (2026-10-29): the same bottom-clip, 992-1199px band.
   The dashboard still hamburger-collapses at 1024px, but there is no
   bottom nav there, so stream 1's 96px subtraction never applied --
   and style.css caps the menu at 100vh-60px while the navbar itself
   is taller than 60px, so the menu bottom ran past the viewport edge
   and the last row was clipped until the menu was scrolled. dvh is
   the URL-bar-aware viewport (vh fallback first for old browsers). */
@media (min-width:992px) and (max-width:1199.98px){
  .app-navbar .navbar-collapse.show,
  .app-navbar .navbar-collapse.collapsing{
    max-height:calc(100vh - 60px - 24px);
    max-height:calc(100dvh - 60px - 24px);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    padding-bottom:24px;
  }
}
/* LIVE-TEST FIX (2026-10-29): the body-relocated More dropdown holds
   every overflowed nav item at collapsed widths, so it can itself run
   past the bottom edge. Cap + internal scroll below 1200px (style.css
   already caps all dropdowns at 70vh below 768px; this extends the
   same treatment to 768-1199px). Desktop >=1200px dropdown untouched. */
@media (max-width:1199.98px){
  #moreDropdownMenu{
    max-height:calc(100vh - 120px);
    max-height:calc(100dvh - 120px);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }
}
#moreDropdownMenu,.dropdown-menu{max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);overflow-y:auto;overscroll-behavior:contain;}