/* Global responsive safety layer. Loaded last on every public page. */
html,body{max-width:100%;overflow-x:clip}
.site-main,.page-content,.page-content>*{min-width:0;max-width:100%}
.page-content>*{width:100%}
img,video,canvas,svg,iframe{max-width:100%}
input,select,textarea,button{max-width:100%;min-width:0}
.adm-table-wrap,.wt-table-wrap,.hv3-table-wrap,.orders-table-wrap,.table-responsive{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}

/* A desktop sidebar leaves too little content room on small laptops. */
@media(max-width:1180px){
  .sidebar{transform:translateX(-105%)!important;box-shadow:18px 0 55px rgba(0,0,0,.55);transition:transform .28s ease!important}
  .sidebar.open{transform:translateX(0)!important}
  .site-main{margin-left:0!important;width:100%!important}
  .hamburger{display:flex!important}
  .topbar-brand{display:flex!important}
  .sb-overlay{display:none!important}.sb-overlay.open{display:block!important}
  .page-content{padding-inline:clamp(12px,2.2vw,24px)}
}

@media(max-width:900px){
  .page-content{padding-top:18px}
  .wt-layout,.detail-layout,.contact-layout,.history-layout{grid-template-columns:minmax(0,1fr)!important}
  .wt-stats,.hv3-stats,.contact-stats,.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .wt-stat{min-width:0!important;padding:15px!important}
  .wt-stat-icon{width:44px!important;height:44px!important}
  .wt-stat-label{overflow-wrap:anywhere}
  .wt-hero{align-items:flex-start!important}
  .wt-hero-btn{margin-left:auto}
  .rk-page,.wt-page,.hv3-page,.orders-page,.topup-page{width:100%;max-width:100%!important}
}

@media(max-width:700px){
  .topbar{padding-inline:12px;gap:8px}
  .topbar-search{max-width:none}
  .topbar-user-name,.topbar-user-sub,.topbar-user-balance{display:none!important}
  .topbar-user{padding:5px!important}
  .page-content{padding:14px 10px 0}
  .wt-hero{padding:15px!important;gap:12px!important;border-radius:16px!important}
  .wt-hero-icon{width:48px!important;height:48px!important;border-radius:14px!important}
  .wt-hero-btn{width:100%;justify-content:center;margin:2px 0 0}
  .wt-card{padding:14px!important;border-radius:15px!important}
  .wt-timeline{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 8px}
  .wt-tl-step:not(:last-child)::after{display:none!important}
  .wt-tl-label,.wt-tl-sub{max-width:120px!important}
  .wt-table{min-width:620px}
  .wt-table-wrap{margin-inline:-6px;padding-bottom:8px}
  .rk-hero-inner,.rk-section-hdr,.hv3-header,.orders-header,.contact-hero{flex-wrap:wrap}
  .rk-hero-right{margin-left:auto}
  .rk-podium{overflow-x:auto;justify-content:flex-start!important;padding-inline:12px!important}
  .rk-pod{min-width:145px}
  .pm-modal,.wt-modal,.dl-banner-box{width:calc(100vw - 20px)!important;max-height:92dvh!important}
  [class*="-actions"],[class*="-toolbar"]{flex-wrap:wrap}
  .sf-inner{grid-template-columns:1fr!important}
}

@media(max-width:520px){
  html{font-size:14px}
  .topbar-brand{display:none!important}
  .wt-stats,.hv3-stats,.contact-stats,.stats-grid{grid-template-columns:1fr!important}
  .wt-stat{display:grid!important;grid-template-columns:44px minmax(0,1fr)}
  .wt-timeline{grid-template-columns:1fr!important}
  .wt-tl-step{display:grid!important;grid-template-columns:38px minmax(0,1fr);column-gap:10px;align-items:center!important;text-align:left}
  .wt-tl-dot{grid-row:1/3}.wt-tl-label,.wt-tl-sub{text-align:left!important;margin-top:0!important;max-width:none!important}
  .rk-tiers-grid{grid-template-columns:1fr!important}
  .rk-tier-card{min-height:0!important;display:grid;grid-template-columns:90px 1fr;grid-template-rows:auto auto;align-items:center;text-align:left!important;padding:10px 14px!important}
  .rk-tier-icon{grid-row:1/3;margin:0!important}.rk-tier-name{margin:0!important}.rk-tier-disc-label{text-align:left}
  .detail-header,.topup-header,.contact-hero{flex-direction:column!important;align-items:stretch!important}
  .dl-tabs,.hv3-tabs{display:flex;overflow-x:auto;flex-wrap:nowrap!important;padding-bottom:6px}
  .dl-tab,.hv3-tab{flex:0 0 auto}
  .form-actions,.modal-actions{display:grid!important;grid-template-columns:1fr!important}
}

@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
