/* Indizio – kompaktowy header, karta produktu. v1.3.2
   Uruchamiane wyłącznie przez klasę .hdr-compact dodawaną do #tbp_header
   przez JS po przewinięciu strony (patrz indizio-header-compact.js). */

/* Wyłącza scroll anchoring przeglądarki - bez tego zmiana wysokości headera
   (sticky, więc nadal w przepływie dokumentu) powoduje że przeglądarka
   automatycznie koryguje scrollY, co przy progu z JS dawało nieskończone
   miganie pełny/kompaktowy header. */
html {
  overflow-anchor: none;
}

/* ---------- WSPÓLNE (desktop + mobile): logo mniejsze, ikony znikają płynnie ---------- */
#tbp_header .module-site-logo {
  transition: padding-bottom .25s ease;
}
#tbp_header .module-site-logo img {
  height: 73px;
  width: auto;
  transition: height .25s ease;
}
#tbp_header.hdr-compact .module-site-logo {
  padding-bottom: 0 !important;
}
#tbp_header.hdr-compact .module-site-logo img {
  height: 28px !important;
}

/* UWAGA: .row_inner wewnątrz wiersza 2 to CSS GRID (nie flexbox) - szerokości
   kolumn kontroluje grid-template-columns na rodzicu, NIE width/flex-basis
   na samych kolumnach (to ostatnie nie działa i łamie ikonki w wielowierszowy
   stos, rozdymając wysokość wiersza). */
#tbp_header .tb_her3491 .row_inner {
  transition: grid-template-columns .25s ease, column-gap .25s ease;
}
#tbp_header.hdr-compact .tb_her3491 .row_inner {
  /* 0fr (nie 0px!) - kolumny bazowe są w fr (patrz --col), a mieszanie
     fr/px w grid-template-columns uniemożliwia przeglądarce płynną
     interpolację (nieinterpolowalne typy = skok w połowie animacji,
     kolumny z ikonami chwilowo łamią się w wielowierszowy stos i
     rozdymają wysokość headera przy rozwijaniu - patrz uwaga wyżej). */
  grid-template-columns: 0fr 1fr 0fr !important;
  column-gap: 0px !important;
}

/* Kolumny z ikonami (social - lewa, wishlist/konto/koszyk - prawa) - zawartość
   znika przez opacity (płynnie), same kolumny i tak schodzą do 0 szerokości
   dzięki grid-template-columns powyżej. */
#tbp_header .tb_her3491 .module_column:first-child,
#tbp_header .tb_her3491 .module_column:last-child {
  /* max-height stałe (nie tylko w compact!) - bez tego, w trakcie animacji
     grid-template-columns kolumna przejściowo ma złą (zbyt wąską) szerokość,
     ikonki łamią się w drugi wiersz i - skoro nic tego nie ogranicza -
     rozdymają wysokość całego headera zanim szerokość się ustabilizuje
     (widoczne jako skok przy rozwijaniu). 48px = naturalna wysokość
     jednowierszowej zawartości tej kolumny w stanie pełnym. */
  max-height: 48px;
  overflow: hidden;
  opacity: 1;
  transition: opacity .15s ease, padding .25s ease;
}
#tbp_header.hdr-compact .tb_her3491 .module_column:first-child,
#tbp_header.hdr-compact .tb_her3491 .module_column:last-child {
  opacity: 0 !important;
  pointer-events: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
}

/* Szukajka zostaje - grid-template-columns (1fr w środku) sam rozciąga ją
   na całą dostępną szerokość, tu tylko doprecyzowujemy odstępy. */
#tbp_header .tb_her3491 .module_column:nth-child(2) {
  transition: padding .25s ease;
}
#tbp_header .dgwt-wcas-search-input {
  height: 46px;
  transition: height .25s ease, padding .25s ease;
}
#tbp_header.hdr-compact .dgwt-wcas-search-input {
  height: 34px !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

/* ---------- DESKTOP (>=1025px): wiersz kategorii zostaje - to jedyna nawigacja ---------- */
@media screen and (min-width: 1025px) {
  #tbp_header.hdr-compact .tb_her3491 .module_column:nth-child(2) {
    padding: 0 40px !important;
  }
}

/* ---------- MOBILE/TABLET (<=1024px): wiersz kategorii znika płynnie
   (nawigacja jest już w hamburgerze RMP) ---------- */
@media screen and (max-width: 1024px) {
  #tbp_header .tb_z1bn5 {
    max-height: 60px;
    opacity: 1;
    overflow: hidden;
    transition: max-height .3s ease, opacity .25s ease, padding .3s ease;
  }
  #tbp_header.hdr-compact .tb_z1bn5 {
    max-height: 0 !important;
    opacity: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  #tbp_header.hdr-compact .tb_her3491 .module_column:nth-child(2) {
    padding: 0 16px 0 60px !important; /* zapas z lewej na przycisk hamburgera */
  }
}