/*
 * Liikye - zwykla strona (page.php): pas pod naglowkiem sklepu i kolumna tresci na szerokosc kontenera sklepu (1200 px).
 * Szerokosc od 0.20.6 (decyzja Mateusza 29.10.2026: kolumna 720 px z makiet byla zbyt ciasna wzgledem strony): tekst i wnetrze
 * pasa maja te sama geometrie co .lk-kontener, wiec okruszki, tytul i tekst zaczynaja sie rowno z logo w naglowku sklepu.
 * Plan wpisu i zwyklej strony liikye 28.10.2026, zadanie B6. Wymiary i kolory z generatorow makiet
 * (docs/superpowers/makiety/blog-2026-10-28/narzedzia/generuj_k.py pas_strony(), CSS4 .m-pas-reg*), stany E4-01 .. E4-06.
 * Do 900 px uklad telefonu (tablet 768 tez), od 901 px uklad komputera (punkt zlamania menu motywu, D6).
 * Ladowany tylko na zwyklej stronie (inc/strona-ogolna.php); elementy tresci (naglowki, listy, tabele) w liikye-tresc.css.
 * Selektory pasa maja dwie klasy: body ma klase lk-tresc (inc/setup.php), wiec reguly typu ".lk-tresc p" z arkusza tresci
 * siegaja takze poza kolumne tresci, a pas ma zostac nietkniety.
 */

/* --------------------------------------------------------------------------
   Pas (Z9): okruszki, H1, zajawka, data. Tlo ink-50 i linia ink-200; z obrazkiem wyroznijacym
   (--grafika) tlo to rozmyty obrazek pod ciemna nakladka, bialy tekst i bez linii.
   -------------------------------------------------------------------------- */

.lk-pas-strony {
  position: relative;
  overflow: hidden;
  background: var(--surface-sunken);
  border-block-end: 1px solid var(--border-subtle);
  /* Interlinia strony jak w body (makieta), niezalezna od arkusza tresci. */
  line-height: 1.6;
  /* Dlugie slowo w tytule (niemieckie zlozenia) albo adres w zajawce lamie sie, nie rozpycha strony. */
  overflow-wrap: break-word;
}

.lk-pas-strony--grafika { border-block-end: 0; }

/* Obrazek jest wiekszy od pasa (30 px z kazdej strony i skala 1,1), zeby rozmycie nie zostawialo jasnych
   krawedzi; pas ucina nadmiar (overflow: hidden). Regula img { max-width: 100% } z liikye.css przegrywa z tym
   selektorem, wiec rozmiar jest taki, jak tu zapisano. */
.lk-pas-strony .lk-pas-strony__tlo {
  position: absolute;
  inset: -30px;
  inline-size: calc(100% + 60px);
  block-size: calc(100% + 60px);
  max-inline-size: none;
  object-fit: cover;
  object-position: center;
  filter: blur(14px);
  transform: scale(1.1);
}

.lk-pas-strony .lk-pas-strony__ciemno {
  position: absolute;
  inset: 0;
  background: rgba(14, 15, 17, 0.62);
}

/* Wnetrze pasa w tej samej kolumnie co tresc: geometria .lk-kontener z liikye.css (do 1200 px z marginesem bocznym sklepu),
   zeby lewa krawedz okruszkow i tytulu byla ta sama co logo w naglowku. */
.lk-pas-strony .lk-pas-strony__w {
  position: relative;
  inline-size: min(var(--lk-kontener), 100%);
  margin-inline: auto;
  padding-block: 0 26px;
  padding-inline: var(--lk-margines-boczny);
}

/* Okruszki to wspolny element motywu (.lk-okruszki w liikye.css: 14 px, ink-600, bez podkreslenia). W pasie bez marginesow,
   z odstepem z makiety (24 px nad, 14 px pod) i szarym separatorem. */
.lk-pas-strony .lk-okruszki {
  margin: 0;
  padding-block: 24px 14px;
}

.lk-pas-strony .lk-okruszki__sep { color: var(--ink-300); }

.lk-pas-strony .lk-pas-strony__tytul {
  margin: 4px 0 8px;
  font-family: var(--font-display);
  font-size: 30px;
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -.02em;
  color: var(--text-strong);
}

.lk-pas-strony .lk-pas-strony__drobny {
  max-inline-size: 520px;
  margin: 0 0 10px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--ink-700);
}

.lk-pas-strony .lk-pas-strony__data {
  margin: 0;
  font-size: 13px;
  color: var(--ink-600);
}

/* Ostatni element pasa nie dodaje odstepu: bez daty (strony prawne) albo bez zajawki dol pasa zostaje taki, jak w makiecie. */
.lk-pas-strony .lk-pas-strony__w > :last-child { margin-block-end: 0; }

/* Z obrazkiem: bialy tekst na ciemnej nakladce. */
.lk-pas-strony--grafika .lk-okruszki,
.lk-pas-strony--grafika .lk-okruszki__sep { color: rgba(255, 255, 255, .75); }

/* Najechanie na link okruszkow: akcent sklepu (orange-500) na ciemnej nakladce ma za maly kontrast, wiec bialy z podkresleniem. */
.lk-pas-strony--grafika .lk-okruszki a:hover {
  color: var(--white);
  text-decoration: underline;
}

.lk-pas-strony--grafika .lk-pas-strony__tytul { color: var(--white); }
.lk-pas-strony--grafika .lk-pas-strony__drobny { color: rgba(255, 255, 255, .88); }
.lk-pas-strony--grafika .lk-pas-strony__data { color: rgba(255, 255, 255, .7); }

