/**
 * xwhatsapp — defaults overridable via CSS variables (see hookDisplayHeader).
 */

.xwhatsapp-float {
  position: fixed;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--xwhatsapp-fl-size, 56px);
  height: var(--xwhatsapp-fl-size, 56px);
  border-radius: var(--xwhatsapp-fl-radius, 50%);
  background-color: var(--xwhatsapp-fl-bg, #25d366);
  color: var(--xwhatsapp-fl-color, #fff);
  box-shadow: var(--xwhatsapp-fl-shadow, 0 4px 12px rgba(0, 0, 0, 0.25));
  transition: transform 0.15s ease, box-shadow 0.15s ease;
  text-decoration: none;
}

.xwhatsapp-float:hover {
  color: var(--xwhatsapp-fl-color, #fff);
  transform: scale(1.05);
  box-shadow: var(--xwhatsapp-fl-shadow-hover, 0 6px 16px rgba(0, 0, 0, 0.3));
}

.xwhatsapp-float--bottom-right {
  right: 18px;
  bottom: 18px;
}

.xwhatsapp-float--bottom-left {
  left: 18px;
  bottom: 18px;
}

.xwhatsapp-float__icon {
  display: flex;
}

.xwhatsapp-float__icon svg {
  width: var(--xwhatsapp-fl-icon, 28px);
  height: var(--xwhatsapp-fl-icon, 28px);
}

.xwhatsapp-product {
  margin-top: var(--xwhatsapp-pd-margin-top, 0.75rem);
}

.xwhatsapp-product__btn {
  display: inline-flex;
  align-items: center;
  gap: var(--xwhatsapp-pd-gap, 0.5rem);
  font-size: var(--xwhatsapp-pd-font-size, 1rem);
  font-weight: var(--xwhatsapp-pd-font-weight, 600);
  line-height: var(--xwhatsapp-pd-line-height, 1.25);
  padding: var(--xwhatsapp-pd-padding-y, 0.55rem) var(--xwhatsapp-pd-padding-x, 1.1rem);
  border-radius: var(--xwhatsapp-pd-border-radius, 8px);
  border-width: var(--xwhatsapp-pd-border-width, 0);
  border-style: solid;
  border-color: var(--xwhatsapp-pd-border-color, transparent);
  background-color: var(--xwhatsapp-pd-bg, #25d366);
  color: var(--xwhatsapp-pd-color, #fff);
  box-shadow: var(--xwhatsapp-pd-shadow, 0 2px 8px rgba(0, 0, 0, 0.12));
  transition: background-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
  max-width: 100%;
}

/* Beat theme .btn { text-transform: uppercase } */
.xwhatsapp-product a.xwhatsapp-product__btn.btn {
  text-transform: var(--xwhatsapp-pd-text-transform, none);
}

.xwhatsapp-product__btn--rich {
  align-items: center;
  justify-content: flex-start;
  text-align: left;
}

.xwhatsapp-product__btn:hover,
.xwhatsapp-product__btn:focus {
  background-color: var(--xwhatsapp-pd-bg-hover, #1ebe57);
  border-color: var(--xwhatsapp-pd-border-color-hover, var(--xwhatsapp-pd-border-color, transparent));
  color: var(--xwhatsapp-pd-color, #fff);
  box-shadow: var(--xwhatsapp-pd-shadow-hover, 0 4px 14px rgba(0, 0, 0, 0.18));
  transform: translateY(-1px);
}

.xwhatsapp-product__icon {
  display: flex;
  flex-shrink: 0;
}

.xwhatsapp-product__icon svg {
  width: var(--xwhatsapp-pd-icon-size, 1.125rem);
  height: var(--xwhatsapp-pd-icon-size, 1.125rem);
}

.xwhatsapp-product__label {
  white-space: normal;
  text-align: center;
}

.xwhatsapp-product__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: var(--xwhatsapp-pd-r-text-gap, 0.12rem);
  line-height: 1.2;
  min-width: 0;
}

.xwhatsapp-product__row1 {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.xwhatsapp-product__title {
  font-size: var(--xwhatsapp-pd-r-title-size, 0.8125rem);
  font-weight: var(--xwhatsapp-pd-r-title-weight, 400);
  text-transform: var(--xwhatsapp-pd-r-title-tf, inherit);
}

.xwhatsapp-product__badge {
  font-size: var(--xwhatsapp-pd-r-badge-size, 0.6875rem);
  font-weight: var(--xwhatsapp-pd-r-badge-weight, 500);
  text-transform: var(--xwhatsapp-pd-r-badge-tf, inherit);
  padding: var(--xwhatsapp-pd-r-badge-pad-y, 0.1rem) var(--xwhatsapp-pd-r-badge-pad-x, 0.38rem);
  border-radius: var(--xwhatsapp-pd-r-badge-radius, 999px);
  background: var(--xwhatsapp-pd-r-badge-bg, rgba(255, 255, 255, 0.28));
  color: inherit;
  line-height: 1.2;
}

.xwhatsapp-product__subtitle {
  font-size: var(--xwhatsapp-pd-r-subtitle-size, 0.9375rem);
  font-weight: var(--xwhatsapp-pd-r-subtitle-weight, 700);
  text-transform: var(--xwhatsapp-pd-r-subtitle-tf, inherit);
}
