/*
 * Adsrek Pay — Redesign v1.8
 * Settings pages theme/contrast cleanup.
 * Covers: Данные / Безопасность / Реквизиты.
 * UI only.
 */

/* =========================================================
   SETTINGS — common page rhythm
   ========================================================= */
.az-settings,
.ap-sec,
.pay-details{
  gap:13px!important;
}
.az-settings-hero,
.ap-sec-hero,
.pay-details__hero{
  border-radius:16px!important;
  padding:17px 18px!important;
  box-shadow:var(--rd-shadow-xs)!important;
}

/* Hero no longer has an oversized bright decorative circle */
.az-settings-hero:before{
  width:160px!important;
  height:160px!important;
  right:-54px!important;
  top:-66px!important;
  background:color-mix(in srgb,var(--rd-primary) 10%,transparent)!important;
}
.az-settings-hero small{
  margin-bottom:7px!important;
  padding:5px 9px!important;
  border-radius:999px!important;
  background:var(--rd-surface-2)!important;
  border:1px solid var(--rd-border)!important;
  color:var(--rd-muted)!important;
  font-size:9px!important;
  letter-spacing:.075em!important;
}
.az-settings-hero h2{
  font-size:22px!important;
  line-height:1.15!important;
}

/* =========================================================
   Tabs — same segmented control on all settings screens
   ========================================================= */
.az-tabs,
.ap-sec-tabs,
.pay-details__tabs{
  display:flex!important;
  gap:4px!important;
  padding:4px!important;
  border:1px solid var(--rd-border)!important;
  border-radius:12px!important;
  background:var(--rd-surface)!important;
  box-shadow:none!important;
}
.az-tabs a,
.ap-sec-tabs a,
.pay-details__tabs a{
  min-height:34px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 12px!important;
  border:0!important;
  border-radius:9px!important;
  background:transparent!important;
  color:var(--rd-muted)!important;
  box-shadow:none!important;
  font-size:10.5px!important;
  font-weight:850!important;
}
.az-tabs a:hover,
.ap-sec-tabs a:hover,
.pay-details__tabs a:hover{
  background:var(--rd-surface-2)!important;
  color:var(--rd-text-strong)!important;
}
.az-tabs a.is-active,
.ap-sec-tabs a.on,
.ap-sec-tabs a.is-active,
.pay-details__tabs .on{
  background:var(--rd-primary-soft)!important;
  color:var(--rd-primary)!important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--rd-primary) 28%,transparent)!important;
}

/* =========================================================
   DATA tab
   ========================================================= */
.az-settings-grid{
  gap:12px!important;
}
.az-card{
  padding:16px!important;
  border-radius:16px!important;
  border:1px solid var(--rd-border)!important;
  background:var(--rd-surface)!important;
  box-shadow:var(--rd-shadow-xs)!important;
  color:var(--rd-text)!important;
}
.az-card h3{
  margin:0 0 12px!important;
  color:var(--rd-text-strong)!important;
  font-size:16px!important;
  letter-spacing:-.015em!important;
}
.az-profile-badge{
  margin-bottom:12px!important;
  padding:12px 13px!important;
  border-radius:12px!important;
  border:1px solid var(--rd-border)!important;
  background:var(--rd-surface-2)!important;
}
.az-profile-badge b{
  color:var(--rd-text-strong)!important;
  font-size:16px!important;
}
.az-row{
  padding:10px 0!important;
  border-color:var(--rd-border)!important;
}
.az-row span{
  color:var(--rd-muted)!important;
  font-size:11px!important;
}
.az-row b{
  color:var(--rd-text-strong)!important;
  font-size:11.5px!important;
}
.az-pill{
  min-height:25px!important;
  padding:0 8px!important;
  border:1px solid var(--rd-border)!important;
  background:var(--rd-surface-2)!important;
  color:var(--rd-green)!important;
  font-size:9.5px!important;
}
.az-note{
  padding:13px!important;
  border:1px solid var(--rd-border)!important;
  border-radius:12px!important;
  background:var(--rd-surface-2)!important;
  color:var(--rd-muted)!important;
  font-size:11px!important;
}
.az-note b{
  color:var(--rd-text-strong)!important;
}
.az-access-links{
  gap:9px!important;
  margin-top:10px!important;
}
.az-action{
  gap:11px!important;
  padding:12px!important;
  border-radius:13px!important;
  border:1px solid var(--rd-border)!important;
  background:var(--rd-surface-2)!important;
  box-shadow:none!important;
}
.az-action:hover{
  transform:none!important;
  background:var(--rd-primary-soft)!important;
  border-color:color-mix(in srgb,var(--rd-primary) 30%,var(--rd-border))!important;
  box-shadow:none!important;
}
.az-action i{
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  border-radius:11px!important;
  background:var(--rd-primary-soft)!important;
  color:var(--rd-primary)!important;
}
.az-action b{
  color:var(--rd-text-strong)!important;
  font-size:12px!important;
}
.az-action span{
  margin-top:2px!important;
  color:var(--rd-muted)!important;
  font-size:10.5px!important;
}

