/* ==========================================================================
   PlayPapa — правки по итогам ревью (подключается последним на всех страницах)
   ========================================================================== */

/* ---------- 1. Единая палитра: вместо коричневого — мягкие полупрозрачные тона ---------- */
:root {
  --orange-soft: var(--orange-light);
  --green-soft: var(--lime);
  --radius-btn: 10px;
  --radius-badge: 10px;
}
html[data-theme="dark"] {
  --orange-soft: rgba(255, 141, 40, 0.16);
  --green-soft: rgba(110, 184, 63, 0.16);
}

/* ---------- 2. Единый шрифт везде ---------- */
body,
button,
input,
select,
textarea {
  font-family: "Montserrat", "SF Pro Display", "SF Pro Text", Arial, sans-serif;
}

/* ---------- 3. Ссылки-логотипы и кнопка «Бонусы» (теперь <a>) ---------- */
a.bonus-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
.footer-logo-link {
  display: inline-flex;
  flex: 0 0 auto;
}
.footer-logo-link img {
  display: block;
}

/* ---------- 4. «Ввести промокод» — ссылка, а не кнопка (главная, каталог) ---------- */
.promo-small {
  height: auto;
  min-height: 28px;
  padding: 4px 0;
  column-gap: 4px;
  background: transparent !important;
  color: var(--blue) !important;
  font-size: 14px;
  cursor: pointer;
}
.promo-small:hover {
  background: transparent;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.promo-small svg path {
  stroke: currentColor;
}

/* ---------- 5. Подсказка «Где найти логин Steam» у иконки «!» ---------- */
.field-info {
  position: relative;
  cursor: pointer;
  border: 0;
  padding: 0;
}
.field-info:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}
.pp-hint {
  position: absolute;
  z-index: 200;
  right: -8px;
  top: calc(100% + 10px);
  width: 260px;
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--bg-color);
  color: var(--text);
  box-shadow: 0 12px 32px rgba(20, 29, 44, 0.18);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
  text-align: left;
  cursor: default;
  white-space: normal;
}
.pp-hint b {
  display: block;
  margin-bottom: 4px;
  font-size: 14px;
  font-weight: 700;
  color: var(--text-dark);
}
.pp-hint a {
  color: var(--blue);
  font-weight: 600;
}
.pp-hint[hidden] {
  display: none;
}
.login-field {
  position: relative;
  overflow: visible;
}

/* ---------- 6. Колесо: без градиента/засвета (одинаково в светлой и тёмной теме) ---------- */
.wheel-viewport {
  background: var(--blue-deep);
}
html[data-theme="dark"] .bonuses-wheel__wrapper::after {
  background: linear-gradient(180deg, rgba(18, 20, 25, 0) 30%, var(--page) 100%);
}

/* Баннер «Испытай свою удачу» в тёмной теме — без ярко-жёлтого градиента */
html[data-theme="dark"] .index-wheel__inner {
  background: #2a2016;
  box-shadow: inset 0 0 0 1px rgba(255, 141, 40, 0.45);
}
html[data-theme="dark"] .index-wheel__left h2 span,
html[data-theme="dark"] .index-wheel__left p span {
  background-color: var(--orange-dark);
  color: #fff;
}

html[data-theme="dark"] .index-wheel__bg {
  opacity: 0.35;
}
html[data-theme="dark"] .index-wheel__free {
  background: rgba(255, 255, 255, 0.08);
}

/* ---------- 7. Единые скругления у плашек-заголовков ---------- */
.bonuses-main__title span,
.index-wheel__left h2 span,
.index-wheel__left p span,
.referral-left__title-badge strong {
  border-radius: var(--radius-badge);
}
.custom-button {
  border-radius: var(--radius-btn);
}

/* ---------- 8. Бонусы: блок рефералки как блоки подписок ---------- */
.bonuses-wheel__referral-button {
  text-decoration: none;
}

/* ---------- 9. Мобильная версия ---------- */
@media (max-width: 767px) {
  /* компактные поля «Логин Steam» и «Сумма» в быстром пополнении */
  .topup-row .form-field {
    height: 52px;
    border-radius: 12px;
  }
  .topup-row .form-field input {
    font-size: 16px;
  }
  .topup-row .amount-field small {
    margin-bottom: 2px;
    font-size: 12px;
  }
  .topup-row .amount-control input {
    font-size: 16px;
  }
  .topup-row .currency-tabs button {
    width: 32px;
    height: 32px;
  }
  .topup-row .pay-btn {
    height: 52px;
  }
  .topup-row .promo-small {
    width: auto;
    justify-content: flex-start;
  }
  .topup-row .topup-info {
    min-height: 0;
  }
  .topup-row .topup-info > img {
    width: 56px;
    height: 56px;
  }

  .pp-hint {
    right: -4px;
    width: min(280px, calc(100vw - 48px));
  }

  /* окно входа/регистрации — на весь экран */
  .auth-modal-layer {
    padding: 0;
    place-items: stretch;
  }
  .auth-modal-layer .auth-modal-dialog {
    width: 100%;
    max-width: none;
    margin: 0;
    min-height: 100%;
    min-height: 100dvh;
    border-radius: 0;
    box-shadow: none;
    padding-top: 24px;
    padding-bottom: 32px;
  }
  .auth-modal-layer .auth-close {
    top: 16px;
    right: 16px;
  }

  /* бонусы: колесо больше не вылезает за экран */
  .bonuses-wheel__wrapper {
    max-width: 100vw;
  }

  /* длинные слова/названия не распирают карточки */
  h1, h2, h3, p {
    overflow-wrap: break-word;
  }
}

