/*
 * ODO 2026: WordPress compatibility and the approved fixes, loaded on the designed pages after the
 * verbatim design CSS (home.css, or site.css + pages.css). build.py also re-roots these rules under
 * #odo-nav for the generic pages' chrome.css. Nothing here changes a desktop pixel of the design.
 */

/* ── Fix: mobile nav (from odo-fullsite, approved 2026-09-16) ──
   The zip hides .nav-links below 860px with no way to open them. This adds a hamburger that drops
   the same <ul> into a panel under the bar. Hidden on desktop. */
.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 42px;
  height: 42px;
  padding: 0;
  background: none;
  border: 1px solid var(--line);
  border-radius: 3px;
  cursor: pointer;
}

.nav-toggle span {
  display: block;
  width: 18px;
  height: 2px;
  margin: 0 auto;
  background: var(--ink);
  transition: transform 0.25s ease, opacity 0.2s ease;
}

.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 860px) {
  nav { flex-wrap: wrap; }
  .nav-toggle { display: flex; }

  .nav-links {
    display: none;
    order: 3;
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    margin-top: 14px;
    padding-bottom: 8px;
    border-top: 1px solid var(--line);
    max-height: calc(100vh - 92px);
    overflow-y: auto;
  }

  .nav-links.open { display: flex; }
  .nav-links > li { width: 100%; }

  .nav-links > li > a {
    display: block;
    padding: 15px 2px;
    font-size: 15px;
    border-bottom: 1px solid var(--line);
  }

  /* Log In stays the gold button, full width in the panel; its menu opens inline below it. */
  .login-wrap { width: 100%; margin-top: 16px; }

  .login-btn {
    width: 100%;
    padding: 15px 22px;
    font-size: 15px;
    text-align: center;
  }

  .login-menu {
    position: static;
    min-width: 0;
    margin-top: 8px;
    box-shadow: none;
    background: var(--paper);
  }

  .nav-links .nav-cta {
    margin-top: 12px;
    padding: 15px 22px;
    text-align: center;
    border-bottom: none;
  }
}

/* ── WordPress admin bar (logged-in users only) ── */
body.admin-bar #odo-nav { top: 32px; }
@media screen and (max-width: 782px) { body.admin-bar #odo-nav { top: 46px; } }

/* ── Lead forms ── */
.odo-hp {
  position: absolute !important;
  left: -10000px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.odo-form-status {
  scroll-margin-top: 110px;
  padding: 14px 16px;
  border-radius: 3px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink);
}

.odo-form-status.is-sent { background: rgba(254,202,66,0.14); border: 1px solid var(--gold-deep); }
.odo-form-status.is-error { background: var(--white); border: 1px solid var(--ink); }
.odo-form-status a { color: var(--ink); font-weight: 600; }
