/* Accessibility and touch-target fixes verified against the staging storefront. */
#header .cart-products-count,
.breadcrumb,
.breadcrumb li span,
.products-sort-order .select-title,
.pagination,
.pagination .current a,
.product-description p,
.product-miniature .product-title a,
#footer p,
#footer .text-sm-center {
  color: #5f5f5f;
}

#header #search_widget input[type="text"]::placeholder {
  color: #555 !important;
  opacity: 1 !important;
}

#header #search_widget input[type="text"] {
  color: #555 !important;
}

#header #search_widget input[type="text"]::-webkit-input-placeholder,
#header #search_widget input[type="text"]::-moz-placeholder,
#header #search_widget input[type="text"]:-ms-input-placeholder {
  color: #555 !important;
  opacity: 1 !important;
}

.product-flags li.product-flag {
  color: #fff;
  background: #006f82;
}

.dt-section-heading .dt-eyebrow {
  color: #8d1d22 !important;
}

.dt-category-card--dark small {
  color: #ffb9bc;
}

.dt-category-card__copy > span {
  color: #666;
}

.featured-products .all-product-link,
#js-product-list-top .total-products,
#js-product-list-top .showing,
#js-product-list-top p,
#js-product-list .hidden-md-up .btn {
  color: #555;
}

.dt-safety-notice {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 18px;
  align-items: start;
  margin-top: 22px;
  padding: 22px 24px;
  color: #3f2525;
  background: #fff5f5;
  border: 1px solid #e4b9bb;
  border-left: 5px solid #a82026;
  border-radius: 12px;
}

.dt-safety-notice__badge {
  padding: 5px 9px;
  color: #fff;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: #a82026;
  border-radius: 999px;
}

.dt-safety-notice h2 {
  margin: 0 0 7px;
  color: #2c2020;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

.dt-safety-notice p {
  margin: 0 0 8px !important;
  color: #594545 !important;
  font-size: 0.82rem;
  line-height: 1.55;
}

.dt-safety-notice a {
  color: #a82026;
  font-size: 0.76rem;
  font-weight: 700;
}

.pagination .page-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: center;
}

.pagination .page-list li a {
  display: inline-flex;
  min-width: 32px;
  min-height: 32px;
  align-items: center;
  justify-content: center;
  padding: 4px 7px;
}

.bootstrap-touchspin .bootstrap-touchspin-up,
.bootstrap-touchspin .bootstrap-touchspin-down {
  min-width: 36px;
  min-height: 0;
}

.product-quantity .bootstrap-touchspin .input-group-btn-vertical,
.product-quantity .bootstrap-touchspin .input-group-btn-vertical > .btn {
  position: relative;
}

.product-quantity .bootstrap-touchspin .input-group-btn-vertical > .btn > .material-icons {
  position: static;
  width: 1rem;
  height: 1rem;
  line-height: 1rem;
}

.dt-invoice-address-choice {
  margin-top: 12px;
  padding: 14px 0;
  background: #f7f7f5;
  border-left: 4px solid #b51f28;
}

.dt-invoice-address-choice small {
  display: block;
  margin-top: 5px;
  line-height: 1.45;
}

.dt-company-purchase {
  margin: 14px 0 8px;
  padding: 14px 0 2px;
  background: #f7f7f5;
  border-left: 4px solid #b51f28;
}

.dt-company-purchase__choice {
  margin-bottom: 10px;
}

.dt-company-purchase__fields {
  padding-top: 14px;
  border-top: 1px solid #dededb;
}

.dt-company-purchase__fields[hidden] {
  display: none !important;
}

body#checkout .dt-address-options {
  margin: 14px -15px 8px;
  background: #f7f7f5;
  border-left: 4px solid #b51f28;
}

body#checkout .dt-address-options > .dt-company-purchase,
body#checkout .dt-address-options > .dt-invoice-address-choice {
  margin: 0;
  padding: 14px 0;
  background: transparent;
  border-left: 0;
}

body#checkout .dt-address-options .dt-company-purchase__choice,
body#checkout .dt-address-options > .dt-invoice-address-choice {
  margin-right: 0;
  margin-left: 0;
}

