/* KOVO VD - e-shop (Shoptet Disco) - VÝPIS: kategorie, podkategorie, karty produktů, filtry, levý sloupec */

/* ---------- Nadpis kategorie a popis ---------- */
.category-title,
.category-top h1 {
  font-weight: 800;
  color: var(--kv-ink);
  letter-spacing: -.02em;
}

.category-perex {
  color: var(--kv-text);
}

/* ---------- Podkategorie - karty jako "Kategorie produktů" na webu ---------- */
.subcategories {
  display: flex;
  flex-wrap: wrap;
  margin-left: -8px;
  margin-right: -8px;
}

.subcategories li {
  padding: 8px;
  float: none;
}

.subcategories li a {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 100%;
  min-height: 72px;
  padding: 12px 40px 12px 12px;
  background: #fff;
  border: 1px solid var(--kv-border);
  border-radius: var(--kv-r-card);
  color: var(--kv-ink);
  font-weight: 700;
  line-height: 1.25;
  position: relative;
  text-decoration: none;
  transition: border-color var(--kv-ease), box-shadow var(--kv-ease), transform var(--kv-ease);
}

.subcategories li a::after {
  content: "\2192";
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--kv-navy);
  font-weight: 700;
  transition: right var(--kv-ease);
}

.subcategories li a:hover {
  border-color: var(--kv-blue);
  box-shadow: var(--kv-shadow);
  color: var(--kv-navy);
}

.subcategories li a:hover::after {
  right: 12px;
}

.subcategories li a .image {
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  border-radius: 12px;
  overflow: hidden;
  background: var(--kv-blue-25);
  display: flex;
  align-items: center;
  justify-content: center;
}

.subcategories li a .image img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.subcategories li a .text {
  padding: 0;
}

/* ---------- Karty produktů ---------- */
.products-block {
  margin-left: -8px;
  margin-right: -8px;
}

.products-block > .product {
  padding: 8px;
  border: 0 !important;
}

.products-block .p {
  height: 100%;
  background: #fff;
  border: 1px solid var(--kv-border);
  border-radius: var(--kv-r-card);
  overflow: hidden;
  transition: border-color var(--kv-ease), box-shadow var(--kv-ease);
}

.products-block .p:hover {
  border-color: var(--kv-blue);
  box-shadow: var(--kv-shadow);
}

.products-block .p .image {
  background: var(--kv-blue-25);
  border-bottom: 1px solid var(--kv-blue-50);
}

.products-block .p .image img {
  mix-blend-mode: multiply;
  transition: transform .35s ease;
}

.products-block .p:hover .image img {
  transform: scale(1.03);
}

.products-block .p-in {
  padding: 14px 16px 0;
}

.products-block .p .name {
  color: var(--kv-ink);
  font-weight: 700;
  font-size: 17px;
  line-height: 1.3;
  text-decoration: none;
}

.products-block .p .name:hover {
  color: var(--kv-navy);
}

.products-block .p-bottom {
  padding: 12px 16px 18px;
}

.products-block .p-code,
.p-code {
  color: #7b8599;
  font-size: 13px;
}

.products-block .p-desc {
  color: var(--kv-text);
  font-size: 14px;
}

.products-block .availability,
.products-block .availability span {
  font-weight: 600;
  font-size: 14px;
}

/* Ceny */
.price-final,
.price-final strong,
.products-block .price-final strong {
  color: var(--kv-ink);
  font-weight: 800;
}

.price-standard,
.price-standard span {
  color: #7b8599;
}

.price-additional,
.products-block .price-additional {
  color: var(--kv-text);
  font-size: 13px;
}

.price-save {
  color: var(--kv-navy);
  font-weight: 700;
}

/* Tlačítka v kartě */
.products-block .p-tools .btn {
  padding: 9px 18px;
  font-size: 15px;
}

.products-block .quantity,
.p-detail .quantity,
.quantity {
  border: 1px solid var(--kv-border);
  border-radius: var(--kv-r-btn);
  overflow: hidden;
  background: #fff;
}

.quantity .increase,
.quantity .decrease,
.quantity button {
  color: var(--kv-navy);
}

/* ---------- Řazení, stránkování, počet položek ---------- */
.category-header,
.listingControls {
  color: var(--kv-text);
}

.sortingToggle {
  border: 1px solid var(--kv-border);
  border-radius: var(--kv-r-btn);
  background: #fff;
  color: var(--kv-ink-2);
  font-weight: 600;
}

.listSorting__controls {
  border-radius: var(--kv-r-btn);
  border: 1px solid var(--kv-border);
  box-shadow: var(--kv-shadow);
  overflow: hidden;
}

.listSorting__control--current,
.listSorting__control:hover {
  color: var(--kv-navy);
  background: var(--kv-blue-25);
}

.pagination > a,
.pagination > strong,
.pagination .current,
.pagination-wrapper .pagination a,
.pagination-wrapper .pagination strong {
  border-radius: var(--kv-r-btn);
  border: 1px solid var(--kv-border);
  color: var(--kv-ink-2);
  font-weight: 700;
}

.pagination .current,
.pagination > strong,
.pagination-wrapper .pagination strong {
  background: var(--kv-navy);
  border-color: var(--kv-navy);
  color: #fff;
}

.pagination > a:hover,
.pagination-wrapper .pagination a:hover {
  border-color: var(--kv-blue);
  color: var(--kv-navy);
}

.load-products,
.toggle-top-products {
  border-radius: var(--kv-r-btn) !important;
}

/* ---------- Filtry ---------- */
.filters-wrapper .filters,
#filters {
  border-radius: var(--kv-r-card);
}

#filters h4,
#filters h4 span {
  color: var(--kv-ink);
  font-weight: 800;
}

