/* AlbaZone canonical header sync
   Reference: Home desktop header (.az-home-v3 .az-search-row)
   Purpose: make logo + search field + blue Search button visually identical
   on all standard non-Home pages without changing page logic. */

:root {
  --az-home-logo-blue: #1687d3;
  --az-home-logo-orange: #ff4a00;
  --az-home-search-blue: #0875e1;
  --az-home-text: #172033;
  --az-home-border: #d9dee5;
}

/* Standard generated navs and Product nav use the same white Home bar. */
html .az-global-nav,
html[data-theme="dark"] .az-global-nav,
html .product-nav,
html[data-theme="dark"] .product-nav {
  width: 100% !important;
  min-height: 96px !important;
  padding: 10px 42px !important;
  align-items: center !important;
  gap: 20px !important;
  background: #ffffff !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--az-home-border) !important;
  box-shadow: none !important;
  color: var(--az-home-text) !important;
}

html .az-global-nav {
  display: flex !important;
}

html .product-nav {
  display: grid !important;
  grid-template-columns: auto auto minmax(360px, 1fr) auto auto auto auto !important;
}

/* Same AlbaZone logo size and colors as Home. */
html .az-global-nav .az-nav-brand,
html[data-theme="dark"] .az-global-nav .az-nav-brand,
html .product-nav .product-brand,
html[data-theme="dark"] .product-nav .product-brand {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--az-home-logo-blue) !important;
  font-family: Arial, sans-serif !important;
  font-size: 44px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  letter-spacing: -1.5px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

html .az-global-nav .az-nav-brand span,
html[data-theme="dark"] .az-global-nav .az-nav-brand span,
html .product-nav .product-brand .brand-zone,
html[data-theme="dark"] .product-nav .product-brand .brand-zone {
  color: var(--az-home-logo-orange) !important;
}

html .product-nav .product-brand .brand-alba,
html[data-theme="dark"] .product-nav .product-brand .brand-alba {
  color: var(--az-home-logo-blue) !important;
}

