/*
 * INTUITION – nabídky v košíku (dárkové balení, pojištění zásilky)
 * Soubor: /user/documents/vw_upsell-samba.css (šablona Samba)
 * Oba boxy sdílí třídu .vw-upsell, takže vypadají stejně.
 * HTML vkládá skript vw_upsell-samba.js.
 */

.vw-upsell {
  border: 2px dashed #71b0ab;
  padding: 15px;
  margin: 15px 0;
  background: #e0f0ef;
  display: flex;
  align-items: center;
  gap: 15px;
  flex-wrap: nowrap;
}

/* Obrázek vlevo (fotka u dárkového balení, ikona u pojištění) */
.vw-upsell-image {
  width: 80px;
  height: auto;
  object-fit: contain;
  border: 1px solid #71b0ab;
  background: transparent;
  padding: 2px;
  flex-shrink: 0;
  box-sizing: content-box;
}

/* Obrázek pojištění – stejně velký rámeček jako fotka dárkového balení (300 × 367) */
.vw-upsell-icon {
  height: 98px;
  object-fit: contain;
  background: #fff;
}

.vw-upsell h3 {
  color: #2f5d5a;
  margin: 0 0 8px 0;
}

.vw-upsell p {
  color: #3a6b68;
  margin: 0 0 10px 0;
  font-size: 14px;
  line-height: 1.4;
}

.vw-upsell-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.vw-upsell-btn {
  background: #71b0ab;
  color: #fff;
  padding: 10px 20px;
  border: none;
  cursor: pointer;
  font-size: 14px;
}

/* Pojištění je už v košíku → tlačítko slouží k odebrání */
.vw-upsell-btn.is-active {
  background: transparent;
  color: #2f5d5a;
  box-shadow: inset 0 0 0 2px #71b0ab;
}

.vw-upsell-info {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border: 2px solid #71b0ab;
  border-radius: 50%;
  font-size: 13px;
  line-height: 1;
  font-weight: 700;
  color: #71b0ab;
  cursor: help;
}

.vw-upsell.is-loading {
  opacity: .5;
  pointer-events: none;
}

@media (max-width: 767px) {
  .vw-upsell {
    flex-direction: column;
    align-items: flex-start;
  }
  .vw-upsell-image {
    display: none;
  }
}
/* Tlačítko „Vybrat dárek“ (přejmenované „Změnit“) na jeden řádek */
.free-gift-trigger {
  white-space: nowrap;
  padding-left: 14px;
  padding-right: 14px;
}