body#checkout .dt-address-options .dt-company-purchase__choice {
  margin-bottom: 0;
}

body#checkout .dt-address-options > .dt-invoice-address-choice {
  margin-bottom: 0;
  border-top: 1px solid #dededb;
}

body#checkout .dt-address-options .dt-company-purchase__fields {
  margin-top: 14px;
}

@media (min-width: 768px) {
  body#checkout #header .header-nav > .container > .row {
    display: flex;
    align-items: center;
  }
}

.dt-pickup-map-button,
.dt-pickup-map-button[aria-invalid="true"] {
  color: #fff;
  font-weight: 700;
  background: #b51f28;
  border: 2px solid #8d171e;
}

.dt-pickup-map-button:hover,
.dt-pickup-map-button:focus {
  color: #fff;
  background: #8d171e;
}

.dt-pickup-required {
  margin: 6px 0;
  color: #b51f28;
  font-weight: 700;
}

/* Versioned fallback: cached custom.css must not hide reviewed category content. */
body#category .block-category .block-category-inner {
  display: block !important;
}

body#category .block-category .block-category-inner #category-description {
  display: block !important;
  margin: 12px 0 8px;
  padding: 14px 16px;
  font-size: 0.95rem;
  line-height: 1.6;
  color: #4b4b4b !important;
  text-align: left;
  background: #f7f7f5;
  border-left: 3px solid #b51f28;
}

body#category .block-category .block-category-inner #category-description p {
  margin: 0;
  color: inherit;
}

body#category .block-category .block-category-inner .category-cover {
  display: none !important;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #8d1d22;
  outline-offset: 2px;
}

@media (max-width: 767px) {
  .dt-safety-notice {
    display: block;
    margin: 16px 15px 0;
    padding: 18px;
    border-radius: 10px;
  }

  .dt-safety-notice__badge {
    display: inline-block;
    margin-bottom: 11px;
  }

  .pagination .page-list li a {
    min-width: 36px;
    min-height: 36px;
  }
}

/* Conversion-first catalogue system: compact navigation, useful product cards
   and a mobile product flow that exposes the purchase action before long copy. */
body#category #subcategories {
  margin: 20px 0 24px;
  padding: 22px;
  background: #fff;
  border: 1px solid #e2e2de;
  border-radius: 14px;
  box-shadow: 0 10px 28px rgba(23, 23, 23, 0.05);
}

body#category #subcategories .subcategory-heading {
  margin: 0 0 16px;
  color: #1d1d1d;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  text-transform: none;
}

/* Three columns, not four: at four the tile is too narrow for a real category
   name and every label clipped mid-word ("PRÍSLUŠE…"). The names are complete
   in the markup, so the extra width is all that is needed to read them. */
body#category #subcategories .subcategories-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
}

body#category #subcategories .subcategories-list > li {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  width: auto !important;
  max-width: none !important;
  min-width: 0;
  min-height: 78px;
  margin: 0 !important;
  padding: 11px !important;
  background: #f7f7f4;
  border: 1px solid #e4e4df;
  border-radius: 10px;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

body#category #subcategories .subcategories-list > li:hover,
body#category #subcategories .subcategories-list > li:focus-within {
  border-color: #bd242b;
  box-shadow: 0 8px 20px rgba(23, 23, 23, 0.08);
  transform: translateY(-2px);
}

body#category #subcategories .subcategory-image {
  width: 58px !important;
  height: 58px !important;
  margin: 0;
}

body#category #subcategories .subcategory-image a,
body#category #subcategories .subcategory-image picture,
body#category #subcategories .subcategory-image img {
  display: block;
  width: 100%;
  height: 100%;
}

body#category #subcategories .subcategory-image img {
  max-width: 58px !important;
  max-height: 58px !important;
  padding: 4px !important;
  object-fit: contain;
  background: #fff;
  border-radius: 8px;
}

body#category #subcategories h5 {
  min-width: 0;
  margin: 0;
  text-align: left;
}

