/* ════════════════════════════════════════════════════════════════════
   AVA Admin — Design Polish Layer
   ════════════════════════════════════════════════════════════════════
   모든 페이지에 자동 적용되는 UX 마감재:
   - 접근성: focus 인디케이터, 콘트라스트, 키보드 네비
   - 모바일: 터치 타겟 ≥44px, font-size ≥16px (iOS 자동 줌 방지)
   - 인쇄: 깔끔한 출력 (네비·버튼 숨김)
   - 다크 모드: 시스템 prefers-color-scheme 대응 (선택)
   - 모션 감소: prefers-reduced-motion 대응
   ════════════════════════════════════════════════════════════════════ */

/* ── 1. 접근성: focus 인디케이터 ───────────────────────────
   키보드 (Tab 키) 네비게이션 사용자에게 명확한 표시
   마우스 클릭 시는 표시 X (focus-visible) */
*:focus-visible {
  outline: 2.5px solid #A88C64 !important;
  outline-offset: 2px !important;
  border-radius: 4px;
}
button:focus-visible, a:focus-visible {
  outline-offset: 3px !important;
}
input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline-offset: -2px !important;
  outline-color: #A88C64 !important;
}

/* ── 2. 모바일 터치 타겟 — 최소 44×44px (Apple HIG) ──────── */
@media (max-width: 768px) and (pointer: coarse) {
  button, a.btn, .btn, [role="button"] {
    min-height: 44px;
    min-width: 44px;
  }
  input, select, textarea {
    font-size: 16px !important;   /* iOS 자동 줌 방지 */
    min-height: 44px;
    padding: 10px 14px !important;
  }
  textarea { min-height: 88px; }
  /* 작은 아이콘 버튼은 padding 키워서 터치 영역 확장 */
  button.icon-btn, button.btn.small {
    padding: 10px 12px !important;
  }
}

/* ── 3. 비활성화 상태 일관성 ───────────────────────────── */
button:disabled, a.btn:disabled {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
  pointer-events: none;
}

