/* ═══════════════════════════════════════════════════════════════════
   GLOBAL MOBILE RESPONSIVE — AbandonedAssetsOS
   ═══════════════════════════════════════════════════════════════════
   Include on all sidebar-based pages to ensure mobile compatibility.
   Handles: hamburger toggle, sidebar transitions, overflow prevention,
   table responsiveness, and 375px corner-to-corner audit.
   ═══════════════════════════════════════════════════════════════════ */

/* ── PREVENT HORIZONTAL SCROLL GLOBALLY ── */
html, body {
  max-width: 100vw;
  overflow-x: hidden;
}

/* ── HAMBURGER TOGGLE BUTTON ── */
.mobile-toggle {
  display: none;
  position: fixed;
  top: 0.75rem;
  left: 0.75rem;
  z-index: 200;
  background: #0a0a0a;
  color: white;
  border: 1px solid rgba(255,255,255,0.12);
  padding: 0.5rem 0.7rem;
  border-radius: 8px;
  font-size: 1.2rem;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,0.4);
  line-height: 1;
  -webkit-tap-highlight-color: transparent;
}

/* ── SIDEBAR OVERLAY (mobile) ── */
.sidebar-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 99;
  -webkit-tap-highlight-color: transparent;
}
.sidebar-overlay.active {
  display: block;
}

