/* Section navigation mobile dropdown styles */

@media (max-width: 767.98px) {
  /* Toggle button styling (kept minimal; theme can override) */
  #section-nav-toggle {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    justify-content: flex-start;
    padding: 24px;
    color: var(--blue-700);
    background: var(--grey-10, #fff);
    font: inherit;
    cursor: pointer;
    font-weight: 600;
    border-top: 1px solid var(--grey-100);
    border-bottom: 1px solid var(--grey-100);
  }

  #section-nav-toggle .btn-ghost__text--collapsed,
  #section-nav-toggle .btn-ghost__text--expanded {
    display: inline;
  }

  #section-nav-toggle .btn-text--hidden {
    display: none !important;
  }
  #section-nav-toggle .btn-text--visible {
    display: inline !important;
  }

  /* Icon styling: solid dark blue circle with transparent chevron */
  #section-nav-toggle .material-symbols-outlined {
    font-size: 32px; /* Match the 32px reference */
    line-height: 1;
    color: #1A4D81; /* Solid dark blue */
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 32;
  }

  /* Container collapsed state (animated) */
  .section-nav__container.section-nav__container--collapsed {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    margin-top: 0;
  }

  /* When expanded, show with spacing and transition */
  .section-nav__container {
    margin-top: 10px;
    overflow: hidden;
    max-height: 1000px; /* large enough for expected content */
    opacity: 1;
    transition: max-height 300ms ease, opacity 200ms ease;
    will-change: max-height, opacity;
  }
}
@media (max-width: 767px) {
  .standard-page__siblings{
    margin-left: -24px;
    margin-right: -24px;
  }
  .standard-page__siblings .section-nav__container {
    margin-left: 24px;
    margin-right: 24px;
  }
}

/* Desktop: show items normally and hide toggle */
@media (min-width: 768px) {
  #section-nav-toggle  {
    display: none !important;
  }
  .section-nav__container {
    display: block !important;
    margin-top: 0;
  }
}
