/*
 * Custom code goes here.
 * A template should always ship with an empty custom.css
 */
 .js-mailalert .alert-info {
  color: #049324;
  background-color: #00b02717;
  border-color: #0493244f;
}

 .js-customer-form .form-text {
   display: inherit
}

#blur-overlay {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;}

 #content-hook_order_confirmation p, section#content-hook_order_confirmation p a {
  color: white!important;
  text-align: center;
}

.tabs-content {
  border: none;
}

.tab-content {
  padding-bottom: 0 !important;
}

.wishlist-link.header__rightitem {
  margin-left: 2rem;
}

.header-nav > .container-full {
  padding: 0.15rem 0;
  border: none;
}

.header-item__name.name {
  text-transform: none;}

div#info-box {
  font-size: 1.125rem;
  font-weight: 600;
}
.testimonials {
  margin-bottom: 1rem;
}

p.signature {
  margin-bottom: 3rem;
}

.full-width-container {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.custom-column {
  position: relative;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.col-text {
  align-items: center;
  width: 50%;
  padding: 40px;
  color: #fff;
  font-weight: 600;
  min-height: 510px;
}

.col-text p {
  margin: 0;
}

.col-text i {
  font-weight: normal;
  display: inline-block;
  margin-top: 40px;
  font-size: 12px;
}

.col-image {
  width: 50%;
}

.tdc-title {
  margin-bottom: 20px;
}

.tdc-img-background {
  position: absolute;
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: right;
}

.col-text-texture-bg {
  background-image: url("/img/stories/tdc-texture-background-horizontal.jpg");
}

.custom-column {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  justify-content: center;
}

.custom-solid-separator {
  width: 120px;
  height: 4px;
  background-color: #ffe81e;
  margin-bottom: 20px;
}

.custom-column h3 {
  text-transform: uppercase;
  font-size: 24px;
  line-height: 1.2;
  margin-bottom: 20px;
  margin-top: 0;
  color: #ffe81e;
  font-weight: bolder;
}

.custom-column p,
h3 {
  text-align: center;
}

.full-cus-col {
  width: 100%;
  background: linear-gradient(135deg, #003a23, #076842);
  padding: 100px 0;
  align-items: center;
}

.ingredients-columns {
  display: flex;
  flex-wrap: wrap;
  margin-top: 40px;
  align-items: center;
  justify-content: center;
}

.ing-col_wrapper {
  width: calc(20% - 41px);
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.ing-col_wrapper:not(:last-child) {
  border-right: 1px solid rgba(255, 255, 255, 0.15);
}

.ing-col_wrapper img {
  width: 44px;
  margin: 0 auto;
}

.ing-col_wrapper p {
  margin: 30px 0 0;
  font-size: 14px;
  color: #fff;
}

.postup-col p {
  max-width: 380px;
  color: #fff;
  margin: 40px 0;
}

.postup-col img {
  width: 34px;
}

.postup-col {
  align-items: center;
}

.postup-col {
  background-image: url(/img/stories/bg-gradient.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 60px 40px;
}

.postup-col h3 {
  margin-top: 40px;
  margin-bottom: 0;
}

.tab-content img.tdc-img-background {
  height: 100%;
}

.product-description, .product-description p {
  font-size: 1rem;
}

#product.product-id-2828 .product-description.pribeh,
#product.product-id-2829 .product-description.pribeh {
  padding: 0;
}

#product.product-id-2828 .product-description > p,
#product.product-id-2829 .product-description > p {
  display: none;
}

.dm_prices_lowest {
  display: inline;
}

.additional-info-box {
  display: flex;
  padding: 1rem 0;
  border-top: solid 1px #e5e5e5;
  margin-top: 1rem;
}

.additional-info-box > div {
  display: grid;
  align-items: center !important;
  min-width: 25%;
  min-height: 100%;
  justify-content: center !important;
  grid-template-rows: 2fr 5fr;
  text-align: center;
}

.additional-info-box > div:not(:last-child) {
  margin-right: 1rem;
}

.additional-info-box img {
  max-width: 4rem;
  margin: 0 auto;
}

span.feature-value {
  font-size: 2rem;
}

@media (min-width: 992px) and (max-width: 1200px) {
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(1)
    .col-text,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(1)
    .col-text {
    width: 100%;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(1)
    .col-image,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(1)
    .col-image {
    height: 510px;
    width: 100%;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(2),
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(2) {
    flex-direction: column-reverse;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(2)
    .col-text,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(2)
    .col-text {
    width: 100%;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(2)
    .col-image,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(2)
    .col-image {
    height: 510px;
    width: 100%;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(3)
    .col-text,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(3)
    .col-text {
    width: 100%;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(3)
    .col-image,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(3)
    .col-image {
    height: 510px;
    width: 100%;
  }

  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(5)
    .col-text,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(5)
    .col-text {
    width: 100%;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(5)
    .col-image,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(5)
    .col-image {
    height: 510px;
    width: 100%;
  }

  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(6),
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(6) {
    padding: 20px;
    justify-content: center;
    align-items: center;
    background-image: url(/img/stories/bg-gradient.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .ing-col_wrapper {
    min-width: 110px;
  }

  .tabs-content iframe {
    max-width: 512px;
    height: 290px;
    margin: 0;
  }
}

@media (min-width: 320px) and (max-width: 800px) {
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(1)
    .col-text,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(1)
    .col-text {
    width: 100%;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(1)
    .col-image,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(1)
    .col-image {
    height: 510px;
    width: 100%;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(2),
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(2) {
    flex-direction: column-reverse;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(2)
    .col-text,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(2)
    .col-text {
    width: 100%;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(2)
    .col-image,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(2)
    .col-image {
    height: 510px;
    width: 100%;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(3)
    .col-text,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(3)
    .col-text {
    width: 100%;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(3)
    .col-image,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(3)
    .col-image {
    height: 510px;
    width: 100%;
  }

  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(5)
    .col-text,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(5)
    .col-text {
    width: 100%;
  }
  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(5)
    .col-image,
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(5)
    .col-image {
    height: 510px;
    width: 100%;
  }

  #product.product-id-2828
    #tullamore-dew-coffee
    .full-width-container:nth-child(6),
  #product.product-id-2829
    #tullamore-dew-coffee
    .full-width-container:nth-child(6) {
    padding: 20px;
    justify-content: center;
    align-items: center;
    background-image: url(/img/stories/bg-gradient.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .ing-col_wrapper {
    min-width: 50%;
    margin-top: 50px;
  }

  .tabs-content iframe {
    max-width: 512px;
    height: 290px;
    margin: 0;
  }
}

/***counter styling***/
/***counter styling***/
.count-down {
  height: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
}

.count-down span {
  background-color: #202020;
  margin-right: 5px;
  color: white;
  border-radius: 10px;
  font-weight: 600;
  font-family: sans-serif;
  position: relative;
  font-size: 22px;
  box-shadow: 0 0 10px 0 rgb(0 0 0 / 50%);
  width: 48.48px;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.count-down.invert span {
  background-color: #ddd;
  margin-right: 5px;
  color: #202020;
  border-radius: 10px;
  font-weight: 600;
  font-family: sans-serif;
  position: relative;
  font-size: 22px;
  box-shadow: 0 0 10px 0 rgb(0 0 0 / 50%);
  width: 48.48px;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.count-down span:after {
  content: "";
  width: 100%;
  height: 1px;
  background-color: rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.count-down.invert span:after {
  content: "";
  width: 100%;
  height: 1px;
  background-color: rgba(148, 148, 148, 0.5);
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

@media (min-width: 767px) and (max-width: 1599px) {
  .count-down {
    position: absolute;
    left: 50px;
    bottom: 40px;
  }
}

@media (min-width: 1600px) {
  .count-down {
    margin-left: 100px;
  }
}

@media (max-width: 766px) {
  .count-down span {
    font-size: 16px;
    width: 38px;
    height: 43.11px;
  }
}

@media (max-width: 450px) {
  .count-down span {
    font-size: 12px;
    width: 26px;
    height: 29.5px;
  }
}

/* div#roundedbox progress::-webkit-progress-bar {
    background-color: #00bb2d !important;
    border-radius: 9px;
} */

div#roundedbox progress::-webkit-progress-value {
  background: #00bb2d !important;
  border-radius: 9px;
}

div#roundedbox progress::-moz-progress-value {
  background: #00bb2d !important;
  border-radius: 9px;
}

.cart-preview .remove-from-cart {
  padding-right: 16px;
}

/* .crossselling .product-miniature {
    flex: 0 0 12%;
    max-width: 12%;
} */

@media (max-width: 768px) {
  .crossselling .product-miniature {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

.crossselling .product-title a {
  font-size: 0.9rem !important;
}

.crossselling .price {
  font-size: 1rem;
}

/* #doprava_zdarma_here_order {
    width: 100%;
} */

.step-number {
  background: var(--primary);
}
.promo-code .collapse-button {
  color: var(--primary);
}

.form-control,
.form-control-outline {
  box-shadow: none;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  border: 1px solid #f3f3f3;
  background-color: transparent;
  border-radius: 10px;
}

.address-header,
.card-header,
.address-footer,
.card-footer {
  background-color: transparent !important;
}

.-current .address-header,
.-current .card-header {
  background-color: #fff;
  box-shadow: none;
}

#freeshipping_progress {
  width: 100%;
}

.carrier-motivation {
  padding: 28px 28px;
  margin-top: 30px;
}
.orders h3 {
text-align: left;
}

.product-flag.freeshipping {
  color: #fff;
  background: #c12c82;
}

.product-flag.on-sale {
  color: #fff;
  background: #f01e1e
}

.product-flag.new {
  color: #fff;
  background: #4ea841
}

/** SPINKIDS STYLES **/
:root {
  --primary: #c71717;
  --secondary: #7be6cf;
  --tertiary: #3bc625;
  --main-white-color: #f9f9f9;
  --main-light-gray-color: #eeeeee;
  --main-gray-color: #9a9a9a;
  --main-dark-color: rgb(0, 22, 85);
  --font-family-sans-serif: Rubik, Segoe UI, Roboto, Helvetica Neue,
    Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !important;
}
.checkout-process .nav-tabs .nav-item {
  border: none;
}
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
  color: var(--primary);
}

.nav-tabs .nav-link {
  font-weight: 500;
}

.svg-icon.svg-icon-primary svg g [fill] {
  fill: var(--primary);
}
.checkout-process .nav-tabs .nav-link.active {
  border-color: transparent transparent var(--primary);
}

.custom-control-input:checked ~ .custom-control-label:before {
  border-color: var(--primary);
  background-color: var(--primary);
}

.sort-by-row .custom-select {
  min-width: unset !important;
  border: none;
}

div#content-wrapper {
  padding-bottom: 15px;
}

img.logo {
  max-width: 175px;
}

.menu-tile__content img {
  height: 10rem;
  max-width: 11rem;
  object-fit: contain;
  margin-bottom: 1rem;
}

#menu-section-1 a.menu-tile__content span {
  min-height: 3.5rem;
}

.page-item.active .page-link,
.page-item.active .product-comments__pagination li span,
.product-comments__pagination li.active .page-link,
.product-comments__pagination li.active span,
.product-comments__pagination li .page-item.active span {
  color: var(--primary);
}

.main-navigation .menu-submenu {
  box-shadow: none;
  background: #f2f2f2;}

#header.has-info-banner .main-navigation .menu-submenu {
  top: 197px;
}

#header:not(.has-info-banner) .main-navigation .menu-submenu {
  top: 190px;
}

body.scroll-down .menu-submenu {
  top: 147px;
}

div#menu-close g {
  fill: var(--primary);
}

/*slider 2 */
#homepageSlider .slick-slide, .homebanner-slide, #homepageSlider #carousel > div{
  cursor:pointer
}


#homepageSlider .slider-container {
  padding: 4rem;
  right: unset;
  max-width: 40rem;
  transform: none;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

#homepageSlider .home-slider__link {
  content: unset;
  /*width: auto;*/
  /*height: auto;*/
  /*position: relative;*/
  top: 0;
  left: unset;
  right: unset;
  transform: none;
  /*background: white;*/
  color: black !important;
  border-radius: 1.75rem;
  padding: 0.5rem 2rem;
  border: none;
  font-size: 1.25rem;
  margin-top: 2rem;
}

.slider2 h2 {
  color: white;
  font-size: 4rem;
  max-width: 20rem;
  text-align: center;
}

.account-links .link-item,
.address,
.block-categories,
.card,
.card-block {
  border: none;
}

.subcategory-card {
  border-radius: 10px;
  -webkit-box-shadow: 0px 0px 46px -9px rgba(0,0,0,0.07);
  box-shadow: 0px 0px 46px -9px rgba(0,0,0,0.07);
  background: white;
  font-weight: 600;}

#cart .cart-grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 2rem;
}

/* bannery */
.homebanner-slide .homebanner-cover {
  width: 100%;
}
/* ig */
.ybc_instagram {
  border: none;
  padding: 0;
}

.ybc_instagram_header a {
  border-radius: 0;
}

.ybc_instagram_header a:hover {
  color: white !important;
}

section#instagram {
  padding-bottom: 3rem;
}
.ybc_ins_medias {
  max-resolution: 0;
}

/* blog */

div#smartblogcat {
  margin-top: 5rem;
}

.breadcrumb.smart-blog-breadcrumb {
  display: none;
}
#module-smartblog-details #wrapper {
  background: none;
}

.smart-blog-post-single-item {
  border-bottom: none;
}

#module-smartblog-details .page-content,
#module-smartblog-category .page-content,
#module-smartblog-tagpost .page-content,
#module-smartblog-archive .page-content,
#module-smartblog-search .page-content {
  box-shadow: none;
  padding: 5rem 0;
}

.blog {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.5rem;
}

.blog img {
  width: 100%;
}

.post-title,
.smart-blog-posts-title {
  font-size: 1.25rem;
  margin-top: 0.75rem;
  margin-bottom: 0 !important;
  font-weight: 500;
}

a.post-readmore,
.smart-blog-post-readmore-btn a {
  margin-top: 1rem;
  font-weight: 600;
  color: #333 !important;
  background-color:white;
  border: solid 1px #333;
  border-radius: 10px;
  padding: 8px 20px;
  margin-top: 0.75rem;
    display: inline-block;
}

a.post-readmore:hover,
.smart-blog-post-readmore-btn a:hover {
  background-color: #333;
  color: white !important;
}

.smart-blog-posts-short-description {
  margin-top: 0;
}

.product-name {
  margin-top: 1.625rem;
}

#scroll-progress {
  background: #ffc107;
  margin-top: -2px;
}

.cart-preview .content-cart {
  min-width: max-content;
  right: 0;
  position: absolute;
}

/* #product-availability {
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.6em;
  margin-bottom: 0.2rem;
  display: block;
} */

.qty-label {
  font-size: 0.875rem;
  line-height: 1.6em;
  margin-bottom: 0.2rem;
  text-align: center;
  color: #4d4d4d;
  margin-left: -0.25rem;
  display: block;
}

.new_products .products {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap:20px
}

#categorySlider,
#homepageSlider,
body:not(.index):not(#category) #wrapper {
  margin-top: 13.25rem;
}

body:not(.index):not(#category)#product #wrapper {
  margin-top: 14rem;
}



.main-navigation .menu-item a {
  font-size: 1.1rem;
}

.form-control-outline:focus,
.form-control:focus {
  border-color: transparent;
  box-shadow: none;
}

.header-top {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}

.header__menu {
  padding: 0;
}

.header__logo {
  padding-bottom: 15px;
}

.search-form i {
  margin-left: 0.25rem;
}

.search-widget__input-right {
  box-shadow: none;
  font-size: 14px;
  height: 2.825rem;
  border: none;
  background: #f9f9f9;
  border-radius: 10px;

}

.search-widget__btn {
  display: flex;
  align-items: center;
  font-weight: 600;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

#partners {
  background: none;
  padding: 1.75rem 0;
}

#partners-mobile .partners {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1rem;
  text-align: center;
  padding: 2rem 0;
}

#partners .slick-arrow {
  background: none;
  font-size: 0;
  border: none;
}

#partners .slick-slide {
  min-height: 10rem;
}

#partners .slick-slide > div {
  min-height: 10rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

#partners .slick-arrow:before {
  font-size: 1.25rem;
  line-height: 34px;
  content: "";
  font-family: Material Icons;
  font-feature-settings: "liga" 1;
  font-size: 34px;
  color: inherit;
  line-height: 80px;
  text-align: center;
  display: block;
  opacity: 0.5;
}

#partners img,
#partners svg {
  object-fit: contain;
  max-height: 9rem;
}

#partners .slick-prev:before {
  content: "\e5cb";
}

#partners .slick-next:before {
  content: "\e5cc";
}

.facet__item button {
  padding-left: 0 !important;
}

.featured-products .product-description.product__card-desc {
  min-height: 110px;
}

a:hover {
  color: var(--primary) !important;
}

.delivery-information {
  margin-top: 1rem;
} 

.delivery-information .delivery-icon img {
  width: 35px;
}

.category_content {
  display: grid;
  grid-template-columns: 1fr 3fr;
  margin-top: 4rem;
}

div#custom-filter {
  display: flex;
  gap: 1rem;
  flex-direction: column;
}

.facet__item button:hover {
  color: var(--primary);
}

section#js-active-search-filters {
  margin-bottom: 1rem;
}

.clear-all-wrapper {
  margin-top: 2rem;
}

.active_filters__list-item:hover {
  color: white !important;
  background: var(--tertiary) !important;
  border-color: var(--tertiary) !important;
}
#_desktop_search_filters_wrapper {
  position: sticky;
  top: 8rem;
}
#search_filters {
  flex-direction: column;
  align-items: flex-start !important;
  border: 0;
}

