/* ──────────────────────────────────────────
   CareNara 반응형 스타일
   기준점:
     1440px  — 넓은 데스크톱 (여유 패딩)
     1280px  — 일반 데스크톱 (사이드바 220px)
     1024px  — 좁은 데스크톱 / 태블릿 가로
     768px   — 태블릿 (사이드바 숨김)
     480px   — 소형 폰
   ────────────────────────────────────────── */

/* ── 넓은 데스크톱 (1440px+): 여유 있는 패딩 ── */
@media (min-width: 1440px) {
  :root {
    --content-padding-x: 36px;
    --content-padding-y: 24px;
  }
}

/* ── 1200px 이하: 사이드바 자동 접힘 기본값 유도 ── */
@media (max-width: 1200px) {
  :root {
    --content-padding-x: 16px;
    --content-padding-y: 16px;
  }
  /* KPI 카드 2열로 줄이기 */
  .stat-grid[style*="grid-template-columns:repeat(4,1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ── 태블릿 이하 ── */
@media (max-width: 768px) {
  /* 사이드바 관련 룰 — 이미 display:none, 방어적 유지 */
  #sidebar-container { display: none !important; }

  /* 모바일 헤더 — 레거시 (navbar.css의 햄버거로 대체됨) */
  .mobile-header { display: none; }

  /* 본문 패딩 축소 */
  #main-content {
    padding: 12px 14px;
  }

  /* #app은 이미 flex-direction:column (main.css) */

  /* 폼 그리드: 1열로 */
  .form-grid { grid-template-columns: 1fr; }

  /* 통계 카드: 2열 고정 */
  .stat-grid { grid-template-columns: 1fr 1fr; }

  /* 페이지 헤더: 버튼 아래로 */
  .page-header { flex-direction: column; align-items: flex-start; }

  /* 모달: 하단 sheet 스타일 */
  .modal-overlay {
    align-items: flex-end;
    padding: 0;
  }
  .modal {
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    max-width: 100%;
    margin: 0;
    animation: modal-slide-up .25s ease;
  }
  @keyframes modal-slide-up {
    from { transform: translateY(100%); }
    to   { transform: translateY(0); }
  }

  /* 테이블: 스크롤 허용 (모바일에서 카드 가장자리까지 확장) */
  .table-wrap { margin: 0 -16px; }
  /* table min-width는 main.css(760px) 기준, 모바일에선 더 작게 */
  table { min-width: 480px; }

  /* 토스트: 하단 중앙 */
  #toast-container {
    bottom: 16px;
    right: 16px;
    left: 16px;
  }
  .toast { min-width: 0; max-width: 100%; }

  /* 검색바 세로 정렬 */
  .search-bar { flex-direction: column; }
  .search-input-wrap { width: 100%; }

  /* 로그인 카드 패딩 축소 */
  .login-card { padding: 28px 20px; }

  /* 어드민 대시보드 카드 그리드 1열 */
  .admin-grid { grid-template-columns: 1fr !important; }

  /* 탭 스크롤 */
  .tabs { overflow-x: auto; white-space: nowrap; }

  /* 대시보드 액션 그룹 */
  .action-group { justify-content: flex-start; }
}

/* ── 소형 폰 ── */
@media (max-width: 480px) {
  /* 통계 카드: 1열 */
  .stat-grid { grid-template-columns: 1fr; }

  /* 사이드바 전체 너비 */
  #sidebar-container { width: 100%; }
  .sidebar { width: 100%; }

  .modal-body { max-height: 70vh; }

  /* 버튼 텍스트 숨기고 아이콘만 */
  .btn-icon-only .btn-text { display: none; }

  .page-title { font-size: 1.125rem; }
}

/* ── 데스크톱 전용 (사이드바 항상 표시) ── */
@media (min-width: 769px) {
  .mobile-header  { display: none !important; }
  .sidebar-overlay { display: none !important; }
}

/* ── 인쇄 ── */
@media print {
  #sidebar-container,
  .mobile-header,
  .btn,
  #toast-container { display: none !important; }
  #main-content { padding: 0; }
  .card { box-shadow: none; border: 1px solid #ccc; }
}

/* ── 고대비 모드 접근성 ── */
@media (prefers-color-scheme: dark) {
  /* 시스템 다크모드는 추후 지원 — 현재는 라이트 유지 */
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}