/* ================================================================
   PAYLANCE — UI Fixes v2.0  (адаптировано под текущую версию)
   Подключать последним на каждой странице:
   <link rel="stylesheet" href="css/ui-fixes.css?v=1">
   ================================================================ */

/* ── Geist Sans — единый шрифт на всех страницах ─────────────── */
/* ── Токены ──────────────────────────────────────────────────── */
:root {
  --font-sans: 'Geist Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, monospace;
  --pf: var(--font-sans);
  --focus-clr:  #0071E3;
  --focus-ring: 0 0 0 3px rgba(0,113,227,.18);
}

/* ── Единый шрифт везде ──────────────────────────────────────── */
body { font-family: var(--pf) !important; }

/* Исключения — моноширинные элементы */
code, pre, kbd,
.deal-hero__id,
.deal-hero__amount,
.deal-timeline__badge,
.kyc-drop__fname {
  font-family: var(--font-mono) !important;
}

/* ── Кнопки — корректный layout ──────────────────────────────── */
button { font-family: var(--pf); cursor: pointer; }

button:focus        { outline: none; }
button:focus-visible { outline: none; box-shadow: var(--focus-ring); }

/* ── Focus ring — единый стиль ───────────────────────────────── */
/* ── Валидация форм (pre-launch) ─────────────────────────────── */
input.pl-invalid,
textarea.pl-invalid,
select.pl-invalid {
  border-color: #DC2626 !important;
  box-shadow: 0 0 0 3px rgba(220,38,38,.12) !important;
}
.pl-field-err {
  display: block;
  margin-top: 6px;
  font: 500 12px/1.4 var(--pf);
  color: #DC2626;
}

input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: none;
  border-color: var(--focus-clr) !important;
  box-shadow: var(--focus-ring) !important;
}

/* Placeholder — единый цвет */
::placeholder { color: #AEAEB2 !important; opacity: 1; }

/* ── Карточки — border-radius ────────────────────────────────── */
.lst  { border-radius: 16px !important; }
.shop-card,
.factory-card,
.service-card { border-radius: 16px; }

/* ── Скроллбар — скрывать везде где overflow-x ───────────────── */
.hp-nav,
.type-nav__row,
.cat-filters__chips,
.cat-filters__types,
.cat-filters__cond,
.shops {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.hp-nav::-webkit-scrollbar,
.type-nav__row::-webkit-scrollbar,
.cat-filters__chips::-webkit-scrollbar,
.shops::-webkit-scrollbar { display: none; }

/* ── Валидация ───────────────────────────────────────────────── */
input.is-error, select.is-error, textarea.is-error {
  border-color: #E11D48 !important;
  box-shadow: 0 0 0 3px rgba(225,29,72,.12) !important;
}
input.is-ok { border-color: #34C759 !important; }

/* ── Адаптивность ────────────────────────────────────────────── */
@media (max-width: 640px) {
  .pl-chat  { right: 12px; bottom: 80px; }
  .pl-stream { left: 12px; bottom: 80px; max-width: calc(100vw - 100px); }
}

/* ── Hamburger / Mobile menu ─────────────────────────────────── */
.hp-burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 36px; height: 36px;
  border: none; background: none; cursor: pointer;
  padding: 6px; border-radius: 8px;
  transition: background .15s;
  flex-shrink: 0;
}
.hp-burger:hover { background: rgba(0,0,0,.06); }
.hp-burger span {
  display: block; width: 18px; height: 2px;
  background: #1D1D1F; border-radius: 2px;
  transition: all .25s ease;
  pointer-events: none;
}
.hp-burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hp-burger.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hp-burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile drawer */
.hp-mob-menu {
  display: none;
  position: fixed; inset: 0;
  background: rgba(255,255,255,.98);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  z-index: 9998;
  flex-direction: column;
  padding: 80px 24px 40px;
  gap: 2px;
  overflow-y: auto;
}
.hp-mob-menu.is-open { display: flex; animation: mobSlideIn .22s ease; }
@keyframes mobSlideIn {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.hp-mob-menu__link {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 4px;
  font: 600 19px/1 var(--pf);
  color: #1D1D1F; text-decoration: none;
  border-bottom: 1px solid #F0F0F5;
  transition: color .15s;
}
.hp-mob-menu__link:hover { color: #0071E3; }
.hp-mob-menu__link svg { color: #D2D2D7; }
.hp-mob-menu__cta {
  display: block; margin-top: 24px; padding: 16px;
  background: #1D1D1F; color: #fff;
  border-radius: 14px; font: 700 16px/1 var(--pf);
  text-decoration: none; text-align: center;
  transition: background .15s;
}
.hp-mob-menu__cta:hover { background: #000; }
.hp-mob-menu__close {
  position: fixed; top: 18px; right: 20px;
  width: 36px; height: 36px; border-radius: 50%;
  background: #F2F2F7; border: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: #1D1D1F; font-size: 20px; z-index: 9999;
}

@media (max-width: 768px) {
  .hp-burger { display: flex !important; }
  .hp-icon-btn { display: none !important; }
  .hp-user-chip__name { display: none; }
  .hp-loc { display: none; }
}