#search_filters .ui-widget-header {
  background: var(--primary);
}

.freeshipping_progress__icon img {
  filter: hue-rotate(75deg) saturate(0.75);
}

/* .blockreassurance_product svg, .blockreassurance_product img {
    filter: grayscale(1);
} */

.product-flag.discount-product, .product-flag.discount {
  background: #f01e1e;
}

.header__rightitem a {
  display: flex;
  align-items: center;
}

.breadcrumb-item.active,
.header__rightitem a:hover,
body#product .breadcrumb .breadcrumb-item:nth-last-child(2),
a {
  color: var(--primary);
}

.wishlist .label {
  color: #333;
}

body#product:not(.product-id-2768) .pribeh {
  font-family: Rubik, Segoe UI, Roboto, Helvetica Neue, Arial,
    sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !important;
  background: none;
}

/* .product-actions.u-a-i-c {
    background: var(--tertiary);
    padding: 1.5rem;
} */

section.product-accessories {
  padding: 3rem 0;
}
#product .product-accessories {
  width: calc(100% - 328px);
  margin-left: 328px;
  padding-top: 1rem;
}

.product-accessories .product-description {
  min-height: 11rem;
}

.product-accessories .slick-arrow {
  position: absolute;
  top: 45%;
  height: unset;
  font-size: 0;
  background: none;
  border: none;
}

.product-accessories .slick-arrow:focus {
  border: none !important;
  outline: none;
}

.product-accessories .slick-arrow:before {
  content: "";
  font-family: Material Icons;
  font-feature-settings: "liga" 1;
  font-size: 34px;
  color: inherit;
  line-height: 80px;
  text-align: center;
  background: #ededed;
  height: 2.5rem;
  width: 2.5rem;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-accessories .slick-next.slick-arrow:before {
  content: "\e5cc";
  margin-right: 0.75rem;
}
.product-accessories .slick-prev.slick-arrow:before {
  content: "\e5cb";
  margin-left: 0.75rem;
}

.product-miniature .regular-price {
  font-size: 1rem;
}

.modal-cart__name {
  color: #333 !important;
  margin-top: 0 !important;
}

#blockcart-modal .modal-body .modal-gray {
  padding: 2rem;
}

.modal-backdrop.show {
  z-index: 99999;
}
.modal-open .modal {
  z-index: 99999999999999 !important;
}

/* .product-actions.u-a-i-c .product-add-to-cart .product-quantity_label {
  color: #333;
  margin-bottom: 0.25rem;
} */

/* .product-add-to-cart {
  height: 100%;
  display: flex;
  align-items: flex-end;
} */

/* #product .product-discount.current-price,
#product .product-discount.current-price .value {
  font-weight: 500;
} */

#product .product-quantity button#add_to_cart:hover {
  background-color: var(--main-dark-color);
}
/* #product .product-discount-count,
#product .product-discount-count .value {
  font-weight: 600 !important;
} */

#product, #index {
  background: #f9f9f9;
}

#product dl.data-sheet dt {
  font-weight: 600;
  margin-top: 1rem;
}

#product-details .label,
#product-details label {
  display: block;
  margin-bottom: 0;
  font-weight: 600;
}

section.product-features .h6 {
  display: none;
}
/* 
 #product #product-details .product-reference {
        display: flex;
        flex-direction: column;} */

.text-primary {
  color: var(--tertiary) !important;
}

.blockcart__count {
  background: var(--primary);
  position: absolute;
}

header .blockcart .header-item__icon {
  max-width: 30px;
}

.product-flag.on-sale,
.product-flag.pack {
  background: var(--main-dark-color);
}

li.product-flag.novinka {
  background: green;
  color: white;
}

.btn-primary.disabled,
.btn-primary:disabled,
.btn-primary:not(.search-widget__btn):not(#add_to_cart):not(.add_to_cart) {
  color: #333 !important;
  background-color: white;
  border-color: #333;
}

.cart-detailed-actions .btn-primary:not(.search-widget__btn):not(#add_to_cart):not(.add_to_cart) {
  background-color: var(--primary);
  border-color: var(--primary);
  color:white!important
}


.btn-primary.search-widget__btn,
.btn-primary#add_to_cart, 
.btn-primary.add_to_cart {
  background-color: var(--primary);
  border-color: var(--primary);
}

.btn-primary.add_to_cart.focus,
.btn-primary.add_to_cart:focus,
.btn-primary.add_to_cart:hover {
  color: white !important;
}

.btn-primary:not(.search-widget__btn):not(#add_to_cart):not(.add_to_cart).focus,
.btn-primary:not(.search-widget__btn):not(#add_to_cart):not(.add_to_cart):focus,
.btn-primary:not(.search-widget__btn):not(#add_to_cart):not(.add_to_cart):hover {
  color: white !important;
  background-color: #333;
}

.card-product:hover .product-title,
.card-product:hover .product-title a {
  color: var(--main-dark-color) !important;
}

a.all-product-link {
  font-weight: 600;
  border-radius: 10px;
  margin-top: 1.25rem!important;
}

.section-title {
  font-size: 2.25rem;
  font-weight: 700;
  max-width: max-content;
  margin: auto;
  margin-bottom: 3rem;
  margin-top: 1rem;
  position: relative;
  font-family: Rubik, Segoe UI, Roboto, Helvetica Neue, Arial,
    sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !important;
}

/* p.section-title.dec1::before,
p.section-title.dec2::before,
p.section-title.dec3::before,
p.section-title.dec4::before {
    content: "";
    background: url(/img/raketa.svg);
    position: absolute;
    left: -3rem;
    bottom: -1rem;
    width: 5rem;
    z-index: -1;
    opacity: 0.7;
    height: 5rem;
    background-size: contain;
}

p.section-title.dec2::before {
    background: url(/img/lego.svg);
}

p.section-title.dec3::before {
    background: url(/img/kun.svg);
}

p.section-title.dec4::before {
    background: url(/img/panenka_spinkids.svg);
} */

body,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: Rubik, Segoe UI, Roboto, Helvetica Neue, Arial,
    sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !important;
}

.btn:not(.search-widget__btn) {
  border-radius: 10px;
}

.footer-cart a {
  justify-content: center;
}
.header-nav {
  background: var(--secondary);
}

.header-top__col {
  font-weight: 500;
  width: auto;
}

.homebanner-slide {
  max-height: 21rem;
}

.homebanner-slide .homebanner-content {
  flex-direction: column;
  height: 100%;
  position: absolute;
  width: 100%;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 1.5rem;
}

.homebanner-slide a.btn-brown {
  margin-top: 0.75rem;
  display: block;
  background: transparent !important;
  border: solid 1px white;
  border-radius: 1.75rem;
  padding: 0.25rem 1.5rem;
  font-size: 0.875rem !important;
}

.homebanner-slide a.btn-brown:hover {
  color: var(--main-dark-color);
  background: white !important;
}

.homebanner-slide .homebanner-description,
.homebanner-slide .homebanner-title {
  color: white;
  text-transform: none;
  font-size: 0.875rem;
}

.homebanner-title {
  font-size: 1.75rem !important;
  line-height: 1.3em !important;
}

.search-bar .header-item__icon img {
  max-height: 20px;
  transform: rotate(95deg);
}

a.btn-brown {
  background: var(--primary) !important;
  font-size: 1rem !important;
  border: none;
  color: white;
}

.new_products .product-miniature {
  max-width: 100% !important;
}

.new_products .all-product-link.btn {
  margin: 0 auto 2rem;
  display: block;
  max-width: max-content;
}
.benefit-box {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
}

.benefit-box .benefit-text h2 {
  margin-bottom: 0;
  margin-top: 1rem;
  color: var(--primary);
}

.benefit-box .benefit-text p {
  color: #2f2f2f;
  line-height: 1.3em;
}

.product-title,
.product-title a {
  font-size: 1rem !important;
  line-height: 1.2 !important;
}

span.price {
  font-weight: 600 !important;
  color: black !important;
  font-size: 1.5rem;
  text-wrap: nowrap;
}

span.price.current-price-discount {
  color: var(--primary) !important;
}
p.product-title a:hover {
  color: var(--primary) !important;
}

section.trending-now {
  background: #e6e6e6;
  padding: 4rem 0;
}

section.trending-now .section-title {
  max-width: 10rem;
  text-align: left;
  margin: 0;
}

.trending-now img {
  max-width: 100%;
}
.trending-now .brands {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  align-items: center;
  column-gap: 2rem;
}
.trending-now .spcustom_html {
  display: grid;
  grid-template-columns: 1fr 3fr;
  align-items: center;
}

.l-footer {
  margin-top: 3rem;
  padding-top: 0;
}

.footer-container {
  background: var(--main-dark-color);
  margin-top: 0;
}

.footer-container .footer-content {
  padding: 3rem 0 6rem;
}

img.footer-logo {
  margin: 0 auto;
  display: block;
  padding-top: 2rem;
  max-width: 12rem;
}

footer a {
  color: hsla(0, 0%, 100%, 0.7);
}

.footer__title {
  margin-bottom: 2rem;
}

ul.social_icons {
  display: flex;
}
ul.social_icons li {
  margin-right: 0.75rem;
}

ul.social_icons img {
  width: 2rem;
}

.footer-container li {
  padding: 0.25rem 0;
}

#categorySlider img {
  max-width: 1710px !important;
}
.product-onsale {
  color: #4a4a4a !important;
  background: #e3e3e3 !important;
  box-shadow: none !important;
}
.on-sale {
  background: rgb(180 1 173 / 80%) !important;
}
.product-flag {
  font-size: 0.9rem !important;
}

.cc-note[data-v-55c4d392] {
  display: none;
}
.main-navigation .menu-item a.highlight {
  border-bottom: none !important;
}
.blockreassurance_product .block-title {
  color: #535353 !important;
  font-weight: 600 !important;
  font-size: 15px !important;
}
.blockreassurance_product > div {
margin: 0.75rem 0;
}

.blockreassurance_product p {
  color: #888 !important;
  font-size: 14px !important;
}

.blockreassurance_product .item-product {
    flex-basis: 40px;
    min-width: 40px;
}
.blockreassurance_product .item-product img,
.blockreassurance_product .item-product svg {
  height: 29px !important;
  width: 29px !important;
}
#bottleCanvas {
  width: 100% !important;
  height: auto !important;
  background-image: url(https://bottlesandstories.cz/themes/bottles_and_stories/assets/img/customizations/volitelny_id_2829.jpg);
  background-size: contain !important;
  background-repeat: no-repeat !important;
}
.odpocet {
  width: 30% !important;
}
#categorySlider .slider-container {
  top: 40% !important;
}

@media (min-width: 992px) {
  div#menu-close {
    display: none;
  }
}

@media (max-width: 1650px) {
  .main-navigation .menu-item:not(:last-child) {
    margin-right: 3rem;
  }
}

@media (max-width: 1500px) {
  #homepageSlider .slider-container {
    align-items: flex-start;
  }

  .slider2 h2 {
    text-align: left;
  }
}

@media (max-width: 1270px) {
  .main-navigation .menu-item:not(:last-child) {
    margin-right: 1.25rem;
  }

  .main-navigation .menu-item a {
    font-size: 0.875rem;
  }

  .main-navigation .menu-item a span {
    padding-left: 0.2rem !important;
    padding-right: 0.2rem !important;
  }
  .slider2 h2 {
    font-size: 2.5rem;
  }

  .slider2 .carousel-navigation {
    display: none;
  }
}

@media (max-width: 786px) {
  .main-navigation .menu-item a {
    font-size: 1rem !important;
  }

  #homepageSlider .slider-container {
    max-width: 100%;
    background: linear-gradient(90deg, #000000b8 28rem, transparent 28rem);
  }
  .slider2 .rc.rc--lazyload {
    min-height: 30rem;
  }

  .slider2 img {
    height: 100%;
    object-fit: cover;
  }
}

@media (max-width: 991.98px) {
  #categorySlider,
  #homepageSlider,
  body:not(.index):not(#category) #wrapper {
    margin-top: 9.25rem;
  }

  body:not(.index):not(#category) #wrapper {
    margin-top: 15rem;
  }

  section#homepageSlider {
    overflow: hidden;
  }
  .main-navigation .menu-item {
    margin: 1.3rem 0 !important;
  }
  .header__logo,
  .header__logo--checkout {
    margin-bottom: 0;
  }

  .header__menu {
    padding-bottom: 0;
  }

  .search-bar {
    max-width: 90%;
    width: 100%;
    margin: 0 0 1rem 0 !important;
    position: absolute;
    bottom: -1rem;
  }
  a#show-search {
    margin-right: 2rem;
    display: flex;
  }

  
}
@media (min-width: 320px) and (max-width: 800px) {
  .tabs-content iframe {
    max-width: 512px;
    height: 290px;
    margin: 0;
    width: 100% !important;
  }
}

.block-category .category_description_action {
  text-align: right;
  display: block;
}

@media (max-width: 920px) {
  #categorySlider,
  #homepageSlider,
  body:not(.index):not(#category) #wrapper {
    margin-top: 12.25rem;
  }

  .header-nav {
    display: block;
  }

  .header-nav .header-nav__right {
    display: none;
  }

  .header-nav > .container-full {
    padding-top: 2px;
    padding-bottom: 2px;
  }

  #info-box > div {
    padding: 3px 4px !important;
  }

  #info-box .ml-3 {
    margin-left: 0 !important;
  }

  #offcanvas_search_filter .modal-content {
    padding-top: 0;
  }

  body.scroll-down #offcanvas_search_filter .modal-content {
    padding-top: 0;
  }

  body .product-miniature .psproductcountdown {
    font-size: 70%;
  }
}

body.scroll-down .l-header {
  transform: none;
}

#iqitmegamenu-mobile #iqitmegamenu-shower {
  top: 3.2rem;
}

#homepageSlider .slick-initialized .slick-slide {
  max-height: 100%;
}

.product-actions {
  gap: 1rem;
}

.product-actions__prices {
  width: 36%;
}
/* 
.product-actions__prices .product-prices {
  min-height: 55px;
} */

.product-actions__prices .product-prices.in-discount {
  margin-bottom: -0.65rem;
}

.product-actions__addtocart {
  width: 64%;
}

.product-prices {
  margin-bottom: 0;
}

.product-prices .price-label {
  font-size: 0.875rem;
}

.product-prices .value {
  font-size: 0.875rem !important;
}

.product-prices > .product-price .price {
  margin-left: 0;
  margin-right: 0;
}

.product__product-price .price {
  font-size: 20px;
  font-weight: 700 !important;
  color: #222 !important;
}

.product-discount-count {
  font-weight: 700;
  color: var(--primary);
  margin-bottom: 0.25rem;
}

.product-add-to-cart .add {
  margin-right: 0;
}

#product-availability {
  color: #267f24;
}

@media (min-width: 992px) {
  .checkout-form form,
  .page-content form,
  .page-wrapper--order-confirmation form {
    width: 100%;
    max-width: 100% !important;
  }
}

@media only screen and (max-width: 768px) {
  .product-actions {
    flex-direction: column;
  }

  .product-actions > div {
    width: 100%;
  }

  .product-add-to-cart .product-quantity {
    flex-wrap: wrap;
    justify-content: flex-start!important;
  }
}

.price-bottle {
  font-size: 14px;
  font-weight: 600;
}

.regular-price.regular-sale {
  font-size: 1rem;
  color: #5f5f5f;
  font-weight: 500;
}

.thumb-stock-overlay {
  background: rgba(227, 227, 227, 0.6);
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
}

.thumb-stock-overlay span {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  background: #4c4c4c;
  border-radius: 8px;
  max-width: 80%;
  padding: 0.5rem 1rem;
}

@media only screen and (max-width: 768px) {
  .thumb-stock-overlay span {
    text-align: center;
  }

  .section-title {
    font-size: 1.75rem;
  }

  .regular-price {
    font-size: 1rem;
  }

  .price.current-price-discount,
  span.price {
    font-size: 1.25rem;
  }
}

body#index #wrapper {
  margin-top: 4rem !important;
}

.menu-section-selector {
  padding: 1.75rem;
  margin-top: 0.5rem;
}

.menu-section-selector > .d-flex {
  gap: 26px;
}

.menu-section-selector .selector-item {
  font-size: 1.875rem;
  font-weight: 600;
  text-align: center;
  color: #333;
  /* background: #777; */
  background: transparent;
  border: none;
  border-bottom: 3px solid rgba(255, 255, 255, 0.15);
  /* width: 50%; */
  width: 100%;
  padding: 0.725rem 0;
  margin: 0;
  display: block;
  transition: all 0.4s ease-in-out;
}

.menu-tile__content.hover-image:hover img {
  filter: none;
}

.menu-tile__content:hover {
  background: white;
}

.menu-tile__content:hover span {
  color: var(--primary);
}

.selector-item:focus {
  outline: none;
}

.selector-item.active {
  color: var(--primary);
  text-shadow: none;
  border-bottom: 3px solid var(--primary);
  /* box-shadow: 7px 7px 30px -10px rgb(221, 90, 17, .8); */
}

.menu-section-int {
  display: none;
}

.menu-section-int.fade {
  opacity: 0;
  transition: opacity 0.15s linear;
}

.menu-section-int.show {
  opacity: 1;
}

.menu-section-int.active {
  display: block;
}

.menu-submenu
  .discount-products
  .product-miniature
  .card
  .card-img-top
  .product-thumbnail
  img {
  object-fit: contain;
}

