/**
 * AXIOTRADE — unified responsive layout
 * Devices: iPhone SE–Pro Max, Samsung S10–S24, Z Fold/Flip, Pixel, OnePlus
 * Widths: 320px (SE) · 360px (Galaxy S) · 390–430px (iPhone) · 344–374px (Fold cover) · 768–884px (Fold inner)
 */
:root {
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --shell-pad-x: max(0.85rem, var(--safe-left), var(--safe-right));
  --touch-min: 44px;
  --content-max-tablet: 720px;
  --content-max-fold: 840px;
}

/* Prevent iOS zoom on inputs */
@media (max-width: 480px) {
  input,
  select,
  textarea {
    font-size: 16px !important;
  }
}

/* ─── Client dashboard ─── */
.wallet-app-body {
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

.wallet-app,
.wallet-shell,
.wallet-main,
.wallet-panel,
.dash-home,
.dash-home-priority,
.wallet-card,
.dash-balance-card,
.dash-news-hub {
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.wallet-app {
  overflow-x: clip;
  width: 100%;
}

.wallet-header {
  padding-top: max(0.5rem, var(--safe-top));
  padding-left: var(--shell-pad-x);
  padding-right: var(--shell-pad-x);
}

.wallet-main {
  padding-left: var(--shell-pad-x);
  padding-right: var(--shell-pad-x);
  padding-bottom: calc(5.25rem + var(--safe-bottom));
  max-width: 100%;
  overflow-x: hidden;
}

.wallet-sidebar {
  padding-top: max(0.75rem, var(--safe-top));
  padding-bottom: max(0.75rem, var(--safe-bottom));
  width: min(88vw, 300px);
  max-width: 300px;
}

.wallet-sidebar-link,
.wallet-sidebar-logout,
.wallet-cta-btn,
.wallet-back-btn,
.wallet-topbar-menu,
.wallet-icon-btn {
  min-height: var(--touch-min);
  touch-action: manipulation;
}

.wallet-bottom-nav {
  left: 0;
  right: 0;
  transform: none;
  width: 100%;
  max-width: 100%;
  padding-left: max(0.45rem, var(--safe-left));
  padding-right: max(0.45rem, var(--safe-right));
  padding-top: 0.4rem;
  gap: 0;
  box-sizing: border-box;
}

.wallet-bottom-nav .wallet-nav-btn {
  flex: 1 1 0;
  min-width: 0;
  max-width: none !important;
  padding: 0.3rem 0.08rem;
  font-size: 0.54rem;
  letter-spacing: -0.01em;
  overflow: hidden;
}

.wallet-bottom-nav .wallet-nav-btn svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.wallet-primary-cta,
.wallet-primary-cta--triple {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.55rem;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.wallet-primary-cta--triple .wallet-cta-btn {
  width: 100%;
  min-height: 48px;
  font-size: 0.82rem;
  padding: 0.85rem 0.65rem;
  box-sizing: border-box;
}

.wallet-primary-cta--triple .wallet-cta-btn svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.wallet-primary-cta--triple .wallet-cta-btn span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dash-hero {
  flex-wrap: wrap;
  gap: 0.65rem;
  max-width: 100%;
}

.dash-hero-tier {
  margin-top: 0;
}

.dash-news-hub-head {
  flex-wrap: wrap;
  align-items: flex-start;
}

.dash-news-hub-head > div {
  min-width: 0;
  flex: 1 1 60%;
}

.dash-news-hub-badge {
  flex-shrink: 0;
  max-width: 42%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dash-news-title {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.dash-home-priority {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.dash-balance-card {
  padding: 1rem 1rem 1.05rem;
  margin-inline: 0;
}

.dash-balance-header {
  padding-right: 3.25rem;
}

.dash-stats-row {
  grid-template-columns: 1fr;
  gap: 0.4rem;
}

.dash-stat-pill {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  min-height: 44px;
  padding: 0.55rem 0.75rem;
}

.dash-stat-pill span {
  text-align: right;
  font-size: 0.62rem;
}

.wallet-balance-amount {
  font-size: clamp(1.75rem, 8vw, 2.5rem) !important;
  word-break: break-word;
}

.dash-hero-title {
  font-size: clamp(1.15rem, 5vw, 1.45rem);
  line-height: 1.25;
}

.wallet-card,
.dash-balance-card,
.wallet-panel .wallet-card {
  border-radius: 14px;
}

.nx-table-wrap,
.wallet-markets-scroll,
.admin-dep-table-fallback,
.admin-wd-table-fallback {
  -webkit-overflow-scrolling: touch;
  overflow-x: auto;
  max-width: 100%;
}

.wallet-back-bar {
  padding-left: 0;
  padding-right: 0;
}

.wallet-back-bar h1 {
  font-size: 1rem;
}

/* ─── Admin + support shell (shared dash-shell) ─── */
.dash-shell-body {
  overflow-x: hidden;
}

.dash-mobile-bar {
  padding-top: max(0.65rem, var(--safe-top));
  padding-left: var(--shell-pad-x);
  padding-right: var(--shell-pad-x);
}

.dash-shell-sidebar {
  width: min(92vw, 300px);
  max-width: 300px;
  padding-bottom: max(1rem, var(--safe-bottom));
}

.dash-nav-item,
.dash-nav-logout {
  min-height: var(--touch-min);
  touch-action: manipulation;
}

.dash-shell-content {
  padding-left: var(--shell-pad-x);
  padding-right: var(--shell-pad-x);
  padding-bottom: max(1.5rem, var(--safe-bottom));
  max-width: 100%;
}

.admin-stat-grid {
  gap: 0.65rem;
}

.admin-stat-card .stat-value {
  font-size: clamp(1.5rem, 6vw, 2rem);
}

.nx-table-wrap table {
  min-width: 520px;
}

.admin-credit-row {
  flex-direction: column;
  align-items: stretch !important;
  gap: 0.35rem;
}

.admin-credit-row input {
  width: 100% !important;
  min-height: 36px;
}

.admin-credit-row .btn {
  width: 100%;
  min-height: 36px;
}

.admin-dep-review-actions,
.admin-wd-review-actions {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.admin-dep-review-actions .btn,
.admin-wd-review-actions .btn {
  width: 100%;
  min-height: var(--touch-min);
}

.admin-wd-addr-edit-row {
  flex-direction: column;
  align-items: stretch;
}

.admin-wd-save-btn {
  margin-left: 0 !important;
  width: 100%;
}

.admin-user-detail-grid {
  grid-template-columns: 1fr;
}

.admin-modal {
  padding: max(0.5rem, var(--safe-top)) max(0.5rem, var(--safe-right)) max(0.5rem, var(--safe-bottom)) max(0.5rem, var(--safe-left));
  align-items: flex-end;
}

.admin-modal-dialog {
  width: 100%;
  max-height: min(92dvh, 720px);
  border-radius: 16px 16px 0 0;
}

/* ─── Support desk ─── */
.support-desk-page {
  overflow-x: hidden;
}

.support-desk-top {
  padding-top: max(0.75rem, var(--safe-top));
  padding-left: var(--shell-pad-x);
  padding-right: var(--shell-pad-x);
  flex-wrap: wrap;
}

.support-desk-top-actions {
  width: 100%;
  justify-content: flex-end;
}

.support-desk-top-actions .btn-sm {
  min-height: 36px;
  padding: 0.4rem 0.65rem;
  font-size: 0.72rem;
}

.support-mobile-tabs {
  position: sticky;
  top: 0;
  z-index: 15;
  padding-left: var(--safe-left);
  padding-right: var(--safe-right);
}

.support-mobile-tab {
  min-height: var(--touch-min);
  touch-action: manipulation;
}

.support-desk-layout {
  min-height: calc(100dvh - 120px - var(--safe-top) - var(--safe-bottom));
}

.support-chat-compose {
  flex-wrap: wrap;
  padding-bottom: max(0.75rem, var(--safe-bottom));
}

.support-chat-compose textarea {
  width: 100%;
  min-height: 48px;
}

.support-chat-compose .btn {
  width: 100%;
  min-height: var(--touch-min);
}

.support-dep-actions .btn {
  flex: 1 1 auto;
  min-height: 40px;
}

/* Language picker offsets per shell */
.wallet-shell-body #langPickerMount,
.support-desk-page #langPickerMount {
  top: max(3.5rem, calc(var(--safe-top) + 2.75rem));
}

/* Dashboard home — lang picker clear of balance (wins over i18n-rtl shell rules) */
body.wallet-app-body.wallet-shell-body #langPickerMount {
  top: max(0.55rem, var(--safe-top)) !important;
  right: max(0.55rem, var(--safe-right)) !important;
  left: auto !important;
  z-index: 10150 !important;
}

body.wallet-app-body.wallet-shell-body #langPickerMount .lang-picker-trigger {
  padding: 0.3rem 0.5rem;
  min-height: 2rem;
  font-size: 0.65rem;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.55);
}

/* Lang picker stays above modals; nudge left when deposit sheet is open */
body.wallet-modal-open #langPickerMount {
  z-index: 10150 !important;
  top: max(0.55rem, var(--safe-top)) !important;
  right: max(3.35rem, calc(var(--safe-right) + 2.65rem)) !important;
}

body.wallet-modal-open .lang-picker-menu {
  z-index: 10151;
}

.admin-shell #langPickerMount {
  top: max(3.25rem, calc(var(--safe-top) + 2.5rem));
}

/* ─── All phones: never 3-across until tablet ─── */
@media (max-width: 639px) {
  .wallet-primary-cta--triple {
    grid-template-columns: 1fr !important;
    gap: 0.5rem;
  }

  .wallet-primary-cta--triple .wallet-cta-btn--trade {
    grid-column: auto !important;
  }

  .wallet-cta-btn {
    max-width: 100%;
  }
}

/* ─── Mid phones (iPhone 12+, Pixel): 2+1 CTA grid ─── */
@media (min-width: 390px) and (max-width: 639px) {
  .wallet-primary-cta--triple {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .wallet-primary-cta--triple .wallet-cta-btn--trade {
    grid-column: 1 / -1 !important;
  }
}

/* ─── Deposit wizard — all phones ─── */
@media (max-width: 640px) {
  .deposit-wizard-modal.wallet-modal {
    align-items: flex-end;
    padding: 0;
    padding-bottom: var(--safe-bottom);
  }

  .deposit-wizard-modal-card {
    width: 100%;
    max-width: 100%;
    margin: 0;
    border-radius: 18px 18px 0 0;
    max-height: min(92dvh, 100%);
  }

  .deposit-wizard-pop-scroll,
  .deposit-wizard-pop-scroll--single,
  .deposit-wizard-pop-scroll--step2,
  .deposit-wizard-pop-scroll--step3 {
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding-bottom: max(0.85rem, var(--safe-bottom));
  }

  .deposit-wizard-modal-card--step2,
  .deposit-wizard-modal-card--step3 {
    max-height: min(96dvh, 100%);
  }

  .deposit-wizard-pop--step2,
  .deposit-wizard-pop--step3 {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

  .deposit-wizard-pop-foot--sticky {
    flex-shrink: 0;
  }

  .deposit-net-grid.deposit-network-tabs--pop {
    grid-template-columns: 1fr;
  }

  .deposit-generate-wrap--wizard {
    margin-bottom: max(0.5rem, var(--safe-bottom));
  }

  .btn-generate-address {
    width: 100%;
    min-height: var(--touch-min);
  }
}

/* ─── Samsung Galaxy S21/S22/S23/S24 (360–384px) ─── */
@media (min-width: 344px) and (max-width: 389px) {
  :root {
    --shell-pad-x: max(0.75rem, var(--safe-left), var(--safe-right));
  }

  .wallet-primary-cta--triple .wallet-cta-btn {
    font-size: 0.8rem;
    padding: 0.8rem 0.55rem;
    gap: 0.35rem;
  }

  .dash-balance-header {
    padding-right: 2.85rem;
  }

  .dash-stat-pill span {
    font-size: 0.58rem;
    max-width: 58%;
    line-height: 1.2;
  }
}

/* ─── Samsung Galaxy narrow + Z Fold cover ─── */
@media (max-width: 390px) {
  .dash-stat-pill strong {
    font-size: 0.9rem;
  }

  .support-desk-brand strong {
    font-size: 0.85rem;
  }

  .support-desk-top-actions {
    gap: 0.35rem;
  }

  .dash-page-header h1 {
    font-size: 1.2rem;
  }
}

/* ─── iPhone SE / very small ─── */
@media (max-width: 360px) {
  .wallet-balance-amount {
    font-size: 1.65rem !important;
  }

  .wallet-cta-btn {
    font-size: 0.78rem;
    padding: 0.65rem 0.5rem;
  }

  .wallet-bottom-nav .wallet-nav-btn {
    font-size: 0.48rem;
    gap: 0.12rem;
  }

  .wallet-bottom-nav .wallet-nav-btn svg {
    width: 18px;
    height: 18px;
  }

  .support-mobile-tab {
    font-size: 0.65rem;
    padding: 0.5rem 0.2rem;
  }

  .admin-stat-card {
    padding: 1rem;
  }
}

/* ─── Tablet+ restore full 3-column CTAs ─── */
@media (min-width: 640px) {
  .wallet-primary-cta--triple {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .wallet-primary-cta--triple .wallet-cta-btn--trade {
    grid-column: auto !important;
  }

  .dash-stats-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dash-stat-pill {
    flex-direction: column;
    align-items: center;
    text-align: center;
    min-height: 58px;
  }

  .dash-stat-pill span {
    text-align: center;
    max-width: none;
  }
}

/* ─── Z Fold inner / large phones unfolded (700–1023px) ─── */
@media (min-width: 700px) and (max-width: 1023px) {
  .wallet-main {
    max-width: var(--content-max-fold);
    margin-inline: auto;
    padding-left: max(1.25rem, var(--shell-pad-x));
    padding-right: max(1.25rem, var(--shell-pad-x));
  }

  .wallet-bottom-nav {
    max-width: var(--content-max-fold);
    left: 50%;
    transform: translateX(-50%);
  }

  .wallet-home-split,
  .landing-home-pair {
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }

  .dash-stats-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .dash-stat-pill {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
}

/* ─── Samsung Z Fold / dual-screen spanning (cover + inner edge) ─── */
@media (spanning: single-fold-vertical) {
  .wallet-main {
    max-width: var(--content-max-fold);
    margin-inline: auto;
  }
}

@media (horizontal-viewport-segments: 2) {
  .wallet-main,
  .wallet-bottom-nav {
    max-width: min(100%, var(--content-max-fold));
    margin-inline: auto;
  }
}

@media (min-width: 480px) {
  .admin-dep-review-actions,
  .admin-wd-review-actions {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .admin-dep-review-actions .btn,
  .admin-wd-review-actions .btn {
    width: auto;
  }

  .support-chat-compose {
    flex-wrap: nowrap;
  }

  .support-chat-compose .btn {
    width: auto;
  }
}

@media (min-width: 640px) {
  .admin-user-detail-grid {
    grid-template-columns: 1fr 1fr;
  }

  .admin-credit-row {
    flex-direction: row;
    align-items: center !important;
  }

  .admin-credit-row input {
    width: 4.5rem !important;
  }

  .admin-credit-row .btn {
    width: auto;
  }

  .admin-modal {
    align-items: center;
  }

  .admin-modal-dialog {
    border-radius: 16px;
  }
}

/* ─── Auth pages (login / register) ─── */
.auth-page .auth-panel {
  padding-left: var(--shell-pad-x);
  padding-right: var(--shell-pad-x);
  padding-bottom: max(1rem, var(--safe-bottom));
}

.auth-page .auth-card {
  max-width: 100%;
}

.auth-page .auth-submit {
  min-height: var(--touch-min);
  width: 100%;
}

.auth-page #langPickerMount.lang-picker-mount--fixed {
  top: max(0.65rem, var(--safe-top));
}

@media (max-width: 768px) {
  .auth-page .auth-visual {
    display: none;
  }

  .auth-page .auth-shell--split {
    grid-template-columns: 1fr;
  }
}

/* ─── iPhone 12–15 / Pro Max (390–430px) ─── */
@media (min-width: 390px) and (max-width: 440px) {
  .wallet-balance-amount {
    font-size: clamp(1.85rem, 7.5vw, 2.35rem) !important;
  }

  .wallet-bottom-nav .wallet-nav-btn {
    font-size: 0.56rem;
  }
}

/* ─── Landscape phones — reduce vertical waste ─── */
@media (max-height: 500px) and (orientation: landscape) {
  .support-chat-msgs {
    min-height: 35dvh;
  }

  .dash-hero {
    margin-bottom: 0.5rem;
  }

  .wallet-main {
    padding-bottom: calc(4.5rem + var(--safe-bottom));
  }

  .dash-stats-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.35rem;
  }

  .dash-stat-pill {
    flex-direction: column;
    min-height: auto;
    padding: 0.4rem 0.35rem;
  }

  .dash-stat-pill span {
    text-align: center;
    font-size: 0.52rem;
  }
}

/* ─── Global: landing, performance, legal, all public pages ─── */
html {
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
}

body {
  overflow-x: hidden;
  max-width: 100vw;
}

.landing-page,
.page-with-nav,
.legal-page {
  overflow-x: hidden;
}

.site-header {
  padding-top: var(--safe-top);
}

.site-header .nav-inner,
.site-header .nav-inner--auth {
  padding-left: var(--shell-pad-x);
  padding-right: var(--shell-pad-x);
}

.container {
  padding-left: var(--shell-pad-x);
  padding-right: var(--shell-pad-x);
  max-width: 100%;
  box-sizing: border-box;
}

.btn,
.btn-nav,
.btn-primary,
.btn-outline,
.btn-hero-main,
.btn-hero-secondary {
  min-height: var(--touch-min);
  touch-action: manipulation;
}

/* Landing homepage */
.landing-page .hero-coin {
  padding-top: max(5.5rem, calc(var(--safe-top) + 4rem));
  padding-bottom: max(2rem, var(--safe-bottom));
}

.landing-page .hero-coin-grid {
  gap: 1.25rem;
}

.landing-page .hero-copy h1 {
  font-size: clamp(1.45rem, 6.5vw, 2.4rem);
  line-height: 1.15;
}

.landing-page .hero-lead {
  font-size: clamp(0.88rem, 3.8vw, 1.05rem);
}

.landing-page .hero-metrics {
  grid-template-columns: 1fr;
  gap: 0.5rem;
}

.landing-page .hero-cta-row {
  flex-direction: column;
  align-items: stretch;
}

.landing-page .hero-cta-row .btn {
  width: 100%;
  justify-content: center;
}

.landing-page .hero-trust-list {
  flex-direction: column;
  gap: 0.35rem;
}

.landing-page .trust-strip {
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  padding: 1rem var(--shell-pad-x);
}

.landing-page .market-section .container,
.landing-page .landing-section-inner {
  overflow-x: hidden;
}

.landing-page .market-table-wrap,
.landing-page .nx-table-wrap {
  -webkit-overflow-scrolling: touch;
  overflow-x: auto;
  max-width: 100%;
}

/* Landing — lang picker lives inside nav-actions, not fixed overlay */
.landing-page #langPickerMount.lang-picker-mount--nav {
  position: static;
}

/* Performance page */
.page-with-nav {
  padding-top: max(5rem, calc(var(--safe-top) + 3.5rem));
  padding-bottom: max(2rem, var(--safe-bottom));
}

.page-with-nav .card-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.65rem;
}

.page-with-nav .card-grid .stat-value {
  font-size: clamp(1rem, 4.5vw, 1.35rem);
  word-break: break-word;
}

.perf-dual-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

.perf-feed-card {
  min-width: 0;
}

.perf-feed-card .exec-list {
  max-height: min(50vh, 420px);
  -webkit-overflow-scrolling: touch;
}

.market-search-input {
  width: 100%;
  min-height: var(--touch-min);
  box-sizing: border-box;
}

.perf-cta-block {
  padding: 1.25rem 0;
  text-align: center;
}

.perf-cta-block .btn-perf-cta {
  width: 100%;
  max-width: 100%;
}

/* Legal pages */
.legal-page .legal-shell {
  padding: max(5rem, calc(var(--safe-top) + 4rem)) var(--shell-pad-x) max(2.5rem, var(--safe-bottom));
  grid-template-columns: 1fr;
  gap: 0;
}

.legal-page .legal-toc {
  max-height: none;
}

.legal-page .legal-main {
  padding-top: 1rem;
}

.legal-page .legal-nav-links a {
  min-height: 40px;
}

.legal-page #langPickerMount.lang-picker-mount--nav {
  position: static;
}

/* Register extras */
.auth-page--register .reg-stepper {
  flex-wrap: wrap;
  gap: 0.35rem;
}

.auth-page--register .reg-row-2,
.auth-page--register .reg-phone-row {
  grid-template-columns: 1fr;
}

.auth-page--register .auth-card-wrap {
  max-width: 100%;
  padding: 0 0.25rem;
}

/* Footer */
footer .container,
.footer-grid {
  padding-left: var(--shell-pad-x);
  padding-right: var(--shell-pad-x);
}

.footer-grid {
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

@media (min-width: 480px) {
  .landing-page .hero-metrics {
    grid-template-columns: repeat(2, 1fr);
  }

  .page-with-nav .card-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 640px) {
  .landing-page .hero-metrics {
    grid-template-columns: repeat(3, 1fr);
  }

  .landing-page .hero-cta-row {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .landing-page .hero-cta-row .btn {
    width: auto;
  }

  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .perf-dual-grid {
    grid-template-columns: 1fr 1fr;
  }

  .page-with-nav .card-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (max-width: 390px) {
  .landing-page .hero-metric-value {
    font-size: clamp(1.25rem, 7vw, 1.65rem);
  }

  .page-with-nav .card-grid {
    grid-template-columns: 1fr;
  }

  .legal-page .legal-hero h1 {
    font-size: 1.35rem;
  }
}

@media (max-width: 360px) {
  .nav-actions .btn-nav {
    padding: 0.45rem 0.65rem;
    font-size: 0.72rem;
  }
}
