/* CityNews Royal 3.0: final layout fixes. Loaded after the legacy 2.8/2.9 rules. */

/* ONE sticky navigation: original WordPress secondary menu and mode switch. */
body.ukr-royal .top-header {
  display: flex !important;
  align-items: stretch !important;
  flex-wrap: nowrap;
  padding: 0 clamp(10px, 2vw, 26px) !important;
  gap: 10px;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 52px;
  position: sticky !important;
  top: 0;
  z-index: 10000;
  margin: 0;
  box-sizing: border-box;
}
body.ukr-royal.admin-bar .top-header { top: 32px; }
body.ukr-royal .top-header > .top-header-menu {
  order: 1;
  display: flex;
  align-items: stretch;
  flex: 1 1 auto;
  width: auto !important;
  min-width: 0;
  max-width: none !important;
  margin: 0;
  padding: 0;
  overflow-x: auto;
  overflow-y: hidden;
}
body.ukr-royal .top-header-menu ul.top-header-nav {
  margin: 0;
  align-items: center;
}
body.ukr-royal .ukr-top-tools {
  order: 2;
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  padding: 0 4px 0 0;
}
body.ukr-royal .ukr-top-tools .ukr-mode-toggle {
  display: inline-flex !important;
  min-height: 35px;
  padding: 5px 13px;
  border-radius: 18px;
  color: #fff2ce;
  border: 1px solid rgba(227,195,136,.65);
  background: rgba(255,255,255,.07);
  font-size: 12px;
  cursor: pointer;
}
body.ukr-royal .ukr-top-tools .ukr-mode-toggle__text { display: inline !important; }
body.ukr-royal .top-header > .toggle-search {
  order: 3;
  display: flex !important;
  flex: 0 0 48px;
  justify-content: center;
  align-items: center;
  min-width: 48px;
  min-height: 48px;
  margin: 0 !important;
  padding: 0 !important;
  float: none;
  cursor: pointer;
}
body.ukr-royal .ukr-nav-row { display: none !important; }

/* Crisp header typography, fitted wholly within the upper sky. */
body.ukr-royal header.ukr-site-header .ukr-headvisual {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
}
body.ukr-royal header.ukr-site-header .ukr-headcopy,
body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headcopy {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: min(96%, 1210px) !important;
  max-width: 96% !important;
  min-width: 0 !important;
  margin: 6px auto 0 !important;
  padding: 0 6px !important;
  transform: none !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: visible !important;
  text-align: center;
  align-items: center;
  justify-content: flex-start;
}
body.ukr-royal header.ukr-site-header .ukr-headcopy::before { display: none !important; }
body.ukr-royal header.ukr-site-header .ukr-headcopy__title,
body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headcopy__title {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-weight: 700 !important;
  font-size: clamp(22px, 2vw, 34px) !important;
  line-height: 1.06 !important;
  letter-spacing: .125em !important;
  word-spacing: .085em !important;
  white-space: normal;
  text-transform: uppercase;
  color: #0a2d53;
  text-shadow: 0 1px 2px rgba(240,249,255,.93), 0 0 8px rgba(240,249,255,.6);
}
body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headcopy__title {
  color: #fff7e5;
  text-shadow: 0 2px 5px rgba(0,4,15,.9);
}
body.ukr-royal header.ukr-site-header .ukr-headcopy__divider,
body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headcopy__divider {
  display: block !important;
  flex: 0 0 auto;
  width: min(70%, 580px) !important;
  height: 0;
  margin: 6px auto 5px !important;
  border: 0 !important;
  border-top: 1.5px solid #a87b3a !important;
}
body.ukr-royal header.ukr-site-header .ukr-headcopy__portal,
body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headcopy__portal {
  display: block !important;
  width: auto;
  margin: 0 !important;
  font: 700 clamp(12px, 1.08vw, 17px)/1.12 Georgia, 'Times New Roman', serif !important;
  letter-spacing: .04em !important;
  color: #142d4c;
  text-shadow: 0 1px 2px #e9f5ff, 0 0 6px rgba(255,255,255,.78);
}
body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headcopy__portal {
  color: #fff1ce;
  text-shadow: 0 2px 4px #030d1f;
}
/* Preserve correct sky image + distinct crest area, replace just the stars/moon artwork. */
body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headvisual {
  background: #0a1d37 url('img/night-header-clear-sky.webp') center / 100% 100% no-repeat !important;
}