@media (max-width: 1560px) {
  .menu-tile {
    padding: 0.375rem;
  }

  .menu-tile__content {
    padding: 0.75rem 0.8rem 0.725rem;
  }

  .menu-tile__content img {
    max-height: 58px;
    margin-bottom: 1rem;
  }

  .menu-section-selector .selector-item {
    padding: 0.325rem 0;
  }
}

@media (max-width: 1280px) {
  .menu-tile__content {
    flex-direction: row;
    justify-content: flex-start;
  }

  .menu-tile__content img {
    max-width: 30%;
    height: auto;
    margin-bottom: 0;
  }
}

a#dm_prices_popup_button {
  font-size: 0.875rem;
}
a#dm_prices_popup_button:link {
  color: inherit;
}

#dm_prices_popup .modal-header .close {
  position: absolute;
  top: 20px;
  right: 20px;
}

body#checkout .l-footer {
  display: none;
}

.menu-item span.highlight img {
  max-width: 20px;
  padding-bottom: 3px;
}

.visible--mobile .cbp-hrsub-inner {
  padding-top: 68px;
}

/* cart edit */
i.material-icons.list {
  display: none;
}
#cart .product-line__img {
  max-width: 5rem;
  height: auto;
}

#cart .product-line-grid .product-line__title {
  font-size: 1rem;
  margin-bottom: 0;
}

.cart-items-header {
  padding: 1rem 0;
  border-bottom: 1px solid #f1f1f1;
  font-size: 14px;
}

.cart-items-header-right span {
  flex: 1;
  gap: 1rem;
}

.cart-items-header-right {
  padding-right: 1.5rem !important;
  display: flex;
}

.cart-item {
  padding: 1rem 0;
}

#cart.product-line-grid {
  padding: 0.5rem 0;
}

.inner-product-unit-price-label {
  display: none;
}

#cart .product-line-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* gap:1rem */
}

#cart .product-line-actions > div,
.product-line-actions > span {
  flex: 1;
}

#cart .product-line-actions > .cart-line-product-actions {
  max-width: 1.5rem;
}

.cart-header-wrap {
  width: calc(66% - 2.5rem);
  display: flex;
  gap: 3rem;
  justify-content: space-between;
  align-items: center;
}

.cart-header-wrap h1 {
  min-width: max-content;
}

.cart-header-wrap #doprava_zdarma_here_order {
  max-width: 25rem;
}
#cart #product-availability {
  font-size: 14px;
  font-weight: 600;
}

#product-availability i {
  font-size: 1.5rem;
}
/* 
#cart .cart-detailed-totals {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 1rem;
} */

/* #cart .cart-summary-totals {
  display: flex;
  gap: 1rem;
  align-items: baseline;
} */

.cart-summary-totals .cart-summary-line {
  justify-content: end;
}

#cart .cart-summary-line.cart-total {
  font-size: 2rem;
}

/* Adaptis/Claude 2026-07-04 checkout rework — CART PAGE (/kosik, body#cart).
   (2) Discount entry is moved into the checkout, so hide the "Máte slevový kód?"
   prompt + code input here. The applied-voucher list (.promo-name) is left visible;
   only the toggle, the collapsible input panel and the offer-suggestion list are hidden. */
#cart .cart-detailed-totals .promo-code-button,
#cart .cart-detailed-totals #promo-code,
#cart .cart-detailed-totals .promo-highlighted,
#cart .cart-detailed-totals .promo-discounts { display: none !important; }

/* (3) Grand-total row ran together as "Celkem1 200 Kč": the earlier
   `.cart-summary-totals .cart-summary-line { justify-content: end }` override pushed the
   label and value together at the right edge. Restore label-left / value-right just for
   the grand-total row (the tax-excl. line stays right-aligned). */
#cart .cart-summary-totals .cart-summary-line.cart-total {
  justify-content: space-between;
  gap: 1rem;
}

#cart .card-footer {
  background: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 0;
  flex-wrap: wrap;
  gap: 1rem;
  width: 100%;
  border: none;
}

.promo-code__content {
  background: none;
  display: flex;
  gap: 1rem;
  align-items: center;
}

.form__add-voucher {
  margin-bottom: 0;
}

.cart-footer-right {
  display: flex;
  gap: 1rem;
  align-items: center;
}

#cart div#content-wrapper {
  margin-top: 3rem;
}

#cart .cart-darique .card-block {
  flex: unset;
}

#cart .cart-detailed-actions > div {
  min-width: max-content;
}

#cart .cart-darique h2 {
  font-size: 2.25rem;
}

#cart .cart-darique,
#cart .cart-darique .card-block {
  border: 0;
  padding: 0;
}
#cart .product-line__body {
  max-width: 13rem;
}
#cart .card-block {
  background: none;
}
#cart .cart-darique {
  padding: 15px;
}

.cart-darique .arrow_left{
  border:none;
  left: 0;
}

.cart-darique .arrow_right {
  border:none;
  right: 30px;
}

.cart-darique .arrow_left::before, .cart-darique .arrow_right::before {
  font-family: Material Icons;
  font-feature-settings: "liga" 1;
  font-size: 34px;
  color: inherit;
  line-height: 80px;
  text-align: center;
  display: block;
  opacity: 0.5;
  content: "\e5cc";
}

.cart-darique .arrow_left::before {
  content: "\e5cb";
}

#cart li.dariqueItem {
  max-width: max-content;
}

#cart ul.dariqueWrapper li .gift .gift-img img {
  max-width: 5rem;
  margin-bottom: 1rem;
}

#cart ul.dariqueWrapper li .gift img {
  transform: scale(0.98);
  transition: transform ease-in 0.05s;
}

#cart ul.dariqueWrapper li .gift:hover h5 {
  color: #dc3545;
}

#cart ul.dariqueWrapper li .gift {
  border-color: transparent;
}

#cart ul.dariqueWrapper li .gift:hover {
  background-color: inherit;
  border-color: #dc3545;
}

#cart ul.dariqueWrapper li .gift:hover img {
  transform: scale(1);
}

#cart .cart-darique h3 {
  text-align: left;
}

div#dariqueWrapper {
  padding: 1rem 0;
}

#cart .btn-secondary {
  background: none;
  color: #333;
  border: none;
  padding: 0;
}

#cart .btn-secondary i {
  font-size: 0.75rem;
  position: relative;
  bottom: -6px;
}

.cbp-mobilesubmenu li {
  padding-left: 0!important;
}
.category.featured-products .product-miniature {
  flex: 0 0 calc(20% - 20px) !important;
  max-width: calc(20% - 20px) !important;}
@media (max-width: 1500px) {
  .cart-header-wrap {
    width: 66%;
  }
}

@media (max-width: 1350px) {
  #cart .cart-container,
  #cart .cart-darique,
  #cart .card-footer {
    padding: 1rem;
  }

  .cart-header-wrap {
    width: 100%;
  }

  .cart-header-wrapper .cart-detailed-actions {
    display: none;
  }

  .layout-full-width .product-miniature {
    flex: 0 0 33.33%;
    max-width: 33.33%;
  }
  .category.featured-products .product-miniature {
    flex: 0 0 calc(33% - 20px) !important;
    max-width: calc(33% - 20px) !important;
    margin-left: 10px;
    margin-right: 10px;
  }
}

@media (max-width: 991px) {
  #cart .product-line__body {
    max-width: unset;
  }

  .sort-by-row {
    margin-top: 1rem;
  }

  .cart-header-wrap {
    flex-direction: column;
    gap: 1rem;
    align-items: flex-start;
  }

  .nav-tabs--center {
    margin-bottom: 3rem !important;
  }

  .cart-header-wrap #doprava_zdarma_here_order {
    max-width: 100%;
  }

  .header__menu {
    padding: 1px;
  }

  .cart-items-header {
    display: none;
  }

  .inner-product-unit-price-label {
    display: inline-block;
  }

  body#cart h1 {
    font-size: 2.25rem;
  }

  .category_content {
    grid-template-columns: 1fr;
    margin-top: 0;
  }

  .sort-by-row {
    flex-direction: row;
  }


  .product-thumbs .slick-next,
  .product-thumbs .slick-prev {
    transform: translateX(0px) !important;
  }
}

@media (max-width: 720px) {
  .layout-full-width .product-miniature {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .category.featured-products .product-miniature {
    flex: 0 0 calc(50% - 20px) !important;
    max-width: calc(50% - 20px) !important;
  }

  .product-flag {
    font-size: 0.7rem !important;
  }
}

@media (max-width: 620px) {
  #cart .stock-availability {
    display: none;
  }

  body#cart h1,
  #cart .cart-darique h2 {
    font-size: 1.75rem;
    text-align: center;
    margin-bottom: 1rem;
  }

  body#cart h1 {
    margin: 0 auto;
    margin-bottom: 1rem;
  }

  .cart-header-wrapper {
    justify-content: center !important;
  }

  .cart-header-wrap {
    align-items: center;
  }

  #cart .cart-summary-line.cart-total {
    font-size: 1.75rem;
  }

  #cart .cart-detailed-totals {
    gap: 0;
    flex-direction: column;
    align-items: center;
    justify-content: center !important;
    margin-top: 1rem;
  }

  #partners-mobile .partners {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  #cart .product-line-actions {
    flex-direction: row;
  }

  #cart .product-line-actions > div {
    flex: unset;
  }
  .category.featured-products .product-miniature {
    flex: 0 0 calc(100% - 20px) !important;
    max-width: calc(100% - 20px) !important;
  }
}

#cart .product-line-grid .product-price {
  justify-content: center;
}

.product-miniature {

  background: #fff;
  border-radius: 10px;
}

.layout-full-width .product-accessories .product-miniature {
  max-width: calc(100% - 20px) !important;
  min-height: 25rem;
}

@media (min-width: 992px) {
  .product-miniature {
    flex: 0 0 calc(20% - 20px);
    max-width: calc(20% - 20px);
    margin: 0 10px;
}

  .layout-full-width .product-miniature {
    flex: 0 0 calc(25% - 20px) !important;
    max-width: calc(25% - 20px) !important;
    padding-left: 20px;
    padding-right: 20px;
    margin: 0 10px;
  }

  
  
}

@media (max-width: 1400px) and (min-width: 1201px) {
  .product-miniature {
    flex: 0 0 20%;
    max-width: 20%;
  }

  .new_products .products {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}

  .menu-tile {
    flex: 0 0 20%;
    max-width: 20%;
  }
}
@media (max-width: 1350px) and (min-width: 1200px) {
  #cart-summary-product-list .media {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    border-bottom: solid 1px #f1f1f1;
    padding-bottom: 1rem;
  }

  .cart-summary-totals .cart-summary-line {
    justify-content: flex-start;
  }
}

@media (max-width: 1200px) {
  .product-miniature {
    flex: 0 0 33.33%;
    max-width: 33.33%;
  }

  .new_products .products {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }

  .menu-tile {
    flex: 0 0 25%;
    max-width: 25%;
  }
  #cart .cart-grid {
    grid-template-columns: 1fr;
  }
  .promo-code-button {
    text-align: left;
  }
}
@media (max-width:1024px) {
  .additional-info-box > div {
    min-width:33.333%
  }
}
@media (min-width: 992px) and (max-width: 1155px) {
  #product .product-actions {
    gap: 1rem;
    align-items: flex-end;
    flex-direction: column;
    align-items: flex-start;
  }

  .product-actions__prices {
    width: 95%;
    margin-bottom: 1rem;
  }
  .product-actions__addtocart {
    width: 100%;
  }
}

@media (min-width: 992px) and (max-width: 1340px) {
span.header-item__name, .header-item__value{
  display: none!important;
}

.header__rightitem:not(:last-child), a#show-search{
  margin-right: 1rem!important;}

  .wishlist-link.header__rightitem {
    margin-left: 1rem!important;;
  }}

@media (max-width: 991px) {
  .menu-tile {
    flex: 0 0 100%;
    max-width: 100%;
  }

  div#product-details {
    padding: 20px;
  }

  .promo-code__content {
    position: relative;
  }

  .alert.alert-danger.js-error.promo-code-alert {
    position: absolute;
    top: -4rem;
    width: auto;
    left: 1.25rem;
    padding: 1.5rem 1rem;
  }

  #product .product-accessories {
    width: 100%;
    margin-left: 0.6rem;
  }

  span.header-item__name, span.header-item__value {
    display: none;
}

.header__rightitem:not(:last-child) {
  margin-right: 2rem!important;
}

.carousel-navigation a {
  width: 1.875rem;
  height: 1.875rem;
}
}


@media (max-width: 720px) {
  .product-miniature {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .new_products .products,
  .blog {
    grid-template-columns: repeat(2, 1fr);
  }


  div#info-box {
    font-size: 0.825rem;
  }

  .zas-box {
    flex-direction: column;
  }

  body#index #wrapper {
    margin-top: 0!important;
  }
}

@media (min-width: 481px) and (max-width: 720px) {
  #index .product-miniature:last-child,
  #index .new_products .products article:last-child, #index .blog .post:last-child{
    display: none;
  }


  }
  
@media (max-width: 680px) {
span.header-item__name, .header-item__value{
  display: none!important;
}

.header__rightitem:not(:last-child), a#show-search{
  margin-right: 1rem!important;}

  .wishlist-link.header__rightitem {
    margin-left: 1rem!important;;
  }

  }

@media (max-width: 480px) {
  .blog {
    grid-template-columns: repeat(1, 1fr);
  }

  .homebanner-title {
    font-size: 1.25rem !important;
  }

  #cart-summary-product-list .media {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    border-bottom: solid 1px #f1f1f1;
    padding-bottom: 1rem;
  }

  .cart-summary-totals .cart-summary-line {
    justify-content: flex-start;
  }

  .sort-by-row {
    flex-direction: column;
    align-items: flex-start;
    margin-top: 0;
}

.delivery-option label .col-3 {
  display: none;
}

.delivery-option > .row {
  flex-wrap: nowrap;
}

.product-miniature {
  flex: 0 0 100%;
  max-width: 100%;
}

.new_products .products,
.blog {
  grid-template-columns: repeat(1, 1fr);
}
}

.highlighted-informations {
  position: relative !important;
  transform: none !important;
}

.product-miniature-content {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.product-miniature-content .price.current-price-discount {
  margin-left: 0;
}

.product-miniature #product-availability {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  font-size: 0.625rem;
}

.product-miniature #product-availability strong {
  text-transform: uppercase;
}

.product-miniature .product-title {
  text-align: left;
  font-size: 0.75rem;
}

.product-miniature-content .highlighted-informations,
.product-miniature-content .highlighted-informations .btn-primary {
  width: unset;
  margin-bottom: 0.25rem;
  margin-left: 0.25rem;
}

.product-miniature button#add_to_cart,
.product-miniature .highlighted-informations .btn-primary {
  font-size: 1rem;
  padding: 0.5rem 0.75rem 0.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 10px;
}

.product-miniature .price.current-price-discount,
.product-miniature span.price {
  font-size: 1.25rem;
}

img.add-to-cart-img {
  width: 100%;
  max-width: 1.35rem;
  filter: invert(1) grayscale(3) brightness(4.5)
}

.card-body {
  padding: 1.25rem;
}

.delivery-option img {
  max-width: 4rem;
}

div#category-description p {
  font-size: 1rem !important;
  line-height: 1.7em;
}
.sort-by-row,
#select-sort-order,
#search_filters .h6 {
  font-size: 1rem !important;
}

span.carrier-name {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
}

#order-confirmation div#content-wrapper {
  margin-top: 4rem;
}

.promo-code-alert {
  margin-bottom: 0;
}

.custom-control-input {
  z-index: 99999999999999999999999999;
}

.main-navigation .menu-item {
  margin: 0 !important;
  padding: 0.75rem 1rem;
}

header .main-navigation .menu-item:first-of-type {
  padding-left: 0;
}

li.menu-item.menu-item-14 {
  background: #fde4e4;
}

.product-quantity .qty .input-group-btn-vertical {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.bootstrap-touchspin .btn {
  padding: 0.175rem 0.75rem;
}


.header-item__icon {
  width: 46px;
  margin-right: 8px;
  height: 46px;
  margin-bottom: 0;
  border: 1px solid #e9e9e9;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 6px;
}

header .blockcart .header-item__icon {
  max-width: unset;
}

.header-item__icon img {
  max-height: 20px;
}

.header-item__value {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2;
  text-transform: lowercase;
  display: block;
}

.blockcart__count {
  display: none;
}

.header__rightitem:not(:last-child) {
  margin-right: 3.8rem;
}

.wishlist-link.header__rightitem {
  margin-left: 3.8rem;
}

.current-price-offset {
  padding-top: 26px;
}


/* maintenance */

#mimo-provoz {

  height: 100vH;
  text-align: center;
  padding: 1.25rem;
  color: white;
  display: flex;
  justify-content: center;
  flex-flow: wrap column;
  align-items: center;
  margin-top: -3rem;}


#mimo-provoz img {
      max-width: 13rem;
      margin-bottom: 1.75rem;
    }
#mimo-provoz  h1 {
      font-size: 2.25rem;
      color: #c14692;
      margin-bottom: 1.25rem;
      text-transform: uppercase;
    }
p {
      font-size: 1.25rem;
      margin-bottom: 0.25rem;
      color:#333
  
}

.PM_ASBlockOutputVertical .PM_ASCriterionsGroupTitle {
  border-bottom: none;}

  .PM_ASResetGroup {
    font-size: 11px;
    margin-top: 5px;
}

input[type="radio"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: inline-block;
  width: 20px;
  height: 20px;
  padding: 3px;
  background-clip: content-box;
  border: 2px solid #333;
  background-color: #e7e6e700;
  border-radius: 50%!important;
  margin-bottom: 4px;
}