/* общая страховка от горизонтального скролла на телефонах */
@media (max-width: 767px) {
  html,
  body {
    overflow-x: clip;
  }
}

/* ---------- 10. Значки валют встроены, чтобы работали и при открытии файла напрямую ---------- */
.currency-icon-ruble {
  --currency-icon-mask: url("data:image/svg+xml,%3Csvg width=%2212%22 height=%2212%22 viewBox=%220 0 12 12%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%0A%3Cpath d=%22M1.55153 11.2002V0.00019455H6.39953C7.89287 0.00019455 9.07687 0.314861 9.95153 0.944195C10.8262 1.57353 11.2635 2.51753 11.2635 3.7762C11.2635 5.0242 10.8262 5.96286 9.95153 6.5922C9.07687 7.22153 7.89287 7.5362 6.39953 7.5362H2.99153L4.15953 6.38419V11.2002H1.55153ZM-0.000468731 9.7602V8.4322H7.61553V9.7602H-0.000468731ZM4.15953 6.6562L2.99153 5.5042H6.38353C7.0982 5.5042 7.65287 5.3602 8.04753 5.0722C8.4422 4.77353 8.63953 4.34686 8.63953 3.79219C8.63953 3.2482 8.4422 2.8322 8.04753 2.5442C7.65287 2.2562 7.0982 2.1122 6.38353 2.1122H2.99153L4.15953 0.880195V6.6562Z%22 fill=%22%238A94A6%22/%3E%0A%3C/svg%3E");
}
.currency-icon-tenge {
  --currency-icon-mask: url("data:image/svg+xml,%3Csvg width=%2210%22 height=%2212%22 viewBox=%220 0 10 12%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%0A%3Cpath d=%22M3.56819 11.2002V3.61619H0.000187516V2.27219H9.74419V3.61619H6.16019V11.2002H3.56819ZM0.000187516 1.34419V0.00019455H9.74419V1.34419H0.000187516Z%22 fill=%22%238A94A6%22/%3E%0A%3C/svg%3E");
}
.currency-icon-dollar {
  --currency-icon-mask: url("data:image/svg+xml,%3Csvg width=%2210%22 height=%2216%22 viewBox=%220 0 10 16%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%0A%3Cpath d=%22M4.56073 13.3121C3.66473 13.3121 2.80607 13.1948 1.98473 12.9601C1.1634 12.7148 0.502068 12.4001 0.000734389 12.0161L0.880734 10.0641C1.36073 10.4055 1.92607 10.6881 2.57673 10.9121C3.23807 11.1255 3.90473 11.2321 4.57673 11.2321C5.08873 11.2321 5.4994 11.1841 5.80873 11.0881C6.12873 10.9815 6.3634 10.8375 6.51273 10.6561C6.66207 10.4748 6.73673 10.2668 6.73673 10.0321C6.73673 9.73345 6.6194 9.49878 6.38473 9.32812C6.15007 9.14678 5.84073 9.00278 5.45673 8.89612C5.07273 8.77878 4.64607 8.67212 4.17673 8.57612C3.71807 8.46945 3.25407 8.34145 2.78473 8.19212C2.32607 8.04278 1.90473 7.85078 1.52073 7.61612C1.13673 7.38145 0.822068 7.07212 0.576734 6.68812C0.342068 6.30412 0.224734 5.81345 0.224734 5.21612C0.224734 4.57612 0.395401 3.99478 0.736734 3.47212C1.08873 2.93878 1.6114 2.51745 2.30473 2.20812C3.00873 1.88812 3.88873 1.72812 4.94473 1.72812C5.64873 1.72812 6.34207 1.81345 7.02473 1.98412C7.7074 2.14412 8.31007 2.38945 8.83274 2.72012L8.03273 4.68812C7.51007 4.38945 6.9874 4.17078 6.46473 4.03212C5.94207 3.88278 5.43007 3.80812 4.92873 3.80812C4.4274 3.80812 4.01673 3.86678 3.69673 3.98412C3.37673 4.10145 3.1474 4.25612 3.00873 4.44812C2.87007 4.62945 2.80073 4.84278 2.80073 5.08812C2.80073 5.37612 2.91807 5.61078 3.15273 5.79212C3.3874 5.96278 3.69673 6.10145 4.08073 6.20812C4.46473 6.31478 4.88607 6.42145 5.34473 6.52812C5.81407 6.63478 6.27807 6.75745 6.73673 6.89612C7.20607 7.03478 7.63273 7.22145 8.01674 7.45612C8.40073 7.69078 8.71007 8.00012 8.94473 8.38412C9.19007 8.76812 9.31273 9.25345 9.31273 9.84012C9.31273 10.4695 9.13673 11.0455 8.78473 11.5681C8.43273 12.0908 7.90473 12.5121 7.20073 12.8321C6.5074 13.1521 5.6274 13.3121 4.56073 13.3121ZM3.95273 15.0401V0.000116348H5.55273V15.0401H3.95273Z%22 fill=%22white%22/%3E%0A%3C/svg%3E");
}