/* VERSION-CONTROL
////////////////////////////////////////////////////////////////////////
// dekro-ui-534.css
// v1.0.0 (27.08.2026) - APro 3.3.4
// Poprawki UI po klik-tescie Damiana (ADVERTPR-534): sticky menu w 1 wierszu
// + spojna rodzina przycisku „Kup TERAZ".
// last edited by: klaudiusz@localhost
// author: Damian Pakuła (d.pakula@advertpro.co)
////////////////////////////////////////////////////////////////////////
//
// DLACZEGO OSOBNY PLIK, a nie edycja extra.css:
// extra.css jest zarzadzany przez partnera i synchronizowany PROD -> DEV. Kazda zmiana
// w nim zostalaby nadpisana albo nadpisalaby cudza prace. Ten plik ladowany jest PO
// extra.css (airi.php::getHead), wiec wygrywa kolejnoscia bez podbijania specyficznosci
// tam, gdzie nie trzeba. Rollback = usuniecie jednej linii <link> z getHead.
//
// Przy okazji zauwazone w extra.css:3604 — `flex-wrap: wrap;code` (literalne "code"
// wklejone w wartosc). Nie ruszam, bo to plik partnera; zgloszone w raporcie.
//////////////////////////////////////////////////////////////////////// */

/* ═══════════════════════════════════════════════════════════════════════
   1. STICKY MENU — NIGDY wiecej niz 1 wiersz
   ═══════════════════════════════════════════════════════════════════════
   Zmierzone na produkcji 27.08 (1366 px): lista dostawala 1156 px, a pozycje
   potrzebowaly 1367 px -> `flex-wrap: wrap` z extra.css lamal menu na 2 wiersze
   i ikony (lupa/konto/koszyk) ladowaly w innej linii niz pozycje.

   Zabezpieczenie trojwarstwowe — kazda warstwa dziala samodzielnie:
     (a) nowrap  — twarda gwarancja, ze pozycje NIGDY nie zawina;
     (b) clamp() — plynna kondensacja odstepow zamiast progow skokowych; reaguje
         tez tam, gdzie media query nie siega (np. gdy panel koszyka zwezi obszar);
     (c) prog    — ponizej 1400 px menu desktopowe w ogole sie nie pokazuje,
         przejmuje hamburger. Bez tego nowrap wypychalby pozycje poza viewport
         (zmierzone przy 1320 px: prawa krawedz 1348 px przy oknie 1320 px).       */

.dekro-megamenu__list {
  flex-wrap: nowrap !important;   /* (a) */
  min-width: 0;                   /* pozwala kurczyc sie wewnatrz flexa rodzica */
}

.dekro-megamenu__item {
  flex: 0 0 auto;
  min-width: 0;
}

/* (b) Kondensacja odstepow: 9 px przy szerokim oknie -> 3 px przy ciasnym. */
.dekro-megamenu__item > a {
  padding-left: clamp(3px, 0.5vw, 9px) !important;
  padding-right: clamp(3px, 0.5vw, 9px) !important;
  white-space: nowrap !important;
}

/* (b2) Ponizej 1620 px sam padding nie wystarcza. Zmierzone: przy 1440 px menu po
   samym `nowrap` rozpychalo sie do 1444 px i WYPYCHALO ikony poza ekran (left 1444
   przy oknie 1440) — czyli problem zmienial postac, zamiast znikac. Mocniejsza
   kondensacja (padding do 2 px + 10.5 px czcionki) sciaga menu do 1258 px, wiec
   ikony wracaja do kadru: 1258-1418 px. Ponizej progu z punktu (c) i tak wchodzi
   hamburger, wiec ten zakres obejmuje tylko 1400-1620 px. */
@media (max-width: 1620px) {
  .dekro-megamenu__item > a {
    padding-left: clamp(2px, 0.28vw, 9px) !important;
    padding-right: clamp(2px, 0.28vw, 9px) !important;
    font-size: 10.5px !important;
  }
}

/* Ikony po prawej trzymaja sie tej samej linii co pozycje menu. */
.header-toolbar {
  flex-wrap: nowrap !important;
  align-items: center;
}

/* (c) Prog przelaczenia na hamburger. Menu desktopowe wymaga ~1420 px razem
   z ikonami; ponizej pokazywanie go konczy sie albo zawijaniem, albo wyjazdem
   poza ekran. Oba warianty sa gorsze od hamburgera.                          */
