/* ============================================================
   BASTLIK.CZ — Redesign produktové karty (pravý sloupec)
   Vložit do: Shoptet administrace -> Vzhled a obsah -> Editor ->
   HTML kód -> Záhlaví, obalené do <style>...</style>
   Scope: vše je schované pod .p-data-wrapper.
   Vlastní proměnné mají prefix --bstlpd-.
   Žádné nové HTML elementy se nevytváří.

   v7 — změny oproti v6:
   - +/- hover: definitivně jednobarevný. Skryté VŠECHNY potomky
     tlačítek (.decrease *, .increase *) — to byl ten vnitřní
     světlejší box. Ikonu kreslí ::before (není potomek), přístupnost
     drží aria-label ze šablony.
   - "Skladem" zarovnané: vynulované padding-left/margin-left/
     text-indent u všech vnořených elementů v hodnotových buňkách,
     takže kód / Skladem / datum lícují na stejný pixel.
   - cena: "od" zůstává menší, ale samotné číslo (.nowrap) je zpět
     na původní velikosti 32px — na cenovku už nesahám.
   ============================================================ */

.p-data-wrapper {
  --bstlpd-green: #9ccc00;
  --bstlpd-green-dark: #8bb400;
  --bstlpd-red: #d32f2f;
  --bstlpd-blue: #2563eb;
  --bstlpd-border: #e5e7eb;
  --bstlpd-bg-soft: #f9fafb;
  --bstlpd-text-muted: #6b7280;
  --bstlpd-text-dark: #111827;
  --bstlpd-font-heading: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* ---------- Karta ---------- */
.p-data-wrapper {
  background: #ffffff !important;
  border: 1px solid var(--bstlpd-border);
  border-radius: 16px;
  padding: 40px 32px 24px 32px !important;
  max-width: 440px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
  transition: box-shadow .2s ease;
  align-self: flex-start !important;
  height: -moz-fit-content !important;
  height: fit-content !important;
}
.p-data-wrapper:hover {
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.06);
}

/* ---------- Nadpis ---------- */
.p-data-wrapper .p-detail-inner-header h1 {
  font-family: var(--bstlpd-font-heading) !important;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--bstlpd-text-dark);
  margin-bottom: 8px;
}

/* Hvězdičkové hodnocení v novém designu není -> schováme */
.p-data-wrapper .ratings-and-brand {
  display: none !important;
}

/* ---------- Blok variant / vyprodáno ---------- */
.p-data-wrapper .p-variants-block .variant-list {
  margin-bottom: 20px;
}
.p-data-wrapper .p-variants-block .variant-label {
  display: block;
  font-size: 14px;
  color: var(--bstlpd-text-dark);
  margin-bottom: 6px;
}
.p-data-wrapper .p-variants-block .sold-out-wrapper {
  margin-bottom: 18px;
}
.p-data-wrapper .p-variants-block .sold-out {
  color: var(--bstlpd-text-muted);
  font-size: 14px;
}

/* ---------- Tabulka parametrů -> CSS Grid (zarovnané sloupce) ---------- */
.p-data-wrapper table.detail-parameters {
  display: block !important;
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 1px dashed var(--bstlpd-border);
}
.p-data-wrapper table.detail-parameters tbody {
  display: grid !important;
  grid-template-columns: 22px auto 1fr;
  column-gap: 10px;
  row-gap: 10px;
  align-items: center;
  width: 100%;
}
.p-data-wrapper table.detail-parameters tr {
  display: contents !important;
}
.p-data-wrapper table.detail-parameters th,
.p-data-wrapper table.detail-parameters td {
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  background: transparent !important;
  width: auto !important;
  max-width: none !important;
  font-size: 14px;
  text-align: left;
  justify-self: start;
}
/* DŮLEŽITÉ pro zarovnání hodnot: vynulovat vodorovné odsazení
   u VŠECH vnořených elementů v buňkách (span, div, .delivery-time…) */
.p-data-wrapper table.detail-parameters td,
.p-data-wrapper table.detail-parameters td * {
  margin-left: 0 !important;
  padding-left: 0 !important;
  text-indent: 0 !important;
}
/* pojistka proti "dotted leader" pseudoelementům ze šablony */
.p-data-wrapper table.detail-parameters th::after,
.p-data-wrapper table.detail-parameters th::before,
.p-data-wrapper table.detail-parameters td::after,
.p-data-wrapper table.detail-parameters td::before {
  content: none !important;
  border: none !important;
}

