/* WhaleGold UI extensions: product groups and stable mobile navigation */
.wg-product-groups{
  display:flex;gap:9px;overflow-x:auto;overscroll-behavior-inline:contain;
  scrollbar-width:none;padding:5px 2px 14px;margin:4px 0 12px;
  scroll-snap-type:x proximity;
}
.wg-product-groups::-webkit-scrollbar{display:none}
.wg-product-group-btn{
  flex:0 0 auto;scroll-snap-align:start;border:1px solid #e8dfc8;background:#fff;
  color:#64748b;border-radius:16px;padding:10px 17px;font-weight:900;cursor:pointer;
  box-shadow:0 8px 22px rgba(15,23,42,.05);transition:background .2s,color .2s,border-color .2s,box-shadow .2s;
}
.wg-product-group-btn.active{
  background:linear-gradient(135deg,#092b24,#0f493c);color:#f4d675;border-color:#0f493c;
  box-shadow:0 11px 26px rgba(6,49,40,.20);
}
.wg-product-group-title{grid-column:1/-1;display:flex;align-items:center;gap:10px;margin:9px 2px 0;color:#8c681c}
.wg-product-group-title:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,rgba(212,175,55,.5),transparent)}
.wg-product-hidden{display:none!important}

/* آیتم فعال داخل کادر می‌ماند و هنگام اسکرول از نوار بیرون نمی‌پرد. */
.bottom-nav.bottom-nav-3{
  bottom:max(8px,env(safe-area-inset-bottom));transform:translate3d(-50%,0,0);
  backface-visibility:hidden;isolation:isolate;contain:layout paint;
}
.bottom-nav.bottom-nav-3 button.active{transform:none!important;background:rgba(212,175,55,.14)!important;box-shadow:inset 0 0 0 1px rgba(212,175,55,.28)!important}
.bottom-nav.bottom-nav-3 button.active:before{display:none!important}
.bottom-nav.bottom-nav-3 button.active:after{display:none!important}
.bottom-nav.bottom-nav-3 button.active i{transform:none!important;color:#f1d36d!important}
.bottom-nav.bottom-nav-3 button.active span{transform:none!important;color:#f1d36d!important}

.wg-verification-status{padding:13px 14px;border-radius:15px;margin-bottom:14px;font-weight:900;text-align:center}
.wg-verification-status.approved{background:#ecfdf5;color:#047857;border:1px solid #a7f3d0}
.wg-verification-status.pending{background:#fffbeb;color:#a16207;border:1px solid #fde68a}
.wg-verification-status.rejected{background:#fff1f2;color:#be123c;border:1px solid #fecdd3}
.wg-verification-status.unverified{background:#f8fafc;color:#475569;border:1px solid #e2e8f0}

.wg-admin-group-tools{display:grid;grid-template-columns:1fr 130px auto;gap:9px;align-items:center}
.wg-admin-product-meta{display:grid;grid-template-columns:1fr 130px;gap:10px;margin:11px 0;padding:11px;border-radius:16px;background:#faf8f1;border:1px solid #eee3c8}
@media(max-width:600px){
  .wg-product-groups{margin-inline:-2px;padding-bottom:10px}
  .wg-product-group-btn{padding:9px 14px;font-size:12px}
  .wg-admin-group-tools,.wg-admin-product-meta{grid-template-columns:1fr}
}

/* ===== WhaleGold v13.7 - global responsive + section focus fixes ===== */
html{
  scroll-behavior:smooth;
  scroll-padding-top:112px;
  -webkit-text-size-adjust:100%;
}
body{max-width:100%;}
img,svg,video,canvas{max-width:100%;height:auto;}
input,select,textarea,button{max-width:100%;}
.utab,.atab{min-width:0;scroll-margin-top:112px;}
.content,.content>*,.layout,.layout>*,.grid,.grid>*,.card,.glass{min-width:0;}
.card-row>*{min-width:0;overflow-wrap:anywhere;}
.card-row b,.card-row strong,.card-row span{max-width:100%;overflow-wrap:anywhere;word-break:break-word;}
.grid{grid-template-columns:repeat(auto-fit,minmax(min(270px,100%),1fr));}

/* Modal/overlay content must stay inside the viewport on phones and short screens. */
.modal{
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.modal .box{
  width:min(540px,100%);
  max-width:100%;
  max-height:calc(100dvh - 24px);
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.wg-overlay{
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.wg-panel{
  max-width:100%;
  min-width:0;
  max-height:calc(100dvh - 24px);
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.wg-actions>*{min-width:min(130px,100%);}
.wg-json-row{grid-template-columns:minmax(0,1fr) auto;}
.wg-table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.wg-table th,.wg-table td{white-space:nowrap;}

/* User panels including transfers/archive/deposit. */
.transfer-status-grid,.more-feature-grid,.premium-grid,.features-panel{min-width:0;}
.transfer-panel,.premium-feature,.deposit-intro,.receipt-list,.receipt-list>*{min-width:0;}
.deposit-intro{overflow:hidden;}
.deposit-amount-row{grid-template-columns:minmax(0,1fr) auto;}
.payment-detail{grid-template-columns:42px minmax(0,1fr) 42px;}
.payment-detail>div,.payment-detail b,.payment-detail a{min-width:0;max-width:100%;overflow-wrap:anywhere;word-break:break-word;}
.receipt-thumbs{max-width:100%;}
.receipt-thumb{max-width:100%;white-space:normal;overflow-wrap:anywhere;}
.section-head-premium{min-width:0;}
.section-head-premium>div{min-width:0;}

/* Admin layouts/forms must shrink instead of causing horizontal page overflow. */
.admin-dashboard-shell,.admin-topbar,.admin-overview,.admin-quick-access,.admin-quick-buttons{min-width:0;}
.admin-stat-card,.admin-stat-card>div{min-width:0;}
.admin-stat-card strong{overflow-wrap:anywhere;}
.receipt-admin-grid,.receipt-form-grid,.receipt-range-card,.receipt-admin-item{min-width:0;}
.receipt-action-row>*{min-width:min(140px,100%);}
.wg-admin-group-tools{grid-template-columns:minmax(0,1fr) minmax(100px,130px) auto;}
.wg-admin-product-meta{grid-template-columns:minmax(0,1fr) minmax(100px,130px);}

@media (max-width:850px){
  html{scroll-padding-top:92px;}
  .utab,.atab{scroll-margin-top:92px;}
  .wrap{width:min(100% - 20px,1200px);}
  .header{top:6px;margin:6px auto;padding:11px 12px;}
  .modal{padding:10px;align-items:center;}
  .modal .box{padding:18px;border-radius:21px;max-height:calc(100dvh - 20px);}
  .wg-overlay{padding:10px;align-items:center;}
  .wg-panel{width:100%!important;padding:18px;border-radius:21px;max-height:calc(100dvh - 20px)!important;}
  .section-head-premium{gap:12px;}
  .card{padding:16px;}
  .card-row{align-items:flex-start;flex-wrap:wrap;}
  .card-row>span{flex:1 1 42%;}
  .card-row>b,.card-row>strong{flex:1 1 50%;text-align:left;}
  .trade-actions-grid{grid-template-columns:1fr 1fr;}
  .admin-quick-access{padding:13px;}
}

@media (max-width:600px){
  html{scroll-padding-top:84px;}
  .utab,.atab{scroll-margin-top:84px;}
  .wrap{width:calc(100% - 14px);}
  .content{padding-bottom:100px;}
  .glass{border-radius:18px;}
  .card{padding:13px;border-radius:18px;}
  .grid{gap:11px;}
  .btn{min-height:44px;padding:11px 13px;white-space:normal;line-height:1.45;}
  .input,select,textarea{font-size:16px;padding:12px 13px;border-radius:13px;}
  .transfer-status-grid,.more-feature-grid,.receipt-admin-grid,.receipt-form-grid{grid-template-columns:minmax(0,1fr)!important;}
  .transfer-panel{min-height:0;}
  .section-head-premium{align-items:stretch!important;}
  .section-head-premium h2{font-size:22px;margin-block:5px;}
  .section-head-premium p{font-size:12px;line-height:1.9;}
  .section-head-premium .btn{width:100%;}
  .deposit-intro{padding:16px;border-radius:19px;}
  .deposit-intro h3{font-size:17px;margin-top:0;}
  .deposit-intro p{font-size:12px;line-height:1.9;}
  .deposit-amount-row{grid-template-columns:minmax(0,1fr);}
  .deposit-amount-row .btn{width:100%;}
  .payment-detail{grid-template-columns:36px minmax(0,1fr) 36px;gap:8px;padding:10px;border-radius:14px;}
  .payment-detail>i,.copy-payment{width:36px;height:36px;}
  .receipt-thumbs{display:grid;grid-template-columns:1fr;}
  .receipt-thumb{width:100%;}
  .manager-call-card{display:grid;grid-template-columns:42px minmax(0,1fr);}
  .manager-call-card a{grid-column:1/-1;width:100%;overflow-wrap:anywhere;white-space:normal!important;}
  .trade-actions-grid{gap:8px;}
  .wg-actions{display:grid;grid-template-columns:1fr;}
  .wg-actions>*{width:100%;min-width:0;}
  .wg-json-row{grid-template-columns:1fr;}
  .wg-json-row>*{min-width:0;}
  .wg-table{font-size:12px;}
  .admin-overview{grid-template-columns:1fr!important;}
  .admin-stat-card{padding:12px;}
  .admin-quick-buttons{grid-template-columns:1fr!important;}
  .admin-quick-buttons button{width:100%;font-size:11px!important;}
  .admin-topbar{align-items:flex-start;}
  .admin-topbar>div{min-width:0;}
  .receipt-action-row{display:grid;grid-template-columns:1fr;}
  .receipt-action-row .btn{width:100%;}
  .wg-admin-group-tools,.wg-admin-product-meta{grid-template-columns:1fr!important;}
}

@media (max-width:390px){
  .wrap{width:calc(100% - 10px);}
  .card{padding:11px;}
  .trade-actions-grid{grid-template-columns:1fr;}
  .bottom-nav.bottom-nav-3{width:calc(100% - 8px);padding-inline:3px;}
  .bottom-nav.bottom-nav-3 button{padding-inline:2px;font-size:8px;}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
}

/* Long receipt titles/statuses and inline action rows should wrap rather than overflow. */
.receipt-list article>div:first-child,
.receipt-admin-item>div:first-child{flex-wrap:wrap;min-width:0;}
.receipt-list article>div:first-child>* ,
.receipt-admin-item>div:first-child>*{min-width:0;max-width:100%;}
@media(max-width:600px){
  .receipt-status{white-space:normal;text-align:center;}
  .receipt-files{display:grid;grid-template-columns:1fr;width:100%;}
  .receipt-file-btn{width:100%;white-space:normal;overflow-wrap:anywhere;}
}

/* ===== WhaleGold v13.8 - bottom navigation safe zone + panel scrolling ===== */
:root{
  --wg-bottom-nav-clearance: 118px;
  --wg-panel-edge-gap: 12px;
}

/* The fixed user navigation must never cover the end of a page/section. */
.user-app{
  padding-bottom:calc(var(--wg-bottom-nav-clearance) + env(safe-area-inset-bottom, 0px))!important;
}
.user-app .content{
  padding-bottom:calc(var(--wg-bottom-nav-clearance) + env(safe-area-inset-bottom, 0px))!important;
}
.user-app .utab{
  box-sizing:border-box;
  min-width:0;
  padding-bottom:calc(var(--wg-bottom-nav-clearance) + env(safe-area-inset-bottom, 0px));
  scroll-margin-bottom:calc(var(--wg-bottom-nav-clearance) + env(safe-area-inset-bottom, 0px));
}
.user-app .full-section{
  padding-bottom:calc(var(--wg-bottom-nav-clearance) + env(safe-area-inset-bottom, 0px))!important;
}
.user-app .utab > :last-child{
  margin-bottom:0;
}

/* Standard modals used by trade/transfer/deposit used to sit BELOW bottom-nav (99 vs 5000).
   Put them above the navigation and make the panel itself independently scrollable. */
.modal{
  z-index:12000!important;
  box-sizing:border-box;
  padding:
    max(var(--wg-panel-edge-gap), env(safe-area-inset-top, 0px))
    var(--wg-panel-edge-gap)
    max(var(--wg-panel-edge-gap), env(safe-area-inset-bottom, 0px));
  overflow:hidden!important;
  align-items:center;
}
.modal .box{
  box-sizing:border-box;
  width:min(540px,100%);
  max-width:100%!important;
  max-height:calc(100dvh - var(--wg-panel-edge-gap) - var(--wg-panel-edge-gap) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px))!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scroll-padding-top:16px;
  scroll-padding-bottom:28px;
  padding-bottom:max(26px, env(safe-area-inset-bottom, 0px))!important;
}

/* Dynamic overlays already sit over the nav; keep the same safe scrolling behavior. */
.wg-overlay{
  box-sizing:border-box;
  padding-bottom:max(var(--wg-panel-edge-gap), env(safe-area-inset-bottom, 0px))!important;
}
.wg-overlay .wg-panel{
  box-sizing:border-box;
  max-height:calc(100dvh - var(--wg-panel-edge-gap) - var(--wg-panel-edge-gap) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px))!important;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  scroll-padding-bottom:28px;
  padding-bottom:max(24px, env(safe-area-inset-bottom, 0px));
}

/* If a long form has its action buttons at the end, keep a little breathing room after them. */
.modal .box > button:last-child,
.modal .box > div:last-child,
.wg-panel > button:last-child,
.wg-panel > div:last-child{
  margin-bottom:2px;
}

@media(max-width:600px){
  :root{
    --wg-bottom-nav-clearance: 126px;
    --wg-panel-edge-gap: 8px;
  }
  .user-app .utab{
    padding-bottom:calc(var(--wg-bottom-nav-clearance) + env(safe-area-inset-bottom, 0px));
  }
  .modal{
    align-items:flex-end;
  }
  .modal .box{
    width:100%!important;
    max-height:calc(100dvh - 16px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px))!important;
    border-radius:22px!important;
  }
  .wg-overlay{
    align-items:flex-end!important;
  }
  .wg-overlay .wg-panel{
    width:100%!important;
    max-height:calc(100dvh - 16px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px))!important;
    border-radius:22px!important;
  }
}

/* Short landscape screens need even more aggressive scrolling inside panels. */
@media(max-height:560px){
  .modal,.wg-overlay{align-items:flex-start!important;}
  .modal .box,.wg-overlay .wg-panel{
    max-height:calc(100dvh - 12px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px))!important;
  }
}
