/** Spa Display Views - final two-column add-ons layout */
:root {
  --sdv-black: #000;
  --sdv-text: #1b1b1b;
  --sdv-muted: #9c9c9c;
  --sdv-border: #1d1d1d;
  --sdv-gold: #a9823d;
  --sdv-soft: #eee6dd;
}

.sdv-addons-root,
.sdv-addons-root * {
  box-sizing: border-box !important;
}

.sdv-addons-root {
  width: 100% !important;
  max-width: none !important;
  margin: 34px 0 0 !important;
  padding: 0 !important;
  font-family: Assistant, Arial, sans-serif !important;
  direction: rtl !important;
  color: var(--sdv-text) !important;
}

.sdv-addons-heading,
.sdv-addons-heading h2 {
  display: none !important;
}

/* layout: left extras + button, right upgrades */
.sdv-addons-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: start !important;
  width: 100% !important;
  direction: ltr !important;
}

.sdv-addons-column {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  min-width: 0 !important;
  width: 100% !important;
  direction: rtl !important;
}

.sdv-extras-column { grid-column: 1 !important; }
.sdv-upgrades-column { grid-column: 2 !important; }

.sdv-addon-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) auto !important;
  column-gap: 18px !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 66px !important;
  margin: 0 !important;
  padding: 10px 16px 10px 20px !important;
  border: 1px solid var(--sdv-border) !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
  color: var(--sdv-text) !important;
  cursor: pointer !important;
  overflow: hidden !important;
}

.sdv-addon-card:hover,
.sdv-addon-card.is-selected {
  background: var(--sdv-soft) !important;
  border-color: var(--sdv-gold) !important;
}

