/* Live patch for /settings/yandex/ofd: clearer setup flow and safer enable switch. */
.ofdSettingsPage {
  gap: 16px;
}

.ofdSettingsPage .priceHero {
  align-items: stretch;
  background:
    radial-gradient(circle at 86% 10%, rgba(65,225,140,.18), transparent 18rem),
    linear-gradient(135deg, rgba(255,255,255,.12), rgba(34,211,238,.07));
}

.ofdSettingsPage .priceHero p {
  max-width: 720px;
  color: #cbd8eb;
  line-height: 1.58;
}

.ofdGuidePanel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, .9fr);
  gap: 18px;
  align-items: start;
  background:
    radial-gradient(circle at 12% 20%, rgba(34,211,238,.14), transparent 17rem),
    linear-gradient(145deg, rgba(255,255,255,.1), rgba(255,255,255,.045));
}

.ofdGuidePanel h3 {
  margin: 0;
  font-size: 28px;
  letter-spacing: -.04em;
}

.ofdGuidePanel p {
  margin: 10px 0 0;
  color: var(--muted);
  line-height: 1.55;
}

.ofdGuidePanel ol {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ofdGuidePanel li {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 10px;
  align-items: center;
  min-height: 56px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 16px;
  background: rgba(255,255,255,.07);
}

.ofdGuidePanel li b {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: linear-gradient(135deg, #f5fbff, #8fefff);
  color: #07101c;
}

.ofdGuidePanel li span {
  color: #dce8f7;
  line-height: 1.35;
}

.ofdProviderHint,
.ofdFillStatus {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(143,239,255,.2);
  background: rgba(143,239,255,.08);
  color: #dffbff;
}

.ofdProviderHint {
  margin-bottom: 14px;
}

.ofdProviderHint b {
  color: #f6f8ff;
}

.ofdProviderHint span {
  color: var(--muted);
}

.ofdFillStatus {
  margin: 12px 0;
  font-weight: 850;
}

.ofdFillStatus.warn {
  border-color: rgba(255,211,110,.34);
  background: rgba(255,211,110,.14);
  color: #ffe7a8;
}

.ofdFillStatus.ok {
  border-color: rgba(65,225,140,.34);
  background: rgba(65,225,140,.14);
  color: #caffdf;
}

.ofdSettingsPage .priceSwitchGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 16px 0;
}

.ofdSettingsPage .toggleField {
  padding: 14px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 18px;
  background: rgba(255,255,255,.06);
}

.ofdSettingsPage .toggleField > span {
  color: #dfe8f7;
  font-size: 13px;
  font-weight: 950;
  letter-spacing: normal;
  text-transform: none;
}

.ofdSettingsPage .toggleField button {
  width: fit-content;
  min-width: 170px;
  min-height: 40px;
  border-radius: 999px;
  padding: 0 15px;
}

.ofdSettingsPage .toggleField button:disabled {
  cursor: not-allowed;
  opacity: .72;
  background: rgba(255,255,255,.08);
  color: #9aa8bd;
  border-color: rgba(255,255,255,.12);
}

.ofdSettingsPage .ofdEnableField button:disabled {
  min-width: 220px;
  background: rgba(255,211,110,.12);
  color: #ffe7a8;
  border-color: rgba(255,211,110,.28);
}

.ofdSettingsPage .templateActions {
  align-items: center;
}

.ofdSettingsPage .templateActions .primary,
.ofdSettingsPage .templateActions .ghost {
  min-height: 42px;
  border-radius: 14px;
}

.ofdSettingsPage .templateActions button:disabled {
  cursor: not-allowed;
  opacity: .58;
}

.ofdSettingsPage .promoStatus.blocked {
  border-color: rgba(255,211,110,.32);
  background: rgba(255,211,110,.14);
  color: #ffe4a8;
}

.ofdSettingsPage select,
.ofdSettingsPage input {
  border-color: rgba(143,239,255,.2);
  background: linear-gradient(180deg, rgba(11,20,34,.98), rgba(8,14,24,.94));
}

.ofdSettingsPage select {
  cursor: pointer;
}

.ofdSettingsPage .ofdNativeSelectHidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.ofdCustomSelect {
  position: relative;
  z-index: 1;
}

.ofdCustomSelect.open {
  z-index: 30;
}

.ofdCustomSelectButton {
  width: 100%;
  min-height: 46px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 24px;
  gap: 10px;
  align-items: center;
  padding: 0 13px 0 14px;
  border: 1px solid rgba(143,239,255,.24);
  border-radius: 14px;
  background:
    radial-gradient(circle at 10% 12%, rgba(34,211,238,.14), transparent 8rem),
    linear-gradient(180deg, rgba(11,20,34,.98), rgba(8,14,24,.94));
  color: #eef7ff;
  text-align: left;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 12px 30px rgba(0,0,0,.16);
}

.ofdCustomSelectButton:hover,
.ofdCustomSelect.open .ofdCustomSelectButton {
  border-color: rgba(34,211,238,.62);
}

.ofdCustomSelectButton:focus-visible {
  outline: none;
  border-color: rgba(34,211,238,.82);
  box-shadow: 0 0 0 3px rgba(34,211,238,.14), inset 0 1px 0 rgba(255,255,255,.06);
}

.ofdCustomSelectText {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #eef7ff;
  font-weight: 850;
}

.ofdCustomSelectButton i {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 9px;
  background: rgba(143,239,255,.12);
  color: #96e8ff;
  font-style: normal;
  font-size: 17px;
  line-height: 1;
  transition: transform .16s ease;
}

.ofdCustomSelect.open .ofdCustomSelectButton i {
  transform: rotate(180deg);
}

.ofdCustomSelectMenu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  display: none;
  gap: 6px;
  max-height: 260px;
  overflow: auto;
  padding: 8px;
  border: 1px solid rgba(143,239,255,.25);
  border-radius: 18px;
  background:
    radial-gradient(circle at 10% 0%, rgba(34,211,238,.14), transparent 11rem),
    rgba(8,14,24,.98);
  box-shadow: 0 26px 70px rgba(0,0,0,.62);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}

.ofdCustomSelect.open .ofdCustomSelectMenu {
  display: grid;
}

.ofdCustomSelectOption {
  width: 100%;
  min-height: 39px;
  padding: 0 11px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #dfe8f7;
  text-align: left;
  font-weight: 850;
}

.ofdCustomSelectOption:hover,
.ofdCustomSelectOption.active {
  background: rgba(143,239,255,.15);
  color: #fff;
}

.ofdCustomSelectOption.active {
  box-shadow: inset 3px 0 0 #41e18c;
}

@media (max-width: 1000px) {
  .ofdGuidePanel,
  .ofdSettingsPage .priceSwitchGrid {
    grid-template-columns: 1fr;
  }
}
