/*
Theme Name: CheckPomi Boost Final
Author: Gemini
Description: Bootstrap 5 based light-weight Adsense optimized theme with 11-language support, dark mode, and mobile readability tuning.
Version: 1.6
*/

/* ==========================================================
   0. 컬러 변수 (라이트 / 다크)
   ========================================================== */
:root {
  --pomi-bg: #f8f9fa;
  --pomi-text: #333333;
  --pomi-card-bg: #ffffff;
  --pomi-border: #dee2e6;
  --pomi-muted: #6c757d;
  --pomi-link: #0d6efd;
  --pomi-navbar-bg: #ffffff;
  --pomi-footer-bg: #212529;
  --pomi-footer-text: #ffffff;
  --pomi-shadow: rgba(0, 0, 0, 0.05);
  --pomi-ad-bg: #ffffff;
  --pomi-ad-border: #eeeeee;
  color-scheme: light;
}

[data-theme="dark"] {
  --pomi-bg: #14151a;
  --pomi-text: #e6e6e6;
  --pomi-card-bg: #1e1f24;
  --pomi-border: #33343a;
  --pomi-muted: #a0a0a8;
  --pomi-link: #6ea8fe;
  --pomi-navbar-bg: #1a1b20;
  --pomi-footer-bg: #0c0d10;
  --pomi-footer-text: #e6e6e6;
  --pomi-shadow: rgba(0, 0, 0, 0.4);
  --pomi-ad-bg: #1e1f24;
  --pomi-ad-border: #33343a;
  color-scheme: dark;
}

/* 부드러운 전환 */
body, .navbar, .card, .ad-container, footer,
.entry-content table, .entry-content th, .entry-content td {
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

/* ==========================================================
   1. 기본 스타일
   ========================================================== */
body {
    font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, Roboto, sans-serif;
    line-height: 1.8;
    color: var(--pomi-text);
    background-color: var(--pomi-bg);
}

@font-face { font-family: 'Pretendard'; font-display: swap; }

a { color: var(--pomi-link); }

/* Bootstrap 유틸리티 클래스를 다크 모드에 맞춰 재정의 */
[data-theme="dark"] .navbar,
[data-theme="dark"] .bg-white { background-color: var(--pomi-navbar-bg) !important; }
[data-theme="dark"] .bg-light { background-color: var(--pomi-card-bg) !important; }
[data-theme="dark"] .text-dark { color: var(--pomi-text) !important; }
[data-theme="dark"] .text-muted,
[data-theme="dark"] .text-secondary { color: var(--pomi-muted) !important; }
[data-theme="dark"] .border,
[data-theme="dark"] .border-bottom,
[data-theme="dark"] .border-top { border-color: var(--pomi-border) !important; }
[data-theme="dark"] .card { background-color: var(--pomi-card-bg); color: var(--pomi-text); }
[data-theme="dark"] .shadow-sm { box-shadow: 0 0 10px var(--pomi-shadow) !important; }
[data-theme="dark"] .badge.bg-light { background-color: var(--pomi-border) !important; color: var(--pomi-text) !important; }
[data-theme="dark"] .navbar-toggler-icon {
  filter: invert(1) grayscale(100%);
}

/* 다크모드 토글 버튼 */
.pomi-theme-toggle {
  border: 1px solid var(--pomi-border);
  background: transparent;
  color: var(--pomi-text);
  border-radius: 50px;
  width: 40px;
  height: 40px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  cursor: pointer;
}
.pomi-theme-toggle:hover { background-color: var(--pomi-border); }
.theme-icon-dark { display: none; }
[data-theme="dark"] .theme-icon-light { display: none; }
[data-theme="dark"] .theme-icon-dark { display: inline; }

/* ==========================================================
   2. 본문(Entry Content) 스타일
   ========================================================== */
.entry-content { font-size: 1.125rem; overflow-wrap: break-word; word-break: keep-all; }

.entry-content table { width: 100%; border-collapse: collapse; margin: 0; border-radius: 8px; overflow: hidden; box-shadow: 0 0 10px var(--pomi-shadow); }
.entry-content th { background-color: var(--pomi-link); color: white; padding: 12px; }
.entry-content td { padding: 12px; border-bottom: 1px solid var(--pomi-border); background-color: var(--pomi-card-bg); color: var(--pomi-text); }

/* 표 가로 스크롤 래퍼 (functions.php에서 자동으로 감쌈) */
.table-scroll-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 20px 0; }
.table-scroll-wrap table { margin: 0; }

/* Ad Containers */
.ad-container { text-align: center; margin: 20px 0; min-height: 100px; background: var(--pomi-ad-bg); border: 1px solid var(--pomi-ad-border); display: flex; align-items: center; justify-content: center; flex-direction: column; }

/* ==========================================================
   3. 다국어 지원
   ========================================================== */
body.lang-ar,
[dir="rtl"] { direction: rtl; unicode-bidi: embed; }
body.lang-ar .ms-auto,
[dir="rtl"] .ms-auto { margin-right: auto !important; margin-left: 0 !important; }

/* 언어 스위처 — 밋밋한 텍스트 나열이 아니라 pill 형태로 표시 */
.sm-lang-switcher a {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--pomi-border);
  font-size: 0.8rem;
  color: var(--pomi-text) !important;
}
.sm-lang-switcher a:hover { background-color: var(--pomi-border); text-decoration: none; }

body.lang-ko-KR { font-family: 'Pretendard', 'Noto Sans KR', sans-serif; }
body.lang-ja { font-family: 'Hiragino Sans', 'Meiryo', sans-serif; }
body.lang-zh-CN, body.lang-zh-TW { font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif; }

/* ==========================================================
   4. 모바일 최적화 (~767.98px)
   ========================================================== */
@media (max-width: 767.98px) {
  body { font-size: 15px; }
  .entry-content { font-size: 1rem; line-height: 1.75; }
  .entry-content h1 { font-size: 1.5rem; }
  .entry-content h2 { font-size: 1.3rem; }
  .entry-content h3 { font-size: 1.15rem; }
  .entry-content th, .entry-content td { padding: 8px; font-size: 0.9rem; }
  h1.fw-bold { font-size: 1.5rem; }
  .ad-container { min-height: 60px; }
  .navbar-brand { font-size: 1.1rem; }

  /* 사이드바 sticky 해제 (모바일에서는 본문 아래로 스택) */
  aside .sticky-top { position: static !important; top: auto !important; }

  /* 터치 타겟 최소 크기 확보 */
  .btn, .navbar-toggler, .pomi-theme-toggle { min-height: 44px; }
}