input[type="radio"]:checked {
 background-color: var(--primary);
}

.custom-radio .custom-control-label:before {
  border: solid 1px #c61717;
  border-radius:100%;
  box-shadow:none
}



    input[type="checkbox"] {
      /* Add if not using autoprefixer */
      -webkit-appearance: none;
      appearance: none;
      /* For iOS < 15 to remove gradient background */
      background-color: #fff;
      /* Not removed via appearance */
      margin: 0;
    }

    input[type="checkbox"] {
      appearance: none;
      background-color: #fff;
      margin: 0;
      font: inherit;
      color: currentColor;
      width: 1.15em;
      height: 1.15em;
      border: 0.15em solid currentColor;
      border-radius: 0.15em;
      transform: translateY(-0.075em);
    }
    
    .form-control + .form-control {
      margin-top: 1em;
    }

    input[type="checkbox"] {
      /* ...existing styles */
    
      display: grid;
      place-content: center;
    }

    input[type="checkbox"]::before {
      content: "";
      width: 0.65em;
      height: 0.65em;
      transform: scale(0);
      transition: 120ms transform ease-in-out;
      box-shadow: inset 1em 1em var(--primary);
    }


    input[type="checkbox"] {
      display: inline-grid;
      place-content: center;
    }
    
    input[type="checkbox"]::before {
      content: "";
      width: 0.65em;
      height: 0.65em;
      transform: scale(0);
      transition: 120ms transform ease-in-out;
      box-shadow: inset 1em 1em var(--primary);
    }
    
    input[type="checkbox"]:checked::before {
      transform: scale(1);
    }

    input[type="checkbox"]::before {
      /* ...existing styles */
    
      transform-origin: bottom left;
      clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
    }

    input[type="checkbox"]:focus {
      outline: max(2px, 0.15em) solid currentColor;
      outline-offset: max(2px, 0.15em);
    }

    input[type="checkbox"]:disabled {
      --form-control-color: #333;
    
      color: #333;
      cursor: not-allowed;
    }

    
    /* cookie lišta respo fix */
    .lgcookieslaw-reject-all-button-enabled .lgcookieslaw-button-container {
      flex-wrap: wrap;
  }

  .lgcookieslaw-button-container button, .lgcookieslaw-button-container a {
      margin: 0.25rem!important;
  }

  @media (max-width:1370px) {
      .lgcookieslaw-reject-all-button-enabled .lgcookieslaw-message {
          width: calc(50% - 0.5rem);
      }

      .lgcookieslaw-reject-all-button-enabled .lgcookieslaw-button-container {
          width: 50%;}
  }


  @media (max-width:1120px) {
      .lgcookieslaw-button-container button, .lgcookieslaw-button-container a {
          width:100%!important;
          display:block
      }

      .lgcookieslaw-reject-all-button-enabled .lgcookieslaw-message {
          width: calc(60% - 0.5rem);
      }

      .lgcookieslaw-reject-all-button-enabled .lgcookieslaw-button-container {
          width: 35%;}
  }

  @media (max-width:480px) {
      .lgcookieslaw-reject-all-button-enabled .lgcookieslaw-message, .lgcookieslaw-reject-all-button-enabled .lgcookieslaw-button-container  {
          width:100%!important;
      }

  }

  .fancybox-overlay-fixed {
    z-index: 999999999999999;
}

#product-modal .modal-dialog {
  max-width: 800px;
}

#product-modal figure, #product-modal img {
  max-width: 800px;
  height: auto;
}

.product-features dl.data-sheet {
  column-count: 2;
}

.product-features .item {
  white-space: nowrap!important;
  overflow: hidden;
}

#product dl.data-sheet dt{
  margin-top: 0;
}

#product dl.data-sheet dd, .product-features .product-reference span, .product-features .product-out-of-stock span, .product-features .product-availability-date span {
  margin-bottom: 1.25rem;
  display: block;
}

.product-miniature #product-availability strong {
  line-height: 1.4;
}

/* new search */

.prsr-input {
  font-size: 14px;
  height: 2.825rem;
  border: none;
  background: #f9f9f9;
  border-radius: 10px;
}

.prsr-button {
  background:var(--primary);
  border-radius: 0 10px 10px 0;
  height: auto;
  display: flex;
  align-items: center;
  padding: 0.25rem 1.75rem;
  font-weight: 600;
  font-size: 14px;
}

.prsr-button svg{
  margin-left: 0.5rem;
}

.prsr-header {
  background-color: transparent;
  color: #333;
  padding: 0.5rem 0 0 0;
}

.prsr-content .product-availability i {
  position: relative;
  bottom: 8px;
}

.prsr-result {
  box-shadow: 1px 7px 35px rgb(0 0 0 / 7%);}

  .prsr-content .discount, .prsr-flag {
    background-color: #c71717;
    font-weight: 600;
  }

  #module-prestaprosearch-search #categories h3 a {
    padding: 1rem;
    background: #fff7f7;
    border-radius: 10px;
    color: inherit;
    display: block;
}

#module-prestaprosearch-search #categories h3  {
  margin:0
}

#module-prestaprosearch-search #categories .prsr-thumbnail {
  margin: 0 0.5rem 0.5rem 0;
}


.search-bar {
  max-width: 35rem;
  margin: 0 1rem!important;
  width: 100%;
}
.search-form {
  position: unset;
}

.search-bar {
  max-width: 35rem;
  margin: 0 1rem!important;
}

.search-bar.active .prsr-form  {
  display: flex;
  z-index: 999999;
}
.products-selection >div {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

@media (max-width: 991.98px){
  .prsr-form  {
    position: unset;
      width: 100vw;
      max-width: 1190px;
      display: none;
      position: absolute;
      top: -16%;
      right: 70%;
  }
  .prsr-form  {
    width: 90%;
    top: 140%;
    right: 5%;
    z-index: -1;
  }

  .prsr-input {
    border-radius: 10px 0 0 10px;
}
 .prsr-button {
  font-size: 0;
 }


}


@media (max-width: 767px) {
  #module-prestaprosearch-search #categories .prsr-thumbnail {
    width: 48%;
}
}

@media (max-width:520px) {
  #module-prestaprosearch-search #categories .prsr-thumbnail {
    width: 100%;
    margin: 0 0 0.5rem 0;
}

}


  /*** cart quantity fix ***/

.cart-footer-right.disabled .checkout{
  cursor: no-drop;
}

.cart-footer-right.disabled span[data-convertim-toggle="true"] {
  pointer-events: none;
  background: #bdbdbd!important;
  border-color: #bdbdbd!important;
}

/* Adaptis JK edit — order-button loading state (parity with SpinKids.bg reference) */
.cart-detailed-actions span[data-convertim-toggle="true"] {
	display: none;
}

.cart-detailed-actions a.btn-primary.loading {
	opacity: 0.4;
	display: inline-block;
}

.cart-detailed-actions a.btn-primary.loading>i {
	display: block;
	width: 8px;
	height: 8px;
	margin-left: 15px;
	border: 5px solid #FFF;
	border-bottom-color: transparent;
	border-radius: 50%;
	display: inline-block;
	box-sizing: border-box;
	animation: rotation 1s linear infinite;
}

@keyframes rotation {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}
/* /Adaptis JK edit */

.quantity-alert div {
  background: #9c0202d4;
  padding: 1.25rem;
  color: #fff;
  margin-top: 1rem;}

.product-line-grid.alerted .js-cart-line-product-quantity, 
.product-line-grid.alerted .input-group button,
.product-line-grid.alerted .product-line__title,
.quantity-allowed {
    color: #f91818;
}

.product-line-grid.alerted span#product-availability {
  color: #f91818;
  text-decoration: line-through;
}

.quantity-allowed {
  font-size: 0.875rem;
  font-weight: 600;
}

/*** end of cart quantity fix ***/

.cart-darique .loader {
  display: none!important;
}

@media (min-width:992px) {
  #main.search-page-not-found {
    width: calc(125% + 40px);
    left: -33%;
    position: relative;
    text-align: center;
  }
  
}


#main.search-page-not-found section#content {
  display: flex;
  flex-direction: column;
  align-items: center;
}


#content .prsr-block-top {
  display: block!important;
  margin: 1rem!important;
}

/* hlidacipes */
.js-mailalert {
  padding: 1.75rem 1.5rem;
  background: white;
  margin-top: 2rem;
  border-radius: 10px;
  border:solid 1px #c71717
}

.js-mailalert input.form-control {
  background-color:whitesmoke!important}

.js-mailalert p {
  font-size: 1rem;
  margin-bottom: 1.25rem;
}

.js-mailalert button {
  margin-top: 1.25rem;
}

.js-mailalert  .custom-control-label {
  font-size: 0.875rem;
}

.not-found-title {
  font-size: 2rem;
  FONT-WEIGHT: 800;
  color: #d6000b;
  text-transform: uppercase;
  letter-spacing: -1px;
  text-transform: uppercase;
}

.tab-alert .btn-primary[disabled="disabled"] {
  color: #fff !important;
}

.product-packs__featured {
  background: #fff4f8;
  margin-top: 0.5rem;
  padding: 1.75rem 1rem 0.5rem;
  position: relative;
}

.product-packs__featured .text-high {
  color: #C71717;
}

.product-packs__featured .mask {
  width: 180px;
}

.pack-product-wrapper .name {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4em;
}

.pack-product-wrapper .name a {
  color: #C71717;
}

.product-packs__featured .carousel-navigation a {
    border-radius: 50%;
    box-shadow: 0 20px 25px -5px rgba(0,0,0,.1), 0 10px 10px -5px rgba(0,0,0,.04);
}

.product-packs__featured .carousel-navigation a::before {
    line-height: 31px;
}

.product-packs__featured .carousel-navigation a.previous {
    top: 50%;
    left: 0;
    transform: unset;
}

.product-packs__featured .carousel-navigation a.next {
    top: 50%;
    left: unset;
    right: 0;
    transform: unset;
}

.packfeatured-miniature-item .name {
  padding: 0 1rem;
}

.pack-product-price-old {
  font-size: 13px;
  text-decoration: line-through;
  color: #a5a5a5;
}

@media (max-width: 426px) {
  .product-packs__featured .mask {
    width: 100%;
  }
}


/* gifts product page */
.all-gifts-wrapper {
  background: #fff;
  border: 1px solid #d0d0d0;
}

.all-gifts-wrapper h3 {
  background: rgb(249,249,249);
  background: -moz-linear-gradient(180deg, rgba(249,249,249,1) 0%, rgba(251,251,251,1) 49%, rgba(254,254,254,1) 49%, rgba(255,255,255,1) 100%);
  background: -webkit-linear-gradient(180deg, rgba(249,249,249,1) 0%, rgba(251,251,251,1) 49%, rgba(254,254,254,1) 49%, rgba(255,255,255,1) 100%);
  background: linear-gradient(180deg, rgba(249,249,249,1) 0%, rgba(251,251,251,1) 49%, rgba(254,254,254,1) 49%, rgba(255,255,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f9f9f9",endColorstr="#ffffff",GradientType=1);
  padding: 0 1rem;
  max-width: max-content;
  margin: 0 auto;
  margin-top: -0.75rem;
}

.all-gifts-wrapper .name {
  font-size:15px
}

.all-gifts-wrapper .gift-price {
  color: #424242;
}

/* .product-packs__featured {
  position: relative;
} */

.all-gifts-wrapper .carousel-navigation a {
  border-radius: 50%;
  box-shadow: 0 20px 25px -5px rgba(0,0,0,.1), 0 10px 10px -5px rgba(0,0,0,.04);
}

.all-gifts-wrapper .carousel-navigation a::before {
  line-height: 31px;
}

.all-gifts-wrapper .carousel-navigation a.previous {
  top: 50%;
  left: 0;
  transform: unset;
}

.all-gifts-wrapper .carousel-navigation a.next {
  top: 50%;
  left: unset;
  right: 0;
  transform: unset;
}

.all-gifts-wrapper p {
  font-size: 1rem;
}

.text-orange {
  color: #FA9B2B;
}
@media (min-width: 991px) {
  nav.visible--desktop {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
  }
}
@media (min-width: 768px) {
    .product-packs__featured .carousel-navigation a{
        width: 50px;
        height: 50px;
        margin-top: 20px;
        padding-top: 10px;
    }
}

/* ============================================================================
   Adaptis/Fable 2026-07-02 — CHECKOUT REDESIGN
   Faithful port of the approved mockup (scratchpad/checkout-redesign.html) onto
   PrestaShop 1.7.7.5's real checkout DOM. Replaces the former "one-page checkout"
   and "minimal checkout header" blocks — their behaviour-critical rules (steps
   always open, hidden per-step Continue buttons, tab-pane hard-hide, …) are
   carried over below, restyled to the mockup's design system.

   EVERYTHING is scoped to body#checkout (steps: #js-checkout-process, summary
   rail: .order-checkout) so nothing leaks to other pages.

   Sacred, untouched mechanics: #payment-confirmation / #conditions-to-approve /
   .js-payment-option-form (core.js payment gate), #js-delivery + carrier radios
   (selectDeliveryOption AJAX), address save/guest/login submits, autocomplete
   attributes, #freeshipping_progress module ids (wrappers restyled only).
   ========================================================================= */

/* ---------------------------------------------------------------- tokens --- */
body#checkout {
  --co-ground: #FFFFFF;
  --co-panel: #F7F8FA;
  --co-panel-2: #FBFBFC;
  --co-ink: #16161D;
  --co-muted: #74757E;
  --co-muted-2: #9A9BA3;
  --co-line: #E9EAEE;
  --co-line-strong: #DDDEE4;
  --co-brand: #E4002B;
  --co-brand-ink: #BC0022;
  --co-brand-tint: #FFF1F3;
  --co-success: #12A150;
  --co-success-tint: #E9F8EF;
  --co-focus: #2563EB;
  --co-r-sm: 8px;
  --co-r-md: 12px;
  --co-r-lg: 16px;
  --co-shadow: 0 1px 2px rgba(20, 20, 30, .04), 0 6px 24px -12px rgba(20, 20, 30, .12);
  --co-shadow-card: 0 1px 0 rgba(20, 20, 30, .03);
  --co-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --co-round: ui-rounded, "SF Pro Rounded", "Segoe UI", system-ui, sans-serif;

  font-family: var(--co-sans);
  font-size: 15px;
  line-height: 1.45;
  color: var(--co-ink);
  -webkit-font-smoothing: antialiased;
  background:
    radial-gradient(1200px 380px at 85% -120px, #FFF4F6 0%, rgba(255, 244, 246, 0) 70%),
    var(--co-ground);
}

/* keyboard focus ring (mockup .co :focus-visible); text inputs get their own
   brand ring below instead */
body#checkout :focus-visible {
  outline: 2.5px solid var(--co-focus);
  outline-offset: 2px;
  border-radius: 6px;
}
body#checkout .form-control:focus,
body#checkout .form-control:focus-visible,
body#checkout .custom-select:focus,
body#checkout .custom-select:focus-visible {
  outline: 0;
}

/* ------------------------------------------------- behaviour keepers --------
   (carried over from the former one-page-checkout block — do not remove) */

/* Adaptis/Claude 2026-07-04 checkout rework — PROGRESSIVE DISCLOSURE (client req. 3).
   The accordion is driven by custom.js, which adds body.opc-accordion once its
   controller is live and then manages each step's .collapse.show itself.
   The force-open rule below therefore only applies while that class is ABSENT:
   templates still ship every step as "collapse show", so if the JS bundle is
   ever stale or fails, the checkout degrades to the proven all-open one-page
   layout instead of stranding the customer behind collapsed panels. */
body#checkout:not(.opc-accordion) #js-checkout-process .checkout-step .collapse {
  display: block !important;
  height: auto !important;
  visibility: visible !important;
}
body#checkout #js-checkout-process .checkout-step.-unreachable { opacity: 1 !important; }
/* per-step Edit collapse-toggle: hidden by default (all-open fallback has no use
   for it); the accordion re-purposes it as the "edit a completed step" affordance */
body#checkout #js-checkout-process .checkout-step .step-edit { display: none !important; }

/* ----- accordion states (classes set by custom.js's opc accordion controller) --- */
/* completed, collapsed step: whole header is clickable to re-open */
body#checkout.opc-accordion #js-checkout-process .checkout-step .card-header { cursor: default; }
body#checkout.opc-accordion #js-checkout-process .checkout-step.opc-done .card-header { cursor: pointer; }
body#checkout.opc-accordion #js-checkout-process .checkout-step.opc-done .card-header:hover { background: var(--co-panel-2) !important; }
/* the closed card keeps no bottom border line under its header */
body#checkout.opc-accordion #js-checkout-process .checkout-step:not(.opc-open) .card-header { border-bottom: 0; }
/* green check chip for completed steps (uses the template's own hidden
   i.material-icons.done that ships in every step title) */
body#checkout.opc-accordion #js-checkout-process .checkout-step.opc-done .step-number {
  background: var(--co-success);
}
body#checkout.opc-accordion #js-checkout-process .checkout-step.opc-done .step-title .done {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  order: 10;
  margin-left: auto;
  font-size: 18px;
  color: var(--co-success);
}
/* re-purposed Edit button on completed steps (translated label from the tpl) */
body#checkout.opc-accordion #js-checkout-process .checkout-step.opc-done .step-edit {
  display: inline-flex !important;
  align-items: center;
  gap: 4px;
  order: 11;
  float: none;
  margin-left: 10px;
  padding: 2px 8px;
  border: 1px solid var(--co-line-strong);
  border-radius: 999px;
  background: #fff;
  color: var(--co-muted) !important;
  font-size: 11.5px;
  font-weight: 600;
  text-transform: none;
  text-decoration: none !important;
  line-height: 1.4;
}
body#checkout.opc-accordion #js-checkout-process .checkout-step.opc-done .step-edit:hover {
  border-color: var(--co-brand);
  color: var(--co-brand) !important;
}
body#checkout.opc-accordion #js-checkout-process .checkout-step.opc-done .step-edit .material-icons { font-size: 13px; }
/* steps not yet unlocked: visually parked, header inert (clicks are also
   blocked in JS — this is just the visual cue) */
