/*
 * Shared header geometry contract.
 * The design compiler writes the values from Layout Settings to :root.
 * Keep this bridge independent of the selected Header component so a logo
 * and desktop menu spacing setting follows Header v0 through Header v4.
 */

@media (min-width: 901px) {
  body[data-deceti-header="header-v0"] .deceti-megamenu,
  body[data-deceti-header="header-v1"] .deceti-megamenu,
  body[data-deceti-header="header-v2"] .sd2-main-nav .deceti-megamenu,
  body[data-deceti-header="header-v3"] .cys3-menu,
  body[data-deceti-header="header-v4"] .ch4-menu {
    gap: var(--spacing-menu-gap, 12px) !important;
  }
}

body[data-deceti-header="header-v0"] .deceti-header-module--logo img,
body[data-deceti-header="header-v1"] .deceti-logo img,
body[data-deceti-header="header-v2"] .sd2-brand img,
body[data-deceti-header="header-v3"] .cys3-logo img,
body[data-deceti-header="header-v4"] .ch4-logo img {
  width: auto !important;
  max-width: var(--header-logo-max-width, 280px) !important;
  height: auto !important;
  max-height: var(--header-logo-max-height, 72px) !important;
  object-fit: contain;
}

/* Avoid a saved desktop size crowding the mobile Header controls. */
@media (max-width: 900px) {
  body[data-deceti-header] :is(.deceti-header-module--logo img, .deceti-logo img, .sd2-brand img, .cys3-logo img, .ch4-logo img) {
    max-width: min(var(--header-logo-max-width, 280px), 44vw) !important;
    max-height: min(var(--header-logo-max-height, 72px), 18vw) !important;
  }
}

/* Navigation geometry belongs to the shared layout contract, not to a
 * palette override. It preserves the original v0 item rhythm after the old
 * hover-color bridge is removed. */
@media (min-width: 901px) {
  body[data-deceti-header="header-v0"] .deceti-megamenu > li > a,
  body[data-deceti-header="header-v1"] .deceti-megamenu > li > a,
  body[data-deceti-header="header-v2"] .sd2-main-nav .deceti-megamenu > li > a,
  body[data-deceti-header="header-v3"] .cys3-menu > li > a,
  body[data-deceti-header="header-v4"] .ch4-menu > li > a {
    display: flex;
    align-items: center;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 12px !important;
  }
}