/* P2P email settings: remove the white strips */
.az-card--wide{
  padding:16px!important;
}
.az-form{
  gap:9px!important;
}
.az-check{
  gap:11px!important;
  padding:12px 13px!important;
  border:1px solid var(--rd-border)!important;
  border-radius:12px!important;
  background:var(--rd-surface-2)!important;
  color:var(--rd-text)!important;
}
.az-check:hover{
  border-color:color-mix(in srgb,var(--rd-primary) 28%,var(--rd-border))!important;
  background:color-mix(in srgb,var(--rd-primary-soft) 55%,var(--rd-surface-2))!important;
}
.az-check input[type="checkbox"]{
  width:17px!important;
  height:17px!important;
  min-width:17px!important;
  margin-top:2px!important;
  accent-color:var(--rd-primary)!important;
}
.az-check b{
  color:var(--rd-text-strong)!important;
  font-size:11.5px!important;
}
.az-check span{
  margin-top:2px!important;
  color:var(--rd-muted)!important;
  font-size:10.5px!important;
}
.az-form-foot{
  gap:12px!important;
  padding-top:2px!important;
}
.az-form-foot small{
  max-width:760px!important;
  color:var(--rd-muted)!important;
  font-size:9.5px!important;
  line-height:1.45!important;
}
.az-btn{
  min-height:38px!important;
  padding:0 13px!important;
  border:1px solid var(--rd-primary)!important;
  border-radius:10px!important;
  background:var(--rd-primary)!important;
  color:#fff!important;
  box-shadow:none!important;
}

/* =========================================================
   SECURITY tab — harmonize its own local palette
   ========================================================= */
html[data-theme="dark"] .ap-sec{
  --s-bg:var(--rd-surface)!important;
  --s-panel:var(--rd-surface-2)!important;
  --s-line:var(--rd-border)!important;
  --s-text:var(--rd-text-strong)!important;
  --s-muted:var(--rd-muted)!important;
  --s-primary:var(--rd-primary)!important;
  --s-primary2:var(--rd-primary-hover)!important;
  --s-good:var(--rd-green)!important;
  --s-good-bg:var(--rd-green-soft)!important;
  --s-bad:var(--rd-red)!important;
  --s-bad-bg:var(--rd-red-soft)!important;
}
.ap-sec-card{
  border-radius:16px!important;
  padding:16px!important;
}
.ap-sec-card h3{
  color:var(--rd-text-strong)!important;
}
.ap-sec-muted{
  color:var(--rd-muted)!important;
}
.ap-sec-input{
  border-color:var(--rd-border)!important;
  background:var(--rd-surface-2)!important;
  color:var(--rd-text)!important;
}
.ap-sec-status,
.ap-sec-device,
.ap-sec-note,
.ap-sec-secret{
  border-color:var(--rd-border)!important;
  background:var(--rd-surface-2)!important;
}

/* =========================================================
   REQUISITES tab — it previously had no dark theme at all
   ========================================================= */
