/**
 * Vergleich-Hub: gleicher oberer Header wie PDP (catalog_product_minimal) — weiße Leiste, kein Teal-Gradient.
 * Wird nach style.css + catalog-product-page.css geladen; nur body.page-vergleich.
 */

/* style.css setzt .site-header__category { order:2 } ohne Media Query — bei order:0 auf den übrigen
   Zeilen-Elementen rutscht „Kategorien“ ans Ende (rechts neben Profil). Desktop: order zurücksetzen. */
@media (min-width: 761px) {
  body.page-vergleich .site-header--compact.site-header--decision .site-header__top .site-header__category {
    order: 0 !important;
  }
}

body.page-vergleich > header.site-header.site-header--compact.site-header--decision {
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
  box-shadow: 0 6px 24px rgba(15, 23, 42, 0.05) !important;
  color: #0f172a !important;
  backdrop-filter: saturate(180%) blur(14px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(14px) !important;
}

/* Global #breadcrumbs in style.css ist fürs alte Gradient-Header (weiße Link-Linie) — auf PDP-Weiß: grau wie Detailseite */
body.page-vergleich .site-header__crumbs,
body.page-vergleich nav#breadcrumbs.site-header__crumbs {
  color: #64748b !important;
  opacity: 1 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}
body.page-vergleich .site-header__crumbs a,
body.page-vergleich #breadcrumbs a {
  color: #64748b !important;
  border-bottom: none !important;
  text-decoration: none !important;
}
body.page-vergleich .site-header__crumbs a:hover,
body.page-vergleich #breadcrumbs a:hover {
  color: #0f172a !important;
  opacity: 1 !important;
}
body.page-vergleich .site-header__crumbSep,
body.page-vergleich #breadcrumbs .bc-sep {
  color: #cbd5e1 !important;
  opacity: 1 !important;
}
body.page-vergleich .site-header__crumbCurrent,
body.page-vergleich #breadcrumbs .bc-current {
  color: #334155 !important;
  opacity: 1 !important;
}

/* Hauptbereich: nur leicht kühler/grauer als Weiß (catalog-product-page: body --bg #fff) */
body.page-vergleich {
  background-color: #f5f6f8 !important;
}
