.sf-term-control {
  display: grid;
  align-content: center;
  gap: 14px;
  padding: 24px;
}

.sf-term-control__fields {
  display: grid;
  grid-template-columns: minmax(110px, 1fr) minmax(130px, 1fr);
  gap: 12px;
}

.sf-term-control label {
  display: grid;
  gap: 7px;
}

.sf-term-control label span {
  color: #003366;
  font-size: 0.82rem;
  font-weight: 800;
}

.sf-term-control input {
  width: 100%;
  min-height: 44px;
  border: 1px solid #b9c9d7;
  border-radius: 8px;
  background: #ffffff;
  color: #1f2f3d;
  padding: 10px 12px;
  font: inherit;
}

.sf-term-control__year-field {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  align-items: stretch;
  border: 1px solid #b9c9d7;
  border-radius: 8px;
  background: #ffffff;
  overflow: hidden;
}

.sf-term-control__year-input {
  min-height: 52px;
  border: 0;
  border-radius: 0;
  text-align: center;
  padding-inline: 8px;
}

.sf-term-control__year-input::-webkit-outer-spin-button,
.sf-term-control__year-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.sf-term-control__year-input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}

.sf-term-control .sf-term-control__step {
  min-height: 52px;
  border: 0;
  border-right: 1px solid #d8e4ed;
  border-radius: 0;
  background: #f8fbfd;
  color: #003366;
  cursor: pointer;
  font-size: 1.1rem;
  font-weight: 900;
}

.sf-term-control .sf-term-control__step:last-child {
  border-right: 0;
  border-left: 1px solid #d8e4ed;
}

.sf-term-control .sf-term-control__step:hover {
  background: rgba(21, 120, 193, 0.09);
}

.sf-term-control .sf-term-control__step:focus-visible {
  position: relative;
  z-index: 1;
  outline: 3px solid rgba(21, 120, 193, 0.18);
  outline-offset: -3px;
}

.sf-term-control .sf-term-control__step:disabled {
  cursor: not-allowed;
  color: #8ca0b1;
  background: #f4f8fb;
}

.sf-term-control input:focus {
  border-color: #1578c1;
  outline: 3px solid rgba(21, 120, 193, 0.18);
}

.sf-term-control__year-field:focus-within {
  border-color: #1578c1;
  outline: 3px solid rgba(21, 120, 193, 0.18);
  outline-offset: 0;
}

.sf-term-control__year-field .sf-term-control__year-input:focus {
  border-color: transparent;
  outline: 0;
}

.sf-term-control .sf-select-menu {
  min-width: 0;
}

.sf-term-control .sf-term-control__submit {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  border-radius: 8px;
  background: #1578c1;
  color: #ffffff;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

.sf-term-control .sf-term-control__submit:hover {
  background: #0f6ba8;
}

.sf-term-control .sf-term-control__submit:focus-visible {
  outline: 3px solid rgba(21, 120, 193, 0.18);
  outline-offset: 3px;
}

.sf-term-control .sf-term-control__submit svg {
  width: 18px;
  height: 18px;
}

@media (max-width: 560px) {
  .sf-term-control__fields {
    grid-template-columns: 1fr;
  }
}