/* -------- Řádek 1: Kód -------- */
.p-data-wrapper table.detail-parameters tbody > tr.p-code::before {
  content: "";
  grid-row: 1;
  grid-column: 1;
  width: 22px;
  height: 22px;
}
.p-data-wrapper table.detail-parameters tbody > tr.p-code th {
  grid-row: 1;
  grid-column: 2;
}
.p-data-wrapper table.detail-parameters tbody > tr.p-code td {
  grid-row: 1;
  grid-column: 3;
}
.p-data-wrapper table.detail-parameters tbody > tr.p-code th,
.p-data-wrapper table.detail-parameters tbody > tr.p-code td {
  font-size: 13px;
  color: #9ca3af;
}
.p-data-wrapper table.detail-parameters tbody > tr.p-code td span {
  font-weight: 700;
  color: var(--bstlpd-text-muted);
}

/* -------- Řádek 2: Dostupnost -------- */
.p-data-wrapper table.detail-parameters tbody > tr:nth-child(1)::before {
  content: "";
  grid-row: 2;
  grid-column: 1;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: #ecfdf5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232e7d32' stroke-width='2.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M5 13l4 4L19 7'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 13px 13px;
}
.p-data-wrapper table.detail-parameters tbody > tr:nth-child(1) th {
  grid-row: 2;
  grid-column: 2;
}
.p-data-wrapper table.detail-parameters tbody > tr:nth-child(1) td {
  grid-row: 2;
  grid-column: 3;
}
.p-data-wrapper table.detail-parameters tbody > tr:nth-child(1) th .row-header-label {
  color: var(--bstlpd-text-muted);
  font-weight: 400;
  white-space: nowrap;
}
.p-data-wrapper table.detail-parameters tbody > tr:nth-child(1) th .row-header-label::after {
  content: ":" !important;
}
.p-data-wrapper .availability-label {
  color: #2e7d32 !important;
  font-weight: 700 !important;
}
/* amount ("(>5 ks)") — malá mezera za "Skladem" (vyšší specificita
   než plošné vynulování výše, aby se margin uplatnil) */
.p-data-wrapper table.detail-parameters td .availability-amount {
  color: var(--bstlpd-text-dark);
  margin-left: 6px !important;
}

/* -------- Řádek 3: Doručení -------- */
.p-data-wrapper table.detail-parameters tbody > tr.delivery-time-row::before {
  content: "";
  grid-row: 3;
  grid-column: 1;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: #eff6ff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 002-2H5a2 2 0 00-2 2v12a2 2 0 002 2z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
}
.p-data-wrapper table.detail-parameters tbody > tr.delivery-time-row th {
  grid-row: 3;
  grid-column: 2;
}
.p-data-wrapper table.detail-parameters tbody > tr.delivery-time-row td {
  grid-row: 3;
  grid-column: 3;
}
.p-data-wrapper table.detail-parameters tbody > tr.delivery-time-row th .delivery-time-label {
  color: var(--bstlpd-text-muted);
  font-weight: 400;
  white-space: nowrap;
}
.p-data-wrapper table.detail-parameters tbody > tr.delivery-time-row td,
.p-data-wrapper table.detail-parameters tbody > tr.delivery-time-row .delivery-time {
  color: var(--bstlpd-text-dark);
  font-weight: 600;
  font-size: 13px;
}
.p-data-wrapper .show-tooltip.acronym {
  text-decoration: none !important;
  border-bottom: none !important;
  cursor: default;
}

/* -------- Řádek 4: odkaz "Možnosti doručení" -------- */
.p-data-wrapper table.detail-parameters tbody > tr.shipping-options-row td {
  grid-row: 4;
  grid-column: 2 / 4;
  margin-top: -4px !important;
}
.p-data-wrapper table.detail-parameters tbody > tr.shipping-options-row a.shipping-options {
  font-size: 13px;
  color: #2563eb;
  text-decoration: none;
  font-weight: 500;
}
.p-data-wrapper table.detail-parameters tbody > tr.shipping-options-row a.shipping-options:hover {
  text-decoration: underline;
}

