/* ==========================================
   BELIOTO — Single product polish
   ========================================== */

/* Pink-aware accent button (overrides base.css for the variable form) */
.belioto-atc.btn--accent {
  background: var(--c-accent);
  border: 1.5px solid var(--c-accent);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-3);
  padding: 20px 24px;
  border-radius: 0;
  font-size: var(--fs-md);
  font-weight: var(--fw-semibold);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  box-shadow: 0 8px 24px rgba(236, 72, 153, 0.28);
  transition: transform var(--t-fast), box-shadow var(--t),
    background var(--t), border-color var(--t);
  width: 100%;
  min-height: 64px;
  margin-top: var(--sp-8);
}
.belioto-atc.btn--accent:hover:not(:disabled) {
  background: var(--c-accent-dk);
  border-color: var(--c-accent-dk);
  transform: translateY(-1px);
  box-shadow: 0 10px 28px rgba(219, 39, 119, 0.35);
}
.belioto-atc.btn--accent:disabled,
.belioto-atc.btn--accent[disabled] {
  background: var(--c-line);
  border-color: var(--c-line);
  color: var(--c-muted);
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}
.belioto-atc__icon { display: inline-flex; }
.belioto-atc__price {
  font-weight: var(--fw-bold);
  opacity: 0.95;
}

/* Size buttons — always one row, sharp corners, soft pink when selected */
.belioto-pp .size-picker {
  gap: var(--sp-5);                /* more space between legend and buttons */
}
.belioto-pp .size-picker__opts {
  display: flex !important;        /* override the grid set in product.css */
  flex-wrap: nowrap;
  gap: var(--sp-2);
}
.belioto-pp .size-opt {
  flex: 1 1 0;
  min-width: 0;
}
.belioto-pp .size-opt__label {
  width: 100%;
  padding: 0 6px;
}
.belioto-pp .size-opt__label {
  border-radius: 0;
  border: 1.5px solid var(--c-line);
  background: var(--c-bg);
  color: var(--c-ink);
  transition: background var(--t), border-color var(--t), color var(--t);
}
.belioto-pp .size-opt:hover .size-opt__label {
  border-color: var(--c-accent);
}
.belioto-pp .size-opt input[type="radio"]:checked + .size-opt__label {
  background: var(--c-accent-soft);
  border-color: var(--c-accent);
  color: var(--c-accent-dk);
  font-weight: var(--fw-semibold);
}
.belioto-pp .size-opt input[type="radio"]:focus-visible + .size-opt__label {
  outline: 3px solid rgba(236, 72, 153, 0.35);
  outline-offset: 2px;
}

