/* One compact, consistent header on every page and screen size (loaded last).
   ≤1180px (≤1320px on inner pages): menu button instead of the full navigation.
   ≤760px (phones): two rows — row 1: logo + my requests, account, language;
   row 2: menu button + a wide search bar (row break element added by header-fit.js). Favourites stay beside My requests. */
@media (max-width: 1180px) {
  .site-header .desktop-nav, .ge-header .ge-nav { display: none !important; }
  .site-header .menu-button, .ge-header .ge-menu { display: inline-grid !important; place-items: center; }
  .header-tool small, .ge-tool small, .global-search-trigger small { display: none !important; }
  .header-actions, .ge-actions { margin-inline-start: auto !important; }
}
@media (max-width: 1320px) {
  .ge-header .ge-nav { display: none !important; }
  .ge-header .ge-menu { display: inline-grid !important; place-items: center; }
  .ge-header .ge-actions { margin-inline-start: auto !important; }
}
@media (min-width: 1321px) and (max-width: 1560px) {
  .ge-tool small, .ge-header .global-search-trigger small { display: none !important; }
  .ge-header .ge-nav a { white-space: nowrap; }
}
.hf-break { display: none; }

@media (max-width: 760px) {
  .site-header, .ge-header {
    display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-start !important;
    column-gap: 8px !important; row-gap: 10px !important; padding: 10px 14px !important; box-sizing: border-box;
  }
  /* the tools become direct items of the header so they can sit on two rows */
  .header-actions, .ge-actions { display: contents !important; }
  /* row 1 */
  .site-header .brand, .ge-header .ge-logo { order: 1; flex: 0 0 auto !important; display: flex !important; align-items: center; margin: 0 !important; margin-inline-end: auto !important; padding: 0 !important; }
  .site-header .brand-logo, .ge-header .ge-logo img { display: block; height: 46px !important; width: auto !important; max-width: 140px !important; object-fit: contain; }
  #favorites-button, .ge-actions .ge-tool[href*="favorites"] { order: 2; }
  #rfq-button, .ge-actions .ge-tool[href*="requests"] { order: 3; }
  .header-actions .ge-account, .ge-actions .ge-account { order: 4; }
  #language, .ge-language { order: 5; }
  .header-tool, .ge-tool, .site-header .menu-button, .ge-header .ge-menu {
    flex: 0 0 auto !important; width: 40px !important; height: 40px !important; min-width: 40px !important; min-height: 40px !important; padding: 0 !important; margin: 0 !important;
    display: inline-grid !important; place-items: center !important; position: relative !important; border-radius: 12px !important; font-size: 1.05rem !important; box-sizing: border-box;
  }
  .header-tool > b, .ge-tool > b { position: absolute !important; top: -6px !important; left: auto !important; right: -6px !important; bottom: auto !important; width: auto !important; min-width: 18px !important; max-width: 30px; height: 18px !important; padding: 0 5px !important; font-size: .68rem !important; line-height: 18px !important; border-radius: 9px !important; text-align: center; box-sizing: border-box; }
  [dir=rtl] .header-tool > b, [dir=rtl] .ge-tool > b { right: auto !important; left: -6px !important; }
  #language, .ge-language { flex: 0 0 auto !important; width: 58px !important; min-width: 58px !important; height: 40px !important; padding: 0 6px !important; margin: 0 !important; font-size: .85rem !important; border-radius: 12px !important; }
  /* row 2: menu + search bar */
  .hf-break { display: block !important; order: 9; flex: 0 0 100% !important; height: 0; margin: 0 !important; }
  .site-header .menu-button, .ge-header .ge-menu { order: 10; width: 46px !important; height: 46px !important; min-width: 46px !important; font-size: 1.3rem !important; }
  .site-header .global-search-trigger, .ge-header .global-search-trigger {
    order: 11; flex: 1 1 0 !important; min-width: 0 !important; height: 46px !important; margin: 0 !important; padding: 0 14px !important;
    display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important;
    border: 1.5px solid #cfe0ee !important; border-radius: 14px !important; background: #f5f9fd !important; color: #5b7286 !important; box-sizing: border-box;
  }
  .global-search-trigger > span { font-size: 1.3rem !important; color: #0750AD !important; line-height: 1; }
  .global-search-trigger small { display: inline !important; font-weight: 600 !important; font-size: .95rem !important; color: #5b7286 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mobile-nav, .ge-mobile { order: 20; }
  .site-header .mobile-nav { top: calc(100% + 6px) !important; }
  .mobile-nav.open, .ge-mobile.open { max-height: calc(100vh - 130px); overflow-y: auto; }
  .ge-account .ge-avatar { font-size: 1rem; }
}
@media (max-width: 420px) {
  .site-header, .ge-header { padding: 10px 12px !important; column-gap: 6px !important; }
  .site-header .brand-logo, .ge-header .ge-logo img { height: 42px !important; max-width: 112px !important; }
  .header-tool, .ge-tool { width: 38px !important; height: 38px !important; min-width: 38px !important; min-height: 38px !important; }
  #language, .ge-language { width: 52px !important; min-width: 52px !important; height: 38px !important; font-size: .8rem !important; }
}
@media (max-width: 380px) {
  .site-header, .ge-header { padding: 8px 10px !important; column-gap: 5px !important; }
  .site-header .brand-logo, .ge-header .ge-logo img { height: 38px !important; max-width: 100px !important; }
  .header-tool, .ge-tool { width: 35px !important; height: 35px !important; min-width: 35px !important; min-height: 35px !important; border-radius: 10px !important; }
  #language, .ge-language { width: 48px !important; min-width: 48px !important; height: 35px !important; padding: 0 3px !important; }
}
/* very small phones: the account link moves into the menu */
@media (max-width: 349px) {
  .header-actions .ge-account, .ge-actions .ge-account { display: none !important; }
  .site-header .brand-logo, .ge-header .ge-logo img { max-width: 96px !important; }
}
/* links added to the phone menu by header-fit.js */
.hf-extra { display: flex !important; align-items: center; gap: 8px; }
.hf-extra b { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: #0750AD; color: #fff; font-size: .72rem; line-height: 20px; text-align: center; }
.hf-extra.hf-phone { display: none !important; }
@media (min-width: 350px) { .hf-extra.hf-small { display: none !important; } }

.hf-heart { display: inline-grid !important; place-items: center; line-height: 0 !important; color: #0750AD; }
.hf-heart svg { display: block; }