/* ── TABLET (≤ 1024px) ── */
@media (max-width: 1024px) {
  .pipeline-board {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  .admin-stats-row {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

/* ── MOBILE (≤ 768px) ── */
@media (max-width: 768px) {
  /* Show hamburger */
  .mobile-toggle {
    display: block !important;
  }

  /* Hide sidebar off-screen */
  .sidebar {
    transform: translateX(-100%);
    transition: transform 0.3s ease;
  }
  .sidebar.open {
    transform: translateX(0);
  }

  /* Main content fills full width */
  .main {
    margin-left: 0 !important;
    padding: 1rem !important;
    padding-top: 3.5rem !important;
    max-width: 100vw;
    overflow-x: hidden;
  }

  /* Stats grid: 2 columns on mobile */
  .stats-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* Pipeline board: single column */
  .pipeline-board {
    grid-template-columns: 1fr !important;
  }

  /* Admin stats: 2 columns */
  .admin-stats-row {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* Tables: horizontal scroll within container */
  .table-wrap, .card-body.no-pad {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Two-column grids → single column */
  .two-col, .overview-bottom-grid, .form-row {
    grid-template-columns: 1fr !important;
  }

  /* Page header: stack on mobile */
  .page-header {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 0.5rem;
  }
  .page-header h1 {
    font-size: 1.25rem !important;
    word-break: break-word;
  }

  /* Scan bar: wrap on mobile */
  .scan-bar {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 0.75rem;
  }
  .scan-bar .scan-divider {
    display: none;
  }
  .scan-bar-left {
    flex-wrap: wrap;
  }

  /* Forms grid: single column */
  .forms-grid, .state-grid {
    grid-template-columns: 1fr !important;
  }

  /* Tabs: scrollable */
  .tabs {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap;
    width: 100%;
  }
  .tabs .tab {
    flex-shrink: 0;
  }

  /* Referral banners: stack */
  .referral-banner {
    flex-direction: column;
    text-align: center;
  }
  .referral-cta {
    width: 100%;
  }

  /* Market pulse row: single column */
  #marketPulseRow {
    grid-template-columns: 1fr !important;
  }

  /* Credit economy row: 2 columns */
  #creditEconomyRow > div {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ── MOBILE (≤ 768px) — ADDITIONAL FIXES ── */
@media (max-width: 768px) {
  /* Search bar: prevent overflow */
  .search-bar input,
  .search-bar .search-input,
  input[type="search"],
  input[type="text"].search {
    min-width: 0 !important;
    width: 100% !important;
  }

  /* Bar chart labels: flexible width */
  .bar-label {
    width: auto !important;
    min-width: 80px !important;
    max-width: 100px !important;
  }

  /* Modals: full width on mobile */
  .modal, .modal-box, .modal-content {
    max-width: 95vw !important;
    width: 95vw !important;
    margin: 1rem auto !important;
  }

  /* Tabs: compact padding */
  .tabs .tab, .tab {
    padding: 0.5rem 0.85rem !important;
    font-size: 0.82rem !important;
  }

  /* All buttons: full-width on mobile */
  .btn-block, .btn.mobile-full, .cta-btn, .btn-deals {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Auth pages: reduce card padding */
  .auth-card, .card {
    padding: 1.5rem 1.25rem !important;
  }
  .auth-container, .wrap {
    padding: 1rem !important;
    max-width: 100% !important;
  }

  /* Prevent text clipping everywhere */
  h1, h2, h3, h4, p, span, a, li, td, th, label, div {
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
  }

  /* Form link cards: stack on mobile */
  .form-link-card {
    flex-direction: column !important;
    gap: 0.75rem !important;
    align-items: flex-start !important;
  }
  .form-link-card .copy-link {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* ── SMALL MOBILE (≤ 430px / 375px target) ── */
@media (max-width: 430px) {
  /* Single column stats */
  .stats-grid {
    grid-template-columns: 1fr !important;
    gap: 0.6rem !important;
  }

  /* Even smaller page padding — 16px minimum */
  .main {
    padding: 0.75rem !important;
    padding-top: 3.25rem !important;
  }

  /* Compact stat cards */
  .stat-card {
    padding: 0.9rem !important;
  }
  .stat-card .value, .stat-value {
    font-size: 1.4rem !important;
  }

  /* Admin stats: 2 cols, more compact */
  .admin-stats-row {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.5rem !important;
  }
  .admin-stat-num {
    font-size: 1.4rem !important;
  }

  /* Credit economy: single column */
  #creditEconomyRow > div {
    grid-template-columns: 1fr !important;
  }

  /* Smaller buttons on mobile */
  .page-header .btn {
    font-size: 0.75rem !important;
    padding: 0.35rem 0.65rem !important;
  }

  /* Hide secondary header buttons */
  .dash-btn-secondary-hide {
    display: none !important;
  }

  /* Compact early adopter banner */
  .early-adopter-banner {
    flex-direction: column;
    text-align: center;
    gap: 0.5rem;
  }
  .ea-badge {
    margin-left: 0;
  }

  /* Match cards: full width */
  .match-card {
    margin: 0 -0.25rem 0.75rem;
  }

  /* State grid on very small screens */
  .state-grid {
    grid-template-columns: 1fr !important;
  }

  /* Course grid on very small screens */
  .course-grid {
    grid-template-columns: 1fr !important;
  }

  /* Auth pages: even tighter padding */
  .auth-card, .card {
    padding: 1.25rem 1rem !important;
  }

  /* Compliance alert: reduce padding */
  .compliance-alert {
    padding: 1rem !important;
  }
  .compliance-alert h3 {
    font-size: 0.92rem !important;
  }

  /* Modals: near-full width */
  .modal, .modal-box, .modal-content {
    max-width: 100vw !important;
    width: calc(100vw - 1rem) !important;
    margin: 0.5rem auto !important;
    padding: 1.25rem !important;
  }

  /* Select dropdowns: full width */
  select, .form-select, .state-select {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Flex rows that need to stack */
  .state-select-row {
    flex-direction: column !important;
  }

  /* Compliance hub: selector stacks */
  .compliance-selector-row {
    flex-direction: column !important;
    gap: 0.75rem !important;
  }
}

/* ── UNIVERSITY / CAMPUS NAV MOBILE ── */
@media (max-width: 768px) {
  .campus-nav {
    padding: 0 0.75rem;
  }
  .campus-nav .mobile-menu-toggle {
    display: block !important;
    background: none;
    border: none;
    color: white;
    font-size: 1.4rem;
    cursor: pointer;
    padding: 0.25rem;
    -webkit-tap-highlight-color: transparent;
  }
  .campus-nav-links {
    display: none;
    position: absolute;
    top: 64px;
    left: 0;
    right: 0;
    background: #0d1b2a;
    flex-direction: column;
    padding: 1rem;
    gap: 0.5rem;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    box-shadow: 0 8px 24px rgba(0,0,0,0.3);
    z-index: 99;
  }
  .campus-nav-links.open {
    display: flex !important;
  }
  .campus-nav-links a {
    display: block !important;
    padding: 0.6rem 0.75rem;
    border-radius: 6px;
  }
  .campus-nav-links a:hover {
    background: rgba(255,255,255,0.06);
  }
}

/* ── FIX JV SECTION OVERFLOW ── */
.jv-section, .jv-grid, .jv-card, .partner-card {
  max-width: 100%;
  overflow: hidden;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

/* ── FIX TABLE OVERFLOW ── */
table {
  table-layout: auto;
}
@media (max-width: 768px) {
  /* Ensure tables scroll within their container */
  table {
    min-width: 600px;
  }
  .table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }
}