body#checkout.opc-accordion #js-checkout-process .checkout-step.opc-locked { opacity: .55; }
body#checkout.opc-accordion #js-checkout-process .checkout-step.opc-locked .card-header { cursor: not-allowed; }

/* per-step "Continue" chrome a one-page layout doesn't need:
   – logged-in personal-info GET "Continue" form is pure navigation → hidden
   – delivery step persists via core.js AJAX on radio change → its Continue hidden
   – addresses: ONLY the saved-address-selector Continue is hidden (radio picks
     auto-submit via custom.js); the open add/edit address form keeps its own
     Save/Continue (rendered inside .form-wrapper footer.form-footer) */
body#checkout #checkout-personal-information-step form[method="get" i] { display: none !important; }
body#checkout #js-delivery button[name="confirmDeliveryOption"] { display: none !important; }
body#checkout #checkout-addresses-step .js-address-form > form > .clearfix > button[name="confirm-addresses"] { display: none !important; }

/* the inactive login/guest tab pane must be REALLY hidden so Chrome autofill
   ignores its duplicate email/password fields */
body#checkout .tab-content > .tab-pane:not(.active) { display: none !important; }

/* the sidebar summary recaps the order → the tall in-step final summary is noise */
body#checkout #order-summary-content { display: none !important; }
body#checkout #checkout-payment-step .content > hr { display: none; }

/* summary rail: only the summary card, the relocated CTA foot and the reassure
   strip may show (hides displayReassurance & other hook output) */
body#checkout .order-checkout > *:not(#js-checkout-summary):not(#opc-summary-foot):not(.checkout-reassure) { display: none !important; }
body#checkout #js-checkout-summary .darique-checkout-notification { display: none !important; }

/* ---------------------------------------------------------------- header ---
   mockup .hdr: 64px sticky bar, blur, grid logo | pill | trust */
body#checkout .l-header {
  position: sticky !important;
  top: 0;
  z-index: 1020;
  transform: none !important;
  background: rgba(255, 255, 255, .82);
  -webkit-backdrop-filter: saturate(1.2) blur(10px);
  backdrop-filter: saturate(1.2) blur(10px);
  border-bottom: 1px solid var(--co-line);
  box-shadow: none !important;
}
body#checkout .checkout-header__inner {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 24px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
  height: 64px;
}
body#checkout .checkout-header__logo {
  justify-self: start;
  display: block;
  line-height: 0;
}
body#checkout .checkout-header__logo .logo {
  display: block;
  max-height: 40px;
  width: auto;
  max-width: 170px;
}

/* trust cluster (mockup .trust): secure = green, phone = muted */
body#checkout .checkout-header__meta {
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 18px;
  font-size: 12.5px;
  white-space: nowrap;
}
body#checkout .checkout-header__meta .material-icons {
  font-size: 15px;
  line-height: 1;
}
body#checkout .checkout-header__secure {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--co-success);
  font-weight: 600;
}
body#checkout .checkout-header__phone {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--co-muted);
  font-weight: 500;
  text-decoration: none;
}
body#checkout .checkout-header__phone:hover,
body#checkout .checkout-header__phone:focus {
  color: var(--co-ink);
  text-decoration: none;
}

/* ------------------------------------------- free-shipping PILL (mockup .ship)
   shaim module markup untouched (#doprava_zdarma_here_* / #roundedbox /
   #freeshipping_progress / progress#prog keep their ids → module AJAX refresh
   still lands here); only wrappers are restyled. !important where the module's
   footer-printed inline <style> or the global green fill must be beaten. */
body#checkout .checkout-header__progress {
  justify-self: center;
  min-width: 0;
  display: flex;
  justify-content: center;
}
/* module container: #doprava_zdarma_here_order initially, _external after refresh.
   Tighter envelope than before (was 38vw/320–440): custom.js shortens the label to
   the mockup's "Ještě X Kč k dopravě zdarma", so the pill can sit compact. */
body#checkout .checkout-header__progress > div {
  width: clamp(310px, 32vw, 420px);
  min-width: 0;
}
body#checkout .checkout-header__progress div#roundedbox {
  opacity: 1 !important;      /* module JS fades it in over 3s — pointless in a header */
  margin: 0 !important;
  float: none;
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--co-panel);
  border: 1px solid var(--co-line);
  border-radius: 999px;
  padding: 7px 14px 7px 8px;  /* 26px icon + 2×7 = 40px tall, mockup .ship */
  text-align: left;
}
body#checkout .checkout-header__progress .freeshipping_progress__icon {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--co-success-tint);
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}
body#checkout .checkout-header__progress .freeshipping_progress__icon img {
  width: 15px;
  height: 15px;
  object-fit: contain;
  /* base svg is orange #dd5a12 → rotate onto the mockup's success green */
  filter: hue-rotate(83deg) saturate(0.85);
}
/* single row like the mockup .ship: [bar][label] — progress#prog is pulled
   before the text with order:-1; label spans ellipsize only in the no-JS
   fallback (custom.js rewrites them to the short form that fits) */
body#checkout .checkout-header__progress div#freeshipping_progress {
  flex: 1 1 auto;
  min-width: 0;
  float: none !important;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0;
  margin: 0;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
}
body#checkout .checkout-header__progress div#freeshipping_progress img#auto2 { display: none; }
body#checkout .checkout-header__progress #freeshipping_progress .doprava_text,
body#checkout .checkout-header__progress #freeshipping_progress .reming_to_spend {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  float: none;
  font-size: 12.5px;
  line-height: 1.3;
  color: var(--co-muted);
  text-align: left;
}
/* custom.js folds the whole short label into .reming_to_spend and empties this */
body#checkout .checkout-header__progress #freeshipping_progress .doprava_text:empty { display: none; }
body#checkout .checkout-header__progress #freeshipping_progress .reming_to_spend strong {
  color: var(--co-ink);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
body#checkout .checkout-header__progress div#roundedbox progress#prog {
  order: -1;                  /* mockup order: icon | bar | label */
  flex: 1 1 70px;
  display: block;
  width: auto;
  min-width: 70px;
  height: 7px;
  margin: 0;
  border: 0;
  border-radius: 999px;
  background-color: #E7E8EC !important;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  overflow: hidden;
}
body#checkout .checkout-header__progress div#roundedbox progress#prog::-webkit-progress-bar {
  background-color: #E7E8EC;
  border-radius: 999px;
}
body#checkout .checkout-header__progress div#roundedbox progress#prog::-webkit-progress-value {
  background: linear-gradient(90deg, #16B25A, #12A150) !important;
  border-radius: 999px;
  animation: none !important;
}
body#checkout .checkout-header__progress div#roundedbox progress#prog::-moz-progress-bar {
  background: linear-gradient(90deg, #16B25A, #12A150) !important;
  border-radius: 999px;
  animation: none !important;
}
body#checkout .checkout-header__progress .clear_both { display: none; }
body#checkout .checkout-header__progress #hodnota_kosiku { display: none !important; }

/* ---------------------------------------------------------------- layout ---
   mockup .wrap (max 1200) + .grid (1fr | 372px, gap 28) + .form (1fr 1fr, gap 18) */
body#checkout #wrapper {
  max-width: 1200px;
  margin: 0 auto !important;
  padding: 26px 24px 64px;
  background: transparent;
}
body#checkout section#content { background: transparent; }
body#checkout #content > .row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  margin: 0 auto;
  max-width: 640px;              /* <1080px: mockup collapses to one 640px column */
}
body#checkout #content > .row > #js-checkout-process,
body#checkout #content > .row > .order-checkout {
  width: auto;
  max-width: none;
  flex: none;
  padding: 0;
  margin: 0 !important;
}
@media (min-width: 1080px) {
  body#checkout #content > .row {
    grid-template-columns: minmax(0, 1fr) 372px;
    gap: 28px;
    max-width: none;
    align-items: start;
  }
  body#checkout .order-checkout {
    position: sticky;
    top: 88px;                    /* 64px header + 24px breathing room (mockup .sum) */
  }
}

/* steps area — Adaptis/Claude 2026-07-04 checkout rework: SINGLE COLUMN.
   The steps are one full-width stack (client req. 2); the two inner columns
   (and their .checkout-process__col wrappers) are gone from checkout-process.tpl
   so the .checkout-step sections are DOM siblings again — which the accordion
   (custom.js) and core.js's sibling traversal both rely on. */
body#checkout .checkout-process--opc {
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}

/* ------------------------------------------------------------- step cards ---
   mockup .card + .card__h (dark numbered chip + rounded heading) + .card__b */
body#checkout .checkout-step {
  margin: 0;
  background: var(--co-ground);
  border: 1px solid var(--co-line);
  border-radius: var(--co-r-lg);
  box-shadow: var(--co-shadow-card);
  overflow: hidden;
}
body#checkout .checkout-step .card-header {
  padding: 14px 18px;
  border-bottom: 1px solid var(--co-line);
  background: transparent !important;
  border-radius: 0;
}
body#checkout .checkout-step .step-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-family: var(--co-round);
  font-size: 15.5px !important;
  font-weight: 800;
  letter-spacing: -.01em;
  line-height: 1.3;
  color: var(--co-ink);
  text-transform: none;
}
body#checkout .checkout-step .step-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 22px;
  height: 22px;
  margin: 0;
  border: 0;
  border-radius: 7px;
  background: var(--co-ink);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
body#checkout .checkout-step .content.card-body { padding: 16px 18px; }

/* ------------------------------------------------------- fields & inputs ---
   mockup .fld/.inp: 44px inputs, 10px radius, brand focus ring */
body#checkout .checkout-step .form-group { margin-bottom: 12px; }
/* mockup .fields gap is 12px — tighten bootstrap's 30px gutter inside the
   customer/address form field grids (form-fields.tpl wraps name/postcode rows) */
body#checkout .checkout-step .form-fields .row {
  margin-left: -6px;
  margin-right: -6px;
}
body#checkout .checkout-step .form-fields .row > [class*="col-"] {
  padding-left: 6px;
  padding-right: 6px;
}
body#checkout .checkout-step label {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--co-muted);
  margin-bottom: 6px;
}
body#checkout .checkout-step .form-control,
body#checkout .checkout-step .custom-select {
  height: 44px;
  padding: 0 13px;
  font-size: 14.5px;
  color: var(--co-ink);
  background-color: #fff;
  border: 1px solid var(--co-line-strong);
  border-radius: 10px;
  box-shadow: none;
  transition: border-color .12s ease, box-shadow .12s ease;
}
body#checkout .checkout-step .form-control::placeholder { color: var(--co-muted-2); }
body#checkout .checkout-step .form-control:hover,
body#checkout .checkout-step .custom-select:hover { border-color: #CBCCD4; }
body#checkout .checkout-step .form-control:focus,
body#checkout .checkout-step .custom-select:focus {
  outline: 0;
  border-color: var(--co-brand);
  box-shadow: 0 0 0 3px var(--co-brand-tint);
}
body#checkout .checkout-step textarea.form-control {
  height: auto;
  min-height: 66px;
  padding: 10px 13px;
}
body#checkout .checkout-step .form-text,
body#checkout .checkout-step small {
  font-size: 12px;
  color: var(--co-muted-2);
}
body#checkout .checkout-step .form-footer { margin-top: 10px; padding: 0; }

/* password field: reveal button floats INSIDE the input (mockup .pw-wrap) */
body#checkout .checkout-step .input-group.js-parent-focus {
  position: relative;
  display: flex;
  flex-wrap: nowrap;
}
body#checkout .checkout-step .input-group.js-parent-focus .form-control {
  flex: 1 1 auto;
  width: 100%;
  border-radius: 10px !important;
  padding-right: 46px;
}
body#checkout .checkout-step .input-group.js-parent-focus .input-group-btn {
  position: absolute;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  z-index: 4;
}
body#checkout .checkout-step .input-group.js-parent-focus .input-group-btn .btn {
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--co-muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: none;
}
body#checkout .checkout-step .input-group.js-parent-focus .input-group-btn .btn:hover {
  background: var(--co-panel);
  color: var(--co-ink);
}
body#checkout .checkout-step .input-group.js-parent-focus .input-group-btn .material-icons { font-size: 18px; }

/* checkboxes (GDPR, "use this address for invoice too", gift, terms):
   mockup .chk — 20px, 6px radius, brand when checked */
body#checkout .custom-checkbox { position: relative; padding-left: 31px; }
body#checkout .custom-checkbox .custom-control-label {
  font-size: 13px;
  font-weight: 400;
  color: var(--co-muted);
  margin: 0;
  line-height: 1.5;
}
body#checkout .custom-checkbox .custom-control-label::before {
  position: absolute;
  top: 0;
  left: -31px;
  width: 20px;
  height: 20px;
  border-radius: 6px;
  border: 1.5px solid #CBCCD4;
  background-color: #fff;
  box-shadow: none;
  transition: background-color .12s ease, border-color .12s ease;
}
body#checkout .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--co-brand);
  border-color: var(--co-brand);
}
body#checkout .custom-checkbox .custom-control-label::after {
  position: absolute;
  top: 0;
  left: -31px;
  width: 20px;
  height: 20px;
  background-size: 10px 10px;
}
body#checkout .custom-control-input:focus-visible ~ .custom-control-label::before,
body#checkout .custom-control-input:focus ~ .custom-control-label::before {
  border-color: var(--co-brand);
  box-shadow: 0 0 0 3px var(--co-brand-tint);
}

/* step-local buttons (guest register submit, address Save) — quiet ink buttons,
   the single red CTA stays reserved for OBJEDNAT under the summary */
body#checkout .checkout-step .btn-primary {
  height: 44px;
  padding: 0 20px;
  border: 0;
  border-radius: 10px;
  background: var(--co-ink) !important;
  color: #fff !important;
  font-size: 14px;
  font-weight: 700;
  text-transform: none;
  box-shadow: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
body#checkout .checkout-step .btn-primary:hover:not([disabled]) { background: #000 !important; }
body#checkout .checkout-step .btn-primary[disabled] { opacity: .45; }
/* the legacy ".btn-primary:not(…):not(#add_to_cart):not(.add_to_cart)" rule higher up
   carries id-level specificity and forces color:#333/background:white — two ids beat it */
body#checkout #js-checkout-process .checkout-step .btn-primary {
  color: #fff !important;
  background: var(--co-ink) !important;
  border-color: transparent !important;
}
body#checkout #js-checkout-process .checkout-step .btn-primary:hover:not([disabled]),
body#checkout #js-checkout-process .checkout-step .btn-primary:focus:not([disabled]) {
  color: #fff !important;
  background: #000 !important;
}
body#checkout .checkout-step .btn-link,
body#checkout .checkout-step .cancel-address {
  color: var(--co-muted);
  font-size: 13px;
}
body#checkout .checkout-step .btn-link:hover,
body#checkout .checkout-step .cancel-address:hover { color: var(--co-brand); }

/* --------------------------------------------- step 1: guest/login tabs ----
   mockup .seg segmented control */
body#checkout #checkout-personal-information-step .nav-tabs {
  display: inline-flex;
  flex-wrap: nowrap;
  background: var(--co-panel);
  border: 1px solid var(--co-line);
  border-bottom: 1px solid var(--co-line) !important;
  border-radius: 10px;
  padding: 3px;
  gap: 2px;
  margin: 0 0 14px 0 !important;
}
body#checkout #checkout-personal-information-step .nav-tabs .nav-item { margin: 0; }
body#checkout #checkout-personal-information-step .nav-tabs .nav-link {
  border: 0;
  background: transparent;
  color: var(--co-muted);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  padding: 8px 14px;
  border-radius: 8px;
  text-transform: none;
  display: inline-flex;
  align-items: center;
}
body#checkout #checkout-personal-information-step .nav-tabs .nav-link.active {
  background: #fff;
  color: var(--co-ink);
  box-shadow: 0 1px 2px rgba(20, 20, 30, .08);
}
body#checkout #checkout-personal-information-step .nav-tabs .material-icons { display: none; }
/* theme.css gives .tab-content a 48px top padding — the segmented control's
   14px margin is the mockup's spacing */
body#checkout #checkout-personal-information-step .tab-content { padding-top: 0; }
body#checkout #checkout-personal-information-step .identity,
body#checkout #checkout-personal-information-step .content > p,
body#checkout #checkout-guest-form p,
body#checkout #checkout-login-form p {
  font-size: 12.5px;
  color: var(--co-muted);
  margin: 2px 0 8px;
}
body#checkout #checkout-personal-information-step a { color: var(--co-brand); }

/* Adaptis 2026-07-03 — auto-advance guest checkout: hide the "Pokračovat" submit.
   GATED on body.opc-autoadvance-ready, which custom.js adds only once its auto-advance
   is live. If that JS is ever stale/dormant the class is absent, this rule matches
   nothing, and the button stays visible & clickable — a guest is never stranded. The
   button stays in the DOM (custom.js clicks it to drive the native register flow). */
body#checkout.opc-autoadvance-ready #checkout-personal-information-step .js-customer-form [data-link-action="register-new-customer"] {
  display: none !important;
}

/* -------------------------------------------------- step 2: addresses ------
   saved addresses become full-width option cards (radio dot + alias + lines),
   "add new address" becomes the mockup's dashed brand tile */
