/* 32인치 키오스크 (1920x1080 이상) */
@media (min-width: 1920px) and (min-height: 1080px) {
  :root {
    font-size: calc(1rem * var(--kiosk-32-scale));
  }

  .container-fluid {
    max-width: 1800px;
    margin: 0 auto;
  }

  .menu-card {
    min-height: 400px;
  }

  .hero-section {
    padding: 4rem !important;
  }

  .main-content {
    padding-top: 150px;
  }

  .btn-lg {
    min-height: 80px;
    font-size: 1.5rem;
  }
}

/* 24인치 키오스크 (1366x768 ~ 1920x1080) */
@media (min-width: 1366px) and (max-width: 1919px) {
  :root {
    font-size: calc(1rem * var(--kiosk-24-scale));
  }

  .container-fluid {
    max-width: 1300px;
    margin: 0 auto;
  }

  .menu-card {
    min-height: 350px;
  }

  .hero-section {
    padding: 3rem !important;
  }

  .btn-lg {
    min-height: 70px;
    font-size: 1.3rem;
  }
}

/* 태블릿 (768px ~ 1365px) */
@media (min-width: 768px) and (max-width: 1365px) {
  .menu-card {
    min-height: 300px;
    margin-bottom: 2rem;
  }

  .hero-section {
    padding: 2.5rem !important;
  }

  .display-3 {
    font-size: 2.5rem !important;
  }

  .fs-1 {
    font-size: 1.8rem !important;
  }

  .fs-2 {
    font-size: 1.5rem !important;
  }

  .fs-3 {
    font-size: 1.3rem !important;
  }

  .fs-4 {
    font-size: 1.1rem !important;
  }

  .main-content {
    padding-top: 100px;
  }
}

/* 모바일 (최대 767px) */
@media (max-width: 767px) {
  .main-content {
    padding-top: 90px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .hero-section {
    padding: 2rem !important;
  }

  .display-3 {
    font-size: 2rem !important;
  }

  .fs-1 {
    font-size: 1.5rem !important;
  }

  .fs-2 {
    font-size: 1.3rem !important;
  }

  .fs-3 {
    font-size: 1.1rem !important;
  }

  .fs-4 {
    font-size: 1rem !important;
  }

  .menu-card {
    min-height: 250px;
    margin-bottom: 1.5rem;
  }

  .menu-card .card-body {
    padding: 2rem !important;
  }

  .icon-wrapper i {
    font-size: 3rem !important;
  }

  .navbar-brand span {
    font-size: 1.5rem !important;
  }

  .navbar-brand i {
    font-size: 1.5rem !important;
  }

  .btn-lg {
    min-height: 50px;
    font-size: 1rem;
  }

  .feature-badge {
    position: static;
    margin-top: 1rem;
  }

  .alert {
    padding: 2rem !important;
  }

  .alert h4 {
    font-size: 1.3rem !important;
  }

  .alert p {
    font-size: 1rem !important;
  }
}

/* 초소형 모바일 (최대 480px) */
@media (max-width: 480px) {
  .main-content {
    padding-left: 10px;
    padding-right: 10px;
  }

  .hero-section {
    padding: 1.5rem !important;
  }

  .display-3 {
    font-size: 1.8rem !important;
  }

  .menu-card {
    min-height: 200px;
  }

  .menu-card .card-body {
    padding: 1.5rem !important;
  }

  .icon-wrapper i {
    font-size: 2.5rem !important;
  }

  .tip-content {
    padding: 1rem !important;
  }

  .tip-content p {
    font-size: 0.9rem !important;
    margin-bottom: 0.5rem !important;
  }
}

/* 가로 모드 태블릿 */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  .main-content {
    padding-top: 80px;
  }

  .hero-section {
    padding: 2rem !important;
  }

  .menu-card {
    min-height: 280px;
  }
}

/* 터치 디바이스 최적화 */
@media (hover: none) and (pointer: coarse) {
  .menu-card:hover {
    transform: none;
  }

  .menu-card:active {
    transform: scale(0.98);
    transition: transform 0.1s ease;
  }

  .btn:hover {
    transform: none;
  }

  .btn:active {
    transform: scale(0.95);
  }
}

/* 고해상도 디스플레이 */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .menu-card {
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12) !important;
  }
}

/* 다크 모드 지원 */
@media (prefers-color-scheme: dark) {
  .bg-gradient {
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
  }

  .menu-card {
    background: rgba(255, 255, 255, 0.1) !important;
    color: white;
  }

  .hero-section {
    background: rgba(255, 255, 255, 0.1) !important;
    color: white;
  }

  .navbar {
    background: rgba(0, 0, 0, 0.8) !important;
    color: white;
  }
}