#filters .ui-slider {
  background: var(--kv-blue-50);
  border: 0;
  border-radius: 4px;
}

#filters .ui-slider .ui-slider-range {
  background: var(--kv-navy);
}

#filters .ui-slider .ui-slider-handle {
  background: #fff;
  border: 2px solid var(--kv-navy);
  border-radius: 50%;
}

.filter-section label,
#filters label {
  color: var(--kv-ink-2);
}

/* ---------- Levý sloupec ---------- */
.sidebar .box {
  background: var(--kv-blue-25);
  border: 1px solid var(--kv-blue-50);
  border-radius: var(--kv-r-card);
  padding-left: 20px;
  padding-right: 20px;
  margin-bottom: 20px;
}

.sidebar .box.box-categories {
  background: #fff;
  border-color: var(--kv-border);
}

.sidebar .box h4,
.sidebar .box .h4 {
  color: var(--kv-ink);
  font-weight: 800;
}

.box-categories a,
#categories a {
  color: var(--kv-ink-2);
  border-radius: var(--kv-r-btn);
}

.box-categories a:hover,
#categories a:hover {
  color: var(--kv-navy);
  background: transparent;
}

#categories .expandable > a,
#categories .active > a,
#categories a.active {
  color: var(--kv-navy);
}

#categories .topic.active > a,
#categories li.active > a {
  font-weight: 800;
}

.box-topProducts .top-products-wrapper a,
.box-topProducts .p-name {
  color: var(--kv-ink-2);
}

.box-topProducts .top-products-wrapper .counter,
.box-topProducts .top-products-wrapper > li::before {
  background: var(--kv-navy);
  color: #fff;
  border-radius: 50%;
}

/* ---------- Doplňky po testu na vývojovce ---------- */
.products-block > .product > .p {
  background: #fff !important;
  border: 1px solid var(--kv-border) !important;
  border-radius: var(--kv-r-card) !important;
  overflow: hidden;
}

.products-block > .product > .p:hover {
  border-color: var(--kv-blue) !important;
  box-shadow: var(--kv-shadow);
}

.subcategories li a {
  font-size: 15px;
  padding-right: 32px;
}

.subcategories li a .text {
  font-size: 15px;
  -webkit-line-clamp: 3;
}

.subcategories li a::after {
  right: 12px;
}

/* Nejprodávanější v kategorii (řádkové karty) */
.products-inline .product {
  padding: 6px;
}

.products-inline .p {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  height: 100%;
  background: #fff;
  border: 1px solid var(--kv-border);
  border-radius: var(--kv-r-card);
  transition: border-color var(--kv-ease), box-shadow var(--kv-ease);
}

.products-inline .p:hover {
  border-color: var(--kv-blue);
  box-shadow: var(--kv-shadow);
}

.products-inline .p .image {
  flex: 0 0 72px;
  width: 72px;
  max-width: 72px;
  background: var(--kv-blue-25);
  border-radius: 12px;
  overflow: hidden;
}

.products-inline .p .image img {
  mix-blend-mode: multiply;
}

.products-inline .p-in {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  padding: 0;
}

.products-inline .p .name {
  color: var(--kv-ink);
  font-weight: 700;
  line-height: 1.3;
}

.products-inline .price-final strong {
  color: var(--kv-ink);
  font-weight: 800;
}

@media (min-width: 992px) {
  .products-top .product {
    width: 50% !important;
    flex: 0 0 50%;
  }
}

/* Bez stínu při najetí myší (karty produktů) */
.products-block .p:hover,
.products-block > .product > .p:hover,
.products-inline .p:hover {
  box-shadow: none !important;
}

/* Disco dává stín celému obalu .product (hranatý) - vypnout všude */
.products-block > .product,
.products-block > .product:hover,
.products-block > .product:focus-within,
.products-inline .product,
.products-inline .product:hover,
.product-slider .product:hover {
  box-shadow: none !important;
}

/* Menší dlaždice ve výpisu (23. 10. 2026) - počet sloupců se nastavuje v administraci (Rozvržení), tady jen kratší karta */

.products-block .p-in {
  padding: 10px 12px 0;
}

.products-block .p .name {
  font-size: 15px;
}

.products-block .p-bottom {
  padding: 8px 12px 12px;
}

.products-block .p-desc {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-top: 6px;
  font-size: 13px;
}

.products-block .stars-placeholder {
  display: none;
}

.products-block .p-tools {
  margin: 8px 0 0;
  padding: 0;
  min-height: 0;
}

.products-block .p-tools .btn {
  padding: 7px 14px;
  font-size: 14px;
}

/* Hustší řádkování v kartě (23. 10. 2026) */
.products-block .p .p-in {
  padding-top: 10px !important;
}

.products-block .p .name {
  line-height: 1.25;
}

.products-block .p .ratings-wrapper,
.products-block .p .availability {
  min-height: 0;
  line-height: 1.3;
}

.products-block .p .p-bottom {
  padding-top: 8px !important;
}

.products-block .p .prices {
  line-height: 1.2;
}

.products-block .p .p-tools {
  margin-top: 0 !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

.products-block .p .p-desc {
  margin-bottom: 12px !important;
  line-height: 1.4;
}

/* Ikona v tlačítku Řadit podle nesmí sahat na okraj */
.sortingToggle {
  padding-left: 42px !important;
}

.sortingToggle .icon-sort {
  left: 14px !important;
}

/* Menu kategorií v levém sloupci - menší písmo a řádkování (23. 10. 2026) */
#categories .topic > a {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  font-size: 17px !important;
  line-height: 1.25 !important;
}

#categories ul a,
#categories li li a {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
}