/* ── 4. 로딩 스켈레톤 클래스 (대신 사용 가능) ───────────── */
.ava-skel {
  background: linear-gradient(90deg, #F5F2EC 0%, #FBFAF8 50%, #F5F2EC 100%);
  background-size: 200% 100%;
  animation: ava-skel 1.4s ease-in-out infinite;
  border-radius: 6px;
  color: transparent !important;
  user-select: none;
}
@keyframes ava-skel {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ── 5. 토글 / 체크박스 — 큰 터치 영역 ──────────────────── */
@media (pointer: coarse) {
  input[type="checkbox"], input[type="radio"] {
    width: 20px !important;
    height: 20px !important;
    accent-color: #A88C64;
    cursor: pointer;
  }
}

/* ── 6. 스크롤바 — 일관된 스타일 ──────────────────────── */
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: #d9cdb8; border-radius: 99px; }
*::-webkit-scrollbar-thumb:hover { background: #A88C64; }

/* ── 7. 모션 감소 (사용자 설정 존중) ─────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ── 8. 인쇄 ──────────────────────────────────────────── */
@media print {
  /* 네비·버튼·FAB 숨김 */
  .ava-nav-widget, .ava-sub-nav, .ava-pwa-banner,
  .voice-fab, .ai-toggle, .fab, .away-lock,
  button:not(.print-keep), .btn:not(.print-keep),
  nav, .toast, .modal-bg, .lightbox {
    display: none !important;
  }
  body { background: #fff !important; color: #000 !important; }
  /* 카드·섹션 — 페이지 분할 안 깨짐 */
  .card, .section, .chart-card { page-break-inside: avoid; }
  /* 링크 URL 표시 */
  a[href]:after { content: " (" attr(href) ")"; font-size: 9px; color: #888; }
  a[href^="javascript"]:after, a[href^="#"]:after { content: ''; }
  /* 사이드바 숨김 */
  .sidebar, aside { display: none !important; }
}

/* ── 9. 빈 상태 — 친절한 톤 ──────────────────────────── */
.ava-empty-friendly {
  padding: 60px 30px;
  text-align: center;
  color: #8b7c6d;
  font-family: 'Gowun Batang', 'Pretendard', serif;
  font-style: italic;
  font-size: 14px;
}
.ava-empty-friendly .ava-emoji-large {
  font-size: 48px;
  margin-bottom: 14px;
  display: block;
  opacity: 0.7;
}

/* ── 10. 다크 모드 미세 보정 (이미 admin/today에 사용) ─── */
[data-theme="dark"] *:focus-visible {
  outline-color: #C9A872 !important;
}

/* ── 11. 텍스트 선택 ───────────────────────────────── */
::selection {
  background: #A88C64;
  color: #fff;
}

/* ── 12. 링크 기본 ──────────────────────────────────── */
a {
  color: #A88C64;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

/* ── 13. 모바일 viewport 안전 영역 (iPhone notch) ─────── */
@supports (padding: env(safe-area-inset-top)) {
  body {
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
  }
}
/* (단, .shell 같은 자체 padding 가진 곳은 그대로) */

/* ── 14. PWA standalone 모드 — 추가 padding ──────────── */
@media (display-mode: standalone) {
  /* nav-widget이 자동으로 fixed top일 때 안전 영역 위에 표시되도록 */
  .ava-nav-widget {
    padding-top: calc(8px + env(safe-area-inset-top, 0px)) !important;
  }
}

/* ── 15. UI 요소 텍스트 드래그 방지 (메뉴·버튼·탭·헤더·라벨) ──────────
   본문 텍스트는 드래그 가능, 인터랙티브/네비/장식 요소만 user-select:none */
button,
a.btn, a.action-btn, a.sm, a.mm, a.tab,
.btn, .action-btn, .nav-btn,
.main-menu, .sub-menu, .top-bar, .topbar, .brand,
.tab, .tab-bar, .tab-btn, .rail, .rail-section, .rail-item,
.kpi-bar, .kpi, .kpi-card, .kpi-strip,
.section-head, .section-head h3,
.ava-nav-widget, .ava-nav-user,
.ava-help-fab, .ava-ai-fab,
.ava-ai-head, .ava-ai-quick,
.action-bar, .pill, .badge, .stp, .status-pill,
label.action-btn, label.btn,
.tabs, .toc, .toc a,
.sidebar, .sidebar-header, .item-btn, .item-btn .title, .item-btn .subtitle,
.detail-header, .pane-right, .category-group, .category-group h4,
.head h1, .head .sub, .head .actions,
.eyebrow, .brand-mark, .brand-sub,
h2[class*="head"], h3[class*="section"] {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

/* 본문 콘텐츠는 명시적으로 선택 가능 (위 규칙 override) */
.md, .md *,
.note, .notes,
input, textarea, [contenteditable="true"],
td, th,
.timeline-item, .tl-item, .quote, .body, .em-info-block,
.records, .receipt, .audit-row {
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

/* 메뉴 영역 마우스 드래그 시 ghost 이미지 방지 */
.main-menu .mm img, .sub-menu .sm img, .nav-btn img, .item-btn img {
  -webkit-user-drag: none;
  user-drag: none;
}

/* ── ★ AVA 심볼 폰트 (글로벌 — 모든 admin 페이지에서 일관) ──────────
   모든 페이지에서 .icon-icon-ava 가 같은 PUA U+E900 글리프를 같은 크기로 렌더.
   ava-symbol.ttf (legacy, 작은 글리프) 직접 로드 금지 — 메모리 룰. */
@font-face {
  font-family: 'icomoon';
  src: url('/fonts/icomoon.woff') format('woff'),
       url('/fonts/icomoon.ttf') format('truetype'),
       url('/fonts/icomoon.eot') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
.icon-icon-ava, [class^="icon-icon-ava"], [class*=" icon-icon-ava"] {
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: inline-block;
  vertical-align: baseline;
}
.icon-icon-ava::before { content: "\e900"; }

/* ─── 2026-05-10 UX: 글로벌 sticky header (재미나이 ①) ───
   모든 admin/SPA 의 long list table 에 자동 적용. 헤더가 스크롤 시 화면 상단에 고정.
   각 페이지가 자체 sticky 정의했으면 그 값이 우선. */
table thead th, .ava-sticky-header thead th, .stickyhd thead th {
  position: sticky;
  top: 0;
  z-index: 5;
}
/* 자식 요소가 overflow:hidden 이면 sticky 안 먹음 — visible 강제 */
table.ava-sticky-host, .ava-sticky-host table { overflow: visible; }

