/* =========================================================
   KONFERENCNE STOLIKY – TEXTURE SYSTEM + MODEL PREVIEW
   (vloz na KONIEC /css/cenova-ponuka.css)
   ========================================================= */

/* ===== SELECT + SWATCH (vedla seba, zarovno) ===== */
.select-swatch-row{
  display:flex;
  align-items:stretch; /* swatch sa natiahne na výšku selectu */
  gap:12px;
}

.select-swatch-row .form-control{
  flex:1 1 auto;
  width:auto;
  min-width:0;
}

/* swatch vedla selectu */
.select-swatch-row .swatch-preview{
  width:46px;
  flex:0 0 46px;
  height:46px;          /* nechá stretch */
  align-self:stretch;   /* istota */
  border-radius:8px;
  border:1px solid #ccc;
  box-sizing:border-box;
  display:block;
  margin:0;
  background:transparent;
}

/* default (nič vybraté) */
.select-swatch-row .swatch-preview.stone-none,
.select-swatch-row .swatch-preview.wood-none{
  background:transparent;
}

/* ===== "Iná farebnosť" / "Iný odtieň" – biely podklad + X ===== */
.select-swatch-row .swatch-preview.stone-other,
.select-swatch-row .swatch-preview.wood-other{
  background:#ffffff !important;
  position:relative;
  overflow:hidden;
}

.select-swatch-row .swatch-preview.stone-other::after,
.select-swatch-row .swatch-preview.wood-other::after{
  content:"✕";
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:22px;
  color:#c9c9c9;
  pointer-events:none;
}

/* ===== SWATCH: textura režim ===== */
.select-swatch-row .swatch-preview.is-texture{
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.25);
}

/* =========================================================
   MODEL PREVIEW (text hore, foto + tvar vedľa seba)
   ========================================================= */
.model-preview{
  margin: 8px 0 18px;
  padding: 14px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  background: rgba(255,255,255,.06);
}

.model-preview__meta{
  margin-bottom: 12px;
}

.model-preview__label{
  font-size: 12px;
  opacity: .75;
  margin-bottom: 4px;
}

.model-preview__name{
  font-size: 18px;
  font-weight: 800;
  letter-spacing: .6px;
}

.model-preview__grid{
  display:flex;
  gap: 16px;
  align-items:flex-start;
  flex-wrap: wrap;
}

.model-preview__img-wrap{
  width: 260px;
  height: 180px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.08);
  background: #fff;
}

.model-preview__img{
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: center 58%;
  display:block;
}

.model-preview__shape{
  min-width: 260px;
  flex: 1 1 280px;
}

.model-preview__shape-label{
  font-size: 12px;
  opacity: .75;
  margin-bottom: 8px;
}

/* SVG náhľad */
.model-shape-svg{
  width: 93%;
  max-width: 520px;
  height: auto;
  display: block;
  background: transparent;
  border: none;
  padding: 0;
  border-radius: 0;
}

#shape-stone{ stroke: rgba(0,0,0,.08); stroke-width: 2; }
#shape-wood { stroke: rgba(0,0,0,.08); stroke-width: 2; }

/* =========================================================
   OBRÁZOK POD H2/H3 – vzdušnosť + zaoblené rohy
   ========================================================= */
.section-image-block{
  margin-top: 20px;
  margin-bottom: 28px;
}

.section-image-block .rounded-1{
  border-radius: 14px;
}

@media (min-width: 992px){
  .section-image-block{
    margin-top: 24px;
    margin-bottom: 36px;
  }
}

/* =========================================================
   KONFERENCNE STOLIKY – LOKALNE VELKOSTI NADPISOV
   (scope len pre obsah v #page-content)
   ========================================================= */
#page-content h2{
  font-size: 52px;
  line-height: 1.25;
  margin: 0 0 10px;
}

#page-content h3{
  font-size: 22px;
  line-height: 1.3;
  margin: 24px 0 28px; /* viac miesta pod "Časté otázky" */
}

#page-content h4{
  font-size: 17px;
  line-height: 1.4;
  margin: 0 0 6px;
}

/* lead text vľavo – aby nebol väčší než nadpisy */
#page-content p.lead{
  font-size: 17px;
  line-height: 1.45;
  margin: 0 0 16px;
}

/* mobil */
@media (max-width: 768px){
  #page-content h2{ font-size: 34px; }
  #page-content h3{ font-size: 30px; }
}

/* =========================================================
   FAQ – layout + zalamovanie odpovedí + priprava na max-height animáciu
   ========================================================= */
.faq-item{
  display:flex;
  justify-content:space-between;
  gap:24px;
}

.faq-text{
  flex:1 1 auto;
  min-width:0; /* kritické pre zalamovanie */
}

.faq-answer {
    display: block;
    margin-top: 8px;
    width: 100%;        /* Vynúti šírku celého kontajnera */
    flex-basis: 100%;   /* Klúčové pre flexbox - povie, že toto má byť nový riadok */
    
    white-space: normal;
    word-break: break-word;
    line-height: 1.5;

    /* Animáciu riadi JS cez max-height */
    overflow: hidden;
    max-height: 0;
    
    /* Odporúčam pridať plynulosť, ak ju tam nemáte */
    transition: max-height 0.4s ease-out; 
}

.faq-toggle{
  flex:0 0 auto;
}