/* --------------------------------------------------------------------------
   Kolumna tresci: ta sama szerokosc co wnetrze pasa (geometria .lk-kontener), odstepy z makiety (telefon 16 i 24 px,
   komputer 40 i 40 px) i 24 px nad stopka sklepu.
   -------------------------------------------------------------------------- */

.lk-strona-ogolna .lk-strona-ogolna__kolumna {
  inline-size: min(var(--lk-kontener), 100%);
  margin-inline: auto;
  padding-inline: var(--lk-margines-boczny);
  margin-block-end: 24px;
  padding-block: 16px 24px;
}

/* Spis tresci stron prawnych (details.lk-spis z inc/stopka-tresc.php) ma w liikye-stopka.css miare tekstu 41rem; w kolumnie na
   szerokosc kontenera zostawal ramka na pol strony, wiec tu idzie na cala szerokosc kolumny (lista dalej w dwoch kolumnach). */
.lk-strona-ogolna .lk-tresc .lk-spis { max-width: none; }

/* Kotwice spisu tresci stron prawnych (inc/stopka-tresc.php) nie chowaja sie pod przyklejonym naglowkiem sklepu. */
.lk-strona-ogolna .lk-tresc :is(h2, h3) {
  scroll-margin-block-start: calc(var(--lk-naglowek-h) + var(--space-5));
}

/* --------------------------------------------------------------------------
   Resztki po kreatorze (WPBakery): 115 z 169 stron liikye to wiersze i kolumny kreatora.
   Te same reguly co w liikye-stopka.css, sekcja 8 ("Resztki po poprzednim motywie"), ktore tam stoja na .lk-proza. Rusztowanie
   planu zmienilo klase tresci strony na .lk-tresc, wiec stare reguly przestaly tu dzialac: wiersze wrocily do ujemnych marginesow
   (-15 px), kolumny do dopelnienia 15 px, a puste wiersze po skasowanych obrazkach i martwych znacznikach do pustych przerw.
   Wynik zmierzony na /order-confirmation/ przy 390 px: plakietka Sale wystaje o 2 px, poziomy pasek przewijania.
   Stare reguly zostaja, bo .lk-proza ma jeszcze koszyk i kasa (page.php, dawny uklad).
   -------------------------------------------------------------------------- */

.lk-strona-ogolna .lk-tresc .vc_row {
  margin-inline: 0;
  width: auto;
}

.lk-strona-ogolna .lk-tresc .vc_column-inner,
.lk-strona-ogolna .lk-tresc .wpb_column { padding-inline: 0; }

.lk-strona-ogolna .lk-tresc .wpb_text_column:last-child,
.lk-strona-ogolna .lk-tresc .wpb_content_element:last-child { margin-block-end: 0; }

.lk-strona-ogolna .lk-tresc .wpb_wrapper > *:last-child { margin-block-end: 0; }

/* Lista elementow tresciowych jest szersza niz w liikye-stopka.css (runda poprawek 1, pkt 3): dodane a, button, select, textarea, canvas,
   figure, details, label, fieldset, object, embed, audio oraz widzety (klasy widget, woocommerce, cleafs, wpforms), zeby nic tresciowego
   nie znikalo. Wiersz ukryty celowo przez kreator (vc_hidden-xs i inne) nie podlega tej regule. */
/* Wiersz kreatora, w ktorym nie ma juz zadnego elementu tresci, to sam odstep po skasowanym obrazku albo martwym znaczniku: znika
   w calosci. Kolumna bez tresci znika tak samo, a jej sasiadka dostaje cala szerokosc wiersza. Przegladarka bez :has() zostawia
   odstepy i nic sie nie psuje. */
.lk-strona-ogolna .lk-tresc .vc_row:not(:has(p, h1, h2, h3, h4, h5, h6, ul, ol, dl, table, img, picture, svg, iframe, video, form, input, blockquote, hr, article, section, a, button, select, textarea, canvas, figure, details, label, fieldset, object, embed, audio, [class*="widget"], [class*="woocommerce"], [class*="cleafs"], [class*="wpforms"])) {
  display: none;
}

.lk-strona-ogolna .lk-tresc .wpb_column:not(:has(p, h1, h2, h3, h4, h5, h6, ul, ol, dl, table, img, picture, svg, iframe, video, form, input, blockquote, hr, article, section, a, button, select, textarea, canvas, figure, details, label, fieldset, object, embed, audio, [class*="widget"], [class*="woocommerce"], [class*="cleafs"], [class*="wpforms"])) {
  display: none;
}

.lk-strona-ogolna .lk-tresc .vc_row:has(> .wpb_column:not(:has(p, h1, h2, h3, h4, h5, h6, ul, ol, dl, table, img, picture, svg, iframe, video, form, input, blockquote, hr, article, section, a, button, select, textarea, canvas, figure, details, label, fieldset, object, embed, audio, [class*="widget"], [class*="woocommerce"], [class*="cleafs"], [class*="wpforms"]))) > .wpb_column {
  width: 100%;
}

/* Wiersz, w ktorym zostala jedna kolumna (obok stal obrazek, ktorego juz nie ma), daje jej cala szerokosc. */
.lk-strona-ogolna .lk-tresc .vc_row > .wpb_column:only-child { width: 100%; }

/* --------------------------------------------------------------------------
   Komputer: od 901 px
   -------------------------------------------------------------------------- */

@media (min-width: 901px) {
  .lk-pas-strony .lk-pas-strony__w { padding-block-end: 56px; }
  .lk-pas-strony .lk-okruszki { padding-block: 40px 18px; }
  .lk-pas-strony .lk-pas-strony__tytul { font-size: 56px; }
  .lk-pas-strony .lk-pas-strony__drobny { font-size: 18px; }
  .lk-strona-ogolna .lk-strona-ogolna__kolumna { padding-block: 40px; }
}