/* hierMenu plugin — styles for Berlin theme
 *
 * Berlin base rules we must override:
 *   .header__nav             { text-align: right; overflow: hidden; }
 *   .header__nav li          { display: inline-block; vertical-align: middle; }
 *   .header__nav li span:not(.simple-menu-label)  { font-size:.875em; font-style:italic; font-family:serif; }
 *   .header__nav li a:link   { color: #fff }
 */

/* ── Left-align items (Berlin defaults to right) ── */
.hier-menu {
    text-align: left;
}

/* ── Desktop: show nav open by default, hide the hamburger button ──
 *
 * Berlin's JS adds .hide to .header__nav at DOMready and inserts the
 * hamburger button unconditionally. We neutralise both on desktop only.
 * On mobile (≤ 60em) neither rule applies, so the hamburger works as normal.
 */
@media screen and (min-width: 60.001em) {
    #hamburger {
        display: none;
    }

    .hier-menu.hide {
        overflow: visible !important;
        opacity: 1 !important;
        height: auto !important;
    }
}

/* ── Top-level items: stay top-aligned when a sibling sub-menu opens ── */
.hier-menu > .hm-item {
    vertical-align: top;
}

/* ── All links: consistent block display, white, no decoration ── */
.hier-menu .hm-link {
    display: block;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
    font-style: normal;
    font-family: inherit;
    font-size: 1em;
}

/* ── Labels (non-clickable spans): override Berlin's italic serif span rule ── */
.hier-menu .hm-label {
    display: block;
    color: #fff;
    font-style: normal;
    font-family: inherit;
    font-size: 1em;
    line-height: inherit;
    white-space: nowrap;
    cursor: default;
    user-select: none;
}

/* ── Sub-menus: hidden until .hm-open toggled by JS ── */
.hm-sub {
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: left;
}

.hm-item.hm-open > .hm-sub {
    display: block;
}

/* ── Sub-menu items: override Berlin's inline-block li rule ── */
.hm-sub > .hm-item {
    display: block !important;
    vertical-align: top !important;
    white-space: normal;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid #555;
}

/* ── Sub-menu links and labels: indented, styled to match nav ── */
.hm-sub .hm-link,
.hm-sub .hm-label {
    display: block;
    padding: 0.3em 1em 0.3em 1.4em;
    color: #fff;
    text-decoration: none;
    font-style: normal;
    font-family: inherit;
    font-size: 0.9em;
}

/* Level 2 — extra indent */
.hm-sub .hm-sub .hm-link,
.hm-sub .hm-sub .hm-label {
    padding-left: 2.6em;
}

.hm-sub .hm-link:hover,
.hm-sub .hm-label:hover {
    background-color: #636363;
}

/* ── Dropdown arrow: ▾ closed, ▴ open ── */
.hm-has-children > .hm-link::after,
.hm-has-children > .hm-label::after {
    content: ' \25BE';
    font-size: 0.75em;
    opacity: 0.8;
}

.hm-open > .hm-link::after,
.hm-open > .hm-label::after {
    content: ' \25B4';
}