/* Regular weight and sentence case: the owner asked for readable names rather
   than shouty ones.

   The !important flags are NOT decoration. themes/classic/assets/css/custom.css
   — which lives only on the server and is not in this repository — clamps these
   names to two lines:

     .subcategories-list .subcategory-name { display: -webkit-box !important;
       -webkit-line-clamp: 2 !important; overflow: hidden !important;
       text-overflow: ellipsis !important; }

   That is exactly the truncation the owner complained about ("velmi skratene a
   vo vacsine necitatelne"). An earlier attempt set `display: block` without
   !important and silently lost the cascade, so the names stayed clipped and the
   fix looked applied while changing nothing on screen. These declarations undo
   every part of that clamp; the selector carries two IDs against the other
   rule's two classes, so it wins on specificity. */
body#category #subcategories .subcategory-name {
  display: block !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: unset !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: break-word;
  color: #252525;
  font-size: 0.86rem;
  font-weight: 500;
  line-height: 1.35;
  text-transform: none;
}

body#category #subcategories .subcategory-name::after {
  content: none;
}

body#category #subcategories .cat_desc,
body#category #subcategories .subcat-mobile-link {
  display: none;
}

.product-miniature .thumbnail-container {
  display: flex;
  height: 100%;
  overflow: hidden;
  flex-direction: column;
  margin-bottom: 20px;
  background: #fff;
  border: 1px solid #e2e2de;
  border-radius: 12px;
  box-shadow: 0 7px 22px rgba(23, 23, 23, 0.045);
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.product-miniature .thumbnail-container:hover,
.product-miniature .thumbnail-container:focus-within {
  border-color: #c9c9c4;
  box-shadow: 0 15px 32px rgba(23, 23, 23, 0.1);
  transform: translateY(-3px);
}

.product-miniature .thumbnail-top {
  overflow: hidden;
  flex: 0 0 auto;
  background: #fff;
}

.product-miniature .product-thumbnail img {
  width: 100%;
  height: 100%;
  padding: 8px;
  object-fit: contain;
}

.product-miniature .product-description {
  position: static;
  display: flex;
  width: 100%;
  height: auto;
  min-height: 142px;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 14px;
  background: #fff;
}

.product-miniature .product-title {
  min-height: 2.7em;
  margin: 0 0 8px;
  line-height: 1.35;
  text-align: left;
}

.product-miniature .product-title a {
  color: #2a2a2a;
  font-size: 0.85rem;
  font-weight: 700;
}

.product-miniature .product-price-and-shipping {
  margin: 0 0 12px;
  text-align: left;
}

.product-miniature .product-price-and-shipping .price {
  color: #b92028;
  font-size: 1.03rem;
  font-weight: 800;
}

.product-miniature .product-list-reviews {
  min-height: 0;
  margin: 0;
}

.product-miniature .dt-card-action {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: auto;
  padding: 9px 12px;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  background: #b92028;
  border: 1px solid #9c1820;
  border-radius: 7px;
}

.product-miniature .dt-card-action:hover,
.product-miniature .dt-card-action:focus-visible {
  color: #fff;
  background: #94171e;
}

.product-miniature .product-flags li.product-flag.new {
  color: #464646;
  background: #f1f1ed;
  border: 1px solid #d8d8d2;
}

.product-miniature .product-flags li.product-flag.out_of_stock {
  color: #fff;
  background: #9f1c23;
  border-color: #9f1c23;
}

.dt-subcategories-toggle {
  display: none;
}

.dt-mobile-buy-bar {
  display: none;
}

/* Faceted navigation: make a catalogue with thousands of products feel
   browsable without visually competing with the product grid. */
body#category #search_filters {
  padding: 18px;
  background: #fff;
  border: 1px solid #dfdfda;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(23, 23, 23, 0.055);
}

body#category #search_filters .facet {
  margin: 0;
  padding: 16px 0;
  border-bottom: 1px solid #e8e8e3;
}

body#category #search_filters .facet:first-child {
  padding-top: 0;
}

body#category #search_filters .facet:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