@media (max-width: 1399.98px) {
  .main-navigation.dekro-megamenu-nav { display: none !important; }
  .header-toolbar__item.dekro-menu-trigger,
  .header-toolbar__item.d-xxl-none { display: block !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   2. „KUP TERAZ" — jedna rodzina ksztaltu i rozmiaru
   ═══════════════════════════════════════════════════════════════════════
   Zmierzone przed poprawka (produkcja, ta sama strona):
     karta:  Dodaj 60 px / Kup 70 px, font 14 px vs 14.95 px
     sticky: Dodaj 49 px / Kup 27 px (!), text-transform: none vs uppercase
   Zrodlo rozjazdu: karta miala `font-size: inherit` (dziedziczyla po rodzicu
   zamiast wyrownac do .btn), a sticky ustawial wysokosc jednorazowo w JS
   (`buyBtn.style.height = addBtn.offsetHeight`) — gdy w tym momencie sasiad nie
   mial jeszcze finalnej wysokosci, zostawala pigulka 27 px.

   Rozwiazanie: jedna klasa `.dekro-buy-now` uzywana w OBU miejscach, wysokosc
   z CSS (align-self: stretch), zero mierzenia w JS.                            */

:root {
  /* Kolor CTA w jednym miejscu — podmiana wariantu to zmiana tych dwoch linii. */
  --dekro-buy-now-bg: #4a2328;
  --dekro-buy-now-bg-hover: #a14659;
  --dekro-buy-now-fg: #fff;
  --dekro-buy-now-radius: 12px;
}

.dekro-buy-now {
  background: var(--dekro-buy-now-bg);
  border: none;
  color: var(--dekro-buy-now-fg);
  border-radius: var(--dekro-buy-now-radius);
  font-weight: 700;
  font-size: 14px;             /* rowno z „Dodaj do koszyka", nie `inherit` */
  line-height: 1.2;
  letter-spacing: .2px;        /* rowno z „Dodaj do koszyka" */
  text-transform: uppercase;   /* sticky mial `none` — stad inny ksztalt liter */
  cursor: pointer;
  transition: background-color .15s ease, opacity .15s ease;
}

.dekro-buy-now:hover:not(.disabled):not([disabled]) {
  background: var(--dekro-buy-now-bg-hover);
  color: var(--dekro-buy-now-fg);
}

.dekro-buy-now.disabled,
.dekro-buy-now[disabled] { opacity: .45; cursor: not-allowed; pointer-events: none; }
.dekro-buy-now.running   { opacity: .7;  cursor: wait;        pointer-events: none; }

/* Wariant „karta produktu": pelna szerokosc pod „Dodaj do koszyka".
   font-size/letter-spacing powtorzone celowo: `.btn` z main.css ma 1.4rem, a stara regula
   `.add-to-cart-form .buy-now` (usuwana z product_variant w tym samym wdrozeniu) miala
   `font-size: inherit`. Selektor dwuklasowy + pozniejsza kolejnosc ladowania daja pewnosc,
   ze przycisk zostanie przy 14 px nawet gdyby ktoras z tamtych regul gdzies przetrwala. */
.add-to-cart-form .dekro-buy-now {
  width: 100%;
  min-height: 60px;            /* tyle samo co .add-to-cart w karcie */
  padding: 16px 24px;
  margin-top: 10px;
  font-size: 14px;
  letter-spacing: .2px;
}

/* Wariant „sticky": obok „Dodaj do koszyka", wysokosc z flexa — nie z JS. */
.sticky-cart-desktop .dekro-buy-now,
[class*="sticky-cart"] .dekro-buy-now {
  align-self: stretch;         /* rowna sie do sasiada bez mierzenia w JS */
  min-height: 0;
  padding: 0 22px;
  margin-left: 10px;
  margin-top: 0;
  width: auto;
  white-space: nowrap;
}

/* Podpis pod CTA w karcie — zostaje bez zmian, tylko domykamy odstep. */
.add-to-cart-form .buy-now-hint {
  display: block;
  margin-top: 6px;
  text-align: center;
  font-size: 12px;
  color: #777;
  line-height: 1.3;
}