body#checkout .js-address-selector { margin: 0; }
body#checkout .js-address-selector > [class*="col-"] {
  flex: 0 0 100%;
  max-width: 100%;
  padding: 0;
  margin: 0 0 9px !important;
}
body#checkout .address-item .card {
  margin: 0;
  border: 1px solid var(--co-line-strong);
  border-radius: 12px;
  background: #fff;
  box-shadow: none;
  cursor: pointer;
  overflow: hidden;
  display: block;
  transition: border-color .12s ease, box-shadow .12s ease, background .12s ease;
}
body#checkout .address-item .card:hover { border-color: #C9CAD2; }
body#checkout .address-item.selected .card,
body#checkout .address-item .card:has(input:checked) {
  border-color: var(--co-brand);
  background: var(--co-brand-tint);
  box-shadow: 0 0 0 1px var(--co-brand);
}
body#checkout .address-item .card-header {
  padding: 12px 14px 2px;
  border: 0;
}
body#checkout .address-item .custom-control.custom-radio {
  position: relative;
  padding-left: 32px;
  margin: 0;
  min-height: 20px;
}
body#checkout .address-item .custom-control-label {
  position: static;
  margin: 0;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--co-ink);
  cursor: pointer;
}
body#checkout .address-item .custom-control-label::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid #CBCCD4;
  background: #fff;
  box-shadow: none;
  content: "";
}
body#checkout .address-item .custom-control-input:checked ~ .custom-control-label::before {
  border-color: var(--co-brand);
  background: #fff;
}
body#checkout .address-item .custom-control-label::after {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: transparent;
  background-image: none !important;
  content: "";
}
body#checkout .address-item .custom-control-input:checked ~ .custom-control-label::after {
  background-color: var(--co-brand);
}
body#checkout .address-item .card-body {
  padding: 2px 14px 10px 46px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--co-muted);
}
body#checkout .address-item .card-footer {
  display: flex;
  gap: 16px;
  padding: 8px 14px;
  border-top: 1px solid var(--co-line);
  background: transparent !important;
  font-size: 12.5px;
}
body#checkout .address-item .card-footer a {
  color: var(--co-muted);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
body#checkout .address-item .card-footer a:hover { color: var(--co-brand); }
body#checkout .address-item .card-footer .material-icons { font-size: 14px; }

/* add-address tile (mockup .linkadd, adapted to the theme's tile markup) */
body#checkout a.card--address,
body#checkout a.invoice-address {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  margin: 0;
  border: 1.5px dashed rgba(228, 0, 43, .45);
  border-radius: 12px;
  background: transparent !important;
  color: var(--co-brand);
  text-decoration: none;
  box-shadow: none;
  transition: background .12s ease, border-color .12s ease;
}
body#checkout a.card--address:hover,
body#checkout a.invoice-address:hover {
  background: var(--co-brand-tint) !important;
  border-color: var(--co-brand);
}
body#checkout .card-body_add-address {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  font-size: 13.5px;
  font-weight: 600;
  text-align: left;
}
body#checkout .card-body_add-address .material-icons.md-48 { font-size: 20px; }
body#checkout .card-body_add-address br { display: none; }

body#checkout #checkout-addresses-step h2.h4 {
  font-family: var(--co-round);
  font-size: 14px;
  font-weight: 800;
  color: var(--co-ink);
  margin: 4px 0 10px;
}
body#checkout [data-link-action="different-invoice-address"] {
  color: var(--co-brand);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
body#checkout [data-link-action="different-invoice-address"]:hover { text-decoration: underline; }
body#checkout .js-address-error {
  font-size: 12.5px;
  padding: 8px 12px;
  border-radius: 10px;
  margin: 0 0 9px;
}

/* --------------------------------------- step 3: shipping option cards -----
   mockup .opt: dot | logo tile | name(+subline) | right price, red ring/tint
   when selected. PS DOM: .delivery-option > .row > (.col-1 radio)(label.col-11
   .delivery-option-2 > .row > name-col + price-col) */
body#checkout .delivery-options-list { margin: 0; }
body#checkout .delivery-options { margin: 0; }
body#checkout .delivery-option {
  background: #fff;
  border: 1px solid var(--co-line-strong);
  border-radius: 12px;
  padding: 12px 14px;
  margin: 0 0 9px;
  cursor: pointer;
  transition: border-color .12s ease, box-shadow .12s ease, background .12s ease;
}
body#checkout .delivery-option:hover { border-color: #C9CAD2; }
body#checkout .delivery-option:has(input:checked) {
  border-color: var(--co-brand);
  background: var(--co-brand-tint);
  box-shadow: 0 0 0 1px var(--co-brand);
}
body#checkout .delivery-option:has(.custom-control-input:focus-visible) {
  outline: 2.5px solid var(--co-focus);
  outline-offset: 2px;
}
body#checkout .delivery-option > .row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  margin: 0;
}
body#checkout .delivery-option > .row > .col-1 {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  padding: 0;
}
/* the radio → mockup .dot */
body#checkout .delivery-option .custom-control.custom-radio {
  position: relative;
  width: 20px;
  height: 20px;
  padding: 0;
  margin: 0;
  min-height: 0;
}
body#checkout .delivery-option .custom-control-label {
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  cursor: pointer;
}
body#checkout .delivery-option .custom-control-label::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid #CBCCD4;
  background: #fff;
  box-shadow: none;
  content: "";
}
body#checkout .delivery-option .custom-control-input:checked ~ .custom-control-label::before {
  border-color: var(--co-brand);
  background: #fff;
}
body#checkout .delivery-option .custom-control-label::after {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: transparent;
  background-image: none !important;
  content: "";
}
body#checkout .delivery-option .custom-control-input:checked ~ .custom-control-label::after {
  background-color: var(--co-brand);
}
body#checkout .delivery-option label.delivery-option-2 {
  flex: 1 1 auto;
  width: auto;
  max-width: none;
  min-width: 0;
  padding: 0 0 0 12px;
  margin: 0;
  cursor: pointer;
  font-size: inherit;
  font-weight: 400;
  color: inherit;
}
body#checkout .delivery-option-2 > .row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px;
  margin: 0;
}
body#checkout .delivery-option-2 > .row > [class*="col-"] {
  padding: 0;
  max-width: none;
  width: auto;
}
body#checkout .delivery-option-2 > .row > .col-sm-6:first-child { flex: 1 1 auto; min-width: 0; }
body#checkout .delivery-option-2 > .row > .text--right {
  flex: 0 0 auto;
  padding: 0 !important;
  text-align: right;
}
body#checkout .delivery-option-2 .col-sm-6 > .row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px;
  margin: 0;
}
body#checkout .delivery-option-2 .col-sm-6 > .row > [class*="col-"] {
  padding: 0;
  max-width: none;
  width: auto;
}
body#checkout .delivery-option-2 .col-sm-6 > .row > .col-3 { flex: 0 0 auto; }
body#checkout .delivery-option-2 .col-sm-6 > .row > .col-9,
body#checkout .delivery-option-2 .col-sm-6 > .row > .col-12 { flex: 1 1 auto; min-width: 0; }
/* carrier logo → mockup .opt__logo tile */
body#checkout .delivery-option .col-3 img {
  display: block;
  width: 40px !important;
  height: 28px;
  object-fit: contain;
  background: var(--co-panel);
  border: 1px solid var(--co-line);
  border-radius: 7px;
  padding: 2px;
}
body#checkout .delivery-option .carrier-name {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  font-family: var(--co-sans);
  font-size: 14px;
  font-weight: 600;
  color: var(--co-ink);
  text-transform: none;
  line-height: 1.35;
}
body#checkout .delivery-option .carrier-name a { line-height: 0; }
body#checkout .delivery-option .carrier-name .material-icons.info {
  font-size: 15px;
  color: var(--co-muted-2);
}
body#checkout .delivery-option .carrier-price {
  font-size: 14px;
  font-weight: 700;
  color: var(--co-ink);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
/* per-carrier extra content (pickup-point pickers etc.) — soft panel below the card */
body#checkout .carrier-extra-content {
  margin: -3px 0 9px;
  padding: 10px 12px;
  background: var(--co-panel-2);
  border: 1px solid var(--co-line);
  border-radius: 12px;
  font-size: 12.5px;
}
body#checkout #js-delivery .order-options { margin-top: 2px; font-size: 13px; }
body#checkout #js-delivery .order-options label { font-size: 13px; }
body#checkout #hook-display-before-carrier:empty,
body#checkout #hook-display-after-carrier:empty { display: none; }

/* ---------------------------------------- step 4: payment option cards -----
   PS DOM: .payment-option (#xxx-container) > .custom-radio > input + label
   (text + logo img). Flex + order pulls the logo tile between dot and name. */
body#checkout .payment-options > div { margin: 0; }
/* whatever renders last (option card or its visible form) carries a 9px bottom
   margin — swallow it so the card body closes at the mockup's 16px */
body#checkout .payment-options { margin: 0 0 -9px; }
body#checkout .payment-option {
  background: #fff;
  border: 1px solid var(--co-line-strong);
  border-radius: 12px;
  padding: 12px 14px;
  margin: 0 0 9px;
  transition: border-color .12s ease, box-shadow .12s ease, background .12s ease;
}
body#checkout .payment-option:hover { border-color: #C9CAD2; }
body#checkout .payment-option:has(input:checked) {
  border-color: var(--co-brand);
  background: var(--co-brand-tint);
  box-shadow: 0 0 0 1px var(--co-brand);
}
body#checkout .payment-option:has(.custom-control-input:focus-visible) {
  outline: 2.5px solid var(--co-focus);
  outline-offset: 2px;
}
body#checkout .payment-option .custom-control {
  padding: 0;
  margin: 0;
  min-height: 0;
}
body#checkout .payment-option .custom-control-label {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 0;
  min-height: 28px;
  font-size: 14px;
  font-weight: 600;
  color: var(--co-ink);
  cursor: pointer;
}
body#checkout .payment-option .custom-control-label::before {
  content: "";
  position: static;
  order: -2;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid #CBCCD4;
  background: #fff;
  box-shadow: none;
  margin: 0;
}
body#checkout .payment-option .custom-control-input:checked ~ .custom-control-label::before {
  border-color: var(--co-brand);
  background: #fff;
}
body#checkout .payment-option .custom-control-label::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 5px;
  width: 10px;
  height: 10px;
  margin-top: -5px;
  border-radius: 50%;
  background: transparent;
  background-image: none !important;
}
body#checkout .payment-option .custom-control-input:checked ~ .custom-control-label::after {
  background-color: var(--co-brand);
}
body#checkout .payment-option .custom-control-label img {
  order: -1;
  flex: 0 0 auto;
  width: 40px;
  height: 28px;
  object-fit: contain;
  background: var(--co-panel);
  border: 1px solid var(--co-line);
  border-radius: 7px;
  padding: 2px;
  margin: 0;
}
/* fallback brand glyphs (payment-logo.tpl) for options whose module supplies no
   logo — same 40×28 tile as the <img> above (mockup .opt__logo) */
body#checkout .payment-option .custom-control-label .opt__logo {
  order: -1;
  flex: 0 0 auto;
  width: 40px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--co-panel);
  border: 1px solid var(--co-line);
  border-radius: 7px;
  color: var(--co-muted);
}
body#checkout .payment-option .custom-control-label .opt__logo svg {
  display: block;
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
body#checkout .payment-option .custom-control-label .opt__logo svg.opt__logo--fill {
  width: 15px;
  height: 15px;
  fill: currentColor;
  stroke: none;
}
body#checkout .payment-option .custom-control-label .opt__logo svg.opt__logo--wm {
  width: 36px;
  height: 24px;
  stroke: none;
}
body#checkout .payment-option .custom-control-label .opt__logo svg.opt__logo--wm text {
  fill: currentColor;
  font-family: var(--co-round);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .02em;
  text-anchor: middle;
}
body#checkout .payment-option .custom-control-label .opt__logo svg.opt__logo--wm-sm text { font-size: 8.5px; }
body#checkout .cart-payment-step-refreshed-info {
  font-size: 12.5px;
  color: var(--co-muted);
  margin: 0 0 8px;
}
body#checkout #checkout-payment-step .js-additional-information,
body#checkout #checkout-payment-step .js-payment-option-form { margin: -3px 0 9px; }
body#checkout #checkout-payment-step .js-additional-information .alert,
body#checkout #checkout-payment-step .additional-information .alert {
  background: var(--co-panel-2);
  border: 1px solid var(--co-line);
  border-radius: 12px;
  color: var(--co-muted);
  font-size: 12.5px;
  padding: 10px 12px;
  margin: 0;
}

/* ------------------------------------------------------- summary card ------
   mockup .sum__card: header pill-count, thumbnails w/ qty badge, promo field,
   totals, big grand total */
body#checkout #js-checkout-summary {
  margin: 0 !important;
  background: var(--co-ground);
  border: 1px solid var(--co-line);
  border-radius: var(--co-r-lg);
  box-shadow: var(--co-shadow);
  overflow: hidden;
}
/* while the CTA foot is attached below (custom.js sets body.opc-cta-relocated),
   the card opens toward it */
body#checkout.opc-cta-relocated #js-checkout-summary {
  border-radius: var(--co-r-lg) var(--co-r-lg) 0 0;
  border-bottom: 0;
  box-shadow: none;
}
body#checkout .checkout-summary-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 15px 18px;
  border-bottom: 1px solid var(--co-line);
}
body#checkout .checkout-summary-head__title {
  margin: 0;
  font-family: var(--co-round);
  font-size: 15px;
  font-weight: 800;
  color: var(--co-ink);
}
body#checkout .checkout-summary-head__meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 5px 10px;
}
body#checkout .checkout-summary-head__count {
  flex: none;
  font-size: 12px;
  color: var(--co-muted);
  background: var(--co-panel);
  border: 1px solid var(--co-line);
  padding: 3px 9px;
  border-radius: 999px;
  white-space: nowrap;
}
/* Adaptis/Claude 2026-07-11 (round 5) — the summary is read-only, so its only affordance
   for changing quantities is this header action: promoted from an underlined text link to
   a real, obviously-clickable pill button back to the pre-cart (/kosik).

   Adaptis/Claude 2026-07-12 (round 6) — the customer reported "I have no way to edit the
   order at all" while this button was already on the page: at 12px in the header's meta
   row, next to the item count, it read as a label rather than a control. Quantity editing
   now lives ONLY in the pre-cart, so this is the single path back — if it is missed, the
   customer is stuck. Given more size, weight and contrast so it reads as the action it is.
   Deliberately NOT a filled/primary button: it must not compete with "Objednat". */
body#checkout .checkout-summary-head__edit {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border: 1.5px solid var(--co-ink);
  border-radius: 999px;
  background: #fff;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--co-ink);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
body#checkout .checkout-summary-head__edit .material-icons {
  font-size: 16px;
  line-height: 1;
}
body#checkout .checkout-summary-head__edit:hover,
body#checkout .checkout-summary-head__edit:focus {
  background: var(--co-ink);
  border-color: var(--co-ink);
  color: #fff;
  text-decoration: none;
}
body#checkout #js-checkout-summary .card-body { padding: 0; }

/* items (mockup .items/.item) */
body#checkout .cart-summary-products { padding: 2px 18px; }
/* Adaptis/Codex 2026-07-10 — read-only checkout summary: keep three or more
   product rows visible without the former 230px clipping; genuinely long carts
   still scroll within a viewport-bounded list. */
body#checkout #cart-summary-product-list { max-height: 60vh; overflow-y: auto; }
body#checkout #cart-summary-product-list .media-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
body#checkout #cart-summary-product-list .media-list__item {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 10px 0;
  border-bottom: 1px solid var(--co-line);
}
body#checkout #cart-summary-product-list .media-list__item:last-child { border-bottom: 0; }
body#checkout .checkout-item__thumb {
  position: relative;
  flex: none;
  width: 48px;
  height: 48px;
  margin-right: 12px !important;
  display: block;
}
body#checkout .checkout-item__thumb img.media-object {
  display: block;
  width: 48px;
  height: 48px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid var(--co-line);
}
body#checkout .checkout-item__qty {
  position: absolute;
  top: -7px;
  right: -7px;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  border-radius: 999px;
  background: var(--co-ink);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #fff;
}
body#checkout #cart-summary-product-list .media-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 12px;
  align-items: center;
  min-width: 0;
  flex: 1;
}
body#checkout #cart-summary-product-list .product-name {
  grid-column: 1;
  font-size: 13px;
  font-weight: 400; /* mockup item names are regular; theme bolds .product-name */
  line-height: 1.35;
  color: var(--co-ink);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
body#checkout #cart-summary-product-list .media-body > .clearfix {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  justify-content: flex-end;
}
/* textual "x2" stays for screen readers only — the thumb badge carries it visually */
body#checkout #cart-summary-product-list .product-quantity {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
  float: none;
}
body#checkout #cart-summary-product-list .product-price {
  float: none;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--co-ink);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
body#checkout #cart-summary-product-list .product-line-info {
  grid-column: 1 / -1;
  font-size: 11.5px;
  color: var(--co-muted-2);
}

/* Adaptis/Claude 2026-07-04 checkout rework — DISCOUNT MOVED INTO CHECKOUT (client
   req., revised placement). The promo entry lives HERE now (and is hidden on the
   /kosik cart page — see the #cart rule further down). Per the client it is a SUBTLE,
   quiet, LEFT-aligned "Máte slevový kód?" toggle, COLLAPSED by default: the native
   Bootstrap collapse (data-toggle="collapse" href="#promo-code") expands it inline to
   the code input + Apply button. We RESTYLE ONLY — the cart-voucher markup and the
   form.form__add-voucher submit / core.js add-voucher AJAX are untouched. The
   applied-voucher list (.promo-name) stays visible. theme.css already hides the toggle
   when expanded via .promo-code-button .collapse-button[aria-expanded=true]{display:none}
   and .collapse:not(.show){display:none} keeps the panel closed until clicked — we do
   NOT set display on either, so that native show/hide keeps working. */
