/* =============================================================================
 * VARIA+PLUS — úvodní stránka (Shoptet, šablona Classic / 11-one)
 * Vlastní CSS · v1.0   —   patří k souboru varia-homepage.js
 *
 * Vše je omezené na úvodní stránku (body.type-index) — ostatní stránky
 * e-shopu zůstávají beze změny. Hlavní banner nahoře se needituje.
 *
 * Carousel produktů je nativní Shoptet slider (.product-slider), tady se
 * pouze přestyluje — nesaháme na jeho rozměry, ty počítá jeho vlastní JS.
 * ========================================================================== */

/* ---------------------------------------------------------------- proměnné */
body.type-index {
  --vp-green: #116835;
  --vp-green-deep: #0b3f21;
  --vp-orange: #f89834;
  --vp-orange-hover: #db8021;
  --vp-ink: #17251c;
  --vp-muted: #5c6b61;
  --vp-line: #e3e8e4;
  --vp-surface: #ffffff;
  --vp-surface-alt: #f4f6f4;
  --vp-radius: 14px;
  --vp-radius-lg: 20px;
  --vp-gap: 20px;
  --vp-shadow: 0 1px 2px rgba(17, 40, 25, .05);
  --vp-shadow-hover: 0 12px 28px rgba(17, 40, 25, .12);
}

/* ------------------------------------------------------------ hlavička sekce */
body.type-index .vp-section {
  margin: 0 0 56px;
}

/* POŘADÍ SEKCÍ
 *
 * Obsah úvodní stránky je flex sloupec a stávající CSS šablony řadí bloky
 * podle POZICE: `.id-1 .content > div:nth-child(-n+5) { order: -2 }`.
 * Jakýkoli blok navíc (naše sekce, add-on, banner) tím posune index, takže
 * část skupiny vypadne z prvních pěti a rozpadne se pořadí — typicky zůstane
 * nadpis nahoře a carousel propadne pod zelený banner.
 *
 * Proto si tady pořadí určíme napevno podle toho, CO prvek je, ne kde stojí.
 * !important je schválně — přebíjí právě to nth-child pravidlo. */
body.type-index .vp-quicknav {
  order: -10 !important;
}

body.type-index .homepage-group-title.vp-sec-head {
  order: -9 !important;
}

/* carousel patří hned za svůj nadpis (obal doplňuje slider, proto obě varianty) */
body.type-index .vp-sec-head + .product-wrapper,
body.type-index .vp-sec-head + .vp-group-wrap,
body.type-index .vp-sec-head + .products.vp-group-shown {
  order: -9 !important;
}

body.type-index .vp-promo {
  order: -8 !important;
}

body.type-index .benefitBanner.position--benefitHomepage {
  order: -7 !important;
}

/* skupiny, které nestylujeme, zůstávají až za tím */
body.type-index [class*="homepage-products-heading-"]:not(.vp-sec-head),
body.type-index .vp-group-wrap {
  order: 0 !important;
}

body.type-index .vp-sec-head {
  display: flex !important;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin: 0 0 22px !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  text-align: left !important;
  font-weight: 400;
}

body.type-index .vp-sec-head::before,
body.type-index .vp-sec-head::after {
  display: none !important;
}

body.type-index .vp-sec-head__main {
  min-width: 0;
}

body.type-index .vp-sec-head__side {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 18px;
  flex: 0 0 auto;
  min-width: 96px;
  min-height: 42px;
}

body.type-index .vp-kicker {
  display: block;
  margin: 0 0 6px;
  color: var(--vp-orange);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  line-height: 1.2;
}

body.type-index .vp-kicker--light {
  color: #f7c58a;
}

body.type-index .vp-sec-title {
  margin: 0;
  padding: 0;
  color: var(--vp-ink);
  font-size: 32px;
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: -.01em;
  text-transform: none;
  text-align: left;
}

body.type-index .vp-sec-sub {
  margin: 8px 0 0;
  color: var(--vp-muted);
  font-size: 15px;
  line-height: 1.5;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
}

