/*
 * Plantpur redesign: nakladka na style.min.css i main.css.
 * Ladowana tylko w: strona-glowna-new.28, sklep-full.27, sklep-new.30.
 * Nie ladowac w head/head_new: te pliki obsluguja tez checkout.
 * !important jest celowy: nakladka musi wygrac z regulami :hover starych arkuszy.
 */

:root {
  --pp-navy: #0b4152;
  --pp-navy-hover: #136078;
  --pp-ink: #112f3a;
  --pp-text: #3a4f57;
  --pp-line: #e3e8ea;
  --pp-promo: #600d0d;

  --pp-composite: #8a6538;
  --pp-composite-hover: #765530;
  --pp-natural: #4d7358;
  --pp-natural-hover: #3f604a;
  --pp-baby: #b4476e;
  --pp-baby-hover: #9c3a5d;
  --pp-surface: #665aa0;
  --pp-surface-hover: #554a8a;
  --pp-pillow: #2a6f9e;
  --pp-pillow-hover: #225c84;
  --pp-bed: #3f3e3c;
  --pp-bed-hover: #2c2b2a;
}

/* ---------- Dostepnosc i stany ---------- */

.skip-link {
  position: absolute;
  left: 16px;
  top: -80px;
  z-index: 10000;
  padding: 12px 20px;
  background: var(--pp-navy);
  color: #fff;
  font: 700 16px/1.2 Lato, sans-serif;
  border-radius: 4px;
}

.skip-link:focus {
  top: 16px;
  color: #fff;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--pp-navy);
  outline-offset: 2px;
  box-shadow: 0 0 0 2px #fff;
}

.link-main,
.link-default,
.link-default--line {
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .15s ease;
}

.link-main:not(:disabled):active,
.link-default:not(:disabled):active,
.link-default--line:active {
  transform: translateY(1px);
}

/* ---------- Typografia: Lato wszedzie, bez minion-pro i Crimson Text ---------- */

main p,
main small,
main li,
main td,
main h1,
main h2,
main h3,
main h4,
main .title,
main .sub-title,
main .description-price,
main .section-shop-subpage__content__send__price {
  font-family: Lato, sans-serif !important;
}

main h1,
main h2,
main h3 {
  letter-spacing: -.01em;
  text-wrap: balance;
}

.header-main__description .title,
.header-main__description .sub-title {
  font-family: Lato, sans-serif !important;
  text-shadow: 0 1px 10px rgba(17, 47, 58, .55);
}

main p {
  text-wrap: pretty;
}

.description-price,
.section-shop-subpage__content__send__price,
.section-general-text__article__shop h4,
.omnibus-price__value {
  font-variant-numeric: tabular-nums;
}

/* ---------- Kolory linii produktow (biel na tle: kontrast min. 4.5:1) ---------- */

.link-main {
  --cta: var(--pp-composite);
  --cta-hover: var(--pp-composite-hover);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .04em;
}

.link-main.link-main--green { --cta: var(--pp-natural); --cta-hover: var(--pp-natural-hover); }
.link-main.link-main--blue { --cta: var(--pp-navy); --cta-hover: var(--pp-navy-hover); }
.link-main.link-main--pink { --cta: var(--pp-baby); --cta-hover: var(--pp-baby-hover); }
.link-main.link-main--violet { --cta: var(--pp-surface); --cta-hover: var(--pp-surface-hover); }
.link-main.link-main--sky { --cta: var(--pp-pillow); --cta-hover: var(--pp-pillow-hover); }
.link-main.link-main--bed { --cta: var(--pp-bed); --cta-hover: var(--pp-bed-hover); }

.link-main:not(:disabled) {
  background: var(--cta) !important;
  color: #fff !important;
}

.link-main:not(:disabled):hover,
.mattress-item:hover .link-main:not(:disabled) {
  background: var(--cta-hover) !important;
}

/* ---------- Strona glowna ---------- */

.mattress-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 48px;
}

/* Obrazek jest absolutny, wiec bez szerokosci figure zwija sie do zera w kolumnie flex. */
.mattress-item__img {
  flex: none;
  width: 100%;
}

