/* UBKAZ v12 — global responsive shell + P2P/wallet visibility fixes */
:root{--v12-header:72px;--v12-gold:#f4c84a;--v12-panel:#0d1a26;--v12-line:rgba(255,255,255,.09)}
html,body{max-width:100%;overflow-x:hidden}
body{font-weight:400!important}
body strong,body b,body h1,body h2,body h3,body h4,body h5,body h6,body button,body .btn,body label,body .eyebrow,body .pill,body .phase-badge,body .card-title{font-weight:600!important}
*,*::before,*::after{border-radius:0!important}

/* ---------- Universal app header: compact on every viewport ---------- */
.app-header{height:var(--v12-header)!important;min-height:var(--v12-header)!important;padding:0!important;position:sticky!important;top:0!important;z-index:120!important;background:rgba(6,17,27,.95)!important;border-bottom:1px solid var(--v12-line)!important;backdrop-filter:blur(16px)!important}
.app-header .app-header-inner{height:100%!important;width:min(1320px,calc(100% - 32px))!important;margin:0 auto!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:12px!important;flex-direction:row!important;min-width:0!important}
.app-brand{display:flex!important;align-items:center!important;gap:9px!important;flex:0 0 auto!important;min-width:0!important}
.app-brand img{width:40px!important;height:40px!important;object-fit:cover!important}
.app-brand strong{font-size:17px!important;white-space:nowrap!important}
.header-user-summary{display:flex;align-items:center;gap:9px;margin-left:auto;min-width:0;max-width:240px}
.header-user-summary .avatar{width:34px;height:34px;flex:0 0 34px;font-size:11px}
.header-user-copy{display:grid;min-width:0;line-height:1.15}
.header-user-copy strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.header-user-copy small{font-size:9px;color:#7890a5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mobile-header-actions{display:flex!important;align-items:center!important;gap:7px!important;margin-left:0!important;flex:0 0 auto!important}
.mobile-qr-shortcut,.mobile-menu-toggle{display:grid!important;place-items:center!important;width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important;padding:0!important;border:1px solid rgba(255,255,255,.10)!important;background:#0f1e2b!important;color:#dce6ee!important;cursor:pointer!important}
.mobile-qr-shortcut{background:linear-gradient(145deg,#ffe477,#d8a31b)!important;color:#151006!important;border-color:transparent!important}
.mobile-qr-shortcut svg{width:20px!important;height:20px!important}
.mobile-menu-toggle span{width:18px!important;height:2px!important;margin:2px 0!important;background:#dce6ee!important;display:block!important}
.mobile-menu-toggle.is-open span:nth-child(1),.mobile-menu-toggle.is-open span:nth-child(2),.mobile-menu-toggle.is-open span:nth-child(3){transform:none!important;opacity:1!important}

/* Drawer is always a drawer — never a long overflowing desktop nav. */
.app-menu-backdrop{display:block!important;position:fixed!important;inset:0!important;background:rgba(1,7,12,.68)!important;backdrop-filter:blur(4px)!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;transition:opacity .2s ease,visibility .2s ease!important;z-index:128!important}
.app-menu-backdrop.is-open{opacity:1!important;visibility:visible!important;pointer-events:auto!important}
.app-menu{display:flex!important;position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:auto!important;width:min(390px,92vw)!important;max-width:390px!important;height:100dvh!important;margin:0!important;padding:18px 16px calc(20px + env(safe-area-inset-bottom))!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;gap:0!important;overflow-y:auto!important;overflow-x:hidden!important;background:linear-gradient(180deg,#0b1824,#08131d)!important;border:0!important;border-left:1px solid rgba(255,255,255,.10)!important;box-shadow:-24px 0 60px rgba(0,0,0,.48)!important;transform:translateX(104%)!important;visibility:visible!important;opacity:1!important;pointer-events:none!important;transition:transform .24s ease!important;z-index:130!important}
.app-menu.is-open{transform:translateX(0)!important;pointer-events:auto!important}
.app-drawer-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;padding:4px 0 16px!important;margin:0 0 14px!important;border-bottom:1px solid rgba(255,255,255,.075)!important}
.app-menu .app-menu-user{display:flex!important;align-items:center!important;gap:11px!important;padding:0!important;margin:0!important;border:0!important;min-width:0!important}
.app-menu .app-menu-user .avatar{display:grid!important;width:42px!important;height:42px!important;flex:0 0 42px!important}
.app-menu-user-copy{display:grid!important;gap:2px!important;min-width:0!important}
.app-menu-user-copy strong{font-size:13px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.app-menu-user-copy span{display:block!important;color:#758da1!important;font-size:9px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.app-drawer-close{display:grid!important;place-items:center!important;width:40px!important;height:40px!important;min-width:40px!important;border:1px solid rgba(255,255,255,.09)!important;background:rgba(255,255,255,.035)!important;color:#b7c5d0!important;cursor:pointer!important}
.app-menu-section{display:flex!important;flex-direction:column!important;gap:6px!important;margin-bottom:16px!important}
.app-menu-label{display:block!important;padding:0 8px 4px!important;color:#667f93!important;font-size:8px!important;letter-spacing:.11em!important;text-transform:uppercase!important}
.app-menu-icon{display:block!important;width:20px!important;height:20px!important;flex:0 0 20px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important}
.app-menu .btn,.app-menu .mini-btn{width:100%!important;min-height:46px!important;padding:10px 11px!important;margin:0!important;justify-content:flex-start!important;gap:10px!important;border:1px solid transparent!important;background:transparent!important;color:#afbfcc!important;font-size:11px!important;box-shadow:none!important;text-align:left!important;white-space:normal!important}
.app-menu .btn span,.app-menu .mini-btn span{min-width:0!important}
.app-menu .btn small,.app-menu .mini-btn small{display:block!important;margin-left:auto!important;max-width:130px!important;color:#627b90!important;font-size:8px!important;text-align:right!important;line-height:1.3!important}
.app-menu .btn.is-active,.app-menu .mini-btn.is-active{background:rgba(246,200,72,.10)!important;border-color:rgba(246,200,72,.22)!important;color:#f5d15e!important}
.app-menu-logout{margin-top:auto!important;color:#ff9da4!important;border-top:1px solid rgba(255,255,255,.07)!important;padding-top:13px!important}
body.menu-open{overflow:hidden!important}

/* ---------- P2P layout ---------- */
.p2p-container{width:min(1280px,calc(100% - 40px))!important;max-width:1280px!important;margin:0 auto!important}
.p2p-page .dash-main{padding-top:34px!important}
.p2p-page .dash-hero{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:18px!important;flex-wrap:wrap!important}
.p2p-page .dash-hero>div{min-width:0!important;max-width:820px!important}
.p2p-page .dash-hero h1{font-size:clamp(34px,4.2vw,52px)!important;line-height:1.05!important}
.p2p-rate-strip{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:1px!important;background:var(--v12-line)!important;border:1px solid var(--v12-line)!important;margin:0 0 16px!important}
.p2p-rate-strip>div{min-width:0!important;background:#0f1d2a!important;padding:16px!important}
.p2p-rate-strip span,.p2p-rate-strip small{display:block!important}
.p2p-rate-strip span{font-size:9px!important;color:#7d92a5!important;letter-spacing:.06em!important}
.p2p-rate-strip strong{display:block!important;font-size:16px!important;margin:7px 0 3px!important;overflow-wrap:anywhere!important;line-height:1.35!important}
.p2p-rate-strip small{font-size:9px!important;color:#6f8498!important}
.p2p-wallet-summary{display:grid!important;grid-template-columns:1fr 1fr!important;gap:1px!important;background:var(--v12-line)!important;border:1px solid var(--v12-line)!important;margin:0 0 20px!important}
.p2p-wallet-summary>div{min-width:0!important;padding:15px 16px!important;background:#0c1925!important}
.p2p-wallet-summary span{display:block!important;color:#7f94a8!important;font-size:9px!important;letter-spacing:.06em!important;margin-bottom:6px!important}
.p2p-wallet-summary code{display:block!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word!important;color:#e8eef3!important;font-size:11px!important;line-height:1.55!important}
.p2p-wallet-summary .wallet-not-set{color:#ff9ca2!important}
.p2p-wallet-summary a{color:#f4ca52!important;font-size:10px!important}
.p2p-main-grid{display:grid!important;grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr)!important;gap:20px!important;align-items:start!important;width:100%!important}
.p2p-buy-panel,.p2p-sell-panel{min-width:0!important;width:100%!important}
.p2p-offer{display:grid!important;grid-template-columns:minmax(150px,.65fr) minmax(260px,1fr) minmax(260px,.9fr)!important;gap:16px!important;align-items:center!important;min-width:0!important}
.p2p-offer>*{min-width:0!important}
.p2p-offer-data{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:9px!important}
.p2p-offer-data strong{overflow-wrap:anywhere!important}
.p2p-buy-form{display:grid!important;grid-template-columns:minmax(0,1fr) 90px 76px!important;gap:7px!important;min-width:0!important}
.p2p-buy-form input,.p2p-buy-form .btn{min-width:0!important;width:100%!important}
.p2p-sell-body form,.p2p-payment-box form{min-width:0!important}
.p2p-sell-body input,.p2p-sell-body select,.p2p-payment-box input{width:100%!important;max-width:100%!important}
.p2p-payment-box code{max-width:100%!important;overflow-wrap:anywhere!important;word-break:break-word!important}
.p2p-page .table-scroll{width:100%!important;max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}
.p2p-page .token-table{min-width:720px!important}

/* ---------- Wallet address visibility ---------- */
.wallet-address-inline{display:block!important;margin-top:7px!important;color:#f1c84d!important;font-size:10px!important;line-height:1.45!important;overflow-wrap:anywhere!important;word-break:break-word!important}
.wallet-created-grid{display:grid!important;grid-template-columns:minmax(0,1fr) 180px!important;gap:20px!important;align-items:start!important;margin:18px 0!important}
.wallet-created-address{padding:16px!important;border:1px solid rgba(244,200,74,.25)!important;background:rgba(244,200,74,.045)!important;min-width:0!important}
.wallet-created-address span{display:block!important;color:#8da3b7!important;font-size:10px!important;letter-spacing:.07em!important;margin-bottom:7px!important}
.wallet-created-address strong,.wallet-created-address code{display:block!important;color:#f6d35e!important;font-size:13px!important;line-height:1.6!important;overflow-wrap:anywhere!important;word-break:break-word!important;white-space:normal!important}
.wallet-created-address .btn{margin-top:12px!important}
.wallet-created-qr{background:#fff!important;padding:10px!important;width:180px!important;max-width:100%!important;aspect-ratio:1/1!important;object-fit:contain!important}

/* ---------- Tablet ---------- */
@media(max-width:1100px){
  .p2p-main-grid{grid-template-columns:1fr!important}
  .p2p-offer{grid-template-columns:minmax(140px,.55fr) minmax(260px,1fr)!important}
  .p2p-buy-form{grid-column:1/-1!important;grid-template-columns:minmax(0,1fr) 110px 90px!important}
}
@media(max-width:900px){
  .header-user-summary{display:none!important}
  .app-header .app-header-inner{width:calc(100% - 24px)!important}
  .mobile-bottom-nav{display:grid!important;left:0!important;right:0!important;bottom:0!important;width:100%!important;height:68px!important}
  .p2p-container{width:calc(100% - 28px)!important}
  .p2p-rate-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .p2p-wallet-summary{grid-template-columns:1fr!important}
  .p2p-offer{grid-template-columns:1fr!important}
  .p2p-buy-form{grid-column:auto!important;grid-template-columns:minmax(0,1fr) 100px 90px!important}
  .p2p-offer-data{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .p2p-page .dash-main{padding-bottom:92px!important}
}
@media(max-width:650px){
  :root{--v12-header:64px}
  .app-header .app-header-inner{width:calc(100% - 20px)!important;gap:8px!important}
  .app-brand img{width:34px!important;height:34px!important}
  .app-brand strong{font-size:15px!important}
  .mobile-qr-shortcut,.mobile-menu-toggle{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important}
  .app-menu{width:min(340px,94vw)!important;padding:14px 12px calc(18px + env(safe-area-inset-bottom))!important}
  .p2p-container{width:calc(100% - 20px)!important}
  .p2p-page .dash-main{padding-top:22px!important}
  .p2p-page .dash-hero{align-items:flex-start!important;flex-direction:column!important}
  .p2p-page .dash-hero .btn{width:100%!important}
  .p2p-rate-strip{grid-template-columns:1fr!important}
  .p2p-buy-form{grid-template-columns:1fr!important}
  .p2p-buy-form .btn{grid-column:auto!important}
  .p2p-offer-data{grid-template-columns:1fr 1fr!important}
  .wallet-created-grid{grid-template-columns:1fr!important}
  .wallet-created-qr{justify-self:center!important;width:190px!important}
}
@media(max-width:390px){
  .app-brand strong{max-width:72px!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .p2p-offer-data{grid-template-columns:1fr!important}
  .p2p-page .token-table{min-width:640px!important}
}

/* ===== v14 PHP P2P responsiveness ===== */
@media (max-width:1180px){
  .p2p-rate-strip-v14{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .p2p-methods-layout{grid-template-columns:1fr!important}
  .p2p-method-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media (max-width:820px){
  .p2p-rate-strip-v14{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .p2p-filter-tabs{display:flex!important;flex-wrap:nowrap!important;padding:10px 12px!important}
  .p2p-method-list{grid-template-columns:1fr!important}
  .p2p-methods-card{padding:16px!important}
}
@media (max-width:560px){
  .p2p-rate-strip-v14{grid-template-columns:1fr!important}
  .p2p-methods-layout{gap:14px!important}
  .p2p-method-form .form-two{grid-template-columns:1fr!important}
  .p2p-method-head{align-items:flex-start!important}
  .p2p-payment-qr{grid-template-columns:70px 1fr!important;max-width:100%!important}
  .p2p-payment-qr img{width:70px!important;height:70px!important}
  .p2p-focus-order .p2p-order-summary{grid-template-columns:1fr!important}
}


/* =========================================================
   UBKAZ v18 — responsive header/drawer hotfix
   ========================================================= */
.app-header,
.app-header *{box-sizing:border-box!important}
.app-header .app-header-inner{
  width:min(1180px,calc(100% - 32px))!important;
  max-width:1180px!important;
  min-width:0!important;
}
.app-brand{overflow:hidden!important}
.app-brand strong{overflow:hidden!important;text-overflow:ellipsis!important}
.mobile-header-actions{margin-left:8px!important}
.app-drawer-close{
  display:grid!important;
  place-items:center!important;
  flex:0 0 40px!important;
  color:#d9e4ec!important;
}
.app-drawer-close svg{
  display:block!important;
  width:20px!important;
  height:20px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.app-menu{
  width:min(360px,90vw)!important;
  max-width:360px!important;
  overscroll-behavior:contain!important;
}
.app-menu .btn,.app-menu .mini-btn{min-width:0!important}
.app-menu .btn span,.app-menu .mini-btn span{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
@media(max-width:980px){
  .header-user-summary{display:none!important}
  .mobile-header-actions{margin-left:auto!important}
}
@media(max-width:620px){
  .app-header{height:62px!important;min-height:62px!important}
  .app-header .app-header-inner{width:calc(100% - 20px)!important;gap:8px!important}
  .app-brand img{width:34px!important;height:34px!important}
  .app-brand strong{font-size:14px!important}
  .mobile-qr-shortcut,.mobile-menu-toggle{
    width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;
  }
  .app-menu{
    width:calc(100vw - 18px)!important;
    max-width:none!important;
    padding-left:14px!important;
    padding-right:14px!important;
  }
  .app-menu .btn small,.app-menu .mini-btn small{display:none!important}
}
@media(max-width:380px){
  .app-brand strong{font-size:13px!important}
  .app-menu{width:100vw!important}
}