/* 관리자 페이지 모바일 최적화 */

/* 모바일 입력 필드 최적화 */
@media (max-width: 768px) {
  /* 입력 필드 터치 영역 확대 */
  input[type="text"],
  input[type="email"],
  input[type="number"],
  input[type="tel"],
  input[type="url"],
  select,
  textarea {
    font-size: 16px !important; /* iOS 줌 방지 */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }
  
  /* 체크박스와 라디오 버튼 크기 증가 */
  input[type="checkbox"],
  input[type="radio"] {
    width: 20px !important;
    height: 20px !important;
    cursor: pointer;
  }
  
  /* 레이블 터치 영역 확대 */
  label {
    display: block;
    padding: 8px 0;
    cursor: pointer;
  }
  
  /* 버튼 터치 최적화 */
  button,
  .btn,
  [type="submit"],
  [type="button"] {
    min-height: 44px;
    padding: 12px 16px !important;
    font-size: 16px !important;
  }
  
  /* 파일 업로드 영역 개선 */
  .border-dashed {
    min-height: 120px;
    padding: 20px !important;
  }
  
  /* 이미지 미리보기 그리드 조정 */
  .grid-cols-3 {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.5rem !important;
  }
  
  /* 섹션 간격 조정 */
  .space-y-6 > * + * {
    margin-top: 1rem !important;
  }
  
  /* 카드 패딩 조정 */
  .p-6 {
    padding: 1rem !important;
  }
  
  /* 폼 액션 버튼 */
  .flex.gap-3 {
    gap: 0.75rem !important;
  }
  
  /* 스크롤 방지 */
  body {
    -webkit-overflow-scrolling: touch;
  }
  
  /* 관리자 레이아웃 높이 조정 */
  html.admin-layout,
  html.admin-layout body {
    height: 100%;
    overflow: hidden;
  }
  
  /* 메인 컨테이너 높이 조정 */
  .admin-container {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }
  
  /* 모바일 브라우저 여백 제거 */
  html.admin-layout,
  html.admin-layout body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    height: 100% !important;
    position: fixed !important;
    overflow: hidden !important;
  }
  
  /* 스크롤 가능한 메인 컨텐츠 */
  main.flex-1 {
    height: 100% !important;
  }
}

/* 태블릿 최적화 */
@media (min-width: 768px) and (max-width: 1024px) {
  /* 입력 필드 크기 조정 */
  input,
  select,
  textarea {
    font-size: 16px !important;
  }
  
  /* 버튼 크기 조정 */
  button,
  .btn {
    padding: 10px 20px !important;
  }
}

/* 가로 모드 최적화 */
@media (max-width: 896px) and (orientation: landscape) {
  /* TinyMCE 에디터 높이 조정 */
  .tox .tox-edit-area {
    min-height: 200px !important;
    max-height: 300px !important;
  }
  
  /* 섹션 간격 축소 */
  .space-y-6 > * + * {
    margin-top: 0.75rem !important;
  }
}

/* iOS 특정 스타일 */
@supports (-webkit-touch-callout: none) {
  /* iOS 입력 필드 스타일 */
  input,
  select,
  textarea {
    -webkit-user-select: text;
    user-select: text;
  }
  
  /* iOS 버튼 스타일 */
  button,
  .btn {
    -webkit-tap-highlight-color: transparent;
  }
}

/* 안드로이드 특정 스타일 */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  /* 안드로이드 입력 필드 포커스 */
  input:focus,
  select:focus,
  textarea:focus {
    outline-offset: 2px;
  }
}

/* 접근성 개선 */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* 다크 모드 지원 */
@media (prefers-color-scheme: dark) {
  /* 필요시 다크 모드 스타일 추가 */
}