/* LUVHOUSE_DIRECT_REAL_BUTTON_CLASSES_STEP_058
   Цвет со скрина: верх #9ABD3D, низ #87A635.
   Только CSS. Без JS.
*/

:root {
  --luv-shot-green-top: #9ABD3D;
  --luv-shot-green-bottom: #87A635;
  --luv-shot-green-border: #7F9D32;
  --luv-shot-green-hover-top: #A7CB47;
  --luv-shot-green-hover-bottom: #90B23A;
  --luv-shot-green-shadow: rgba(135, 166, 53, .36);
}

/* Главные кнопки: рассчитать, отправить, сохранить, активное действие */
.primary,
button.primary,
a.primary,
input.primary,
button[type="submit"],
input[type="submit"],
.mosaic-form__button,
.form-submit,
.lead-submit,
.calculate,
.calc-button,
.submit,
.send,
.cta,
.result-button,
#calculate,
#calculateBtn,
#calcButton,
#submit,
#submitLead,
#sendLead,
#leadSubmit,
#resultButton,
.admin-actions button:not(.logout-link),
.admin-actions a:not(.logout-link) {
  background: linear-gradient(135deg, var(--luv-shot-green-top) 0%, var(--luv-shot-green-bottom) 100%) !important;
  background-color: var(--luv-shot-green-bottom) !important;
  color: #ffffff !important;
  border: 1px solid var(--luv-shot-green-border) !important;
  box-shadow: 0 12px 28px var(--luv-shot-green-shadow) !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.12) !important;
}

/* Наведение */
.primary:hover,
button.primary:hover,
a.primary:hover,
input.primary:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
.mosaic-form__button:hover,
.form-submit:hover,
.lead-submit:hover,
.calculate:hover,
.calc-button:hover,
.submit:hover,
.send:hover,
.cta:hover,
.result-button:hover,
#calculate:hover,
#calculateBtn:hover,
#calcButton:hover,
#submit:hover,
#submitLead:hover,
#sendLead:hover,
#leadSubmit:hover,
#resultButton:hover,
.admin-actions button:not(.logout-link):hover,
.admin-actions a:not(.logout-link):hover {
  background: linear-gradient(135deg, var(--luv-shot-green-hover-top) 0%, var(--luv-shot-green-hover-bottom) 100%) !important;
  background-color: var(--luv-shot-green-hover-bottom) !important;
  color: #ffffff !important;
  border-color: #739129 !important;
}

/* Выбранные варианты калькулятора */
.option-card.active,
.option-card.is-active,
.option-card.selected,
.choice.active,
.choice.is-active,
.choice.selected,
.calc-option.active,
.calc-option.is-active,
.calc-option.selected,
.calculator-option.active,
.calculator-option.is-active,
.calculator-option.selected,
.variant.active,
.variant.is-active,
.variant.selected,
button.active,
button.is-active,
button.selected,
button[aria-pressed="true"],
[aria-selected="true"],
[data-selected="true"],
input[type="radio"]:checked + label,
input[type="checkbox"]:checked + label {
  background: linear-gradient(135deg, var(--luv-shot-green-top) 0%, var(--luv-shot-green-bottom) 100%) !important;
  background-color: var(--luv-shot-green-bottom) !important;
  color: #ffffff !important;
  border-color: var(--luv-shot-green-border) !important;
  box-shadow: 0 10px 24px var(--luv-shot-green-shadow) !important;
}

/* Если у активной карточки был левый зелёный штрих — убираем, чтобы было как цельная кнопка */
.option-card.active {
  box-shadow: 0 10px 24px var(--luv-shot-green-shadow) !important;
}

/* Маленькие кнопки подсказок со знаком вопроса */
.hint,
.help,
.help-btn,
.tooltip-btn,
.tooltip-button,
.question,
.question-btn,
.info,
.info-btn,
.calc-help,
.calc-tooltip,
button.hint,
button.help,
button.help-btn,
button.tooltip-btn,
button.tooltip-button,
button.question,
button.question-btn,
button.info,
button.info-btn,
span.hint,
span.help,
span.help-btn,
span.tooltip-btn,
span.tooltip-button,
span.question,
span.question-btn,
span.info,
span.info-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 25px !important;
  height: 25px !important;
  min-width: 25px !important;
  min-height: 25px !important;
  padding: 0 !important;
  border: 1px solid var(--luv-shot-green-border) !important;
  background: linear-gradient(135deg, var(--luv-shot-green-top) 0%, var(--luv-shot-green-bottom) 100%) !important;
  background-color: var(--luv-shot-green-bottom) !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-align: center !important;
  box-shadow: 0 6px 15px rgba(135,166,53,.30) !important;
}

/* Результат расчёта и важные зелёные акценты */
.total,
.metric b,
#leadStatus,
.breakdown-details summary {
  color: var(--luv-shot-green-bottom) !important;
}

.result-note {
  background: linear-gradient(135deg, rgba(154,189,61,.16) 0%, rgba(135,166,53,.10) 100%) !important;
  border-color: rgba(135,166,53,.44) !important;
}