/* Promo callout above the add-to-cart button */
.belioto-promo {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: 14px 18px;
  background: var(--c-accent-soft);
  border: 1px solid rgba(236, 72, 153, 0.18);
  border-radius: 0;
  margin: 0;
  color: var(--c-ink);
  font-size: var(--fs-base);
  line-height: var(--lh-snug);
}
.belioto-promo__icon {
  flex: 0 0 36px;
  width: 36px; height: 36px;
  background: var(--c-accent);
  color: #fff;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}
.belioto-promo strong { color: var(--c-accent-dk); }

/* Trust strip below add-to-cart */
.belioto-trust {
  list-style: none;
  margin: var(--sp-6) 0 0;
  padding: var(--sp-5) 0 0;
  border-top: 1px solid var(--c-line);
  display: grid;
  gap: var(--sp-3);
}
.belioto-trust li {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  color: var(--c-ink-soft);
  font-size: var(--fs-sm);
}
.belioto-trust svg {
  color: var(--c-accent);
  flex: 0 0 20px;
}

/* ── Single product price block ─────────────────────────── */
.single-product .product .summary .price {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  flex-wrap: wrap;
  margin: 0 0 var(--sp-5);
  padding: 0;
}
.single-product .product .summary .price ins {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  text-decoration: none;
  background: transparent;
  font-size: clamp(38px, 4.4vw, 52px);
  font-weight: var(--fw-bold);
  line-height: 1;
  color: var(--c-accent-dk);
  letter-spacing: -0.02em;
}
.single-product .product .summary .price ins .woocommerce-Price-amount {
  color: var(--c-accent-dk);
}
.single-product .product .summary .price del {
  display: inline-flex;
  align-items: center;
  font-size: var(--fs-lg);
  font-weight: var(--fw-medium);
  text-decoration: line-through;
  text-decoration-thickness: 2px;
  text-decoration-color: var(--c-muted);
  color: var(--c-muted);
  opacity: 0.85;
  margin: 0;
  order: 1;
}
.single-product .product .summary .price del .woocommerce-Price-amount {
  color: var(--c-muted);
}
/* Savings badge — purely CSS, fixed at -25€ since every product is 60→35 */
.single-product .product .summary .price::after {
  content: "−25€ • спести 42%";
  order: 2;
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  background: var(--c-accent);
  color: #fff;
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: 999px;
  box-shadow: 0 4px 12px rgba(236, 72, 153, 0.25);
  white-space: nowrap;
}
.single-product .product .summary .screen-reader-text { position: absolute; left: -9999px; }

/* Push the variations form down from the promo callout for breathing room */
.variations_form.belioto-pp {
  margin-top: var(--sp-6);
}
.single-product .product .summary .product_title {
  font-size: var(--fs-lg);
  font-weight: var(--fw-semibold);
  margin: 0 0 var(--sp-3);
  letter-spacing: var(--ls-tight);
  line-height: var(--lh-tight);
}

/* Hide unwanted single-product bits */
.single-product .product .woocommerce-product-rating,
.single-product .product .product_meta,
.single-product .product .woocommerce-product-details__short-description,
.single-product .product .woocommerce-tabs {
  display: none;
}

/* Variation single_variation panel: hide WC default price+description duplication */
.belioto-variation .single_variation { display: none; }

/* Layout: place custom .pgallery in col 1 row 1 — product.css only places
   .images / .woocommerce-product-gallery there. Overlay .onsale badge. */
.single-product .product > .pgallery {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  position: relative;
}
.single-product .product > .onsale {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  justify-self: start;
  align-self: start;
  margin: 14px;
  z-index: 2;
  background: var(--c-accent);
  color: #fff;
  font-size: var(--fs-xs);
  font-weight: var(--fw-bold);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 8px 14px;
  border-radius: 0;
  line-height: 1;
  text-align: center;
  min-width: auto;
  min-height: auto;
  box-shadow: 0 4px 12px rgba(236, 72, 153, 0.30);
}
.single-product .product > .summary {
  align-self: start;
}

/* Related products header polish */
.single-product .related.products > h2 {
  font-size: var(--fs-xl);
  font-weight: var(--fw-bold);
  margin: var(--sp-12) 0 var(--sp-6);
}

/* General button accent — soften shadow on btn--lg */
.btn--accent {
  background: var(--c-accent);
  border-color: var(--c-accent);
  color: #fff;
}
.btn--accent:hover {
  background: var(--c-accent-dk);
  border-color: var(--c-accent-dk);
  color: #fff;
}

/* Cart count badge pinks up */
.head-tool--cart .count {
  background: var(--c-accent);
  color: #fff;
}

/* ==========================================
   ADD-TO-CART MODAL
   ========================================== */
.belioto-modal {
  position: fixed;
  inset: 0;
  background: rgba(10, 10, 10, 0.55);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: var(--sp-4);
  animation: belioto-fade 200ms ease-out;
}
.belioto-modal.is-open { display: flex; }
.belioto-modal__card {
  background: #fff;
  width: 100%;
  max-width: 540px;
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  padding: clamp(28px, 4vw, 44px) clamp(20px, 4vw, 40px);
  position: relative;
  text-align: center;
  animation: belioto-pop 240ms cubic-bezier(.16,1,.3,1);
}
.belioto-modal__close {
  position: absolute;
  top: 16px; right: 16px;
  background: none;
  border: 0;
  width: 36px; height: 36px;
  cursor: pointer;
  color: var(--c-ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.belioto-modal__close:hover { color: var(--c-accent); }

.belioto-modal__check {
  width: 76px; height: 76px;
  background: var(--c-accent);
  border-radius: 50%;
  margin: 0 auto var(--sp-5);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.belioto-modal__title {
  font-size: var(--fs-xl);
  font-weight: var(--fw-bold);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin: 0 0 var(--sp-5);
  color: var(--c-ink);
}

.belioto-modal__item {
  display: flex;
  gap: var(--sp-4);
  align-items: center;
  background: var(--c-bg-cream);
  padding: var(--sp-4);
  text-align: left;
  margin-bottom: var(--sp-5);
}
.belioto-modal__item img {
  width: 88px;
  height: 88px;
  object-fit: cover;
  flex: 0 0 88px;
}
.belioto-modal__item-name {
  font-size: var(--fs-md);
  font-weight: var(--fw-semibold);
  color: var(--c-ink);
  margin: 0 0 4px;
}
.belioto-modal__item-meta {
  font-size: var(--fs-sm);
  color: var(--c-muted);
  margin: 0;
}

.belioto-modal__promo {
  background: var(--c-accent-soft);
  border: 1px solid rgba(236, 72, 153, 0.18);
  padding: var(--sp-4);
  margin: 0 0 var(--sp-5);
  text-align: left;
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}
.belioto-modal__promo-icon {
  flex: 0 0 36px;
  width: 36px; height: 36px;
  background: var(--c-accent);
  color: #fff;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}
.belioto-modal__promo strong { color: var(--c-accent-dk); }
.belioto-modal__promo-body {
  flex: 1;
  font-size: var(--fs-sm);
  line-height: 1.45;
}
.belioto-modal__promo-body > strong:first-child {
  display: block;
  font-size: var(--fs-base);
  margin-bottom: 4px;
  color: var(--c-accent-dk);
}

/* Active-promo variant: lifted card + savings line */
.belioto-modal__promo.is-active {
  background: linear-gradient(135deg, var(--c-accent-soft) 0%, #fff5fa 100%);
  border-color: var(--c-accent);
  box-shadow: 0 6px 20px rgba(236, 72, 153, 0.18);
}
.belioto-modal__calc {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  flex-wrap: wrap;
  margin-top: 4px;
  font-size: var(--fs-sm);
  color: var(--c-ink);
}
.belioto-modal__calc-arrow {
  color: var(--c-accent);
  font-weight: var(--fw-bold);
}
.belioto-modal__savings {
  margin-top: 6px;
  font-size: var(--fs-sm);
  color: var(--c-success);
  font-weight: var(--fw-semibold);
}
.belioto-modal__savings strong { color: var(--c-success); }

.belioto-modal__actions {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}
.belioto-modal__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-3);
  padding: 18px 24px;
  border: 1.5px solid var(--c-ink);
  background: #fff;
  color: var(--c-ink);
  font-weight: var(--fw-semibold);
  font-size: var(--fs-base);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  text-decoration: none;
  transition: background var(--t), color var(--t), border-color var(--t);
  border-radius: 0;
  min-height: 56px;
}
.belioto-modal__btn:hover {
  background: var(--c-ink);
  color: #fff;
}
.belioto-modal__btn--primary {
  background: var(--c-accent);
  border-color: var(--c-accent);
  color: #fff;
}
.belioto-modal__btn--primary:hover {
  background: var(--c-accent-dk);
  border-color: var(--c-accent-dk);
  color: #fff;
}

@keyframes belioto-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes belioto-pop {
  from { transform: translateY(20px) scale(0.97); opacity: 0; }
  to { transform: translateY(0) scale(1); opacity: 1; }
}

body.belioto-modal-open { overflow: hidden; }

@media (max-width: 480px) {
  .belioto-modal__check { width: 64px; height: 64px; }
  .belioto-modal__title { font-size: var(--fs-lg); }
  .belioto-modal__item img { width: 72px; height: 72px; flex-basis: 72px; }
}