/* Sipariş WhatsApp — vitrin butonu */

.ow-sf-whatsapp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  text-decoration: none;
}

.ow-sf-whatsapp-btn--card {
  position: absolute;
  bottom: 4.5rem;
  right: 0.75rem;
  z-index: 2;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  background: #25d366;
  color: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.ow-sf-whatsapp-btn--card:hover {
  background: #128c7e;
  color: #fff;
}

.ow-sf-whatsapp-btn--detail {
  margin-top: 0;
  width: auto;
  min-height: 2.5rem;
  padding: 0 1.25rem;
  border-radius: 0.5rem;
  background: #25d366;
  color: #fff;
  font-weight: 600;
  border: 0;
  white-space: nowrap;
  box-sizing: border-box;
}

.ow-sf-whatsapp-btn--detail:hover {
  background: #128c7e;
  color: #fff;
}

/*
 * Tema .btn / .btn-three kullanıldığında yeşil paket stili uygulanmaz;
 * renk ve hover tipografi CSS değişkenlerinden gelir.
 */
.ow-sf-whatsapp-btn--detail.btn,
.ow-sf-whatsapp-btn--detail.btn-three {
  background: var(--tg-btn-three-bg, var(--tg-btn-bg, #FAA432));
  color: var(--tg-btn-three-color, var(--tg-btn-color, #fff));
  border: var(--tg-btn-three-border-width, var(--tg-btn-border-width, 0)) solid var(--tg-btn-three-border-color, var(--tg-btn-border-color, transparent));
  border-radius: var(--tg-btn-three-radius, var(--tg-btn-radius, 5px));
  padding: var(--tg-btn-three-padding-y, var(--tg-btn-padding-y, 0.65rem)) var(--tg-btn-three-padding-x, var(--tg-btn-padding-x, 1.5rem));
  font-weight: 700;
}

.ow-sf-whatsapp-btn--detail.btn:hover,
.ow-sf-whatsapp-btn--detail.btn-three:hover {
  background: var(--tg-btn-three-hover-solid, var(--tg-btn-hover-solid, var(--tg-btn-three-bg, #FAA432)));
  color: var(--tg-btn-three-hover-color, var(--tg-btn-hover-color, #fff));
  border-color: var(--tg-btn-three-border-hover-color, var(--tg-btn-border-hover-color, transparent));
}

.ow-sf-whatsapp-btn--detail.btn::before,
.ow-sf-whatsapp-btn--detail.btn-three::before {
  background: var(--tg-btn-three-hover-bg, var(--tg-btn-hover-bg, #0D9B4D));
  display: var(--tg-btn-three-hover-before, var(--tg-btn-hover-before, block));
}