/* ──────────────────────────────────────────────────────────────────────────
   EN-251 — the SPLIT nav bar (user directive: «خلي اللوجو كبير علي ناحيه
   والصفح علي ناحيه تانيه»). Additive layer — the delivered `style.css` stays
   byte-identical (D-042/D-223); this file only re-weights the header of the
   theme whose shell links it. Applied to Classic Editorial for now.

   Shape: the brand alone on one side, big; every page link (and nothing else)
   on the other. The header's CTA button is gone from the markup — the hero
   already carries the two collection buttons.
   ────────────────────────────────────────────────────────────────────────── */

/* r2 — the directive became «غيره كله»: all nine themes now render this bar, so
   the rules must also OUTRANK the variant headers three of them shipped
   (masthead / centred / dark bar). The dark bar keeps its colour — only the
   layout is ours. */
.theme-header__inner,
.theme-header--centered .theme-header__inner,
.theme-header--masthead .theme-header__inner,
.theme-header--darkbar .theme-header__inner {
  display: flex;
  flex-direction: row;          /* --centered stacked it into a column */
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  flex-wrap: nowrap;
  padding-top: 18px;
  padding-bottom: 18px;
}

/* ── the big side: the wordmark / logo ── */
.theme-header .theme-brand,
.theme-header--masthead .theme-brand,
.theme-header--centered .theme-brand,
.theme-brand {
  display: inline-flex;
  align-items: center;
  font-size: clamp(24px, 3.2vw, 38px);   /* the theme's own 20px, roughly doubled */
  line-height: 1.05;
  flex: 0 0 auto;
}

.theme-brand img {
  /* the shell asks for 34px inline; a split bar wants it big */
  height: clamp(44px, 6vw, 68px) !important;
  width: auto;
}

/* ── the other side: the pages, pushed to the far edge ── */
.theme-header__inner .theme-nav {
  margin-inline-start: auto;
  gap: 26px;
  align-items: center;
  flex-wrap: nowrap;
}

.theme-header__inner .theme-nav-link {
  font-size: 13px;
  padding-block: 6px;
}

/* the toggle keeps its own corner on small screens */
.theme-header__actions {
  flex: 0 0 auto;
  margin-inline-start: 8px;
}

/* ── narrow screens: the theme's own rules take the nav to its own row; keep
      the brand from eating the line and let the nav breathe ── */
@media (max-width: 860px) {
  .theme-header__inner {
    flex-wrap: wrap;
    gap: 12px;
  }
  .theme-brand {
    font-size: clamp(20px, 6vw, 28px);
  }
  .theme-brand img {
    height: 40px !important;
  }
  .theme-header__inner .theme-nav {
    margin-inline-start: 0;
    flex-wrap: wrap;
    gap: 14px;
  }
}