/* FULL-WIDTH hero directly after header, never offset/overlapped by menus. */
body.ukr-royal header.ukr-site-header .ukr-home-hero {
  display: block !important;
  position: relative !important;
  float: none !important;
  clear: both;
  width: 100% !important;
  max-width: none !important;
  height: 170px !important;
  min-height: 170px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}
body.ukr-royal:not(.ukr-theme-night) header.ukr-site-header .ukr-home-hero {
  background-image:
    linear-gradient(90deg, rgba(250,247,239,.63) 0%,rgba(250,247,239,.27) 39%,rgba(250,247,239,0) 66%),
    url('img/day-hero-clean.webp') !important;
}
body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-home-hero {
  background-image:
    linear-gradient(90deg,rgba(6,19,37,.68) 0%,rgba(6,19,37,.30) 39%,rgba(6,19,37,0) 66%),
    url('img/night-hero-clean.webp') !important;
}
body.ukr-royal header.ukr-site-header .ukr-home-hero__content {
  display: flex !important;
  flex-direction: row !important;
  justify-content: flex-start !important;
  align-items: center !important;
  float: none !important;
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: min(100% - 32px, 1500px) !important;
  max-width: 1500px !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 8px 0 !important;
  text-align: left;
}
body.ukr-royal header.ukr-site-header .ukr-home-hero__text,
body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-home-hero__text {
  position: static !important;
  display: flex !important;
  flex: 0 1 610px !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: min(600px, 63vw) !important;
  max-width: min(600px, 63vw) !important;
  max-height: 154px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 8px 16px !important;
  overflow: hidden !important;
  background: rgba(255,251,243,.9) !important;
  border: 1px solid rgba(191,155,92,.35) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 13px rgba(5,28,50,.12) !important;
  transform: none !important;
}
body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-home-hero__text {
  background: rgba(8,24,44,.91) !important;
}
body.ukr-royal header.ukr-site-header .ukr-home-hero__title {
  font-size: clamp(18px, 2vw, 27px) !important;
  line-height: 1.02 !important;
  margin: 1px 0 3px !important;
}
body.ukr-royal header.ukr-site-header .ukr-home-hero__kicker { font-size: 9px !important; margin: 0 0 2px !important; }
body.ukr-royal header.ukr-site-header .ukr-home-hero__lead { font-size: 11px !important; line-height: 1.21 !important; margin: 0 0 4px !important; }
body.ukr-royal header.ukr-site-header .ukr-hero-button { min-height: 27px !important; height: 27px !important; font-size: 10px !important; }