body#category #search_filters .facet .facet-title {
  margin: 0 0 11px;
  color: #252525;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.015em;
  text-transform: none;
}

body#category #search_filters .facet .facet-label {
  margin: 0 0 7px;
  line-height: 1.35;
}

body#category #search_filters .facet .facet-label a,
body#category #search_filters .facet .facet-label .search-link {
  color: #505050;
  font-size: 0.78rem;
}

body#category #search_filters .facet .facet-label a:hover,
body#category #search_filters .facet .facet-label a:focus-visible {
  color: #991820;
}

body#category #search_filters .custom-checkbox input[type="checkbox"] + span {
  border-color: #aaa9a3;
  border-radius: 3px;
}

body#category #search_filters .custom-checkbox input[type="checkbox"]:checked + span {
  background: #b92028;
  border-color: #b92028;
}

body#category #search_filters .ui-slider .ui-slider-range {
  background: #b92028;
}

body#category #search_filters .ui-slider .ui-slider-handle {
  width: 18px;
  height: 18px;
  margin-top: -4px;
  background: #fff;
  border: 3px solid #b92028;
  border-radius: 50%;
}

body#category #js-active-search-filters.active_filters {
  margin: 0 0 18px;
  padding: 12px 14px;
  background: #fff8f8;
  border: 1px solid #e1b4b7;
  border-left: 4px solid #b92028;
  border-radius: 8px;
}

body#category #js-active-search-filters .filter-block {
  color: #333;
  background: #fff;
  border: 1px solid #d9d9d4;
  border-radius: 999px;
}

@media (min-width: 768px) {
  body#category.page-category #left-column {
    display: block !important;
  }

  body#category.page-category #content-wrapper.left-column {
    flex: 0 0 66.666667% !important;
    width: 66.666667% !important;
    max-width: 66.666667% !important;
  }

  body#category #left-column #search_filters {
    position: sticky;
    top: 18px;
  }
}

@media (min-width: 992px) {
  body#category.page-category #content-wrapper.left-column {
    flex-basis: 75% !important;
    width: 75% !important;
    max-width: 75% !important;
  }
}