body.type-index .vp-link-all {
  color: var(--vp-green);
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

body.type-index .vp-link-all::after {
  content: " \2192";
  display: inline-block;
  transition: transform .15s ease;
}

body.type-index .vp-link-all:hover {
  color: var(--vp-green-deep);
  text-decoration: none;
}

body.type-index .vp-link-all:hover::after {
  transform: translateX(3px);
}

/* --------------------------------------------------------- rozcestník kategorií */
body.type-index .vp-quicknav {
  margin-top: 40px;
}

body.type-index .vp-quicknav__grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: var(--vp-gap);
}

body.type-index .vp-tile {
  display: flex;
  flex-direction: column;
  background: var(--vp-surface);
  border: 1px solid var(--vp-line);
  border-radius: var(--vp-radius);
  overflow: hidden;
  color: var(--vp-ink);
  text-decoration: none;
  box-shadow: var(--vp-shadow);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

body.type-index .vp-tile:hover,
body.type-index .vp-tile:focus-visible {
  transform: translateY(-3px);
  border-color: rgba(17, 104, 53, .35);
  box-shadow: var(--vp-shadow-hover);
  color: var(--vp-ink);
  text-decoration: none;
}

body.type-index .vp-tile__media {
  display: block;
  padding: 0;
  background: #fff;
}

/* obrázky produktů mají bílé pozadí, kryjí celou šířku dlaždice */
body.type-index .vp-tile__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform .25s ease;
}

body.type-index .vp-tile:hover .vp-tile__media img {
  transform: scale(1.04);
}

body.type-index .vp-tile__label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 16px 16px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
}

body.type-index .vp-tile__arrow {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--vp-orange);
  border-right: 2px solid var(--vp-orange);
  transform: rotate(45deg);
  transition: transform .18s ease;
}

body.type-index .vp-tile:hover .vp-tile__arrow {
  transform: rotate(45deg) translate(2px, -2px);
}

/* ------------------------------------------------- carousel (Shoptet slider) */
body.type-index .vp-sec-head + .product-wrapper {
  position: relative;
  margin-bottom: 56px;
}

/* šipky slideru přesunuté nahoru vpravo do hlavičky sekce */
body.type-index .vp-sec-head + .product-wrapper > .product-slider-navigation {
  position: absolute;
  top: -64px;
  bottom: auto;
  left: auto;
  width: 42px;
  height: 42px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--vp-line);
  border-radius: 50%;
  background-color: var(--vp-surface);
  color: transparent;
  font-size: 0;
  line-height: 0;
  opacity: 1;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
  z-index: 3;
}

body.type-index .vp-sec-head + .product-wrapper > .navigation-prev {
  right: 50px;
}

body.type-index .vp-sec-head + .product-wrapper > .navigation-next {
  right: 0;
}

/* původní ikona šipky ze šablony pryč, kreslíme si vlastní */
body.type-index .vp-sec-head + .product-wrapper > .product-slider-navigation::before,
body.type-index .vp-sec-head + .product-wrapper > .product-slider-navigation::after {
  content: none !important;
  display: none !important;
}

/* šipka jako SVG v pozadí — nezávislé na ikonách šablony */
body.type-index .vp-sec-head + .product-wrapper > .navigation-next {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23116835' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 17px 17px;
}

body.type-index .vp-sec-head + .product-wrapper > .navigation-prev {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23116835' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5l-7 7 7 7'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 17px 17px;
}

body.type-index .vp-sec-head + .product-wrapper > .product-slider-navigation:hover {
  background-color: var(--vp-green);
  border-color: var(--vp-green);
}

body.type-index .vp-sec-head + .product-wrapper > .navigation-next:hover {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E");
}

body.type-index .vp-sec-head + .product-wrapper > .navigation-prev:hover {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5l-7 7 7 7'/%3E%3C/svg%3E");
}

/* stránkování jako tečky pod carouselem */
body.type-index .vp-sec-head + .product-wrapper .product-slider-pagination {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 18px;
}

body.type-index .vp-sec-head + .product-wrapper .pagination-button {
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #cfd8d2;
  font-size: 0;
  line-height: 0;
  cursor: pointer;
  transition: background .15s ease, width .15s ease;
}

body.type-index .vp-sec-head + .product-wrapper .pagination-button.active {
  width: 22px;
  border-radius: 4px;
  background: var(--vp-green);
}

/* -------------------------------------------------------------- karta produktu */