body#checkout #js-checkout-summary .block-promo { padding: 4px 18px 10px; margin: 0; }
body#checkout #js-checkout-summary .cart-voucher { margin: 0; }
/* toggle link: small, muted, left-aligned (undo theme's centered red button) */
body#checkout #js-checkout-summary .promo-code-button { text-align: left; margin: 0; }
body#checkout #js-checkout-summary .promo-code-button .collapse-button,
body#checkout #js-checkout-summary a.collapse-button.promo-code-button {
  text-align: left;
  color: var(--co-muted) !important;
  font-size: 12.5px;
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 2px;
}
body#checkout #js-checkout-summary .promo-code-button .collapse-button:hover,
body#checkout #js-checkout-summary a.collapse-button.promo-code-button:hover {
  color: var(--co-brand) !important;
}
/* collapsible panel: native Bootstrap .collapse governs open/closed (no display
   override here) — just breathing room above the input once expanded */
body#checkout #js-checkout-summary #promo-code { margin-top: 8px; }
body#checkout #js-checkout-summary .promo-code__content {
  padding: 0;
  background: transparent;
}
body#checkout #js-checkout-summary .form__add-voucher .input-group {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
}
body#checkout #js-checkout-summary .form__add-voucher .form-control {
  flex: 1 1 auto;
  height: 40px;
  padding: 0 13px;
  font-size: 13.5px;
  color: var(--co-ink);
  background: #fff;
  border: 1px solid var(--co-line-strong);
  border-radius: 10px !important;
  box-shadow: none;
  transition: border-color .12s ease, box-shadow .12s ease;
}
body#checkout #js-checkout-summary .form__add-voucher .form-control::placeholder { color: var(--co-muted-2); }
body#checkout #js-checkout-summary .form__add-voucher .form-control:focus {
  outline: 0;
  border-color: var(--co-brand);
  box-shadow: 0 0 0 3px var(--co-brand-tint);
}
body#checkout #js-checkout-summary .form__add-voucher .input-group-append { margin: 0; }
body#checkout #js-checkout-summary .form__add-voucher .btn {
  height: 40px;
  padding: 0 14px;
  background: #fff !important;
  border: 1px solid var(--co-line-strong) !important;
  border-radius: 10px !important;
  color: var(--co-ink) !important;
  font-size: 13px;
  font-weight: 600;
  text-transform: none;
  box-shadow: none;
}
body#checkout #js-checkout-summary .form__add-voucher .btn:hover { border-color: #C9CAD2 !important; }
body#checkout #js-checkout-summary .promo-code-alert {
  font-size: 12px;
  margin: 8px 0 0;
  padding: 8px 10px;
  border-radius: 10px;
}
body#checkout #js-checkout-summary .promo-name {
  margin: 12px 0 6px; /* Adaptis/Claude 2026-07-04: block-promo lost its padding when the code input was hidden */
  padding: 0;
  list-style: none;
}
body#checkout #js-checkout-summary .promo-name .cart-summary-line { font-size: 12.5px; }
body#checkout #js-checkout-summary .promo-name a { color: var(--co-muted); }
body#checkout #js-checkout-summary .promo-name a:hover { color: var(--co-brand); }
body#checkout #js-checkout-summary .promo-name .material-icons { font-size: 16px; vertical-align: middle; }
body#checkout #js-checkout-summary .promo-highlighted,
body#checkout #js-checkout-summary .promo-discounts {
  font-size: 12px;
  color: var(--co-muted);
  margin: 6px 0 0;
}

/* totals (mockup .totals/.tr — pad-bottom 6, the grand row's border carries the split) */
body#checkout .cart-summary-subtotals-container {
  padding: 12px 18px 6px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
body#checkout #js-checkout-summary .cart-summary-line {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin: 0 !important;
  padding: 0; /* theme.css pads these rows 0.4rem — the container gap is the rhythm */
  font-size: 13.5px;
  color: var(--co-muted);
}
body#checkout #js-checkout-summary .cart-summary-line .label { color: var(--co-muted); }
body#checkout #js-checkout-summary .cart-summary-line .value {
  color: var(--co-ink);
  font-weight: 600;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

/* grand total (mockup .grand): "Celkem" left, big rounded value + small
   "bez DPH" line right */
body#checkout #js-checkout-summary .card-footer {
  padding: 14px 18px 12px;   /* mockup .grand */
  border-top: 1px solid var(--co-line) !important;
  background: transparent !important;
}
body#checkout #js-checkout-summary .cart-summary-totals {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
body#checkout #js-checkout-summary .cart-summary-totals .cart-total {
  order: 1;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
body#checkout #js-checkout-summary .cart-summary-totals .cart-total .label {
  font-family: var(--co-round);
  font-size: 16px;
  font-weight: 800;
  color: var(--co-ink);
}
body#checkout #js-checkout-summary .cart-summary-totals .cart-total .value {
  font-family: var(--co-round);
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -.01em;
  color: var(--co-ink);
}
body#checkout #js-checkout-summary .cart-summary-totals .cart-summary-line--extax {
  order: 2;
  justify-content: flex-end;
  font-size: 11.5px;
}
body#checkout #js-checkout-summary .cart-summary-totals .cart-summary-line--extax .value {
  color: var(--co-muted);
  font-weight: 500;
  font-size: 11.5px;
}
/* the separate tax recap line is replaced by the "bez DPH" subline above */
body#checkout #js-checkout-summary .cart-summary-totals > .small { display: none; }

/* ------------------------------------ terms + ORDER CTA under the summary --
   mockup .sum__foot: #conditions-to-approve + #payment-confirmation + subtext
   are MOVED here by custom.js. Selectors below are position-independent, so if
   JS ever fails they still style the nodes inside the payment step. */
body#checkout .opc-summary-foot:empty { display: none; }
/* Adaptis/Claude 2026-07-04 checkout rework — $is_free edge / order CTA (client req. 7,
   revised on client feedback): the order CTA foot is ALWAYS VISIBLE now. Instead of
   hiding it, the Finish button is DISABLED until every step predicate passes
   (body.opc-all-done), with a "what's next" hint + jump link in the foot (JS-injected).
   Guarded on body.opc-accordion so a JS-dead page (no such class) shows the plain native
   button governed by core.js — never force-disabled by a rule JS can't undo. When
   all-done, this rule stops matching and core.js toggleOrderButton governs enabled state
   (terms + payment). pointer-events:none + a capture-phase click blocker in custom.js
   stop any early submit even if core.js flips the disabled attr. VISUAL state only. */
body#checkout.opc-accordion:not(.opc-all-done) #payment-confirmation .btn {
  opacity: .45 !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
  pointer-events: none;
}
/* "what's next" hint + jump link inside the foot (custom.js .opc-cta-hint) */
body#checkout .opc-cta-hint {
  margin: 0 0 10px;
  text-align: center;
}
body#checkout .opc-cta-hint__line {
  font-size: 12px;
  color: var(--co-muted);
  line-height: 1.5;
}
body#checkout .opc-cta-hint__link {
  display: inline-block;
  margin-top: 2px;
  font-size: 12px;
  font-weight: 600;
  color: var(--co-brand);
  text-decoration: underline;
  cursor: pointer;
}
body#checkout .opc-cta-hint__link:hover { color: var(--co-brand-ink); }
body#checkout .opc-summary-foot {
  background: var(--co-ground);
  border: 1px solid var(--co-line);
  border-top: 1px solid var(--co-line);
  border-radius: 0 0 var(--co-r-lg) var(--co-r-lg);
  padding: 14px 18px 18px;
  box-shadow: 0 14px 28px -18px rgba(20, 20, 30, .2);
}
body#checkout #conditions-to-approve {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0;
  padding: 0 !important;
  margin: 0 0 2px !important;
  font-size: 12.5px;
}
body#checkout #conditions-to-approve .custom-control { margin: 0 0 4px; }
body#checkout #conditions-to-approve .custom-control-label {
  font-size: 12.5px;
  color: var(--co-muted);
  line-height: 1.5;
}
body#checkout #conditions-to-approve a {
  color: var(--co-brand);
  text-decoration: none;
}
body#checkout #conditions-to-approve a:hover { text-decoration: underline; }
body#checkout #payment-confirmation p { margin: 0; }
body#checkout #payment-confirmation .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-height: 52px;
  margin-top: 12px !important;
  padding: 8px 18px;
  border: 0;
  border-radius: 14px;
  /* Adaptis/Claude 2026-07-06 (client req. 17): same red as the "Vložit do košíku"
     add-to-cart button (--primary #c71717), not the checkout brand red #E4002B;
     shadow + hover hues follow. */
  background: var(--primary, #c71717) !important;
  color: #fff !important;
  font-family: var(--co-round);
  font-size: 16px;
  font-weight: 800;
  letter-spacing: .01em;
  line-height: 1.2;
  text-transform: none !important;
  box-shadow: 0 8px 20px -8px rgba(199, 23, 23, .55);
  transition: background .14s ease, box-shadow .14s ease, transform .14s ease;
}
body#checkout #payment-confirmation .btn::after {
  content: "\e5c8"; /* arrow_forward — codepoint, safe with the theme's older icon font */
  font-family: "Material Icons";
  font-size: 18px;
  font-weight: 400;
  line-height: 1;
}
body#checkout #payment-confirmation .btn:hover:not([disabled]) {
  background: #a91313 !important; /* darkened --primary, matches req. 17 */
  box-shadow: 0 10px 24px -8px rgba(199, 23, 23, .6);
}
body#checkout #payment-confirmation .btn:active:not([disabled]) { transform: translateY(1px); }
body#checkout #payment-confirmation .btn[disabled] {
  opacity: .45;
  cursor: not-allowed;
  box-shadow: none;
}
body#checkout .opc-cta-sub {
  display: block;
  margin-top: 9px;
  text-align: center;
  font-size: 11.5px;
  color: var(--co-muted-2);
  font-variant-numeric: tabular-nums;
}
body#checkout .js-alert-payment-conditions {
  margin: 10px 0 0 !important;
  padding: 8px 10px;
  background: var(--co-panel);
  border: 1px solid var(--co-line);
  border-radius: 10px;
  color: var(--co-muted);
  font-size: 12px;
}
body#checkout .js-alert-payment-conditions a { color: var(--co-brand); }

/* reassurance strip under the card (mockup .reassure) */
body#checkout .checkout-reassure {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  justify-content: center;
  padding: 14px 12px 0;
  color: var(--co-muted);
  font-size: 11.5px;
}
body#checkout .checkout-reassure span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
body#checkout .checkout-reassure .material-icons { font-size: 14px; }

/* ==================================================================
   Adaptis/Claude 2026-07-04 — checkout rework additions
   (Packeta widget theme and pickup mode; cart editing moved to /kosik)
   ================================================================== */

/* ------------- Packeta (Zásilkovna) widget inside .carrier-extra-content ---
   (client req. 7) module markup untouched — ids/classes the module JS needs
   (#packetery-widget, .zas-box, #open-packeta-widget, #selected-branch,
   .picked-delivery-place, hidden inputs) are only re-skinned. The bootstrap
   offset columns were dropped in the THEME override of widget.tpl. */
body#checkout .carrier-extra-content #packetery-widget { margin: 0; }
body#checkout .carrier-extra-content .zas-box {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
}
body#checkout .carrier-extra-content .zas-box > br { display: none; }
body#checkout .carrier-extra-content #open-packeta-widget {
  flex: none;
  float: none !important;
  margin: 0 !important;
  padding: 8px 14px;
  /* module front.css sets `#packetery-widget button { height: 50px }` — an explicit
     height min-height can't fight, so reset it and let padding size the button */
  height: auto !important;
  min-height: 36px;
  background: #fff !important;
  border: 1px solid var(--co-brand) !important;
  border-radius: 10px;
  color: var(--co-brand) !important;
  font-size: 13px;
  font-weight: 700;
  text-transform: none;
  line-height: 1.2;
  box-shadow: none;
  transition: background .12s ease, color .12s ease;
}
body#checkout .carrier-extra-content #open-packeta-widget:hover {
  background: var(--co-brand) !important;
  color: #fff !important;
}
body#checkout .carrier-extra-content #selected-branch {
  flex: 1 1 200px;
  margin: 0 !important;
  padding: 0;
  list-style: none;
  font-size: 12.5px;
  color: var(--co-muted);
}
body#checkout .carrier-extra-content #selected-branch li { list-style: none; }
body#checkout .carrier-extra-content .picked-delivery-place {
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  color: var(--co-ink);
}
body#checkout .carrier-extra-content .picked-delivery-place:empty::after {
  content: "—";
  color: var(--co-muted-2);
  font-weight: 400;
}
/* module's hidden error-text holder — data container only, never shown here */
body#checkout .packetery-message-pickup-point-not-selected-error { display: none; }
body#checkout .opc-pickup-save-error {
  flex: 1 1 100%;
  width: 100%;
  margin: 8px 0 0;
  font-size: 12px;
}

/* ------------------------- pickup mode / conditional address (client req. 4)
   custom.js adds body.opc-pickup when the selected carrier is a pickup-point
   carrier, tags address-form field groups it prefills from the chosen branch
   with .opc-field-hidden, and injects an .opc-pickup-note explaining that the
   goods go to the pickup point. Only the phone field (carrier notifications)
   stays visible — PS still receives a full, valid address on submit. */
body#checkout .opc-field-hidden { display: none !important; }
body#checkout .opc-pickup-note {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  margin: 0 0 12px;
  padding: 10px 12px;
  background: var(--co-success-tint);
  border: 1px solid rgba(18, 161, 80, .25);
  border-radius: 10px;
  font-size: 12.5px;
  color: var(--co-ink);
  line-height: 1.5;
}
body#checkout .opc-pickup-note::before {
  content: "\e55f"; /* place — codepoint, safe with the theme's older icon font */
  font-family: "Material Icons";
  font-size: 16px;
  line-height: 1.3;
  color: var(--co-success);
}
body#checkout .opc-pickup-note strong { font-weight: 700; }

/* ---- phone-only reduced address (custom.js body.opc-phone-only): the chosen
   address is complete except the required phone, so every other field group is
   hidden via .opc-field-hidden and this compact summary + phone prompt shows.
   Mirrors the pickup-reduced treatment above. */
/* own hide class (NOT the pickup .opc-field-hidden, which pickup's unreduce strips every refresh) */
body#checkout .opc-phone-hidden { display: none !important; }
body#checkout .opc-phone-only-ui { margin: 0 0 4px; }
body#checkout .opc-phone-summary {
  font-size: 13px;
  color: var(--co-muted, #6b7280);
  line-height: 1.5;
}
body#checkout .opc-edit-full {
  display: inline-block;
  margin: 2px 0 12px;
  font-size: 12.5px;
  text-decoration: underline;
}
body#checkout .opc-phone-heading {
  font-weight: 700;
  margin: 0 0 6px;
  color: var(--co-ink);
}
/* spotlight the one field that's left */
body#checkout.opc-phone-only #delivery-address [name="phone"] {
  border-color: var(--co-success, #12a150);
  box-shadow: 0 0 0 3px rgba(18, 161, 80, .15);
}

/* ------------------------------------------------------------ responsive --- */
@media (max-width: 1079.98px) {
  body#checkout .checkout-header__progress > div {
    width: auto;
    min-width: 0;
    flex: 1 1 auto;
  }
}
@media (max-width: 719.98px) {
  body#checkout .checkout-header__inner {
    grid-template-columns: auto 1fr;
    height: auto;
    padding: 10px 16px;
    gap: 10px 16px;
  }
  body#checkout .checkout-header__logo .logo { max-height: 34px; }
  body#checkout .checkout-header__meta { display: none; }   /* mockup hides .trust */
  body#checkout .checkout-header__progress {
    grid-column: 1 / -1;
    order: 3;
    justify-content: stretch;
  }
  body#checkout .checkout-header__progress > div { width: 100%; max-width: none; }

  body#checkout #wrapper { padding: 16px 16px 48px; }
  /* Adaptis/Claude 2026-07-04: the steps area is single-column at every width now */

  /* 44px+ tap targets */
  body#checkout .checkout-step .btn,
  body#checkout .checkout-step button.continue { min-height: 44px; }
  body#checkout #payment-confirmation .btn { min-height: 54px; }
  body#checkout #cart-summary-product-list { max-height: none; overflow-y: visible; }
}

/* ---------------------------------------------------------- reduced motion --- */
@media (prefers-reduced-motion: reduce) {
  body#checkout *,
  body#checkout *::before,
  body#checkout *::after {
    transition: none !important;
    animation: none !important;
  }
}
/* /Adaptis checkout redesign */

/* ==================================================================
   Adaptis/Claude 2026-07-06 — checkout: 18 client change requests
   (companion to the same-dated custom.js + template edits)
   ================================================================== */

/* (req. 3) carrier delivery info always visible under the carrier name —
   replaces the old "i"-icon tooltip in shipping.tpl */
body#checkout .delivery-option .carrier-delay {
  display: block;
  margin-top: 1px;
  font-size: 12px;
  color: var(--co-muted);
  line-height: 1.4;
}

/* (req. 4) right-aligned price on every payment option row — same visual slot
   as the shipping list's .carrier-price (the option label is a flex row) */