@media (max-width: 991px) and (min-width: 768px) {
  body#category #subcategories .subcategories-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  body#category.page-category #left-column {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body#category #subcategories {
    margin: 14px 0 18px;
    padding: 14px 8px 10px !important;
    border-radius: 10px;
  }

  body#category #subcategories .subcategory-heading {
    display: block !important;
    padding: 0 6px;
    font-size: 1rem;
  }

  /* Every tile is exactly three text lines tall, whatever its name is.
     Names range from "Rádiá" to "Prenosné reproduktory, rádiá, prehrávače a
     diktafóny", and letting each tile size itself produced a ragged grid with
     dead white space under the short ones -- visible as a five-line tile
     sitting next to a two-line one. The height below is that of three clamped
     lines plus padding and border, so a one-line name reserves the same box and
     simply centres in it. Three lines, not the theme's two: the owner rejected
     two-line clamping as unreadable, and three fits every current name except
     the longest one, which now ends in an ellipsis instead of stretching the
     row. */
  body#category #subcategories {
    --dt-subcat-font-size: 13px;
    --dt-subcat-line-height: 1.25;
    --dt-subcat-lines: 3;
    --dt-subcat-tile-height: calc(
      var(--dt-subcat-font-size) * var(--dt-subcat-line-height) * var(--dt-subcat-lines) + 18px
    );
  }

  body#category #subcategories .subcategories-list {
    grid-template-columns: 1fr 1fr;
    gap: 7px;
    align-items: stretch;
  }

  body#category #subcategories .subcategories-list > li {
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100%;
    min-height: var(--dt-subcat-tile-height);
    padding: 0 !important;
    background: #fff;
    border-color: #d9d9d4;
    border-radius: 8px;
    transform: none;
  }

  body#category #subcategories .subcategory-image,
  body#category #subcategories h5 {
    display: none !important;
  }

  body#category #subcategories .subcat-mobile-link {
    position: relative;
    display: flex !important;
    width: 100% !important;
    height: 100% !important;
    min-height: var(--dt-subcat-tile-height);
    align-items: center;
    justify-content: center !important;
    /* Right padding keeps the centred name clear of the arrow. */
    padding: 8px 24px 8px 10px !important;
    color: #2f2f2f;
    font-weight: 700;
    text-align: center !important;
    border: 1px solid #d9d9d4 !important;
    border-radius: 8px !important;
  }

  body#category #subcategories .subcat-mobile-name {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--dt-subcat-lines);
    line-clamp: var(--dt-subcat-lines);
    font-size: var(--dt-subcat-font-size) !important;
    line-height: var(--dt-subcat-line-height) !important;
    overflow-wrap: break-word;
    text-align: center !important;
  }

  /* Taken out of the flex flow so it cannot pull the centred name off-centre. */
  body#category #subcategories .subcat-mobile-link::after {
    position: absolute;
    top: 50%;
    right: 8px;
    margin: 0;
    color: #bd242b;
    content: "→";
    transform: translateY(-50%);
  }

  body#category #subcategories.dt-subcategories--collapsed:not(.dt-subcategories--expanded)
    .subcategories-list > li:nth-child(n + 9) {
    display: none !important;
  }

  .dt-subcategories-toggle {
    display: flex;
    width: calc(100% - 12px);
    min-height: 44px;
    align-items: center;
    justify-content: center;
    margin: 10px 6px 0;
    padding: 8px 12px;
    color: #8f171e;
    font-size: 0.75rem;
    font-weight: 700;
    background: #fff7f7;
    border: 1px solid #d9a3a6;
    border-radius: 8px;
  }

  body#category #search_filter_toggler {
    display: inline-flex;
    width: 100%;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #fff;
    font-size: 0.82rem;
    font-weight: 800;
    background: #b92028;
    border: 1px solid #94171e;
    border-radius: 8px;
    box-shadow: 0 7px 18px rgba(185, 32, 40, 0.2);
    white-space: nowrap;
  }

  body#category #search_filter_toggler:hover,
  body#category #search_filter_toggler:focus-visible {
    color: #fff;
    background: #94171e;
  }

  body#category #search_filters_wrapper {
    margin: 0 0 16px;
  }

  body#category .products-selection .sort-by-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 146px;
    gap: 8px;
    margin-right: 0;
    margin-left: 0;
  }

  body#category .products-selection .products-sort-order,
  body#category .products-selection .filter-button {
    float: none;
    width: auto !important;
    padding-right: 0;
    padding-left: 0;
  }

  body#category #search_filters {
    padding: 16px;
    border-radius: 9px;
  }

  body#category #search_filters .facet {
    padding: 14px 0;
  }

  body#category #search_filter_controls {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 0 0 12px;
  }

  body#category #search_filter_controls .btn {
    min-height: 44px;
  }

  .product-miniature .thumbnail-container {
    margin-bottom: 12px;
    border-radius: 9px;
  }

  .product-miniature .product-thumbnail img {
    padding: 5px;
  }

  .product-miniature .product-description {
    min-height: 150px;
    padding: 10px;
  }

  .product-miniature .product-title {
    min-height: 3.2em;
    margin-bottom: 7px;
  }

  .product-miniature .product-title a {
    display: -webkit-box;
    overflow: hidden;
    font-size: 0.76rem;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  .product-miniature .product-price-and-shipping .price {
    font-size: 0.94rem;
  }

  .product-miniature .dt-card-action {
    min-height: 44px;
    padding: 8px 9px;
    font-size: 0.7rem;
  }

  body#product .breadcrumb ol {
    display: flex;
    overflow: hidden;
    flex-wrap: nowrap;
    align-items: center;
    white-space: nowrap;
  }

  body#product .breadcrumb li:not(:first-child):not(:last-child) {
    display: none;
  }

  body#product .breadcrumb li:last-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body#product .product-information {
    display: flex;
    flex-direction: column;
  }

  body#product .product-information > .product-actions {
    order: 1;
    margin: 0 0 14px;
    padding: 16px;
    background: #fff;
    border: 1px solid #deded8;
    border-top: 4px solid #b92028;
    border-radius: 10px;
    box-shadow: 0 9px 24px rgba(23, 23, 23, 0.07);
  }

  body#product .product-information > .blockreassurance_product {
    order: 2;
    margin-top: 0;
  }

  body#product .product-information > [id^="product-description-short-"] {
    display: -webkit-box;
    order: 3;
    max-height: 6.2em;
    margin: 16px 0 0;
    overflow: hidden;
    color: #555;
    font-size: 0.9rem;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
  }

  body#product .product-information > .dt-full-description-link {
    display: inline-flex;
    order: 4;
    min-height: 44px;
    align-items: center;
    align-self: flex-start;
    margin: 5px 0 20px;
    color: #9c1820;
    font-size: 0.8rem;
    font-weight: 700;
  }

  body#product .product-information > .tabs {
    order: 5;
  }

  body#product .product-actions .product-add-to-cart {
    margin-top: 0;
  }

  body#product .product-actions .product-quantity {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 10px;
    align-items: stretch;
  }

  body#product .product-actions .product-quantity .qty,
  body#product .product-actions .product-quantity .add,
  body#product .product-actions .product-quantity .add .add-to-cart {
    width: 100%;
    margin: 0;
  }

  body#product .product-actions .product-quantity .add-to-cart {
    min-height: 48px;
    padding-right: 10px;
    padding-left: 10px;
    font-size: 0.78rem;
    white-space: nowrap;
  }

  body#product .product-actions .bootstrap-touchspin,
  body#product .product-actions #quantity_wanted {
    height: 48px;
  }

  body#product .product-actions .bootstrap-touchspin-up,
  body#product .product-actions .bootstrap-touchspin-down {
    height: 24px;
  }

  body#product .product-images {
    display: flex !important;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0 3px 8px;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
  }

  body#product .product-images > li.thumb-container {
    flex: 0 0 92px;
    scroll-snap-align: start;
  }

  body#product {
    padding-bottom: 82px;
  }

  body#product .dt-mobile-buy-bar {
    position: fixed;
    right: 8px;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    left: 8px;
    z-index: 1035;
    display: flex;
    min-height: 64px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 10px 9px 14px;
    color: #fff;
    background: #202020;
    border: 1px solid #343434;
    border-radius: 12px;
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.32);
    transition: opacity 140ms ease, transform 140ms ease;
  }

  body#product .dt-mobile-buy-bar.dt-mobile-buy-bar--hidden {
    pointer-events: none;
    opacity: 0;
    transform: translateY(calc(100% + 18px));
  }

  .dt-mobile-buy-bar__summary {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
  }

  .dt-mobile-buy-bar__price {
    overflow: hidden;
    color: #fff;
    font-size: 1rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .dt-mobile-buy-bar__status {
    overflow: hidden;
    color: #c7c7c7;
    font-size: 0.68rem;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .dt-mobile-buy-bar__button {
    min-width: 138px;
    min-height: 46px;
    padding: 8px 14px;
    color: #fff;
    font-size: 0.76rem;
    font-weight: 800;
    background: #c1262d;
    border: 1px solid #df343c;
    border-radius: 8px;
  }

  .dt-mobile-buy-bar__button:hover,
  .dt-mobile-buy-bar__button:focus-visible {
    color: #fff;
    background: #981b22;
  }

  .dt-mobile-buy-bar__button:disabled {
    cursor: not-allowed;
    opacity: 0.55;
  }
}

@media (prefers-reduced-motion: reduce) {
  body#category #subcategories .subcategories-list > li,
  .product-miniature .thumbnail-container {
    transition: none;
  }
}

/* Owner-reviewed responsive navigation and pointer-focus cleanup (2026-08-05). */
:where(a, button, [role="button"]):focus:not(:focus-visible) {
  outline: none !important;
  box-shadow: none;
}

:where(a, button, [role="button"]):focus-visible {
  outline-color: #b92028;
}

/* The thumbnail column was 82px, which left only ~137px for the name inside a
   257px tile — so even with the two-line clamp removed, long names still wrapped
   badly. Trading 22px of image for text width directly serves the request:
   readable names beat marginally larger thumbnails on a navigation tile.
   min-height is a floor, not a cap, so a name may grow to three or four lines.

   Desktop only. The mobile tile has no thumbnail at all, and because these rules
   sit after the mobile block they used to win the cascade on phones too --
   forcing a two-column grid around a hidden image and a 100px floor that fought
   the three-line tile height. */
@media (min-width: 768px) {
  body#category #subcategories .subcategories-list > li {
    display: grid !important;
    grid-template-columns: 60px minmax(0, 1fr);
    min-height: 100px;
  }

  body#category #subcategories .subcategory-image {
    display: flex !important;
    width: 82px !important;
    height: 82px !important;
    aspect-ratio: 1;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
  }

  body#category #subcategories .subcategory-image a,
  body#category #subcategories .subcategory-image picture {
    display: flex;
    width: 100%;
    min-width: 82px;
    height: 82px !important;
    min-height: 82px;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
  }

  body#category #subcategories .subcategory-image img {
    display: block;
    width: 82px !important;
    min-width: 82px !important;
    height: 82px !important;
    flex: 0 0 82px;
    max-width: 82px !important;
    max-height: 82px !important;
    margin: auto;
    padding: 6px !important;
    object-fit: contain !important;
    object-position: center;
  }
}