.mattress-item__content {
  flex: 1 1 auto;
  width: 100%;
  margin-bottom: 16px;
}

.mattress-item .link-main {
  margin-top: auto;
  padding: 15px 28px;
}

.mattress-item__content .title,
.mattress-item__content .title small {
  font-size: 22px;
  font-weight: 700;
  color: var(--pp-ink);
}

.mattress-item__content .title small {
  margin-top: 2px;
}

.mattress-item__content p,
.mattress-item.mattress-item--last p {
  width: auto;
  max-width: 38ch;
  margin: 12px auto 0;
  font-size: 15px;
  line-height: 1.55;
  color: var(--pp-text);
}

.mattress-item__content p br {
  display: none;
}

.mattress-item__content .description-price {
  margin-top: 12px;
  font-size: 18px;
  font-weight: 700;
  color: var(--pp-ink);
}

.mattress-item__content .label-mattress {
  font-weight: 700;
  color: #1c7a0d;
}

.label-bestseller {
  position: absolute;
  top: -35px;
  left: 0;
  right: 0;
  display: inline-block;
  width: 96px;
  margin: 0 auto;
  padding: 4px 6px;
  border-radius: 3px;
  background: var(--pp-composite);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-align: center;
  text-transform: uppercase;
}

.label-bestseller--baby {
  background: var(--pp-baby);
}

/* ---------- Lista sklepu ---------- */

.section-general-text__article__shop .color-mattress-composite { --cta: var(--pp-composite); --cta-hover: var(--pp-composite-hover); }
.section-general-text__article__shop .color-mattress-natural { --cta: var(--pp-natural); --cta-hover: var(--pp-natural-hover); }
.section-general-text__article__shop .color-mattress-life { --cta: var(--pp-navy); --cta-hover: var(--pp-navy-hover); }
.section-general-text__article__shop .color-mattress-baby { --cta: var(--pp-baby); --cta-hover: var(--pp-baby-hover); }
.section-general-text__article__shop .color-mattress-baby.color-mattress-surface--large { --cta: var(--pp-surface); --cta-hover: var(--pp-surface-hover); }
.section-general-text__article__shop .color-mattress-composite[style],
.section-general-text__article__shop .color-mattress-baby.color-bed,
.section-general-text__article__shop .color-mattress-baby.color-bed-panel,
.section-general-text__article__shop .btn-color-1 { --cta: var(--pp-bed); --cta-hover: var(--pp-bed-hover); }
/* Musi byc po [style]: karty poduszek tez maja styl inline w tresci z bazy. */
.section-general-text__article__shop .color-mattress-composite.pillow-block-1 { --cta: var(--pp-pillow); --cta-hover: var(--pp-pillow-hover); }

.section-general-text__article__shop .link-default:not(:disabled) {
  padding: 14px 32px;
  background: var(--cta) !important;
  color: #fff !important;
  font-family: Lato, sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .04em;
}

.section-general-text__article__shop a:hover .link-default:not(:disabled),
.section-general-text__article__shop .link-default:not(:disabled):hover {
  background: var(--cta-hover) !important;
}

.section-general-text__article__shop > .row > .col-md-4 > div {
  position: relative;
  display: flex !important; /* czesc kart ma display:block inline w tresci z bazy */
  flex-direction: column;
  width: 100%;
  min-height: 0;
  margin-bottom: 24px;
  padding: 28px 0;
  border-radius: 6px;
}

.section-general-text__article__shop > .row > .col-md-4 > div > a:first-of-type {
  order: 1;
}

.section-general-text__article__shop .shops-item-foto {
  width: auto;
  max-width: 82%;
  height: 190px;
  margin-top: 0;
  object-fit: contain;
}

.section-general-text__article__shop .extra-label {
  top: 14px;
  left: 14px;
  margin: 0;
  padding: 5px 10px;
  transform: none;
  border-radius: 3px;
  background: var(--pp-promo);
  font-size: 14px;
  font-weight: 700;
}

