/* ==========================================================================
   DigitalProfit Hub — responsive.css
   Breakpoints: 1280 / 1024 / 768 / 640 / 480
   Mobile-first adjustments for nav, grids, hero, dashboards.
   ========================================================================== */

/* ---------- Large desktops (<= 1280px) ---------- */
@media (max-width: 1280px) {
  .dp-container { max-width: 1140px; }
}

/* ---------- Tablet landscape (<= 1024px) ---------- */
@media (max-width: 1024px) {
  .dp-container { max-width: 100%; padding: 0 18px; }
  .dp-section { padding: 56px 0; }

  /* collapse mega menu into simple dropdown list */
  .dp-mega { width: 480px; grid-template-columns: repeat(2, 1fr); }

  /* product grid: 3 cols */
  .dp-grid-products { grid-template-columns: repeat(3, 1fr) !important; }

  /* dashboard layout */
  .dp-dash-layout { grid-template-columns: 220px 1fr !important; }
}

/* ---------- Tablet portrait (<= 768px) ---------- */
@media (max-width: 768px) {
  :root { --dp-header-h: 64px; }

  .dp-section { padding: 44px 0; }
  h1 { font-size: 32px !important; line-height: 1.15 !important; }
  h2 { font-size: 26px !important; }

  /* hide desktop nav, show hamburger */
  .dp-nav-desktop { display: none !important; }
  .dp-nav-toggle  { display: inline-flex !important; }

  /* mobile slide-in nav */
  .dp-mobile-nav {
    position: fixed; top: 0; right: -100%; width: 86%; max-width: 340px;
    height: 100dvh; background: var(--dp-surface); z-index: 60;
    box-shadow: var(--dp-shadow-lg); padding: 20px; overflow-y: auto;
    transition: right .3s cubic-bezier(.2,.7,.2,1);
    display: flex !important; flex-direction: column; gap: 6px;
  }
  .dp-mobile-nav.open { right: 0; }
  .dp-mobile-nav .dp-nav-link { padding: 12px; font-size: 16px; border-radius: 10px; }
  .dp-mobile-nav .dp-mega { display: none; }

  /* product grid: 2 cols */
  .dp-grid-products { grid-template-columns: repeat(2, 1fr) !important; gap: 14px !important; }

  /* hero */
  .dp-hero-grid { grid-template-columns: 1fr !important; }
  .dp-hero-visual { display: none; }

  /* footer columns */
  .dp-footer-grid { grid-template-columns: repeat(2, 1fr) !important; }

  /* dashboard: stack */
  .dp-dash-layout { grid-template-columns: 1fr !important; }
  .dp-dash-sidebar {
    position: fixed; top: 0; left: -100%; width: 260px; height: 100dvh;
    z-index: 60; background: var(--dp-surface); padding: 20px; overflow-y: auto;
    transition: left .3s cubic-bezier(.2,.7,.2,1);
  }
  .dp-dash-sidebar.open { left: 0; }
  .dp-dash-burger { display: inline-flex !important; }

  /* tables scroll */
  .dp-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* hide some columns on mobile tables */
  .hide-sm { display: none !important; }

  /* checkout: single column */
  .dp-checkout-grid { grid-template-columns: 1fr !important; }

  /* toasts anchor bottom center */
  #dp-toast-wrap { left: 12px; right: 12px; bottom: 12px; max-width: none; }
}

/* ---------- Mobile (<= 640px) ---------- */
@media (max-width: 640px) {
  .dp-container { padding: 0 14px; }
  .dp-section { padding: 36px 0; }
  h1 { font-size: 28px !important; }
  h2 { font-size: 22px !important; }

  /* product grid: 1 col on very small, 2 preferred */
  .dp-grid-products { grid-template-columns: repeat(2, 1fr) !important; gap: 12px !important; }
  .dp-product-media { font-size: 40px; }

  .dp-btn { padding: 10px 16px; font-size: 14px; }
  .dp-btn-lg { padding: 13px 22px; font-size: 15px; }

  .dp-footer-grid { grid-template-columns: 1fr !important; }

  /* hero search full width */
  .dp-hero-search { flex-direction: column !important; }
  .dp-hero-search button { width: 100%; }

  /* stat counters grid */
  .dp-stats-grid { grid-template-columns: repeat(2, 1fr) !important; }

  /* hide secondary header actions text */
  .dp-hide-mobile { display: none !important; }

  .dp-hide-scrollbar::-webkit-scrollbar { display: none; }
}

/* ---------- Small phones (<= 480px) ---------- */
@media (max-width: 480px) {
  h1 { font-size: 24px !important; }
  .dp-product-body { padding: 12px; }
  .dp-product-title { font-size: 14px; }
  .dp-price .now { font-size: 17px; }
  .dp-stats-grid { grid-template-columns: 1fr 1fr !important; }
  #dp-toast-wrap { left: 8px; right: 8px; }
  .dp-toast { padding: 10px 12px; }
}

/* ---------- Print ---------- */
@media print {
  .dp-header, .dp-footer, .dp-no-print { display: none !important; }
  body { background: #fff; color: #000; }
  .dp-card, .dp-glass { box-shadow: none; border: 1px solid #ccc; }
  .dp-bg-gradient, .dp-text-gradient { -webkit-text-fill-color: initial; color: #000; }
}