@media (max-width: 991px) {
  #header #search_widget {
    float: none;
    width: min(100%, 430px);
    margin-right: auto;
    margin-left: auto;
  }

  #index .dt-hero,
  #index .dt-home-section .dt-section-heading,
  #index .dt-category-grid .dt-category-card:nth-child(n + 2) {
    display: none !important;
  }

  #index .dt-home-section {
    padding-top: 14px;
  }

  #index .dt-category-grid {
    display: block;
  }

  #index .dt-category-grid .dt-category-card:first-child {
    display: grid;
    width: 100%;
    margin: 0;
  }

  #index .dt-category-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /*
   * Uvodny text kategorie na mobile.
   *
   * Bol tu skryty a malo to vtedy zmysel: 1 986 z 2 012 kategorii malo v popise
   * tu istu generickú vetu z povodneho generatora, takze na malej obrazovke
   * zabral miesto text, ktory nic nehovoril. Od septembra 2026 ma uz vyse tri
   * sto navstevovanych kategorii vecny rucne kontrolovany uvod a vacsina
   * zakaznikov chodi z mobilu — skryvat ho pred nimi uz nedava zmysel.
   *
   * V `themes/classic/templates/_partials/head.tpl` je rucne pridany inline
   * blok, ktory ten popis na mobile skryva. Tento predpis ho zamerne prebija
   * vyssou specificitou (`body#category` navyse). Ked bude niekto upravovat
   * head.tpl, nech ten mrtvy predpis rovno odstrani.
   *
   * Na mobile je text kompaktnejsi nez na desktope, aby neodtlacil produkty
   * prilis nizko.
   */
  body#category .block-category .block-category-inner #category-description {
    display: block !important;
    margin: 8px 0 10px;
    padding: 10px 12px;
    font-size: 0.875rem;
    line-height: 1.5;
  }

  body#category.page-category #left-column,
  body#category.page-category #content-wrapper.left-column {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body#category #left-column > .block-categories {
    display: none !important;
  }

  body#category .filter-button.hidden-md-up,
  body#category #search_filter_controls.hidden-md-up,
  body#category #search_filters .title.hidden-md-up {
    display: block !important;
  }

  body#category #search_filters_wrapper.hidden-sm-down,
  body#category #search_filters .hidden-sm-down {
    display: none !important;
  }

  body#category #search_filters_wrapper:not(.hidden-sm-down) {
    display: block !important;
  }

  body#category #subcategories .dt-subcategories-toggle {
    display: none !important;
  }

  body#category .products-selection .sort-by-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
    margin-right: 0;
    margin-left: 0;
  }

  body#category .products-selection .sort-by {
    display: none !important;
  }

  body#category .products-selection .products-sort-order,
  body#category .products-selection .filter-button {
    float: none;
    width: auto !important;
    padding-right: 0;
    padding-left: 0;
  }

  body#category .products-sort-order .select-title,
  body#category #search_filter_toggler {
    display: inline-flex;
    width: 100%;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    color: #b92028;
    font-size: 0.78rem;
    font-weight: 800;
    background: #fff;
    border: 1px solid #d68b8f;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(185, 32, 40, 0.08);
  }

  body#category .products-sort-order .select-title .material-icons {
    margin-left: auto;
  }

  body#category #search_filter_toggler:hover,
  body#category #search_filter_toggler:focus-visible {
    color: #94171e;
    background: #fff7f7;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  #header .header-top > .container > .row {
    grid-template-columns: 1fr;
  }

  #header #_desktop_logo {
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
  }

  #header #search_widget {
    grid-column: 1;
    grid-row: 2;
    justify-self: center;
    margin-top: 12px;
  }

  #header #_desktop_top_menu {
    grid-column: 1;
    grid-row: 3;
  }
}