/* pryč s rámečky původní mřížky — kartu kreslí až .p uvnitř */
body.type-index .vp-group-shown,
body.type-index .vp-group-shown .products-block,
body.type-index .vp-group-shown .product {
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

body.type-index .vp-group-shown .product {
  padding: 0 !important;
}

body.type-index .vp-group-shown .product .p {
  display: flex;
  flex-direction: column;
  height: 100%;
  margin: 5px 10px 6px;
  padding: 16px;
  background: var(--vp-surface);
  border: 1px solid var(--vp-line);
  border-radius: var(--vp-radius);
  box-shadow: var(--vp-shadow);
  transition: border-color .18s ease, box-shadow .18s ease;
}

body.type-index .vp-group-shown .product .p:hover {
  border-color: rgba(17, 104, 53, .35);
  box-shadow: 0 6px 16px rgba(17, 40, 25, .12);
}

/* Obrázek zůstává blokem (.flags jsou uvnitř odkazu a polohují se absolutně)
 * a jako jediný roste — pohltí volné místo v kartě, takže mezi dostupností
 * a tlačítkem nezůstane prázdné okno a fotka je co největší. */
body.type-index .vp-group-shown .product .p > .image {
  display: block;
  position: relative;
  flex: 1 1 auto;
  min-height: 190px;
  margin-bottom: 14px;
  overflow: hidden;
}

body.type-index .vp-group-shown .product .p > .image img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: none;
  object-fit: contain;
}

/* šablona dává .p-in height:100 %, což kartu přetahuje — tady ho pustíme
 * na obsah, aby volné místo dostal obrázek */
body.type-index .vp-group-shown .product .p-in {
  display: block;
  flex: 0 0 auto;
  height: auto;
  min-height: 0;
}

body.type-index .vp-group-shown .product .p-in-in {
  flex: 0 0 auto;
}

/* dva řádky na název, aby ceny i tlačítka byly na stejné lince */
body.type-index .vp-group-shown .product .name {
  display: block;
  min-height: 2.7em;
  margin: 0 0 10px;
  color: var(--vp-ink);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  text-align: left;
  text-decoration: none;
}

body.type-index .vp-group-shown .product .name:hover {
  color: var(--vp-green);
}

/* hvězdičky vlevo, dostupnost vpravo — na jednom řádku, ať karty sedí na sebe */
body.type-index .vp-group-shown .product .ratings-wrapper {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 22px;
  margin-bottom: 10px;
  padding: 0;
}

body.type-index .vp-group-shown .product .ratings-wrapper > * {
  flex: 0 1 auto;
  width: auto;
  margin: 0;
}

body.type-index .vp-group-shown .product .availability {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  text-align: right;
  white-space: nowrap;
}

body.type-index .vp-group-shown .product .p-bottom {
  margin-top: 0;
  padding-top: 12px;
  border-top: 1px solid var(--vp-line);
}

/* cena vlevo, tlačítko vpravo na jednom řádku; na úzkých kartách se zalomí */
body.type-index .vp-group-shown .product .p-bottom > div {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px 12px;
}

body.type-index .vp-group-shown .product .prices {
  flex: 1 1 auto;
  margin-bottom: 0;
  text-align: left;
}

body.type-index .vp-group-shown .product .price-additional {
  color: var(--vp-muted);
  font-size: 12px;
  line-height: 1.3;
}

body.type-index .vp-group-shown .product .price-final {
  color: var(--vp-ink);
  font-size: 22px;
  font-weight: 800;
  line-height: 1.2;
}

body.type-index .vp-group-shown .product .price-final strong {
  font-weight: 800;
}

body.type-index .vp-group-shown .product .price-measure,
body.type-index .vp-group-shown .product .p-code {
  display: none;
}

body.type-index .vp-group-shown .product .p-tools {
  display: flex;
  flex: 0 0 auto;
  justify-content: flex-end;
  margin: 0 0 0 auto;
}

body.type-index .vp-group-shown .product .btn-cart {
  border-radius: 8px;
  font-weight: 700;
  white-space: nowrap;
}

/* ------------------------------------------------------------- zelený banner */
body.type-index .vp-promo {
  margin: 0 0 56px;
}

body.type-index .vp-promo__in {
  position: relative;
  display: flex;
  align-items: center;
  gap: 32px;
  padding: 44px 48px;
  background: linear-gradient(135deg, var(--vp-green) 0%, var(--vp-green-deep) 100%);
  border-radius: var(--vp-radius-lg);
  overflow: hidden;
}

