/* ══════════════════════════════════════════
   MediCare BD — responsive.css
   All breakpoints: Mobile / Tablet / Desktop
══════════════════════════════════════════ */

/* ─── Large Desktop (1400px+) ─── */
@media (min-width: 1400px) {
  .doctor-grid { grid-template-columns: repeat(5, 1fr); }
  .test-packages { grid-template-columns: repeat(5, 1fr); }
}

/* ─── Desktop (992px–1399px) ─── */
@media (min-width: 992px) and (max-width: 1399px) {
  .doctor-grid { grid-template-columns: repeat(4, 1fr); }
  .test-packages { grid-template-columns: repeat(4, 1fr); }
}

/* ─── When sidebar is open on desktop ─── */
@media (min-width: 992px) {
  .banner { margin-left: 0; }
  .search-section { left: 270px; }
  .stats-bar { max-width: calc(1400px); }
}

/* ─── Tablet (768px–991px) ─── */
@media (min-width: 768px) and (max-width: 991px) {
  body { padding-left: 0; }
  .sidebar { top: 0; }

  .banner { height: 200px; }
  .slide-content h2 { font-size: 22px; }
  .slide-content h2 span { font-size: 27px; }
  .slide-img { font-size: 70px; right: 40px; }

  .doctor-grid { grid-template-columns: repeat(3, 1fr); }
  .test-packages { grid-template-columns: repeat(3, 1fr); }
  .atp-grid { grid-template-columns: repeat(3, 1fr); }

  .stats-bar { overflow-x: auto; }
  .stat { min-width: 120px; }

  .footer-inner { flex-direction: column; }
  .footer-left { max-width: 100%; }

  .nav-right .btn-login,
  .nav-right .btn-register { display: none; }

  .search-bar-wrap { flex-wrap: wrap; }
  .search-bar-wrap .search-input-group { min-width: 100%; }
  .search-section select { flex: 1; }
}

/* ─── Mobile (max 767px) ─── */
@media (max-width: 767px) {
  body { padding-left: 0; }
  :root { --navbar-h: 58px; }
  .sidebar { top: 0; width: 260px; }

  /* Navbar */
  .nav-inner { padding: 0 14px; }
  .brand-name { font-size: 17px; }
  .btn-login, .btn-register { display: none; }
  .profile-btn img { width: 28px; height: 28px; }

  /* Banner */
  .banner { height: 180px; }
  .slide { padding: 0 16px 0 18px; }
  .slide-content h2 { font-size: 17px; }
  .slide-content h2 span { font-size: 21px; }
  .slide-content p { display: none; }
  .slide-img { font-size: 55px; right: 18px; opacity: .7; }
  .slide-btn { font-size: 12px; padding: 7px 14px; }
  .slide-arrow { width: 28px; height: 28px; font-size: 11px; }

  /* Search */
  .search-section { padding: 14px 14px; }
  .search-tabs { gap: 6px; }
  .stab { padding: 6px 12px; font-size: 12.5px; }
  .search-bar-wrap { flex-direction: column; gap: 8px; }
  .search-bar-wrap .search-input-group { width: 100%; }
  .search-section select { width: 100%; }
  .search-btn { width: 100%; justify-content: center; }

  /* Stats */
  .stats-bar { overflow-x: auto; gap: 0; }
  .stat { min-width: 100px; padding: 12px 8px; }
  .stat i { font-size: 18px; }
  .stat strong { font-size: 15px; }
  .stat span { font-size: 11px; }

  /* Section */
  .section { padding: 24px 14px 40px; }
  .section-head { flex-direction: column; align-items: flex-start; }
  .section-head h2 { font-size: 18px; }

  /* Doctor Grid */
  .doctor-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .card-top img { width: 70px; height: 70px; }
  .card-name { font-size: 13.5px; }
  .card-spec { font-size: 11.5px; }
  .card-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .btn-details, .btn-appoint { min-height: 38px; padding: 7px 8px; font-size: 12px; gap: 5px; }

  /* Test packages */
  .test-packages { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .pkg-title { font-size: 13.5px; }
  .atp-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .atp-filter { flex-direction: column; }
  .atp-filter input, .atp-filter select { width: 100%; }

  /* Modal */
  .modal-box { border-radius: 14px; }
  .dm-header { flex-direction: column; align-items: flex-start; gap: 10px; }
  .dm-header img { width: 65px; height: 65px; }
  .info-grid { grid-template-columns: 1fr; }
  .dm-tabs { overflow-x: auto; }
  .dm-tab { font-size: 12.5px; padding: 9px 12px; white-space: nowrap; }

  .step-dot { font-size: 10px; }
  .step-actions { flex-direction: column; gap: 8px; }
  .btn-next, .btn-prev, .btn-confirm { width: 100%; justify-content: center; }

  /* Footer */
  .footer-inner { flex-direction: column; gap: 20px; padding: 28px 16px; }
  .footer-left { max-width: 100%; }
  .footer-right { flex-direction: column; gap: 20px; }

  /* Pagination */
  .pagination-wrap { flex-direction: column; align-items: center; }

  /* Filter chips */
  .filter-chips { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
  .chip { white-space: nowrap; }
}

/* ─── Very small mobile (max 380px) ─── */
@media (max-width: 380px) {
  .doctor-grid { grid-template-columns: 1fr; }
  .test-packages { grid-template-columns: 1fr; }
  .atp-grid { grid-template-columns: 1fr; }
  .slide-content h2 { font-size: 15px; }
  .slide-content h2 span { font-size: 18px; }
  .slide-img { display: none; }
  .banner { height: 160px; }
}

/* ─── Print ─── */
@media print {
  .navbar, .sidebar, .sidebar-overlay, .footer, .search-section,
  .banner, .stats-bar, .toast, .modal-close, .btn-next, .btn-prev { display: none !important; }
  body { padding: 0 !important; color: #000; }
  .modal-overlay { position: static; opacity: 1; pointer-events: all; }
  .modal-box { box-shadow: none; max-height: none; }
}