/* Search group = Home-size search shell + separate blue Search button. */
html .az-global-nav .az-nav-search,
html[data-theme="dark"] .az-global-nav .az-nav-search,
html .product-nav .product-nav-search,
html[data-theme="dark"] .product-nav .product-nav-search {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(250px, 1fr) 190px !important;
  align-items: center !important;
  gap: 20px !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: none !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Search icon at the same left position as Home. */
html .az-global-nav .az-nav-search::before,
html[data-theme="dark"] .az-global-nav .az-nav-search::before,
html .product-nav .product-nav-search::before,
html[data-theme="dark"] .product-nav .product-nav-search::before {
  content: "⌕" !important;
  position: absolute !important;
  z-index: 2 !important;
  left: 18px !important;
  top: 50% !important;
  width: 24px !important;
  height: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transform: translateY(-50%) !important;
  color: #111827 !important;
  font-size: 24px !important;
  line-height: 1 !important;
  pointer-events: none !important;
}

html .az-global-nav .az-nav-search input,
html[data-theme="dark"] .az-global-nav .az-nav-search input,
html .product-nav .product-nav-search input,
html[data-theme="dark"] .product-nav .product-nav-search input {
  grid-column: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 46px !important;
  margin: 0 !important;
  padding: 0 18px 0 56px !important;
  border: 1px solid #172033 !important;
  border-radius: 32px !important;
  outline: 0 !important;
  background: #ffffff !important;
  color: var(--az-home-text) !important;
  font-family: Arial, sans-serif !important;
  font-size: 15px !important;
  box-shadow: none !important;
}

html .az-global-nav .az-nav-search input::placeholder,
html[data-theme="dark"] .az-global-nav .az-nav-search input::placeholder,
html .product-nav .product-nav-search input::placeholder,
html[data-theme="dark"] .product-nav .product-nav-search input::placeholder {
  color: #7a8494 !important;
  opacity: 1 !important;
}

html .az-global-nav .az-nav-search button,
html[data-theme="dark"] .az-global-nav .az-nav-search button,
html .product-nav .product-nav-search button,
html[data-theme="dark"] .product-nav .product-nav-search button {
  grid-column: 2 !important;
  width: 190px !important;
  min-width: 190px !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 0 38px !important;
  border: 0 !important;
  border-radius: 32px !important;
  background: var(--az-home-search-blue) !important;
  color: #ffffff !important;
  font-family: Arial, sans-serif !important;
  font-size: 0 !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transform: none !important;
}

html .az-global-nav .az-nav-search button::after,
html[data-theme="dark"] .az-global-nav .az-nav-search button::after,
html .product-nav .product-nav-search button::after,
html[data-theme="dark"] .product-nav .product-nav-search button::after {
  content: "Search" !important;
  font-size: 17px !important;
}

html .az-global-nav .az-nav-search button:hover,
html[data-theme="dark"] .az-global-nav .az-nav-search button:hover,
html .product-nav .product-nav-search button:hover,
html[data-theme="dark"] .product-nav .product-nav-search button:hover {
  background: #0668c8 !important;
  color: #ffffff !important;
  transform: none !important;
}

/* Keep remaining navigation actions readable on the same white bar. */
html .az-global-nav > a:not(.az-nav-brand),
html[data-theme="dark"] .az-global-nav > a:not(.az-nav-brand),
html .product-nav > a:not(.product-brand),
html[data-theme="dark"] .product-nav > a:not(.product-brand),
html .product-nav .theme-toggle,
html[data-theme="dark"] .product-nav .theme-toggle {
  color: var(--az-home-text) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
}

/* Header remains visually identical in Dark mode; page content still follows theme. */
html[data-theme="dark"] .az-global-nav,
html[data-theme="dark"] .product-nav {
  background: #ffffff !important;
}

/* Tablet: preserve the same proportions while avoiding overflow. */
@media (max-width: 1100px) and (min-width: 761px) {
  html .az-global-nav,
  html .product-nav {
    padding-left: 22px !important;
    padding-right: 22px !important;
    gap: 12px !important;
  }
  html .az-global-nav .az-nav-brand,
  html .product-nav .product-brand {
    font-size: 36px !important;
  }
  html .az-global-nav .az-nav-search,
  html .product-nav .product-nav-search {
    grid-template-columns: minmax(220px, 1fr) 140px !important;
    gap: 12px !important;
  }
  html .az-global-nav .az-nav-search button,
  html .product-nav .product-nav-search button {
    width: 140px !important;
    min-width: 140px !important;
    padding: 0 22px !important;
  }
  html .product-nav {
    grid-template-columns: auto minmax(0, 1fr) !important;
  }
  html .product-nav > a:not(.product-brand),
  html .product-nav .theme-toggle {
    display: none !important;
  }
  html .product-nav .product-nav-search {
    grid-column: 2 !important;
  }
}

/* Mobile follows Home's compact behavior: logo above a full-width search row. */
@media (max-width: 760px) {
  html .az-global-nav,
  html .product-nav {
    min-height: 112px !important;
    padding: 8px 12px !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    grid-template-rows: auto auto !important;
    gap: 8px 10px !important;
  }
  html .az-global-nav .az-nav-brand,
  html .product-nav .product-brand {
    grid-column: 1 !important;
    grid-row: 1 !important;
    font-size: 28px !important;
  }
  html .az-global-nav .az-nav-search,
  html .product-nav .product-nav-search {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    grid-template-columns: minmax(0, 1fr) 68px !important;
    gap: 8px !important;
    width: 100% !important;
  }
  html .az-global-nav .az-nav-search button,
  html .product-nav .product-nav-search button {
    width: 68px !important;
    min-width: 68px !important;
    padding: 0 !important;
  }
  html .az-global-nav .az-nav-search button::after,
  html .product-nav .product-nav-search button::after {
    content: "⌕" !important;
    font-size: 22px !important;
  }
  html .az-global-nav > a:not(.az-nav-brand),
  html .az-global-nav > button,
  html .product-nav > a:not(.product-brand),
  html .product-nav .theme-toggle {
    display: none !important;
  }
}

/* 2026-08-13: typography-only sync for top utility bars; no layout/function changes. */
.az-utility-bar,
.az-utility-bar a,
.az-utility-bar button,
.az-home-v3 .az-utility-bar,
.az-home-v3 .az-utility-bar a,
.az-home-v3 .az-utility-bar button {
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 12px !important;
  font-style: normal !important;
  font-weight: 400 !important;
}