body#checkout .payment-option .custom-control-label .payment-price {
  margin-left: auto;
  font-size: 14px;
  font-weight: 700;
  color: var(--co-ink);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

/* (req. 5) the COD module's "Příplatek X Kč" info box is redundant now (price
   shows inline + in the summary); the marker class is set by custom.js and the
   !important wins over the inline display core.js sets on selection */
body#checkout .opc-cod-additional { display: none !important; }

/* (req. 14) the server injects the "Dobírka" subtotal line whenever the CARRIER
   maps to a COD fee — custom.js keeps it visible only while COD is the selected
   payment option */
body#checkout .opc-cod-line-off { display: none !important; }

/* (req. 9) Company + DIČ hidden on the DELIVERY address form until the
   "Zadat firemní a fakturační údaje" checkbox (custom.js → .opc-show-company)
   reveals them. Scoped to #delivery-address: a legacy separate-invoice form
   keeps its fields. .opc-company-row is stamped by _partials/form-fields.tpl. */
body#checkout #delivery-address .opc-company-row { display: none; }
body#checkout #delivery-address.opc-show-company .opc-company-row { display: flex; }
/* pickup mode prefills the whole address from the branch — no company entry there */
body#checkout.opc-pickup-reduced .opc-company-toggle-group { display: none; }

/* (req. 10) single-country shop: the country <select> stays in the DOM (keeps
   POSTing id_country for validation/save + the pickup auto-select) but is not
   shown; PSČ + Město stretch over the freed third column */
body#checkout .js-address-form .opc-country-group { display: none !important; }
/* (rev r2) .col-md-4 only sets its width at >=768px, so the stretch must be gated
   to md+ too — otherwise, with the country column gone, PSČ + Město are forced
   side-by-side on narrow phones instead of stacking/wrapping normally. */
@media (min-width: 768px) {
  body#checkout .js-address-form .row > .form-group.col-md-4 { flex: 1 1 0; max-width: none; }
}

/* (req. 15) the terms checkbox is auto-checked by custom.js and hidden ONLY
   under body.opc-terms-auto — a stale JS bundle leaves the native checkbox
   visible and the order gate fully manual, never stranding the button. The
   consent sentence (.opc-terms-note, payment.tpl) sits under the order button. */
body#checkout.opc-terms-auto #conditions-to-approve { display: none !important; }
/* auto-checking the terms makes core.js run toggleOrderButton before a payment
   is picked, which un-hides its native "choose a payment method…" alert right
   at page load — while the accordion is mid-flow its own .opc-cta-hint already
   says what is missing, so the duplicate alert stays out of the way. Without
   opc-accordion (JS dead) and once all-done, core.js governs it natively. */
body#checkout.opc-accordion:not(.opc-all-done) .js-alert-payment-conditions { display: none !important; }
body#checkout .opc-terms-note {
  margin: 9px 0 0 !important;
  text-align: center;
  font-size: 11.5px;
  color: var(--co-muted);
  line-height: 1.5;
}

/* (req. 11) subtle busy state while the pickup address saves in the background */
body#checkout.opc-bg-saving #checkout-addresses-step {
  opacity: .6;
  pointer-events: none;
  transition: opacity .15s ease;
}
/* /Adaptis 2026-07-06 client change requests */

/* Adaptis/Claude 2026-07-07 (round 2, req. F6) — merged "Dodací údaje" step */
/* the addresses step renders an empty placeholder while the guest's first-address
   form is embedded in the contact step; custom.js stamps .opc-merged-away on it
   (JS-dead fallback: the section shows an empty card, native flow still works) */
body#checkout #checkout-addresses-step.opc-merged-away { display: none !important; }
/* the embedded fields have no .js-address-form ancestor (they sit inside the
   contact form) — replicate the single-country hide + PSČ/Město stretch (req. 10) */
body#checkout .opc-embedded-address .opc-country-group { display: none !important; }
@media (min-width: 768px) {
  body#checkout .opc-embedded-address .row > .form-group.col-md-4 { flex: 1 1 0; max-width: none; }
}
/* (req. 11 parity) the merged background save dims the hosting contact step too;
   during a non-merged pickup save this step is collapsed, so the rule is inert there */
body#checkout.opc-bg-saving #checkout-personal-information-step {
  opacity: .6;
  pointer-events: none;
  transition: opacity .15s ease;
}
/* /Adaptis round 2, req. F6 — merged Dodací údaje */

/* Adaptis/Claude 2026-07-07 (round 2, req. F8/F11) — big green check on every
   satisfied field of the merged "Dodací údaje" step (.opc-field-valid is toggled
   live by custom.js; a server-rejected .is-invalid field is never ticked, so the
   check stays honest). Scoped to the merged step so the marker can't leak into
   other forms. Inputs there are 44px tall (see "fields & inputs" above): the 30px
   badge centers over the input via bottom/right 7px — the input is the group's
   last visible child (the trailing .invalid-feedback stub is display:none while
   the field is valid). NOTE for a later "even bigger / outside the field" wish:
   ::after on .form-group can't escape the input box without overlapping the next
   row — switch to a JS-injected <span> then. */
body#checkout #checkout-personal-information-step .form-group { position: relative; }
body#checkout #checkout-personal-information-step .form-group.opc-field-valid > .form-control {
  padding-right: 44px;
  border-color: #2e9e5b;
}
body#checkout #checkout-personal-information-step .form-group.opc-field-valid::after {
  content: "\e876"; /* done — codepoint, safe with the theme's older icon font (same technique as .opc-pickup-note) */
  font-family: "Material Icons";
  font-size: 20px;
  line-height: 30px;
  color: #fff;
  text-align: center;
  position: absolute;
  right: 7px;
  bottom: 7px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #2e9e5b;
  box-shadow: 0 2px 6px -1px rgba(46, 158, 91, .55);
  pointer-events: none;
}
/* /Adaptis round 2, req. F8/F11 — green field checks */

/* Adaptis/Claude 2026-07-08 (UX r3, N5) — LIVE red invalid state, the F8 green
   check's mirror: custom.js toggles .opc-field-invalid + injects .opc-field-msg
   on a TOUCHED, not-satisfied field (empty-required or bad format). Same scope
   (#checkout-personal-information-step), same badge geometry as the green tick;
   .opc-field-valid and .opc-field-invalid are mutually exclusive (one toggle
   site in opcMarkFieldValidity). The badge's bottom offset adds the message
   block's reserved height (17px line + 4px margin = 21px → 7+21 = 28px) so the
   ✕ still centers over the 44px input; a rare two-line message shifts it a few
   px — cosmetic only. Server-side .is-invalid (Bootstrap) keeps its own look;
   custom.js never client-flags a field whose only failure is the server mark. */
body#checkout #checkout-personal-information-step .form-group.opc-field-invalid > .form-control {
  padding-right: 44px;
  border-color: #d63b3b;
}
body#checkout #checkout-personal-information-step .form-group.opc-field-invalid::after {
  content: "\e5cd"; /* close ✕ — codepoint, safe with the theme's older icon font */
  font-family: "Material Icons";
  font-size: 18px;
  line-height: 30px;
  color: #fff;
  text-align: center;
  position: absolute;
  right: 7px;
  bottom: 28px; /* 7px input inset + 21px reserved .opc-field-msg height below */
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #d63b3b;
  box-shadow: 0 2px 6px -1px rgba(214, 59, 59, .55);
  pointer-events: none;
}
body#checkout #checkout-personal-information-step .opc-field-msg {
  margin: 4px 0 0;
  font-size: 12px;
  line-height: 17px;
  min-height: 17px;
  color: #d63b3b;
}
/* /Adaptis UX r3, N5 — red field marks */

/* Adaptis/Claude 2026-07-08 (UX r3, N3+N4) — merged-step review summary: after
   the merged "Dodací údaje" save, custom.js keeps the step OPEN, stamps
   .opc-merged-summarised on it (hiding the re-rendered guest form below) and
   injects the read-only #opc-merged-summary (contact / delivery / billing +
   "Upravit"). The addresses step stays .opc-merged-away meanwhile — one block. */
body#checkout #checkout-personal-information-step.opc-merged-summarised .tab-content { display: none; }
body#checkout .opc-merged-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
body#checkout .opc-merged-summary .opc-pickup-note { flex: 1 1 100%; margin: 0; } /* re-hosted pickup note spans the row */
body#checkout .opc-merged-summary__sec {
  flex: 1 1 220px;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--co-line, #e6e6e6);
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--co-ink, #16161D);
}
body#checkout .opc-merged-summary__label {
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: var(--co-muted, #6b7280);
  margin: 0 0 4px;
}
body#checkout .opc-merged-summary__val { overflow-wrap: anywhere; }
body#checkout .opc-merged-summary__editlink {
  display: inline-block;
  margin: 6px 12px 0 0;
  font-size: 12.5px;
  text-decoration: underline;
}
body#checkout .opc-merged-summary__edit {
  flex: 1 1 100%;
  align-self: flex-start;
  font-size: 13px;
  font-weight: 600;
  text-decoration: underline;
}
/* /Adaptis UX r3, N3+N4 — merged-step review summary */

/* ==================================================================
   Adaptis/Claude 2026-07-08 (billing checkbox) — "Fakturační údaje
   jsou jiné" (companion to address-fields-embed.tpl,
   steps/addresses.tpl, custom.js and the CheckoutAddressesStep
   override).
   ================================================================== */
/* merged guest step: the plain billing fieldset, hidden until the checkbox
   reveals it (custom.js toggles .opc-billing-on on the #delivery-address embed
   wrapper). The :has() rule is a stale-JS-bundle fallback: the checkbox still
   reveals the fields, the PHP override still handles the POST, and PS's native
   two-step flow completes the billing address. */
body#checkout .opc-billing-form {
  display: none;
  margin: 4px 0 12px;
  padding: 14px 14px 4px;
  border: 1px solid var(--co-line, #e6e6e6);
  border-radius: 10px;
  background: var(--co-bg-soft, #fafafa);
}
body#checkout #delivery-address.opc-billing-on .opc-billing-form { display: block; }
body#checkout .opc-billing-toggle-group:has(> input:checked) + .opc-billing-form { display: block; }
/* saved-address step: read-only summary of the chosen billing address —
   replaces the native #invoice-addresses selector that offered pickup points */
body#checkout .opc-billing-current {
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid var(--co-line, #e6e6e6);
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--co-ink, #16161D);
}
body#checkout .opc-billing-current .opc-billing-edit {
  display: inline-block;
  margin-top: 4px;
  font-size: 12.5px;
  text-decoration: underline;
}
/* generic hide used by the billing logic (e.g. the billing-aliased address card
   inside the DELIVERY selector — billing must never be offered as delivery) */
body#checkout .opc-hide { display: none !important; }
/* Carrier/address reconciliation hides address cards that can never be used by
   the selected mode (home vs pickup). The native add-address card stays visible. */
body#checkout .opc-address-incompatible { display: none !important; }
/* One native carrier update at a time. JS capture handlers enforce the lock;
   this state makes the acknowledgement wait visible without disabling inputs
   (Presta core serializes the form again in its AJAX success callback). */
body#checkout.opc-carrier-saving #js-delivery {
  pointer-events: none;
  cursor: wait;
  opacity: .68;
}
/* the saved-address checkbox only drives background swaps — without JS
   (body.opc-js absent) it must not dangle inert; billing then simply stays
   equal to delivery, exactly like before this feature. The merged-step
   checkbox (#opc-billing-toggle) stays visible without JS on purpose: its
   flow works natively (PHP override + PRG two-step). */
body#checkout:not(.opc-js) [data-opc-billing-saved] { display: none; }
/* /Adaptis billing checkbox */

/* Checkout cross-sell removed 2026-07-10; recommendations live in /kosik. */

/* ==================================================================
   Adaptis/Claude 2026-07-08 (r4, D) — ONE-BLOCK EDIT ("Upravit údaje")
   companion to custom.js: while body.opc-one-block-edit holds, the
   personal step (contact fields) and the addresses step (the swapped-in
   native #delivery-address edit form [+ the billing summary]) are BOTH
   kept expanded by refreshAccordion; these rules fuse the two cards
   into one visual block. JS-dead pages never carry the body class, so
   nothing here can affect the native fallback flow.
   ================================================================== */
/* the addresses step loses its own header/number — its content continues
   the personal step's card ("Dodací údaje" stays the one heading) */
body#checkout.opc-one-block-edit #checkout-addresses-step > .card-header { display: none !important; }
/* fuse the cards: cancel the .checkout-process--opc 18px flex gap and merge
   the touching borders/radii so the seam disappears */
body#checkout.opc-one-block-edit #checkout-personal-information-step {
  border-bottom: 0;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
body#checkout.opc-one-block-edit #checkout-addresses-step {
  margin-top: -18px;
  border-top: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
/* single continuous body: drop the doubled inner padding at the seam */
body#checkout.opc-one-block-edit #checkout-personal-information-step .content.card-body { padding-bottom: 4px; }
body#checkout.opc-one-block-edit #checkout-addresses-step .content.card-body { padding-top: 4px; }
/* ONE save button for the whole block — the contact form's own Pokračovat is
   hidden (its submit would be a contact-only native PRG); the edit form's
   Save/Continue submits BOTH forms via the combined background POST
   (custom.js one-block submit intercept). The button stays in the DOM, so
   Enter-key implicit submission of the contact form still works natively
   should the intercept ever be gone. */
body#checkout.opc-one-block-edit #checkout-personal-information-step form.js-customer-form footer.form-footer { display: none; }
/* Adaptis/Claude 2026-07-08 (r4b, 1) — ONE visible name pair: the address edit
   form's own Jméno/Příjmení groups are disabled by custom.js while one-block
   holds (the contact pair above is the single source in the combined POST — a
   duplicated key would let the address values overwrite a contact-half name
   edit on both records) and hidden here. Scoped to the body flag, so the hide
   can never outlive the mode even before JS restores the fields. */
body#checkout.opc-one-block-edit #checkout-addresses-step #delivery-address .opc-oneblock-name { display: none; }
/* /Adaptis r4, D — one-block edit */

/* ==================================================================
   Adaptis/Codex 2026-07-10 — pre-cart recommendation surface.
   Uses native product miniatures; this wrapper only supplies spacing and a
   clear boundary before the final cart action. Checkout itself has no upsell.
   ================================================================== */
body#cart .precart-crosssell {
  width: 100%;
  margin: 12px 0 28px;
  padding: 22px 0 4px;
  border-top: 1px solid #e6e6e6;
}
body#cart .precart-crosssell__title {
  margin: 0 0 16px;
  font-size: 20px;
  font-weight: 800;
  text-align: center;
  color: #16161d;
}
body#cart .precart-crosssell__item { min-width: 0; }
body#cart .precart-crosssell .product-miniature,
body#cart .precart-crosssell .card-product { height: 100%; }
@media (max-width: 575.98px) {
  body#cart .precart-crosssell { padding-top: 18px; }
  body#cart .precart-crosssell__title { font-size: 17px; }
}

/* ===================================================================
   Adaptis/Claude 2026-07-11 (round 5) — READ-ONLY CHECKOUT SUMMARY (belt)
   The server render of the right-column summary (cart-summary.tpl ->
   cart-summary-product-line.tpl) has no quantity control at all — only a badge.

   Adaptis/Claude 2026-07-11 (round 5, review fix) — the original comment here blamed
   core.js's $('.cart-overview').replaceWith(resp.cart_detailed) for injecting the
   pre-cart TouchSpin markup into the checkout summary. That is FALSE: .cart-overview
   / .cart-detailed-actions / .cart-detailed-totals exist only in cart-detailed.tpl,
   included only by checkout/cart.tpl (the PRE-CART). On /objednavka those selectors
   match nothing, so the injection is a no-op and no product-quantity-spin input ever
   reaches #js-checkout-summary.

   These rules (and custom.js opcSummaryReadOnly()) are therefore DEFENSIVE INSURANCE,
   not a proven fix: they guarantee that nothing which can change a quantity is ever
   visible inside the summary, whatever injects it. If "+ / −" really were seen on
   /objednavka, the real injector is elsewhere and still has to be found.
   Scoped to #js-checkout-summary: the pre-cart (/kosik) keeps its own +/-.
   =================================================================== */
body#checkout #js-checkout-summary .cart-overview,
body#checkout #js-checkout-summary .cart-detailed-actions,
body#checkout #js-checkout-summary .cart-detailed-totals,
body#checkout #js-checkout-summary .bootstrap-touchspin,
body#checkout #js-checkout-summary .input-group-btn-vertical,
body#checkout #js-checkout-summary .js-touchspin,
body#checkout #js-checkout-summary input[name="product-quantity-spin"],
body#checkout #js-checkout-summary .js-cart-line-product-quantity,
body#checkout #js-checkout-summary [data-link-action="delete-from-cart"] {
  display: none !important;
}

/* ===================================================================
   Adaptis/Claude 2026-07-11 (round 5) — DOPRAVA ZDARMA v souhrnu
   cart-summary-subtotals.tpl marks a genuinely-free (and already decided)
   shipping row with .cart-summary-line--free / .value--free and prints the
   word "Zdarma" instead of a price. Only the value chip changes — the flex
   row geometry above (custom.css: #js-checkout-summary .cart-summary-line)
   keeps its baseline alignment.
   =================================================================== */
body#checkout #js-checkout-summary .cart-summary-line--free .label {
  color: var(--co-ink);
}
body#checkout #js-checkout-summary .cart-summary-line--free .value--free {
  color: var(--co-success);
  background: var(--co-success-tint);
  font-weight: 700;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: .01em;
  padding: 1px 8px;
  border-radius: 999px;
  white-space: nowrap;
}