/* DBX ONE v134.5 — navigation consistency, dark continuity, iOS Safari root-background fix */

/* Never expose a white browser/root canvas beneath the site. */
html,
body {
  margin: 0;
  min-height: 100%;
  background: #02050a !important;
}
body {
  min-height: 100vh;
  min-height: 100svh;
  color-scheme: dark;
}
main,
.footer,
.v134-footer {
  background-color: #02050a;
}

/* Make the two new product pages visually continuous.  Legacy 'light' sections
   were useful in older builds but now read as formatting errors inside v134. */
body.v134-shell .v134-section.light,
body.v134-shell .v134-section.soft,
body.stock-page .v134-section,
body.stock-page .v134-stock-personalised {
  background: linear-gradient(180deg, #02050a 0%, #06101c 100%) !important;
  color: #f4f8fc !important;
}
body.v134-shell .v134-section.light .v134-section-head h2,
body.v134-shell .v134-section.light .v134-card h3,
body.v134-shell .v134-section.light h2,
body.v134-shell .v134-section.light h3 {
  color: #f6f9fd !important;
}
body.v134-shell .v134-section.light .v134-section-head p,
body.v134-shell .v134-section.light .v134-card p,
body.v134-shell .v134-section.light p {
  color: #98aabe !important;
}
body.v134-shell .v134-section.light .v134-card {
  background: linear-gradient(150deg, rgba(12,24,41,.94), rgba(6,14,25,.98)) !important;
  border-color: rgba(116,169,220,.16) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.16) !important;
}
body.v134-shell .v134-section.light .v134-card .index {
  color: #8bd0ff !important;
  background: rgba(35,150,255,.12) !important;
  border-color: rgba(74,179,255,.22) !important;
}

/* Force STOCKROOM proof/receipt/personalisation panels back into the dark product palette,
   even if an older stylesheet is cached or loaded before this file. */
body.stock-page .v134-proof {
  background: linear-gradient(145deg,#081523 0%,#0b2036 56%,#0a1726 100%) !important;
  color: #f7fbff !important;
  border-color: rgba(97,175,244,.20) !important;
}
body.stock-page .v134-proof h3 { color:#f8fbff !important; }
body.stock-page .v134-proof p { color:#a8b8ca !important; }
body.stock-page .v134-proof a { color:#66c1ff !important; }
body.stock-page .v134-proof .proof-number { color:#45adff !important; }
body.stock-page .v134-stock-personalised .v134-card,
body.stock-page .v134-receipt {
  background: linear-gradient(145deg,#0b1625,#08111d) !important;
  color:#f7fbff !important;
}

/* One navigation system everywhere. */
.topbar {
  position: sticky;
  top: 0;
  z-index: 5000;
  background: rgba(2,5,10,.88) !important;
  border-bottom: 1px solid rgba(255,255,255,.07);
  -webkit-backdrop-filter: blur(24px) saturate(140%);
  backdrop-filter: blur(24px) saturate(140%);
}
.nav-wrap { position: relative; }
.menu-toggle { position: relative; z-index: 5002; }
.nav { z-index: 5001; }

@media (max-width: 980px) {
  .topbar { min-height: 72px; }
  .nav-wrap { min-height: 72px; }
  .nav {
    display: none !important;
    position: fixed !important;
    top: 78px !important;
    left: 14px !important;
    right: 14px !important;
    width: auto !important;
    max-height: calc(100dvh - 98px);
    overflow-y: auto;
    padding: 12px !important;
    gap: 3px !important;
    flex-direction: column !important;
    align-items: stretch !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 22px !important;
    background: rgba(3,8,16,.985) !important;
    box-shadow: 0 28px 80px rgba(0,0,0,.55) !important;
    -webkit-backdrop-filter: blur(26px) saturate(140%);
    backdrop-filter: blur(26px) saturate(140%);
  }
  .nav.open { display: flex !important; }
  .nav a {
    display: block;
    padding: 13px 14px !important;
    border-radius: 13px;
    color: #dbe7f3 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.15;
  }
  .nav a:active,
  .nav a:hover { background: rgba(255,255,255,.055); color:#fff !important; }
  .nav .nav-cta { background: none !important; color:#dbe7f3 !important; box-shadow:none !important; }
}

@media (max-width: 640px) {
  .topbar,
  body.v134-shell .topbar { min-height: 66px; }
  .nav-wrap,
  body.v134-shell .nav-wrap { min-height: 66px; }
  .nav,
  body.v134-shell .nav { top: 72px !important; }
}

/* Darken legacy public/legal content all the way to the bottom of the viewport. */
.page-hero,
.op-hero,
.op-legal,
.legal-shell,
.footer {
  background-color: #030812;
}

/* Safe-area paint for iOS Safari. */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  body { padding-bottom: env(safe-area-inset-bottom); }
}