/* SummerToons Header Manager — header nav (r5).
 *
 * 1) Dropdown polish for "Ekibe Katıl" / "Sosyal Medya" (li.sthm-nav).
 *
 * 2) Desktop layout — ONE natural model, no per-item row assignment:
 *      [ logo ]  [ centre nav area ]  [ search ]
 *    The centre nav area is #main-menu, a flex item that takes the width left
 *    between logo and search (theme/mauve: flex:1 1 auto; min-width:0). Its <ul>
 *    is a wrapping flex container whose every line is centred, so however many
 *    items exist (today or added later in WP Admin / menus) the browser wraps them
 *    in DOM order and re-centres each line by itself.
 *    mauve gives account items margin-left:auto !important; an auto margin absorbs
 *    the free space of its line and would defeat justify-content:center, so it is
 *    reset. Mobile (<= 880px) is untouched.
 *
 * Bump the file name (nav-r6.css …) on any change: the CDN keys CSS by path and
 * ignores ?ver=. */
#main-menu ul.menu > li.sthm-nav > a {
  cursor: pointer;
}
#main-menu ul.menu > li.sthm-nav > a:focus-visible {
  outline: 2px solid #af67ff;
  outline-offset: 3px;
  border-radius: 6px;
}

@media (min-width: 881px) {
  #main-menu {
    align-items: center !important;
    justify-content: center !important;
  }
  #main-menu ul.menu {
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    align-content: center !important;
    row-gap: 6px !important;
  }
  #main-menu ul.menu > li {
    margin-left: 0 !important;
  }
}

/* One-row header (logo | nav | search): the nav takes exactly the remaining width;
   the search keeps a usable minimum instead of being squeezed by the nav. */
@media (min-width: 1025px) {
  #main-menu { flex: 1 1 0% !important; }
  .centernav.bound .searchx { min-width: 220px !important; }
}
/* Squeezed band: tighter column gap so lines carry more items. */
@media (min-width: 1025px) and (max-width: 1179px) {
  #main-menu ul.menu { column-gap: 10px !important; }
}

/* nav-r*.js adds .sthm-flip when a DROPDOWN would open over the search box:
   open it leftwards (right-aligned to its parent). Dropdowns only. */
@media (min-width: 881px) {
  #main-menu ul.menu > li.sthm-nav.sthm-flip > .sub-menu { left: auto !important; right: 0 !important; }
}