.sdv-addon-control {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.sdv-addon-checkmark {
  grid-column: 1 !important;
  width: 23px !important;
  height: 23px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid var(--sdv-border) !important;
  background: #fff !important;
  margin: 0 !important;
}

.sdv-addon-checkmark::after {
  content: '✓' !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  transform: none !important;
  opacity: 0 !important;
  color: var(--sdv-black) !important;
  font-family: Arial, sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

.sdv-addon-card.is-selected .sdv-addon-checkmark::after,
.sdv-addon-control:checked + .sdv-addon-checkmark::after {
  opacity: 1 !important;
}

.sdv-addon-card.is-selected .sdv-addon-checkmark,
.sdv-addon-control:checked + .sdv-addon-checkmark {
  background: #fff !important;
  border-color: var(--sdv-black) !important;
}

.sdv-addon-copy {
  grid-column: 2 !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  text-align: right !important;
}

.sdv-addon-name,
.sdv-addon-desc,
.sdv-addon-note,
.sdv-addon-price,
.sdv-total-label,
.sdv-total-price {
  font-family: Assistant, Arial, sans-serif !important;
  font-weight: 400 !important;
}

.sdv-addon-name {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  font-size: 20px !important;
  line-height: 1.2 !important;
  color: var(--sdv-text) !important;
}

.sdv-addon-desc,
.sdv-addon-note {
  display: block !important;
  width: 100% !important;
  margin: 6px 0 0 !important;
  font-size: 16px !important;
  line-height: 1.35 !important;
  color: var(--sdv-muted) !important;
}

.sdv-extra-card .sdv-addon-desc,
.sdv-extra-card .sdv-addon-note { display: none !important; }

.sdv-addon-price {
  grid-column: 3 !important;
  justify-self: end !important;
  direction: ltr !important;
  white-space: nowrap !important;
  font-size: 20px !important;
  line-height: 1 !important;
  color: var(--sdv-black) !important;
}

.sdv-addon-price .woocommerce-Price-amount,
.sdv-addon-price .woocommerce-Price-currencySymbol,
.sdv-total-price .woocommerce-Price-amount,
.sdv-total-price .woocommerce-Price-currencySymbol {
  color: inherit !important;
  font: inherit !important;
}

.sdv-addons-total {
  appearance: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  min-height: 142px !important;
  margin: 0 !important;
  padding: 22px 32px !important;
  border: 1px solid var(--sdv-black) !important;
  border-radius: 0 !important;
  background: var(--sdv-black) !important;
  color: #fff !important;
  cursor: pointer !important;
  box-shadow: none !important;
  text-align: right !important;
  direction: rtl !important;
}

.sdv-addons-total:hover,
.sdv-addons-total:focus,
.sdv-addons-total:active {
  background: var(--sdv-black) !important;
  color: #fff !important;
  border-color: var(--sdv-black) !important;
  opacity: 1 !important;
}

.sdv-total-label {
  font-size: 20px !important;
  line-height: 1 !important;
  color: #fff !important;
}

.sdv-total-price {
  direction: ltr !important;
  font-size: 32px !important;
  line-height: 1 !important;
  color: #fff !important;
  white-space: nowrap !important;
}


/* When there are no descriptions, the left column has fewer cards + a taller total bar. */
.sdv-layout-no-descriptions .sdv-addon-card {
  min-height: 66px !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.sdv-layout-no-descriptions .sdv-addons-total {
  min-height: 142px !important;
}

/* qty cards */
.sdv-addon-card-qty { cursor: default !important; }
.sdv-addon-qty-control {
  grid-column: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  height: 30px !important;
  border: 1px solid var(--sdv-border) !important;
  background: #fff !important;
}
.sdv-addon-qty-btn {
  width: 28px !important;
  height: 30px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--sdv-gold) !important;
  padding: 0 !important;
  font: 400 20px/1 Assistant, Arial, sans-serif !important;
}
.sdv-addon-qty {
  width: 34px !important;
  height: 30px !important;
  border: 0 !important;
  border-right: 1px solid var(--sdv-border) !important;
  border-left: 1px solid var(--sdv-border) !important;
  padding: 0 !important;
  text-align: center !important;
  font: 400 18px/1 Assistant, Arial, sans-serif !important;
  -moz-appearance: textfield !important;
}
.sdv-addon-qty::-webkit-outer-spin-button,
.sdv-addon-qty::-webkit-inner-spin-button { margin: 0 !important; -webkit-appearance: none !important; }

@media (max-width: 767px) {
  .sdv-addons-root { margin-top: 28px !important; }
  .sdv-addons-layout { grid-template-columns: 1fr !important; gap: 10px !important; direction: rtl !important; }
  .sdv-extras-column { grid-column: auto !important; order: 2 !important; }
  .sdv-upgrades-column { grid-column: auto !important; order: 1 !important; }
  .sdv-addon-card { min-height: 72px !important; padding: 12px !important; column-gap: 10px !important; }
  .sdv-addon-name, .sdv-addon-price, .sdv-total-label { font-size: 18px !important; }
  .sdv-addon-desc, .sdv-addon-note { font-size: 16px !important; }
  .sdv-total-price { font-size: 28px !important; }
}


/* v3.1.3 hard overrides: prices + checkbox visibility */
.sdv-addons-root .sdv-addon-card .sdv-addon-price,
.sdv-addons-root .sdv-addon-card .sdv-addon-price *,
.sdv-addons-root .sdv-addon-card .sdv-addon-price bdi,
.sdv-addons-root .sdv-addon-card .sdv-addon-price span,
.sdv-addons-root .sdv-addon-card .sdv-addon-price .amount,
.sdv-addons-root .sdv-addon-card .sdv-addon-price .woocommerce-Price-amount,
.sdv-addons-root .sdv-addon-card .sdv-addon-price .woocommerce-Price-currencySymbol {
  color: #000000 !important;
  fill: #000000 !important;
  text-shadow: none !important;
}

.sdv-addons-root .sdv-addon-checkmark {
  position: relative !important;
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  border: 1.5px solid #111111 !important;
  background: #ffffff !important;
  color: #111111 !important;
}

.sdv-addons-root .sdv-addon-checkmark::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 45% !important;
  width: 7px !important;
  height: 13px !important;
  border: solid #111111 !important;
  border-width: 0 3px 3px 0 !important;
  transform: translate(-50%, -50%) rotate(45deg) !important;
  opacity: 0 !important;
  background: transparent !important;
}

.sdv-addons-root .sdv-addon-card.is-selected .sdv-addon-checkmark::after,
.sdv-addons-root .sdv-addon-control:checked + .sdv-addon-checkmark::after {
  opacity: 1 !important;
}

.sdv-addons-root .sdv-addon-card.is-selected .sdv-addon-checkmark,
.sdv-addons-root .sdv-addon-control:checked + .sdv-addon-checkmark {
  background: #ffffff !important;
  border-color: #000000 !important;
}


/* v3.1.4 full-width: let Elementor container control the real page width */
.sdv-addons-root {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.elementor-widget-shortcode:has(.sdv-addons-root),
.elementor-widget-shortcode:has(.sdv-addons-root) .elementor-widget-container,
.elementor-shortcode:has(.sdv-addons-root) {
  width: 100% !important;
  max-width: none !important;
}


/* v3.1.6 final layout width and colors */
.sdv-addons-root {
  width: calc(100vw - 200px) !important;
  max-width: calc(100vw - 200px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.sdv-addons-root .sdv-addon-price,
.sdv-addons-root .sdv-addon-price *,
.sdv-addons-root .sdv-total-price,
.sdv-addons-root .sdv-total-price * {
  text-decoration: none !important;
}

.sdv-addons-root .sdv-addon-price,
.sdv-addons-root .sdv-addon-price * {
  color: #000000 !important;
}

@media (max-width: 767px) {
  .sdv-addons-root {
    width: calc(100vw - 40px) !important;
    max-width: calc(100vw - 40px) !important;
  }
}


/* v3.1.7 adaptive layout + exact typography */
.sdv-addons-root .sdv-addon-card {
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) auto !important;
  align-items: center !important;
}

.sdv-addons-root .sdv-addon-copy {
  grid-column: 2 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-items: center !important;
  min-width: 0 !important;
}

.sdv-addons-root .sdv-addon-name {
  grid-row: 1 !important;
  font-size: 20px !important;
  line-height: 1.2 !important;
}

.sdv-addons-root .sdv-addon-price {
  grid-column: 3 !important;
  grid-row: 1 !important;
  align-self: center !important;
  font-size: 20px !important;
  line-height: 1.2 !important;
}

.sdv-addons-root .sdv-addon-desc,
.sdv-addons-root .sdv-addon-note {
  grid-row: 2 !important;
  margin-top: 6px !important;
  font-size: 16px !important;
  line-height: 1.35 !important;
}

.sdv-addons-layout.sdv-layout-no-descriptions .sdv-extras-column { grid-column: 1 !important; }
.sdv-addons-layout.sdv-layout-no-descriptions .sdv-upgrades-column { grid-column: 2 !important; }

@media (max-width: 767px) {
  .sdv-addons-root {
    width: calc(100vw - 40px) !important;
    max-width: calc(100vw - 40px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .sdv-addons-layout,
  .sdv-addons-layout.sdv-layout-no-descriptions,
  .sdv-addons-layout.sdv-layout-has-descriptions {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    direction: rtl !important;
  }

  .sdv-upgrades-column,
  .sdv-extras-column {
    width: 100% !important;
    display: contents !important;
  }

  .sdv-upgrades-column .sdv-addon-card,
  .sdv-extras-column .sdv-addon-card { order: 1 !important; }
  .sdv-addons-total { order: 999 !important; width: 100% !important; }

  .sdv-addons-root .sdv-addon-card {
    min-height: 72px !important;
    padding: 12px !important;
    column-gap: 10px !important;
  }

  .sdv-addons-root .sdv-addon-name,
  .sdv-addons-root .sdv-addon-price,
  .sdv-addons-root .sdv-total-label {
    font-size: 16px !important;
    line-height: 1.25 !important;
  }

  .sdv-addons-root .sdv-addon-desc,
  .sdv-addons-root .sdv-addon-note {
    font-size: 12px !important;
    line-height: 1.35 !important;
    margin-top: 5px !important;
  }

  .sdv-total-price { font-size: 28px !important; }
}

/* v3.1.8 tighter cards + balanced no-description layout */
.sdv-addons-root .sdv-addon-card {
  min-height: 66px !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.sdv-addons-root .sdv-addon-desc,
.sdv-addons-root .sdv-addon-note {
  font-size: 16px !important;
  line-height: 1.35 !important;
}

.sdv-addons-layout.sdv-layout-no-descriptions .sdv-addons-total {
  min-height: 142px !important;
}

@media (max-width: 767px) {
  .sdv-addons-root .sdv-addon-card {
    min-height: 64px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  .sdv-addons-layout.sdv-layout-no-descriptions .sdv-addons-total,
  .sdv-addons-root .sdv-addons-total {
    min-height: 72px !important;
  }

  .sdv-addons-root .sdv-addon-name,
  .sdv-addons-root .sdv-addon-price,
  .sdv-addons-root .sdv-total-label {
    font-size: 16px !important;
  }

  .sdv-addons-root .sdv-addon-desc,
  .sdv-addons-root .sdv-addon-note {
    font-size: 12px !important;
  }
}


/* v3.2.1 visual balance fix: mixed layouts use a normal total bar height.
   No-description mode keeps the taller total bar to balance 4 cards right / 2 cards + total left.
   All-described mode keeps the total bar as the left-side visual anchor. */
.sdv-addons-layout.sdv-layout-mixed-descriptions .sdv-addons-total {
  min-height: 66px !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.sdv-addons-layout.sdv-layout-mixed-descriptions .sdv-total-price {
  font-size: 32px !important;
}

@media (max-width: 767px) {
  .sdv-addons-layout.sdv-layout-mixed-descriptions .sdv-addons-total,
  .sdv-addons-layout.sdv-layout-all-described .sdv-addons-total,
  .sdv-addons-layout.sdv-layout-no-descriptions .sdv-addons-total {
    min-height: 72px !important;
  }
}


/* v3.2.2 visual row balance: the black total button counts as a left-column row. */
.sdv-addons-root .sdv-addons-total {
  min-height: 66px !important;
}

.sdv-addons-root .sdv-addons-total[data-total-span-rows="2"] { min-height: 142px !important; }
.sdv-addons-root .sdv-addons-total[data-total-span-rows="3"] { min-height: 218px !important; }
.sdv-addons-root .sdv-addons-total[data-total-span-rows="4"] { min-height: 294px !important; }
.sdv-addons-root .sdv-addons-total[data-total-span-rows="5"] { min-height: 370px !important; }
.sdv-addons-root .sdv-addons-total[data-total-span-rows="6"] { min-height: 446px !important; }

@media (max-width: 767px) {
  .sdv-addons-root .sdv-addons-total,
  .sdv-addons-root .sdv-addons-total[data-total-span-rows] {
    min-height: 72px !important;
  }
}
