/* =================================================================
   TRAVT — Detail produktu (popis) · samostatný stylesheet
   verzia: 1.0  ·  2026-06
   -----------------------------------------------------------------
   ► Nahrať cez Shoptet → Súbory a linknúť ako DRUHÝ stylesheet
     v HTML kódoch (slot "Pred koncom </head>"):
     <link rel="stylesheet" href="/user/documents/upload/style/travt-product.css?v=1">
   ► Obsah popisu (product-description.html) je celý zabalený do
     <div class="trv-pd"> — všetky štýly sú scoped pod .trv-pd,
     takže sa NEPLETÚ s homepage ani so zvyškom šablóny.
   -----------------------------------------------------------------
   Sekcie:
     0) Tokeny (idempotentné — rovnaké ako v travt-redesign.css)
     1) Layout popisu (.trv-pd, nadpisy)
     2) Tabuľky (rozmery, technické parametre)
     3) Karty materiálu
     4) USP s ikonami (background-image)
     5) Dekor swatche
     6) CTA blok
     7) Shoptet "Dodatočné parametre" (.detail-parameters)
   ================================================================= */


/* 0) TOKENY ──────────────────────────────────────────────────────
   Re-deklarácia je neškodná (rovnaké hodnoty ako hlavný CSS) a robí
   tento súbor samostatný, keby sa načítal bez travt-redesign.css. */
:root{
  --travt-bg:        #FAF8F4;
  --travt-bg-alt:    #F2EEE6;
  --travt-bg-card:   #FFFFFF;
  --travt-ink:       #1A1714;
  --travt-ink-soft:  #4A433C;
  --travt-ink-mute:  #7B7269;
  --travt-line:      #E3DDD0;
  --travt-line-2:    #EEE9DC;
  --travt-steel:     #1F1B18;
  --travt-accent:    #B86A2E;
  --travt-accent-soft:#F4E6D5;
  --travt-green:     #2E7D45;
}


/* 1) LAYOUT POPISU ───────────────────────────────────────────────── */
.trv-pd{
  font-family: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--travt-ink);
  font-size: 16px;
  line-height: 1.6;
}
.trv-pd *{ box-sizing: border-box; }

.trv-pd__block{ margin: 0 0 40px; }
.trv-pd__block:last-child{ margin-bottom: 0; }

/* Nadpis sekcie — bold Manrope + tobacco "tick" pod ním */
.trv-pd__h{
  font-family: inherit;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--travt-ink);
  margin: 0 0 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--travt-line);
  position: relative;
}
.trv-pd__h::after{
  content: "";
  position: absolute;
  left: 0; bottom: -1px;
  width: 48px; height: 2px;
  background: var(--travt-accent);
}

.trv-pd__note{
  font-size: 14px;
  color: var(--travt-ink-mute);
  margin: 14px 0 0;
  line-height: 1.5;
}
.trv-pd__note strong{ color: var(--travt-ink-soft); }


/* 2) TABUĽKY ─────────────────────────────────────────────────────── */
.trv-pd__table{
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
  margin: 0;
  border: 1px solid var(--travt-line);
  border-radius: 10px;
  overflow: hidden;
}
/* hlavička (rozmery) — steel pruh, mono popisky */
.trv-pd__table thead tr{
  background: var(--travt-steel);
}
.trv-pd__table thead th{
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #C9BFAF;
  font-weight: 500;
  text-align: left;
  padding: 14px 16px;
}
.trv-pd__table tbody td{
  padding: 14px 16px;
  border-bottom: 1px solid var(--travt-line-2);
  color: var(--travt-ink-soft);
}
.trv-pd__table tbody tr:last-child td{ border-bottom: none; }
.trv-pd__table tbody td strong{ color: var(--travt-ink); font-weight: 600; }

/* technické parametre — dvojstĺpec, zebra */
.trv-pd__spec{
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
  border: 1px solid var(--travt-line);
  border-radius: 10px;
  overflow: hidden;
}
.trv-pd__spec tr{ border-bottom: 1px solid var(--travt-line-2); }
.trv-pd__spec tr:last-child{ border-bottom: none; }
.trv-pd__spec tr:nth-child(even){ background: var(--travt-bg-alt); }
.trv-pd__spec th{
  text-align: left;
  width: 42%;
  padding: 13px 16px;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11.5px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--travt-ink-mute);
  font-weight: 500;
  vertical-align: top;
}
.trv-pd__spec td{
  padding: 13px 16px;
  color: var(--travt-ink);
  font-weight: 500;
}