body.type-index .vp-promo__in::after {
  content: "";
  position: absolute;
  top: -140px;
  right: -120px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .05);
  pointer-events: none;
}

body.type-index .vp-promo__body {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  max-width: 640px;
}

body.type-index .vp-promo__title {
  margin: 0 0 12px;
  color: #fff;
  font-size: 32px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: -.01em;
}

body.type-index .vp-promo__text {
  margin: 0 0 24px;
  color: rgba(255, 255, 255, .85);
  font-size: 16px;
  line-height: 1.55;
}

body.type-index .vp-promo .vp-btn {
  display: inline-block;
  padding: 14px 28px;
  background: var(--vp-orange);
  color: #fff;
  border-radius: 10px;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  transition: background .15s ease, transform .15s ease;
}

body.type-index .vp-promo .vp-btn:hover,
body.type-index .vp-promo .vp-btn:focus-visible {
  background: var(--vp-orange-hover);
  color: #fff;
  text-decoration: none;
  transform: translateY(-1px);
}

/* Koláž fotek: první velká přes dva řádky, další vedle ní pod sebou. */
body.type-index .vp-promo__media {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  grid-auto-rows: 1fr;
  gap: 12px;
  flex: 0 0 420px;
  margin-left: auto; /* koláž drží u pravého okraje banneru */
}

body.type-index .vp-promo__media[data-count="1"] {
  grid-template-columns: 1fr;
  flex-basis: 260px;
}

body.type-index .vp-promo__media[data-count="2"] {
  grid-template-columns: 1fr 1fr;
  flex-basis: 340px;
}

body.type-index .vp-promo__media[data-count="3"] .vp-promo__shot:first-child {
  grid-row: span 2;
}

body.type-index .vp-promo__shot {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  background: #fff;
  border-radius: var(--vp-radius);
  overflow: hidden;
}

body.type-index .vp-promo__media[data-count="1"] .vp-promo__shot {
  padding: 18px;
}

body.type-index .vp-promo__shot img {
  display: block;
  width: 100%;
  height: 100%;
  max-height: 190px;
  object-fit: contain;
}

body.type-index .vp-promo__media[data-count="3"] .vp-promo__shot:first-child img {
  max-height: 232px;
}

/* -------------------------------------------------- doladění okolních bloků */
body.type-index .benefitBanner.position--benefitHomepage {
  margin: 32px 0 8px;
}

body.type-index .latest-contribution-wrapper .latest-contribution {
  padding: 20px;
  background: var(--vp-surface);
  border: 1px solid var(--vp-line);
  border-radius: var(--vp-radius);
}

/* -----------------------------------------------------------------------------
 * SKRYTÉ SKUPINY PRODUKTŮ
 * Skryje ostatní skupiny (Novinky, Akce, …), aby úvodní stránka měla jeden
 * carousel podle návrhu. Chceš je zpět? Smaž tento blok a v JS nastav
 * hideOtherGroups: false.
 * -------------------------------------------------------------------------- */
body.type-index .vp-group-hidden,
body.type-index .product-wrapper:has(> .vp-group-hidden) {
  display: none !important;
}

/* -------------------------------------------------------------- responzivita */
@media (max-width: 1199px) {
  body.type-index .vp-quicknav__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 991px) {
  body.type-index .vp-sec-title,
  body.type-index .vp-promo__title {
    font-size: 26px;
  }

  body.type-index .vp-promo__in {
    gap: 24px;
    padding: 32px;
  }

  body.type-index .vp-promo__media,
  body.type-index .vp-promo__media[data-count="1"],
  body.type-index .vp-promo__media[data-count="2"] {
    flex-basis: 300px;
  }

  body.type-index .vp-promo__shot img {
    max-height: 130px;
  }

  body.type-index .vp-promo__media[data-count="3"] .vp-promo__shot:first-child img {
    max-height: 160px;
  }
}

