.smm-calculator {
  --calc-primary: var(--ua-color-violet, #6266ee);
  --calc-primary-dark: #4d51d8;
  --calc-blue: var(--ua-color-sky, #42a5f5);
  --calc-ink: var(--ua-color-ink, #242633);
  --calc-muted: var(--ua-color-muted, #7e8292);
  --calc-line: var(--ua-color-line, #e3e5ee);
  --calc-soft: #f3f4ff;
  position: relative !important;
  isolation: isolate;
  width: min(1180px, calc(100% - 2 * var(--ua-gutter, 1rem))) !important;
  max-width: 1180px !important;
  min-width: 0 !important;
  margin: clamp(1rem, 3vw, 2rem) auto !important;
  padding: clamp(.5rem, 2vw, 1.125rem) !important;
  overflow: hidden !important;
  border: 1px solid rgba(98, 102, 238, .12) !important;
  border-radius: clamp(1.25rem, 3vw, 1.875rem) !important;
  background:
    radial-gradient(circle at 0 0, rgba(98, 102, 238, .11), transparent 34%),
    radial-gradient(circle at 100% 100%, rgba(66, 165, 245, .1), transparent 32%),
    #f8f9ff !important;
  box-shadow: 0 24px 64px rgba(42, 49, 88, .12) !important;
  color: var(--calc-ink);
  font-family: var(--ua-font-sans, Inter, sans-serif) !important;
}

.smm-calculator,
.smm-calculator *,
.smm-calculator *::before,
.smm-calculator *::after { box-sizing: border-box; }

.smm-calculator :where(.elementor-container, .e-con-inner) {
  min-width: 0 !important;
  max-width: 100% !important;
}

.smm-calculator > :is(.elementor-container, .e-con-inner) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(270px, 320px) !important;
  gap: clamp(.875rem, 2vw, 1.25rem) !important;
  align-items: start !important;
  width: 100% !important;
  margin: 0 !important;
}

.smm-calculator > :is(.elementor-container, .e-con-inner) > :is(.elementor-column, .e-con) {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}

.smm-calculator > :is(.elementor-container, .e-con-inner) > :is(.elementor-column, .e-con):first-child {
  padding: clamp(1rem, 2.8vw, 1.625rem) !important;
  border: 1px solid rgba(98, 102, 238, .09) !important;
  border-radius: clamp(1rem, 2.5vw, 1.375rem) !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 12px 34px rgba(42, 49, 104, .08) !important;
}

.smm-calculator .elementor-widget-wrap,
.smm-calculator .elementor-widget-container,
.smm-calculator .elementor-form-fields-wrapper,
.smm-calculator .pafe-field-container {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.smm-calculator .elementor-widget-wrap { padding: 0 !important; }
.smm-calculator .elementor-element { max-width: 100% !important; margin-bottom: 0 !important; }
.smm-calculator :where(.elementor-menu-anchor, .elementor-widget-spacer) { display: none !important; }

.smm-calculator > :is(.elementor-container, .e-con-inner)
> :is(.elementor-column, .e-con):first-child
> .elementor-widget-wrap {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(190px, 240px) !important;
  gap: clamp(1rem, 2.5vw, 1.5rem) !important;
  align-items: start !important;
}

.smm-calculator > :is(.elementor-container, .e-con-inner)
> :is(.elementor-column, .e-con):first-child
> .elementor-widget-wrap > .elementor-element {
  grid-column: 1 / -1;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding-inline: 0 !important;
  justify-self: stretch !important;
}

.smm-calculator > :is(.elementor-container, .e-con-inner)
> :is(.elementor-column, .e-con):first-child
> .elementor-widget-wrap > .elementor-element:is(.smm-calculator__quantity, :has(.elementor-field-group-number)) {
  grid-column: 1;
}

.smm-calculator > :is(.elementor-container, .e-con-inner)
> :is(.elementor-column, .e-con):first-child
> .elementor-widget-wrap > .elementor-element:is(.smm-calculator__total, :has(.elementor-field-group-total)) {
  grid-column: 1;
  justify-self: start !important;
}

@media (min-width: 768px) {
  .smm-calculator > :is(.elementor-container, .e-con-inner)
  > :is(.elementor-column, .e-con):first-child
  > .elementor-widget-wrap > .elementor-element:is(.smm-calculator__total, :has(.elementor-field-group-total)) {
    width: min(240px, 100%) !important;
    max-width: 240px !important;
  }
}

.smm-calculator .elementor-field-label {
  position: static !important;
  display: block !important;
  width: 100% !important;
  margin: 0 0 .625rem !important;
  padding: 0 !important;
  color: var(--calc-ink) !important;
  font: 700 .875rem/1.4 var(--ua-font-sans, Inter, sans-serif) !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
}

.smm-calculator .elementor-field-group-cal {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: clamp(1rem, 2.4vw, 1.25rem) !important;
  border: 1px solid rgba(98, 102, 238, .13) !important;
  border-radius: 1.25rem !important;
  background: linear-gradient(145deg, #f8f8ff, #f1f5ff) !important;
}

.smm-calculator .elementor-field-group-cal,
.smm-calculator .elementor-field-group-number,
.smm-calculator .elementor-field-group-total,
.smm-calculator .wtk-calculator-link,
.smm-calculator .elementor-button-wrapper {
  margin-inline: 0 !important;
}

.smm-calculator .elementor-select-wrapper {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
}

.smm-calculator .elementor-select-wrapper::before {
  position: absolute !important;
  z-index: 2 !important;
  top: 50% !important;
  right: 1.125rem !important;
  width: .5rem !important;
  height: .5rem !important;
  border: 0 !important;
  border-right: 2px solid #858a96 !important;
  border-bottom: 2px solid #858a96 !important;
  content: "" !important;
  pointer-events: none !important;
  transform: translateY(-70%) rotate(45deg) !important;
}

.smm-calculator :is(#form-field-cal, .elementor-field-group-cal select) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 0 3rem 0 1rem !important;
  border: 1px solid var(--calc-line) !important;
  border-radius: .875rem !important;
  outline: 0 !important;
  background: #fff !important;
  color: var(--calc-ink) !important;
  box-shadow: none !important;
  font: 600 16px/1.3 var(--ua-font-sans, Inter, sans-serif) !important;
  text-indent: 0 !important;
  appearance: none !important;
  cursor: pointer !important;
}

.smm-calculator :is(#form-field-cal, .elementor-field-group-cal select):focus {
  border-color: var(--calc-primary) !important;
  box-shadow: 0 0 0 4px rgba(98, 102, 238, .12) !important;
}

.smm-calculator .elementor-field-group-number { display: block !important; width: 100% !important; padding: 0 !important; }

.smm-calculator .nice-number {
  display: inline-grid !important;
  grid-template-columns: 42px minmax(62px, 72px) 42px !important;
  gap: .25rem !important;
  align-items: center !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: .3125rem !important;
  border: 1px solid var(--calc-line) !important;
  border-radius: 999px !important;
  background: var(--calc-soft) !important;
}

.smm-calculator .nice-number button {
  display: grid !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #fff !important;
  color: var(--calc-primary) !important;
  box-shadow: 0 5px 14px rgba(39, 45, 95, .1) !important;
  font: 800 1.35rem/1 var(--ua-font-sans, Inter, sans-serif) !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

.smm-calculator .nice-number button:hover { background: linear-gradient(145deg, var(--calc-primary), var(--calc-blue)) !important; color: #fff !important; }
.smm-calculator .nice-number button:active { transform: scale(.95); }

.smm-calculator :is(#form-field-number, .elementor-field-group-number input) {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: var(--calc-ink) !important;
  box-shadow: none !important;
  font: 800 17px/42px var(--ua-font-sans, Inter, sans-serif) !important;
  text-align: center !important;
  appearance: textfield !important;
}

.smm-calculator :is(#form-field-number, .elementor-field-group-number input)::-webkit-inner-spin-button,
.smm-calculator :is(#form-field-number, .elementor-field-group-number input)::-webkit-outer-spin-button { margin: 0; appearance: none; }

.smm-calculator .elementor-field-group-total {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  min-height: 104px !important;
  margin: 0 !important;
  padding: 1rem 1.125rem !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, .25) !important;
  border-radius: 1.125rem !important;
  background: radial-gradient(circle at 100% 0, rgba(96, 190, 255, .65), transparent 45%), linear-gradient(145deg, #6c58f8, #485de4 70%, #357ee9) !important;
  color: #fff !important;
  box-shadow: 0 16px 30px rgba(77, 84, 222, .23) !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.smm-calculator .elementor-field-group-total::after {
  position: absolute;
  top: -3rem;
  right: -2rem;
  width: 7rem;
  height: 7rem;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 50%;
  box-shadow: 0 0 0 18px rgba(255, 255, 255, .04), 0 0 0 36px rgba(255, 255, 255, .02);
  content: "";
  pointer-events: none;
}

.smm-calculator .elementor-field-group-total .elementor-field-label {
  position: relative !important;
  z-index: 1 !important;
  margin-bottom: .5rem !important;
  color: rgba(255, 255, 255, .82) !important;
  font-size: .6875rem !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

.smm-calculator .pafe-calculated-fields-form {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  min-height: 40px !important;
  align-items: flex-end !important;
  flex-wrap: wrap !important;
  gap: .5rem !important;
  color: transparent !important;
  font-size: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.smm-calculator .pafe-calculated-fields-form__value {
  display: inline-block !important;
  color: #fff !important;
  font-size: clamp(2rem, 4vw, 2.75rem) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.smm-calculator .pafe-calculated-fields-form::after {
  display: inline-flex !important;
  margin-bottom: .15rem !important;
  padding: .3rem .55rem !important;
  border: 1px solid rgba(255, 255, 255, .3) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .16) !important;
  color: #fff !important;
  content: "грн." !important;
  font-size: .75rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

.smm-calculator .wtk-calculator-link {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: clamp(.9rem, 2.5vw, 1.25rem) !important;
  border: 1px solid rgba(98, 102, 238, .14) !important;
  border-radius: 1.125rem !important;
  background: linear-gradient(145deg, #f8f7ff, #eff4ff) !important;
  color: var(--calc-ink) !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.smm-calculator .wtk-calculator-head {
  display: grid !important;
  grid-template-columns: 36px minmax(0, 1fr) !important;
  gap: .75rem !important;
  align-items: start !important;
  margin: 0 0 1rem !important;
}

.smm-calculator .wtk-calculator-icon {
  display: grid !important;
  width: 36px !important;
  height: 36px !important;
  place-items: center !important;
  border-radius: .7rem !important;
  background: linear-gradient(145deg, var(--calc-primary), var(--calc-blue)) !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(87, 97, 240, .25) !important;
}

.smm-calculator .wtk-calculator-title { margin: 0 0 .2rem !important; color: var(--calc-ink) !important; font-size: .95rem !important; font-weight: 800 !important; }
.smm-calculator .wtk-calculator-subtitle { margin: 0 !important; color: var(--calc-muted) !important; font-size: .8rem !important; line-height: 1.45 !important; }
.smm-calculator .wtk-calculator-service { display: block !important; margin: 0 0 .875rem !important; padding: .55rem .7rem !important; border: 1px solid rgba(98, 102, 238, .1) !important; border-radius: .6rem !important; background: rgba(255, 255, 255, .84) !important; color: var(--calc-primary-dark) !important; font-size: .8rem !important; font-weight: 700 !important; }
.smm-calculator .wtk-calculator-service[hidden] { display: none !important; }

.smm-calculator .wtk-calculator-label {
  display: flex !important;
  align-items: center !important;
  gap: .45rem !important;
  margin: 0 0 .5rem !important;
  color: var(--calc-ink) !important;
  font: 700 .875rem/1.4 var(--ua-font-sans, Inter, sans-serif) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  opacity: 1 !important;
}

.smm-calculator .wtk-calculator-label::before,
.smm-calculator .wtk-calculator-label::after { display: none !important; content: none !important; }

.smm-calculator .wtk-calculator-label img.emoji { width: 17px !important; height: 17px !important; margin: 0 !important; }

.smm-calculator .wtk-calculator-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: .6rem !important;
  align-items: stretch !important;
  width: 100% !important;
}

.smm-calculator .wtk-calculator-row input {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 0 .8rem !important;
  border: 1px solid var(--calc-line) !important;
  border-radius: .75rem !important;
  outline: 0 !important;
  background: #fff !important;
  color: var(--calc-ink) !important;
  box-shadow: none !important;
  font-size: 16px !important;
}

.smm-calculator .wtk-calculator-row input:focus { border-color: var(--calc-primary) !important; box-shadow: 0 0 0 3px rgba(98, 102, 238, .12) !important; }

.smm-calculator .wtk-calculator-check {
  display: inline-flex !important;
  min-width: max-content !important;
  min-height: 48px !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 1rem !important;
  border: 1px solid var(--calc-primary) !important;
  border-radius: .75rem !important;
  background: #fff !important;
  color: var(--calc-primary-dark) !important;
  font-size: .875rem !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
}

.smm-calculator .wtk-calculator-row input:disabled,
.smm-calculator .wtk-calculator-check:disabled { border-color: #dde0e9 !important; background: #eceef4 !important; color: #969baa !important; cursor: not-allowed !important; opacity: 1 !important; }

.smm-calculator .wtk-calculator-message { min-height: 1.25rem !important; margin: .5rem 0 0 !important; color: var(--calc-muted) !important; font-size: .8rem !important; line-height: 1.45 !important; }
.smm-calculator .wtk-calculator-message:is(.is-ok, .is-success) { color: #138a62 !important; }
.smm-calculator .wtk-calculator-message.is-error { color: #c43d4b !important; }

.smm-calculator .elementor-button-wrapper { width: 100% !important; }

.smm-calculator .pafe-form-builder-button {
  position: relative !important;
  width: 100% !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 0 1.5rem !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: .875rem !important;
  background: linear-gradient(100deg, #ff674d, #ff9563 55%, #ffb16c) !important;
  color: #fff !important;
  box-shadow: 0 13px 28px rgba(255, 105, 78, .27) !important;
  font: 800 .9375rem/1.2 var(--ua-font-sans, Inter, sans-serif) !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
}

.smm-calculator :is(.recommendation-block, .smm-calculator__recommendations) {
  position: relative !important;
  isolation: isolate;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 1.5rem 1.25rem 1.25rem !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, .16) !important;
  border-radius: 1.375rem !important;
  background: radial-gradient(circle at 100% 0, rgba(128, 102, 255, .72), transparent 37%), radial-gradient(circle at 0 100%, rgba(31, 197, 255, .22), transparent 44%), linear-gradient(145deg, #171a3a, #22275b 55%, #151833) !important;
  color: #fff !important;
  box-shadow: 0 22px 46px rgba(22, 25, 60, .27) !important;
}

.smm-calculator :is(.recommendation-block, .smm-calculator__recommendations) .title { max-width: 245px !important; margin: 0 0 1rem !important; color: #fff !important; font-size: 1.125rem !important; font-weight: 800 !important; line-height: 1.25 !important; }

.smm-calculator :is(.recommendation-block, .smm-calculator__recommendations) .title::before {
  display: block;
  width: max-content;
  max-width: 100%;
  margin-bottom: .5rem;
  padding: .3rem .55rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #7b70ff, #559cff);
  color: #fff;
  content: "ДЛЯ КРАЩОГО РЕЗУЛЬТАТУ";
  font-size: .56rem;
  font-weight: 900;
  letter-spacing: .07em;
}

.smm-calculator :is(.recommendation-block, .smm-calculator__recommendations) .button-list { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: .6rem !important; counter-reset: calc-recommendation; }
.smm-calculator :is(.recommendation-block, .smm-calculator__recommendations) br { display: none !important; }

.smm-calculator :is(.recommendation-block, .smm-calculator__recommendations) a {
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) 24px !important;
  gap: .55rem !important;
  align-items: center !important;
  min-width: 0 !important;
  min-height: 55px !important;
  margin: 0 !important;
  padding: .55rem !important;
  border: 1px solid rgba(255, 255, 255, .1) !important;
  border-radius: .875rem !important;
  background: rgba(255, 255, 255, .09) !important;
  color: #fff !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere;
  text-decoration: none !important;
  counter-increment: calc-recommendation;
}

.smm-calculator :is(.recommendation-block, .smm-calculator__recommendations) a::before { display: grid; width: 28px; height: 28px; place-items: center; border-radius: .55rem; background: linear-gradient(145deg, #766bff, #4e99ff); content: counter(calc-recommendation, decimal-leading-zero); color: #fff; font-size: .58rem; font-weight: 900; }
.smm-calculator :is(.recommendation-block, .smm-calculator__recommendations) a::after { display: grid; width: 24px; height: 24px; place-items: center; border-radius: 50%; background: rgba(255, 255, 255, .11); content: "↗"; color: #b8dfff; }
.smm-calculator :is(.recommendation-block, .smm-calculator__recommendations) a:hover { border-color: rgba(151, 193, 255, .48) !important; background: rgba(121, 109, 255, .25) !important; }

.smm-calculator :is(.recommendation-block, .smm-calculator__recommendations)::after {
  display: inline-flex;
  margin-top: 1rem;
  padding: .4rem .65rem;
  border: 1px solid rgba(160, 226, 255, .2);
  border-radius: 999px;
  background: rgba(99, 112, 255, .18);
  color: #b9eaff;
  content: "✦ ВИГІДНІШЕ РАЗОМ";
  font-size: .56rem;
  font-weight: 900;
  letter-spacing: .09em;
}

@media (max-width: 1024px) {
  .smm-calculator > :is(.elementor-container, .e-con-inner) { grid-template-columns: minmax(0, 1fr) !important; }
}

@media (max-width: 767px) {
  .smm-calculator {
    width: calc(100% - .75rem) !important;
    max-width: calc(100% - .75rem) !important;
    margin: .375rem auto !important;
    padding: .375rem !important;
    border-radius: 1.25rem !important;
  }

  .smm-calculator > :is(.elementor-container, .e-con-inner) { display: flex !important; flex-direction: column !important; gap: .75rem !important; }

  .smm-calculator > :is(.elementor-container, .e-con-inner) > :is(.elementor-column, .e-con):first-child { order: 1 !important; padding: .9rem !important; }
  .smm-calculator > :is(.elementor-container, .e-con-inner) > :is(.elementor-column, .e-con):last-child { order: 2 !important; }

  .smm-calculator > :is(.elementor-container, .e-con-inner)
  > :is(.elementor-column, .e-con):first-child
  > .elementor-widget-wrap {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 1.15rem !important;
  }

  .smm-calculator > :is(.elementor-container, .e-con-inner)
  > :is(.elementor-column, .e-con):first-child
  > .elementor-widget-wrap > .elementor-element:is(.smm-calculator__quantity, :has(.elementor-field-group-number)),
  .smm-calculator > :is(.elementor-container, .e-con-inner)
  > :is(.elementor-column, .e-con):first-child
  > .elementor-widget-wrap > .elementor-element:is(.smm-calculator__total, :has(.elementor-field-group-total)) { grid-column: 1; }

  .smm-calculator > :is(.elementor-container, .e-con-inner)
  > :is(.elementor-column, .e-con):first-child
  > .elementor-widget-wrap > .elementor-element:is(.smm-calculator__total, :has(.elementor-field-group-total)) {
    width: 100% !important;
    max-width: 100% !important;
  }

  .smm-calculator .elementor-field-group-total { min-height: 100px !important; }
  .smm-calculator .wtk-calculator-row { grid-template-columns: minmax(0, 1fr) !important; }
  .smm-calculator .wtk-calculator-check { width: 100% !important; max-width: 100% !important; }
  .smm-calculator :is(.recommendation-block, .smm-calculator__recommendations) { padding: 1.2rem .9rem !important; }
  .smm-calculator :is(.recommendation-block, .smm-calculator__recommendations) .title { max-width: 100% !important; }
}

@media (max-width: 360px) {
  .smm-calculator { width: calc(100% - .5rem) !important; max-width: calc(100% - .5rem) !important; }
  .smm-calculator > :is(.elementor-container, .e-con-inner) > :is(.elementor-column, .e-con):first-child { padding: .7rem !important; }
  .smm-calculator .nice-number { grid-template-columns: 40px minmax(54px, 1fr) 40px !important; }
  .smm-calculator .nice-number button { width: 40px !important; height: 40px !important; min-width: 40px !important; min-height: 40px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .smm-calculator,
  .smm-calculator * { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}