/* 3) KARTY MATERIÁLU ─────────────────────────────────────────────── */
.trv-pd__cards{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.trv-pd__card{
  background: var(--travt-bg-card);
  border: 1px solid var(--travt-line-2);
  border-radius: 12px;
  padding: 22px 24px;
}
.trv-pd__card h3{
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--travt-accent);
  font-weight: 500;
  margin: 0 0 14px;
}
.trv-pd__card ul{
  margin: 0;
  padding: 0 0 0 10px;
  list-style: none;
}
.trv-pd__card li{
  position: relative;
  padding: 7px 0 7px 26px;
  font-size: 14.5px;
  color: var(--travt-ink-soft);
  line-height: 1.45;
  border-bottom: 1px solid var(--travt-line-2);
}
.trv-pd__card li:last-child{ border-bottom: none; }
/* Shoptet default odrážka (šipka cez ::after / background) preč — ostane len naše koliesko */
.trv-pd__card ul{ list-style: none !important; padding-left: 10px !important; }
.trv-pd__card li{ background-image: none !important; list-style: none !important; padding-left: 26px !important; }
.trv-pd__card li::after{ content: none !important; display: none !important; background: none !important; }
.trv-pd .trv-pd__card li::before,
.trv-pd__card li::before{
  content: "" !important;
  font-size: 0 !important;          /* zhasne ikonu z fontu (\e910 šipka) */
  font-family: inherit !important;
  position: absolute;
  left: 0 !important; top: 14px;
  margin: 0 !important;             /* prebije margin témy -18px */
  width: 8px !important; height: 8px !important;
  border-radius: 50%;
  background: var(--travt-accent-soft) !important;
  border: 1.5px solid var(--travt-accent) !important;
  color: transparent !important;
}