@media (max-width: 767px) {
  body.type-index {
    --vp-gap: 14px;
  }

  body.type-index .vp-section {
    margin-bottom: 40px;
  }

  body.type-index .vp-sec-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  body.type-index .vp-sec-head__side {
    min-height: 0;
    min-width: 0;
  }

  /* na mobilu se listuje tahem prstem — šipky zabírají místo zbytečně
   * (!important kvůli display:flex !important ve stávajícím CSS šablony) */
  body.type-index .vp-sec-head + .product-wrapper > .product-slider-navigation {
    display: none !important;
  }

  body.type-index .vp-quicknav__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.type-index .vp-tile__label {
    padding: 12px;
    font-size: 14px;
  }

  body.type-index .vp-group-shown .product .p {
    padding: 12px;
  }

  body.type-index .vp-group-shown .product .p > .image {
    min-height: 130px;
    margin-bottom: 10px;
  }

  body.type-index .vp-promo__in {
    flex-direction: column-reverse;
    align-items: stretch;
    padding: 24px;
  }

  body.type-index .vp-promo__media {
    flex: 0 0 auto;
  }

  body.type-index .vp-promo__media {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  body.type-index .vp-promo__shot img {
    max-height: 120px;
  }

  body.type-index .vp-promo__media[data-count="3"] .vp-promo__shot:first-child img {
    max-height: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.type-index .vp-tile,
  body.type-index .vp-group-shown .product .p,
  body.type-index .vp-promo .vp-btn {
    transition: none;
  }
}

/* =============================================================================
 * NEWSLETTER V PATIČCE
 *
 * POZOR: tahle sekce záměrně NENÍ omezená na úvodní stránku — patička je
 * všude, takže se opraví na celém e-shopu.
 *
 * Proč to bylo rozbité: stávající style.css cílí na starší podobu widgetu
 * (nadpis h4, formulář .compact-form, absolutně umístěné tlačítko). Shoptet
 * mezitím widget překreslil na h3.pageElement__heading + form.subscribe-form,
 * takže část pravidel minula cíl a část (::after texty) zůstala viset navíc.
 * Tady se layout staví znovu a přebytky se vypínají.
 * ========================================================================== */

#footer .custom-footer > div.custom-footer__newsletter {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  align-items: center;
  gap: 24px 56px;
  padding: 44px 20px 48px !important;
  margin-bottom: 60px;
  color: #fff;
}

/* --- levý sloupec: nadpis a popis ---------------------------------------- */
#footer .custom-footer__newsletter .newsletter-header {
  display: block;
  width: auto;
  max-width: 520px;
  flex-basis: auto;
  margin: 0;
  padding: 0;
  text-align: left;
}

/* zbytek po starém CSS: text navíc pod nadpisem */
#footer .custom-footer__newsletter .newsletter-header::after {
  content: none !important;
  display: none !important;
}

#footer .custom-footer__newsletter .newsletter-header h3,
#footer .custom-footer__newsletter .newsletter-header h4,
#footer .custom-footer__newsletter .newsletter-header .pageElement__heading {
  margin: 0 0 8px !important;
  padding: 0 !important;
  color: #fff !important;
  font-size: 26px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -.01em;
  text-align: left !important;
  text-transform: none;
}

#footer .custom-footer__newsletter .newsletter-header h3 span,
#footer .custom-footer__newsletter .newsletter-header h4 span {
  display: inline !important;
}

#footer .custom-footer__newsletter .newsletter-header p {
  margin: 0 !important;
  color: rgba(255, 255, 255, .85) !important;
  font-size: 15px;
  line-height: 1.55;
  text-align: left !important;
}

/* --- pravý sloupec: formulář --------------------------------------------- */
#footer .custom-footer__newsletter .subscribe-form {
  width: 100%;
  max-width: 620px;
  padding: 0;
  margin: 0;
}

#footer .custom-footer__newsletter .subscribe-form fieldset {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  margin: 0;
  padding: 0;
  border: 0;
}

#footer .custom-footer__newsletter fieldset > div {
  float: none;
  text-align: left !important;
}

/* e-mail + tlačítko na jednom řádku, souhlas pod nimi */
#footer .custom-footer__newsletter .form-group.smart-label-wrapper {
  order: 1;
  flex: 1 1 240px;
  margin: 0;
}

#footer .custom-footer__newsletter .subscribe-form .btn {
  order: 2;
  position: static !important;
  top: auto !important;
  flex: 0 0 auto;
  width: auto !important;
  min-width: 150px;
  height: 52px;
  padding: 0 28px !important;
  border: 0;
  border-radius: 8px;
  background-color: #f89834;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 52px;
  text-transform: none;
  transition: background-color .15s ease;
}