.pay-details__hero,
.pay-details__card{
  border:1px solid var(--rd-border)!important;
  background:var(--rd-surface)!important;
  color:var(--rd-text)!important;
  box-shadow:var(--rd-shadow-xs)!important;
}
.pay-details__hero{
  background:linear-gradient(135deg,var(--rd-surface),color-mix(in srgb,var(--rd-primary) 4%,var(--rd-surface)))!important;
}
.pay-details__hero h2,
.pay-details__card h3{
  color:var(--rd-text-strong)!important;
}
.pay-details__hero p,
.pay-details__card p{
  color:var(--rd-muted)!important;
}
.pay-details__grid{
  gap:12px!important;
}
.pay-details__card{
  padding:16px!important;
  border-radius:16px!important;
}
.pay-details__link{
  min-height:38px!important;
  border-radius:10px!important;
  background:var(--rd-primary)!important;
  color:#fff!important;
  box-shadow:none!important;
}
.pay-details__list{
  gap:8px!important;
}
.pay-details__item{
  padding:11px 12px!important;
  border:1px solid var(--rd-border)!important;
  border-radius:11px!important;
  background:var(--rd-surface-2)!important;
  color:var(--rd-text)!important;
}

/* =========================================================
   DARK MODE — explicit overrides against old local CSS
   ========================================================= */
html[data-theme="dark"] .az-settings-hero,
html[data-theme="dark"] .az-card,
html[data-theme="dark"] .az-tabs,
html[data-theme="dark"] .ap-sec-tabs,
html[data-theme="dark"] .pay-details__tabs{
  background:#132236!important;
  border-color:#2a3e57!important;
}
html[data-theme="dark"] .az-profile-badge,
html[data-theme="dark"] .az-note,
html[data-theme="dark"] .az-action,
html[data-theme="dark"] .az-check{
  background:#17283b!important;
  border-color:#30465f!important;
}
html[data-theme="dark"] .az-card h3,
html[data-theme="dark"] .az-profile-badge b,
html[data-theme="dark"] .az-row b,
html[data-theme="dark"] .az-note b,
html[data-theme="dark"] .az-action b,
html[data-theme="dark"] .az-check b{
  color:#edf3fa!important;
}
html[data-theme="dark"] .az-row span,
html[data-theme="dark"] .az-note,
html[data-theme="dark"] .az-action span,
html[data-theme="dark"] .az-check span,
html[data-theme="dark"] .az-form-foot small{
  color:#9eb0c4!important;
}
html[data-theme="dark"] .az-tabs a,
html[data-theme="dark"] .ap-sec-tabs a,
html[data-theme="dark"] .pay-details__tabs a{
  color:#9eb0c4!important;
}
html[data-theme="dark"] .az-tabs a.is-active,
html[data-theme="dark"] .ap-sec-tabs .on,
html[data-theme="dark"] .ap-sec-tabs a.is-active,
html[data-theme="dark"] .pay-details__tabs .on{
  background:#1d314a!important;
  color:#abc0e2!important;
  box-shadow:inset 0 0 0 1px #354e6c!important;
}
html[data-theme="dark"] .az-btn,
html[data-theme="dark"] .pay-details__link{
  background:#607eaf!important;
  border-color:#708cba!important;
}
html[data-theme="dark"] .az-btn:hover,
html[data-theme="dark"] .pay-details__link:hover{
  background:#6c88b7!important;
}

/* Light mode: avoid giant pure-white notification strips too */
html:not([data-theme="dark"]) .az-check{
  background:#f7f9fc!important;
  border-color:#dce5ef!important;
}
html:not([data-theme="dark"]) .az-profile-badge,
html:not([data-theme="dark"]) .az-note,
html:not([data-theme="dark"]) .az-action{
  background:#f7f9fc!important;
  border-color:#dce5ef!important;
}

@media(max-width:980px){
  .az-settings-grid,
  .pay-details__grid{
    grid-template-columns:1fr!important;
  }
}
@media(max-width:560px){
  .az-tabs,
  .ap-sec-tabs,
  .pay-details__tabs{
    display:grid!important;
    grid-template-columns:1fr!important;
  }
  .az-tabs a,
  .ap-sec-tabs a,
  .pay-details__tabs a{
    width:100%!important;
  }
  .az-card,
  .ap-sec-card,
  .pay-details__card{
    padding:14px!important;
  }
}