/* Restore a real search icon. Support BOTH WordPress classic and block widgets. */
body.ukr-royal .widget_search input[type='submit'],
body.ukr-royal .widget_search button[type='submit'],
body.ukr-royal .widget #searchsubmit,
body.ukr-royal .widget .searchSubmit,
body.ukr-royal .wp-block-search__button,
body.ukr-royal .ukr-search-submit {
  flex: 0 0 54px !important;
  min-width: 54px !important;
  width: 54px !important;
  height: 52px !important;
  min-height: 52px !important;
  padding: 0 !important;
  background-color: #234361 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round'%3E%3Ccircle cx='10.7' cy='10.7' r='7.1'/%3E%3Cpath d='m16 16 5 5'/%3E%3C/svg%3E") !important;
  background-position: center !important;
  background-size: 23px 23px !important;
  background-repeat: no-repeat !important;
  color: transparent !important;
  font-size: 0 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
body.ukr-royal .widget_search .ukr-search-submit svg {
  display: block !important;
  width: 23px;
  height: 23px;
  margin: 0 auto;
  color: #fff;
  stroke: currentColor;
}
body.ukr-royal .ukr-search-form {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 10px;
}
body.ukr-royal .ukr-search-form label { flex: 1 1 auto; min-width: 0; }
body.ukr-royal .ukr-search-form input[type='search'] {
  width: 100%;
  height: 52px;
  padding: 10px 12px;
  color: var(--ukr-text);
  background: var(--ukr-card-soft);
  border: 1px solid var(--ukr-line);
  border-radius: 9px;
  font: inherit;
}
body.ukr-royal.ukr-theme-night .ukr-search-form input[type='search'] { color:#f0f3f9; }

@media(max-width: 900px) {
  body.ukr-royal header.ukr-site-header .ukr-headcopy__title,
  body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headcopy__title {
    font-size: clamp(16px, 3.1vw, 26px) !important;
    letter-spacing: .07em !important;
  }
  body.ukr-royal header.ukr-site-header .ukr-home-hero__text { width: min(600px,70vw) !important; max-width: min(600px,70vw) !important; }
}
@media(max-width: 760px) {
  body.ukr-royal.admin-bar .top-header { top: 46px; }
  body.ukr-royal .top-header { min-height: 44px; gap: 3px; padding: 0 5px !important; }
  body.ukr-royal .top-header > .toggle-search { flex-basis: 40px; min-width:40px; min-height:40px; }
  body.ukr-royal .ukr-top-tools .ukr-mode-toggle { padding: 5px 9px; min-height: 34px; }
  body.ukr-royal .ukr-top-tools .ukr-mode-toggle__text { display: none !important; }
  body.ukr-royal header.ukr-site-header .ukr-headcopy,
  body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headcopy {
    width: calc(100% - 4px) !important;
    max-width: calc(100% - 4px) !important;
    margin-top: 10px !important;
    padding: 0 2px !important;
  }
  body.ukr-royal header.ukr-site-header .ukr-headcopy__title,
  body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headcopy__title {
    font-size: clamp(13px, 3.2vw, 19px) !important;
    letter-spacing: .015em !important;
    line-height: 1.12 !important;
  }
  body.ukr-royal header.ukr-site-header .ukr-headcopy__divider { margin: 5px auto 4px !important; }
  body.ukr-royal header.ukr-site-header .ukr-headcopy__portal,
  body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headcopy__portal {
    font-size: clamp(10px, 2.3vw, 13px) !important;
    letter-spacing: 0 !important;
  }
  body.ukr-royal header.ukr-site-header .ukr-home-hero__text { width: min(95%,500px) !important; max-width: min(95%,500px) !important; }
  body.ukr-royal header.ukr-site-header .ukr-home-hero__lead { display: none !important; }
  body.ukr-royal header.ukr-site-header .ukr-home-hero__title { font-size: clamp(19px,4vw,24px) !important; }
}
@media(max-width: 480px) {
  body.ukr-royal header.ukr-site-header .ukr-home-hero__text { padding: 9px 12px !important; }
}

/* Header copy above the skyline (specifically on bright sky, not the water). */
@media (min-width: 901px) {
  body.ukr-royal header.ukr-site-header .ukr-headcopy,
  body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headcopy { margin-top: 0 !important; }
  body.ukr-royal header.ukr-site-header .ukr-headcopy__title,
  body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headcopy__title {
    font-size: clamp(22px, 1.62vw, 30px) !important;
    line-height: 1 !important;
    letter-spacing: .15em !important;
  }
  body.ukr-royal header.ukr-site-header .ukr-headcopy__divider,
  body.ukr-royal.ukr-theme-night header.ukr-site-header .ukr-headcopy__divider {
    margin: 3px auto 3px !important;
  }
}
@media (max-width: 480px) {
  body.ukr-royal { overflow-x: clip; }
  body.ukr-royal .top-header { max-width:100vw !important; }
  body.ukr-royal .top-header-menu { max-width: calc(100vw - 105px) !important; }
}