#footer .custom-footer__newsletter .subscribe-form .btn:hover,
#footer .custom-footer__newsletter .subscribe-form .btn:focus-visible {
  background-color: #db8021;
}

/* zbytek po starém CSS: druhý popisek natištěný přes text tlačítka */
#footer .custom-footer__newsletter .subscribe-form .btn::after,
#footer .custom-footer__newsletter .subscribe-form .btn::before {
  content: none !important;
  display: none !important;
}

#footer .custom-footer__newsletter .form-group.smart-label-wrapper > label {
  display: block;
  margin: 0 0 6px !important;
  padding: 0 !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 600;
  line-height: 1.3;
  text-align: left !important;
}

#footer .custom-footer__newsletter .form-control {
  width: 100%;
  height: 52px;
  padding: 12px 16px !important;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 8px;
  background: #fff;
  color: #17251c;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.4;
}

#footer .custom-footer__newsletter .form-control:focus {
  outline: 2px solid #f89834;
  outline-offset: 1px;
}

/* --- souhlas se zpracováním údajů ---------------------------------------- */
/* Zaškrtávátko kreslí šablona přes label::before, samotný input je přes něj
 * položený průhledně — label proto musí mít vlevo místo, jinak se překrývají. */
#footer .custom-footer__newsletter .form-group.consents {
  order: 3;
  flex: 1 1 100%;
  margin: 2px 0 0;
}

#footer .custom-footer__newsletter .form-group.consents label {
  position: relative;
  display: block;
  margin: 0 !important;
  padding: 1px 0 1px 30px !important;
  color: rgba(255, 255, 255, .85) !important;
  font-size: 13px !important;
  font-weight: 400;
  line-height: 1.45;
  text-align: left !important;
  cursor: pointer;
}

#footer .custom-footer__newsletter .form-group.consents label::before {
  background-color: #fff !important;
  border-color: #fff !important;
  border-radius: 4px !important;
}

#footer .custom-footer__newsletter .form-group.consents input[type="checkbox"] {
  top: 50% !important;
  left: 0 !important;
  width: 20px;
  height: 20px;
  margin: 0;
  transform: translateY(-50%);
  cursor: pointer;
}

#footer .custom-footer__newsletter .form-group.consents input[type="checkbox"]:checked + label::before {
  background-color: #f89834 !important;
  border-color: #f89834 !important;
}

/* zaškrtnutí kreslíme sami — výchozí značka šablony je na oranžové neviditelná */
#footer .custom-footer__newsletter .form-group.consents input[type="checkbox"]:checked + label::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 7px !important;
  width: 5px !important;
  height: 10px !important;
  margin-top: -7px !important;
  border: solid #fff !important;
  border-width: 0 2px 2px 0 !important;
  border-radius: 0 !important;
  background: none !important;
  transform: rotate(45deg) !important;
}

#footer .custom-footer__newsletter .form-group label a {
  color: #fff;
  font-weight: 600;
  text-decoration: underline;
}

/* staré CSS ruší zalomení, kvůli čemuž věty splývaly v jednu */
#footer .custom-footer__newsletter .form-group.consents br {
  display: inline !important;
}

#footer .custom-footer__newsletter .required-asterisk::after {
  color: #ffc98a !important;
}

#footer .custom-footer__newsletter .validator-msg-holder,
#footer .custom-footer__newsletter .msg {
  width: 100%;
  color: #ffd7d7;
  font-size: 13px;
}

/* --- responzivita --------------------------------------------------------- */
@media (max-width: 991px) {
  #footer .custom-footer > div.custom-footer__newsletter {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
    padding: 32px 20px 36px !important;
    margin-bottom: 40px;
  }

  #footer .custom-footer__newsletter .newsletter-header,
  #footer .custom-footer__newsletter .subscribe-form {
    max-width: none;
  }

  #footer .custom-footer__newsletter .newsletter-header h3,
  #footer .custom-footer__newsletter .newsletter-header h4,
  #footer .custom-footer__newsletter .newsletter-header .pageElement__heading {
    font-size: 22px;
  }
}

@media (max-width: 575px) {
  #footer .custom-footer__newsletter .form-group.smart-label-wrapper {
    flex: 1 1 100%;
  }

  #footer .custom-footer__newsletter .subscribe-form .btn {
    width: 100% !important;
  }
}