@media (max-width: 767px) {
  body#category #subcategories .subcategory-image,
  body#category #subcategories h5 {
    display: none !important;
  }

  /* Only the frame is settled here. Layout and height belong to the tile block
     further up: this rule used to repeat `display: block` and `min-height: 52px`
     and, being later in the file, silently won -- so the three-line sizing was
     applied and then undone a few hundred lines later. */
  body#category #subcategories .subcategories-list > li {
    border: 0 !important;
    box-shadow: none !important;
  }

  body#category #subcategories .subcat-mobile-link {
    border: 1px solid #d9d9d4 !important;
  }

  /* "Čo práve riešite?" and its lead-in are cut on phones at the owner's
     request. On a narrow screen the heading plus three lines of explanation
     pushed the category cards themselves below the fold, and the cards already
     say what they are. Hidden, not removed: the copy still serves desktop and
     stays in the markup for search engines. */
  #index #custom-text > #dt-categories-title,
  #index #custom-text > #dt-categories-title + p {
    display: none !important;
  }

  /* The last crumb is the full product name and gets clipped mid-word by the
     breadcrumb's overflow; an ellipsis at least shows that it was shortened. */
  #product .breadcrumb li:last-child span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

/* Owner-reviewed storefront corrections (2026-08-10, Freelo 34661822/34611871/34610947). */