/* ---------- Nákupní zóna (šedý box) ---------- */
.p-data-wrapper .p-to-cart-block {
  background: var(--bstlpd-bg-soft) !important;
  border-radius: 12px;
  padding: 20px;
  display: grid !important;
  grid-template-columns: 1fr auto;
  grid-template-areas:
    "price qty"
    "button button";
  row-gap: 16px;
  column-gap: 12px;
  align-items: center;
}

/* Cena */
.p-data-wrapper .p-final-price-wrapper {
  grid-area: price;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-self: center !important;
}
.p-data-wrapper .price-final {
  font-size: 32px;
  font-weight: 800;
  color: var(--bstlpd-red) !important;
  line-height: 1.2;
}
.p-data-wrapper .price-measure:empty {
  display: none;
}
/* skryté cenové varianty nesmí zabírat výšku (jinak natahují
   cenový sloupec a cena je pak výš než blok s množstvím) */
.p-data-wrapper .price-final .price-final-holder.no-display,
.p-data-wrapper .price-final .price-final-holder.noDisplay {
  display: none !important;
}
/* U nevybrané varianty je "od" menší, ale samotná cena (.nowrap)
   zůstává v původní velikosti 32px — cenovku neměníme */
.p-data-wrapper .price-final .price-final-holder.default-variant {
  font-size: 18px;
  font-weight: 700;
}
.p-data-wrapper .price-final .price-final-holder.default-variant .nowrap {
  font-size: 32px;
}

/* Volič množství */
.p-data-wrapper .add-to-cart {
  grid-area: qty;
  align-self: center !important;
}
.p-data-wrapper .add-to-cart .quantity {
  display: flex !important;
  align-items: stretch !important;
  background: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  overflow: hidden;
  height: 44px;
  width: fit-content;
}
.p-data-wrapper .add-to-cart .quantity .decrease { order: 1; }
.p-data-wrapper .add-to-cart .quantity input.amount { order: 2; }
.p-data-wrapper .add-to-cart .quantity .increase { order: 3; }

.p-data-wrapper .add-to-cart .quantity input.amount {
  width: 40px;
  height: 100%;
  text-align: center;
  border: none !important;
  font-size: 15px;
  font-weight: 600;
  color: var(--bstlpd-text-dark);
  outline: none;
  -moz-appearance: textfield;
  background: transparent !important;
  align-self: center;
}
.p-data-wrapper .add-to-cart .quantity input.amount::-webkit-outer-spin-button,
.p-data-wrapper .add-to-cart .quantity input.amount::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* +/- tlačítka — necháváme původní znaky ze šablony (− / +),
   jen tlačítka srovnáme do řádku a doladíme vzhled. Pořadí je
   opět minus vlevo, číslo uprostřed, plus vpravo. */
.p-data-wrapper .add-to-cart .quantity .increase,
.p-data-wrapper .add-to-cart .quantity .decrease {
  background: none !important;
  border: none !important;
  width: 36px;
  height: 100%;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 22px;
  line-height: 1 !important;
  color: #4b5563 !important;
  cursor: pointer;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background .15s, color .15s;
  box-sizing: border-box !important;
}
/* stray ::before/::after ze šablony pryč — to dělalo tu druhou barvu */
.p-data-wrapper .add-to-cart .quantity .increase::before,
.p-data-wrapper .add-to-cart .quantity .decrease::before,
.p-data-wrapper .add-to-cart .quantity .increase::after,
.p-data-wrapper .add-to-cart .quantity .decrease::after {
  content: none !important;
  display: none !important;
  background: none !important;
}
/* posun JEN znaménka nahoru (přes span), tlačítko i hover zůstávají celé */
.p-data-wrapper .add-to-cart .quantity .increase__sign,
.p-data-wrapper .add-to-cart .quantity .decrease__sign {
  display: block !important;
  background: transparent !important;
  color: inherit !important;
  font-size: 24px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  transform: translateY(-2px);
}
.p-data-wrapper .add-to-cart .quantity .increase:hover,
.p-data-wrapper .add-to-cart .quantity .decrease:hover {
  background: var(--bstlpd-blue) !important;
  color: #ffffff !important;
}
.p-data-wrapper .add-to-cart .quantity .js-increase-tooltip,
.p-data-wrapper .add-to-cart .quantity .js-decrease-tooltip {
  display: none !important;
}