.section-general-text__article__shop .section-shops-subpage__content__title {
  order: 2;
  min-height: 0;
  margin: 20px 16px 0;
  font-size: 22px;
  font-weight: 700;
  color: var(--pp-ink);
}

.section-general-text__article__shop > .row > .col-md-4 > div > h4 {
  order: 3;
  margin: 10px 0 0;
  font-size: 20px;
  font-weight: 700;
  color: var(--pp-ink);
}

.section-general-text__article__shop .table-products {
  order: 4;
  margin-top: 16px;
  margin-bottom: 20px;
  padding: 0 24px;
}

.section-general-text__article__shop .table-products td {
  padding: 9px 4px;
  border-color: rgba(17, 47, 58, .1);
  font-size: 15px;
  line-height: 1.45;
  color: var(--pp-text);
}

.section-general-text__article__shop > .row > .col-md-4 > div > a:nth-of-type(2) {
  order: 5;
  margin-top: auto;
}

@media (min-width: 992px) {
  .section-general-text__article__shop > .row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  .section-general-text__article__shop > .row::before,
  .section-general-text__article__shop > .row::after {
    display: none;
  }

  .section-general-text__article__shop > .row > .col-md-4 {
    display: flex;
    float: none;
  }

  .section-general-text__article__shop .section-shops-subpage__content__title {
    min-height: 58px;
  }
}

/* ---------- Karta produktu ---------- */

.section-shop-subpage__content .link-default.add-basket:not(:disabled) {
  min-height: 52px;
  padding: 14px 32px;
  background: var(--pp-navy);
  font-size: 16px;
  font-weight: 700;
}

.section-shop-subpage__content .link-default.add-basket:not(:disabled):hover {
  background: var(--pp-navy-hover);
}

.custom-size .link-default.link-default--custom {
  padding: 12px 24px;
  border: 1px solid var(--pp-navy);
  background: transparent;
  color: var(--pp-navy);
}

.custom-size .link-default.link-default--custom:hover {
  background: #eef3f4;
  color: var(--pp-navy);
}

.section-shop-subpage__content__send__price {
  font-size: 32px;
  color: var(--pp-ink);
}

.section-shop-subpage__content__send__before #ca-link {
  margin-left: 8px;
}

/* iOS przybliza strone przy fokusie na polach mniejszych niz 16px. */
@media (max-width: 767px) {
  .section-shop-subpage input,
  .section-shop-subpage select,
  .section-shop-subpage textarea {
    font-size: 16px;
  }
}

.section-shop-subpage__content__send__before .section-shop-subpage__content__send__price__small {
  top: 0;
  margin-top: 2px;
  font-size: 13px;
}

/*
 * Cena, linia Omnibus i przycisk zostaja widoczne podczas konfiguracji materaca.
 * Tylko od 1200px: ponizej .extra-beam jest fixed na dole ekranu i przykrylby ten pasek.
 */
@media (min-width: 1200px) {
  /* style.min.css ma body{overflow-x:hidden!important}, co blokuje sticky. clip ucina tak samo, ale nie tworzy kontenera przewijania. */
  body.body-page:not(.modal-open) {
    overflow-x: clip !important;
    overflow-y: visible;
  }

  .section-shop-subpage__content {
    display: flow-root;
    overflow: visible;
  }

  .section-shop-subpage__content__send {
    position: sticky;
    bottom: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 32px;
    padding: 14px 0;
    border-top: 1px solid var(--pp-line);
    background: #fff;
  }

  .section-shop-subpage__content__send__before,
  .section-shop-subpage__content__send__after {
    float: none;
    width: auto;
    margin: 0;
    padding: 0;
  }

  .section-shop-subpage__content__send__before {
    flex: 1 1 auto;
    min-width: 0;
  }

  .section-shop-subpage__content__send__after {
    flex: 0 0 auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .link-main,
  .link-default,
  .link-default--line {
    transition: none;
  }

  .link-main:not(:disabled):active,
  .link-default:not(:disabled):active,
  .link-default--line:active {
    transform: none;
  }
}