/* Main categories in the header read as black text; the red is kept for the
   active underline only. */
#header #_desktop_top_menu > .top-menu > li > a,
#header #_desktop_top_menu > .top-menu > li > a:hover,
#header #_desktop_top_menu > .top-menu > li > a:focus,
#header #_desktop_top_menu > .top-menu > li.current > a {
  color: #1d1d1d !important;
}

/* No black frame on hover anywhere the owner reported it: header links, the
   logo, the cart, category tiles and product tiles. The red lift on category
   tiles is intentional and stays. */
#header a:hover,
#header a:focus,
#header .logo:hover,
#header .logo:focus,
#header #_desktop_cart a:hover,
#header #_desktop_cart a:focus,
.product-miniature a:hover,
.product-miniature a:focus,
body#category #subcategories .subcategories-list > li a:hover,
body#category #subcategories .subcategories-list > li a:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* Clicking with a mouse must never leave the focus ring behind; keyboard focus
   is still shown via :focus-visible above. */
:where(a, button, [role="button"], img, picture):focus:not(:focus-visible) {
  outline: none !important;
  box-shadow: none !important;
}

/* Balíkovo pickup prompt, shown beside the red "Zobraziť mapu" button until a
   pickup point is chosen (Freelo 34663510). The trailing ↗ is part of the
   translated string and points at that button, which sits to its right.

   A previous rule here targeted .dt-pickup-help__arrow, which no template ever
   emitted -- styling with no element to style, while the prompt itself was not
   rendered at all. */
.dt-pickup-help {
  color: #b51f28;
  font-style: italic;
  font-weight: 500;
}