/* ============================================================
   RESPONSIVE.CSS — Media query mobile-first
   Breakpoint: 360,390,412,414,480 (mobile) / 768 (tablet) / 1024+ (desktop)
   ============================================================ */

/* Pastikan tidak ada horizontal scroll di perangkat manapun */
html, body { overflow-x: hidden; width: 100%; }

/* ---------- ≤480px (default mobile-first sudah diterapkan di style.css) ---------- */
@media (max-width: 480px) {
  .section { padding: 2rem 0; }
  .book-grid { grid-template-columns: repeat(2, 1fr); gap: 0.75rem; }
  .hero-slide-content h2 { font-size: 1.15rem; }
  .stat-grid { grid-template-columns: 1fr; }
  .footer-container { grid-template-columns: 1fr; text-align: center; }
  .footer-social { justify-content: center; }
}

/* ---------- ≤768px : tablet & hp besar ---------- */
@media (min-width: 481px) and (max-width: 768px) {
  .book-grid { grid-template-columns: repeat(3, 1fr); }
  .stat-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .navbar-menu { display: flex; }
  .book-detail-grid { grid-template-columns: 1fr; }
  .book-detail-meta-list { grid-template-columns: 1fr 1fr; }
}

/* ---------- ≥1024px : desktop, navbar horizontal, sidebar tetap terbuka ---------- */
@media (min-width: 1024px) {
  .navbar-toggle { display: none; }
  .navbar-menu {
    position: static; transform: none; flex-direction: row; align-items: center; padding: 0; background: transparent;
    width: auto; height: auto; overflow: visible;
  }
  .navbar-menu a { padding: 0.6rem 0.9rem; min-height: auto; }
  .theme-toggle { margin-top: 0; }

  .book-grid { grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
  .section { padding: 4rem 0; }

  .book-detail-grid { grid-template-columns: 22rem 1fr; gap: 2.5rem; }
  .book-detail-meta-list { grid-template-columns: repeat(3, 1fr); }

  .auth-card { padding: 2.5rem; }
}

@media (min-width: 1366px) {
  .book-grid { grid-template-columns: repeat(5, 1fr); }
}

@media (min-width: 1920px) {
  .container { max-width: 1440px; }
  .book-grid { grid-template-columns: repeat(6, 1fr); }
}

/* ---------- Reader viewer khusus mobile ---------- */
@media (max-width: 1023px) {
  .reader-sidebar { top: 3.4rem; }
  .reader-toolbar .page-total { display: none; }
}

/* ---------- Print (khusus PDF viewer print) ---------- */
@media print {
  .navbar, .site-footer, .reader-toolbar, .back-to-top, .toast-container { display: none !important; }
}