/* PANTEREX Mobile Responsive — loaded on all pages */

/* ── HAMBURGER MENU ── */
.px-hamburger{display:none;position:fixed;top:12px;left:12px;z-index:200;width:40px;height:40px;border-radius:8px;background:rgba(14,14,28,0.95);border:1px solid rgba(124,58,237,0.3);cursor:pointer;align-items:center;justify-content:center;backdrop-filter:blur(12px);}
.px-hamburger svg{width:20px;height:20px;stroke:#a855f7;stroke-width:2;fill:none;}
.px-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.6);z-index:49;}
.px-overlay.open{display:block;}

@media(max-width:768px){
  /* Show hamburger */
  .px-hamburger{display:flex !important;}

  /* Sidebar: hidden by default, slide in on toggle */
  .sidebar{transform:translateX(-100%);transition:transform 0.25s ease;z-index:100 !important;}
  .sidebar.open{transform:translateX(0);}

  /* Main: full width */
  .main{margin-left:0 !important;}

  /* Topbar adjustments */
  .topbar{padding:0 12px 0 56px !important;gap:8px !important;height:50px !important;}
  .topbar-title{font-size:15px !important;}
  .topbar-right{gap:6px !important;}
  .topbar-stat{display:none !important;}
  .topbar-stat:last-of-type{display:flex !important;padding:4px 8px !important;font-size:10px !important;}

  /* Content padding */
  .content{padding:16px 12px !important;max-width:100% !important;}

  /* Metric cards: 2 columns on mobile */
  .metrics{grid-template-columns:1fr 1fr !important;gap:10px !important;}
  .metric{padding:14px !important;}
  .metric-value{font-size:28px !important;}

  /* Grids: stack vertically */
  .grid2,.grid3{grid-template-columns:1fr !important;gap:12px !important;}

  /* Tables: horizontal scroll */
  .panel{overflow-x:auto !important;}
  table{min-width:600px;}
  .pos-table{min-width:700px;}
  th,td{padding:8px 10px !important;font-size:11px !important;}

  /* Position cards */
  .pos-metrics{grid-template-columns:1fr 1fr !important;gap:8px !important;}
  .pos-header{flex-wrap:wrap;gap:10px !important;}
  .pos-actions{flex-wrap:wrap;}
  .whale-tag{margin-left:0 !important;margin-top:4px;}

  /* Panel headers */
  .panel-header{padding:10px 14px !important;flex-wrap:wrap;gap:6px;}

  /* Signal feed */
  .signal-feed{max-height:none !important;}
  .signal-item{padding:10px 12px !important;}
  .signal-meta{flex-wrap:wrap;gap:4px !important;}

  /* Whale manager two-column → single */
  .content > div[style*="grid-template-columns: 1fr 340px"],
  .content > div[style*="grid-template-columns:1fr 340px"]{
    display:block !important;
  }

  /* Account profile header */
  .profile-header{flex-direction:column;text-align:center;gap:12px !important;padding:20px !important;}
  .edit-profile-btn{margin-left:0 !important;}
  .profile-info{text-align:center;}

  /* Referral stats */
  .referral-stats{grid-template-columns:1fr !important;}
  .referral-link-box{flex-direction:column;}

  /* Forms: full width */
  .form-row{grid-template-columns:1fr !important;}
  .socials-grid{grid-template-columns:1fr !important;}
  .add-form{gap:10px !important;}

  /* Modals: full width on mobile */
  .avatar-modal,.edit-modal,.sell-modal-box{width:95% !important;max-width:95% !important;max-height:90vh !important;padding:20px !important;}
  .avatar-grid{grid-template-columns:repeat(4,1fr) !important;gap:8px !important;}

  /* Pricing cards on homepage */
  .price-cards{flex-direction:column !important;align-items:center !important;}
  .price-card{width:100% !important;max-width:340px !important;}

  /* Homepage hero */
  .hero{padding:40px 16px 30px !important;min-height:auto !important;}
  .hero h1{font-size:36px !important;}
  .hero-sub{font-size:14px !important;}

  /* Homepage nav */
  nav.nav-links,
  .nav-links{display:none !important;}
  nav{padding:0 12px !important;}

  /* Homepage sections */
  .section{padding:40px 16px !important;}
  .section-title{font-size:28px !important;}
  .container{padding:0 !important;}

  /* Homepage wallet/partner cards */
  div[style*="display:flex"][style*="justify-content:center"][style*="gap:20px"]{
    flex-direction:column !important;align-items:center !important;
  }
  div[style*="display:flex"][style*="justify-content:center"][style*="gap:16px"]{
    flex-direction:column !important;align-items:center !important;
  }

  /* Footer */
  footer{flex-direction:column !important;text-align:center !important;gap:12px !important;padding:24px 16px !important;}
  .footer-links{flex-wrap:wrap;justify-content:center !important;gap:12px !important;}

  /* Comparison table scroll */
  div[style*="overflow-x:auto"]{-webkit-overflow-scrolling:touch;}
  table[style*="width:100%"]{min-width:500px;}

  /* CTA banner */
  .cta-banner{padding:40px 16px !important;}
  .cta-banner h2{font-size:28px !important;}

  /* Quote bar */
  .quote-bar{padding:8px 12px !important;}
  .quote-text{font-size:14px !important;letter-spacing:1px !important;}

  /* News panel: hide on mobile */
  .px-news{display:none !important;}

  /* Checkout plan cards */
  .plan-cards,.plan-grid{flex-direction:column !important;align-items:center !important;}
  .plan-card{width:100% !important;max-width:100% !important;}

  /* Ticker */
  .ticker{height:30px !important;}
  .ticker-item{padding:0 16px !important;font-size:10px !important;}

  /* Bot status pill in sidebar — visible when sidebar open */
  .bot-status-pill{margin:10px 12px !important;}

  /* Onboarding */
  .step-content{padding:16px !important;}
  .step-grid{grid-template-columns:1fr !important;}
}

/* Tablet tweaks */
@media(min-width:769px) and (max-width:1024px){
  .sidebar{width:180px !important;}
  .main{margin-left:180px !important;}
  .metrics{grid-template-columns:1fr 1fr !important;}
  .grid2{grid-template-columns:1fr !important;}
  .content{padding:20px !important;}
}