/* Tlačítko Do košíku */
.p-data-wrapper .add-to-cart-button {
  grid-area: button;
  width: 100%;
  background: var(--bstlpd-green) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px;
  height: 48px;
  transition: background .15s, transform .1s;
}
.p-data-wrapper .add-to-cart-button:hover {
  background: var(--bstlpd-green-dark) !important;
}
.p-data-wrapper .add-to-cart-button:active {
  transform: scale(0.98);
}
.p-data-wrapper .add-to-cart-button::before {
  content: "";
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 11-4 0 2 2 0 014 0z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
}

/* ---------- Stav VYPRODÁNO (detekce přes :has) ---------- */
.p-data-wrapper:has(.p-variants-block .sold-out) .availability-label {
  color: var(--bstlpd-red) !important;
}
.p-data-wrapper:has(.p-variants-block .sold-out) table.detail-parameters tbody > tr:nth-child(1)::before {
  background-color: #fef2f2;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d32f2f' stroke-width='2.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
}
.p-data-wrapper:has(.p-variants-block .sold-out) .p-to-cart-block {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  min-height: 92px;
}

/* ---------- Odstranění zbytečné mezery pod tlačítkem ---------- */
.p-data-wrapper form#product-detail-form {
  margin: 0 !important;
  padding: 0 !important;
}
.p-data-wrapper .buttons-wrapper {
  margin: 0 !important;
  padding: 0 !important;
}
.p-data-wrapper .cofidis-buttons-wrapper,
.p-data-wrapper .hledejceny-buttons-wrapper {
  display: none !important;
}

/* ---------- "Zeptat se" — doleva, hned pod boxem ---------- */
.p-data-wrapper .social-buttons-wrapper {
  margin-top: 12px !important;
  width: 100%;
}
.p-data-wrapper .social-buttons-wrapper .link-icons {
  display: flex !important;
  justify-content: flex-start !important;
  width: 100% !important;
}
.p-data-wrapper .social-buttons-wrapper .link-icons .print,
.p-data-wrapper .social-buttons-wrapper .link-icons .share {
  display: none !important;
}
.p-data-wrapper .social-buttons-wrapper .link-icons a.chat {
  display: flex !important;
  align-items: center !important;
  gap: 6px;
  margin: 0 !important;
  font-size: 13px;
  color: var(--bstlpd-text-muted);
  text-decoration: none;
  font-weight: 500;
  transition: color .15s;
}
.p-data-wrapper .social-buttons-wrapper .link-icons a.chat:hover {
  color: var(--bstlpd-text-dark);
}
.p-data-wrapper .social-buttons-wrapper .link-icons a.chat::before {
  content: "";
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M8.228 9c.549-1.165 2.03-2 3.772-2 2.21 0 4 1.343 4 3 0 1.4-1.278 2.575-3.006 2.907-.542.104-.994.54-.994 1.093m0 3h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
}

/* ============================================================
   Responzivita — tablet + mobil
   ============================================================ */
@media (max-width: 768px) {
  .p-data-wrapper {
    max-width: 100%;
  }
}

@media (max-width: 600px) {
  .p-data-wrapper {
    padding: 32px 24px 20px 24px !important;
  }
  .p-data-wrapper .p-detail-inner-header h1 {
    font-size: 20px;
  }
  .p-data-wrapper table.detail-parameters tbody {
    grid-template-columns: 20px auto 1fr;
    column-gap: 8px;
  }
  /* menší text parametrů + hodnoty na jeden řádek (bez zalamování) */
  .p-data-wrapper table.detail-parameters th,
  .p-data-wrapper table.detail-parameters td {
    font-size: 13px;
  }
  .p-data-wrapper table.detail-parameters tbody > tr:nth-child(1) td,
  .p-data-wrapper table.detail-parameters tbody > tr.p-code td,
  .p-data-wrapper table.detail-parameters tbody > tr.delivery-time-row td {
    white-space: nowrap;
  }
  .p-data-wrapper .availability-label,
  .p-data-wrapper .availability-amount {
    white-space: nowrap;
  }
}

@media (max-width: 480px) {
  /* cena a množství zůstávají vedle sebe na jednom řádku,
     jen tlačítko je pod nimi přes celou šířku */
  .p-data-wrapper .p-to-cart-block {
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "price qty"
      "button button";
  }
  .p-data-wrapper .add-to-cart .quantity {
    width: -moz-fit-content;
    width: fit-content;
  }
}

@media (max-width: 380px) {
  .p-data-wrapper .price-final {
    font-size: 28px;
  }
}