/* 4) USP S IKONAMI ───────────────────────────────────────────────── */
.trv-pd__usps{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.trv-pd__usp{
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 18px;
  border: 1px solid var(--travt-line-2);
  border-radius: 12px;
  background: var(--travt-bg-card);
}
.trv-pd__usp-ico{
  flex-shrink: 0;
  width: 40px; height: 40px;
  border-radius: 8px;
  background-color: var(--travt-accent-soft);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
  font-size: 0;
}
.trv-pd__usp-ico--vyroba   { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B86A2E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s-8-5-8-12a8 8 0 1 1 16 0c0 7-8 12-8 12z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"); }
.trv-pd__usp-ico--miera    { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B86A2E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h6m6 0h6M12 3v6m0 6v6'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3C/svg%3E"); }
.trv-pd__usp-ico--pevnost  { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B86A2E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20l8-16 8 16M8 14h8'/%3E%3C/svg%3E"); }
.trv-pd__usp-ico--voda     { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B86A2E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3s6 6 6 11a6 6 0 0 1-12 0c0-5 6-11 6-11z'/%3E%3C/svg%3E"); }

.trv-pd__usp strong{
  display: block;
  font-size: 14.5px;
  font-weight: 700;
  color: var(--travt-ink);
  margin-bottom: 3px;
  letter-spacing: -0.01em;
}
.trv-pd__usp span{
  font-size: 13.5px;
  color: var(--travt-ink-mute);
  line-height: 1.45;
}


/* 5) DEKOR SWATCHE ───────────────────────────────────────────────── */
.trv-pd__decors{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.trv-pd__decor{
  text-align: center;
  padding: 10px;
  border: 1.5px solid var(--travt-accent);
  border-radius: 8px;
  min-width: 96px;
  background: var(--travt-bg-card);
}
.trv-pd__decor .sw{
  width: 100%; height: 48px;
  border-radius: 5px;
  margin-bottom: 8px;
  border: 1px solid rgba(0,0,0,0.06);
}
.trv-pd__decor .nm{
  font-size: 13px;
  font-weight: 600;
  color: var(--travt-ink);
  display: block;
  line-height: 1.25;
  margin-bottom: 2px;
}
.trv-pd__decor .cd{
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11px;
  color: var(--travt-ink-mute);
  letter-spacing: 0.04em;
  display: block;
}


/* 6) CTA BLOK ────────────────────────────────────────────────────── */
.trv-pd__cta{
  background: var(--travt-steel);
  color: var(--travt-bg);
  border-radius: 12px;
  padding: 26px 30px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.trv-pd__cta strong{
  font-size: 19px;
  font-weight: 700;
  letter-spacing: -0.015em;
  display: block;
  margin-bottom: 4px;
}
.trv-pd__cta span{
  font-size: 14px;
  color: #B5AB9C;
}
.trv-pd__cta a{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--travt-accent);
  color: #fff;
  font-weight: 700;
  font-size: 15px;
  padding: 14px 24px;
  border-radius: 10px;
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s ease, transform .15s ease;
}
.trv-pd__cta a:hover{ background: #9d5a26; transform: translateY(-1px); }


/* 7) SHOPTET "DODATOČNÉ PARAMETRE" (.detail-parameters) ───────────────
   Toto je mimo .trv-pd (generuje Shoptet) — preto necielime cez wrapper.

   7a) Shoptet kreslí .basic-description a .extended-description VEDĽA
       seba (popis vs. úzky pravý stĺpec). Vynútime jednostĺpec, aby
       boli OBA na plnú šírku pod sebou. */
.description-inner{
  display: block !important;
}
.description-inner .basic-description,
.description-inner .extended-description{
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.description-inner::after{ content: ""; display: table; clear: both; }

.extended-description{ margin-top: 40px; }
.extended-description > p strong{
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--travt-ink-mute);
  font-weight: 500;
}
.detail-parameters{
  width: 100%;
  border-collapse: collapse;
  font-size: 14.5px;
  margin-top: 10px;
}
.detail-parameters th{
  text-align: left;
  width: 42%;
  padding: 12px 16px;
  font-weight: 500;
  color: var(--travt-ink-mute);
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11.5px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  vertical-align: middle;
}
.detail-parameters .row-header-label-colon{ display: none; }
.detail-parameters td{ padding: 12px 16px; color: var(--travt-ink); font-weight: 500; }
.detail-parameters td a{ color: var(--travt-accent); }
/* zrušiť Shoptet "leader-line" bordery na th/td a vnútornom span
   (platí pre obe tabuľky — buy-box aj Dodatočné parametre) */
.detail-parameters th,
.detail-parameters td,
.detail-parameters .row-header-label{
  border: 0 !important;
  border-bottom: 0 !important;
  background-image: none !important;
  box-shadow: none !important;
}
.detail-parameters .row-header-label::after,
.detail-parameters th::after,
.detail-parameters td::after{ content: none !important; border: 0 !important; }

/* BOXOVÝ štýl LEN pre "Dodatočné parametre" (v .extended-description) —
   buy-box (Dostupnosť/Kód) ostane minimalistický, bez rámu a zebry. */
.extended-description .detail-parameters{
  border: 1px solid var(--travt-line);
  border-radius: 10px;
  overflow: hidden;
}
.extended-description .detail-parameters tr{ border-bottom: 1px solid var(--travt-line-2); }
.extended-description .detail-parameters tr:last-child{ border-bottom: none; }
.extended-description .detail-parameters tr:nth-child(even){ background: var(--travt-bg-alt); }

/* buy-box: dostupnosť zeleno, jemné oddeľenie riadkov */
.detail-parameters .availability-label{ font-weight: 600; }
.detail-parameters tr.p-code th,
.detail-parameters tr.p-code td{ padding-top: 4px; }

/* pozadie tabuliek = paper (na reálnej stránke sú biele) ─────────
   vyššia špecificita (body table…) nech prebije bielu z témy */
body table.detail-parameters,
body table.detail-parameters tbody tr,
body table.detail-parameters tbody th,
body table.detail-parameters tbody td,
body table.detail-parameters td,
body table.detail-parameters .row-header-label,
body table.detail-parameters .availability-label,
.detail-parameters,
.detail-parameters tr,
.detail-parameters th,
.detail-parameters td,
.detail-parameters .row-header-label{
  background-color: var(--travt-bg) !important;
  background-image: none !important;
}
/* pri "Dodatočných parametroch" zachovať zebru (párne riadky tmavšie) */
body .extended-description table.detail-parameters tbody tr:nth-child(even) th,
body .extended-description table.detail-parameters tbody tr:nth-child(even) td,
.extended-description .detail-parameters tr:nth-child(even) th,
.extended-description .detail-parameters tr:nth-child(even) td{
  background-color: var(--travt-bg-alt) !important;
}


/* 8) PRODUKTOVÉ TABY (Popis) ─────────────────────────────────────── */
.p-detail-tabs .shp-tab-link{
  font-family: "Manrope", sans-serif;
  font-weight: 600;
  color: var(--travt-ink-mute);
}
.p-detail-tabs .shp-tab.active .shp-tab-link{
  color: var(--travt-ink);
  border-bottom-color: var(--travt-accent);
}


/* RESPONSIVE ─────────────────────────────────────────────────────── */
@media (max-width: 600px){
  .trv-pd__cards,
  .trv-pd__usps{ grid-template-columns: 1fr; }
  .trv-pd__h{ font-size: 21px; }
  .trv-pd__cta{ padding: 22px; }
}