/**
 * 작명(이름 획수/음오행) 패널 및 음원오행 리포트 스타일
 * pro/report/naming.php, naming-eum.php 에서 사용.
 * font-size는 em 사용 → 테마 모바일 글자크기(ts_up/ts_up2)가 #container에 적용될 때 본문·리포트 텍스트에도 반영됨.
 */

/* ========== naming-panel (naming.php) ========== */
.naming-panel .naming-desc { color: var(--text-secondary); margin-bottom: 1rem; font-size: 0.95em; }
.naming-panel .naming-input-group { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 1.5rem; }
.naming-panel .naming-input-group label { font-weight: 600; color: var(--text-primary); }
.naming-panel .naming-input-group input[type="number"] { width: 80px; padding: 8px 12px; border: 1px solid var(--border-color); border-radius: 4px; background: var(--input-bg); color: var(--text-primary); }
.naming-panel .naming-input-group button { padding: 8px 20px; background: var(--button-bg); color: var(--button-text); border: none; border-radius: 4px; cursor: pointer; }
.naming-panel .naming-input-group button:hover { background: var(--link-hover); }
.naming-panel .naming-result { margin-top: 1.5rem; padding: 1.25rem; background: var(--bg-secondary); color: var(--text-primary); border-radius: 8px; border: 1px solid var(--border-color); display: none; }
.naming-panel .naming-result.visible { display: block; }
.naming-panel .naming-result .sentence1 { font-size: 1.1em; font-weight: 700; color: var(--accent-color); margin-bottom: 0.25rem; }
.naming-panel .naming-result .sentence2 { font-size: 0.95em; color: var(--text-secondary); margin-bottom: 0.75rem; }
.naming-panel .naming-result .data { line-height: 1.7; color: var(--text-primary); white-space: pre-wrap; }
.naming-panel .naming-tabs { display: flex; gap: 4px; margin-bottom: 1rem; }
.naming-panel .naming-tab { padding: 8px 14px; border: 1px solid var(--border-color); background: var(--input-bg); color: var(--text-primary); border-radius: 4px; cursor: pointer; font-size: 0.9em; }
.naming-panel .naming-tab:hover { background: var(--bg-secondary); }
.naming-panel .naming-tab.active { background: var(--button-bg); color: var(--button-text); border-color: var(--button-bg); }
.naming-panel .naming-tab-content { display: none; }
.naming-panel .naming-tab-content.active { display: block; }
.naming-panel .naming-settings-btn { margin-right: 4px; padding: 4px 8px; background: transparent; border: 1px solid var(--border-color); border-radius: 4px; cursor: pointer; font-size: 0.9em; color: var(--text-primary); }
.naming-panel .naming-settings-btn:hover { background: var(--bg-secondary); }
.naming-panel .naming-settings-dropdown { position: absolute; top: 100%; right: 0; margin-top: 4px; min-width: 240px; padding: 12px; background: var(--bg-primary); color: var(--text-primary); border: 1px solid var(--border-color); border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.15); z-index: 100; display: none; }
.naming-panel .naming-settings-dropdown.open { display: block; }
.naming-panel .naming-settings-dropdown label { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 0.9em; color: var(--text-primary); }
.naming-panel .naming-settings-note { margin: 8px 0 0; font-size: 0.75em; }
.naming-panel .naming-settings-item-spacer { margin-top: 10px; }
.naming-panel .window-panel-header-buttons { position: relative; }

/* ========== naming-eum (naming-eum.php) ========== */
.naming-eum section { margin-bottom: 1.5rem; padding-bottom: 1rem; border-bottom: 1px solid var(--border-color); }
.naming-eum section:last-child { border-bottom: 0; }
.naming-eum h4 { font-size: 1em; margin-bottom: 0.5rem; color: var(--accent-color); }
.naming-eum .ohang-select { display: flex; flex-wrap: wrap; gap: 6px; margin: 0.5rem 0; }
.naming-eum .ohang-btn { padding: 6px 12px; border: 1px solid var(--border-color); border-radius: 4px; background: var(--input-bg); color: var(--text-primary); cursor: pointer; }
.naming-eum .ohang-btn.active { background: var(--button-bg); color: var(--button-text); border-color: var(--button-bg); }
.naming-eum .consonant-list { display: flex; flex-wrap: wrap; gap: 4px; margin: 0.5rem 0; }
.naming-eum .char-tier { margin-bottom: 1rem; }
.naming-eum .char-tier-title { font-size: 0.85em; color: var(--text-secondary); margin-bottom: 0.35rem; font-weight: 600; }
.naming-eum .char-grid { display: flex; flex-wrap: wrap; gap: 4px; margin: 0.5rem 0; max-height: 120px; overflow-y: auto; }
.naming-eum .char-cell { padding: 4px 8px; border: 1px solid var(--border-color); border-radius: 3px; cursor: pointer; font-size: 0.95em; color: var(--text-primary); background: var(--input-bg); }
.naming-eum .char-cell:hover { background: var(--bg-secondary); }
.naming-eum .char-cell-readonly { cursor: default; background: var(--bg-tertiary); color: var(--text-secondary); }
.naming-eum .char-cell-readonly:hover { background: var(--bg-tertiary); }
.naming-eum .combo-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0.5rem 0; }
.naming-eum .combo-row select { padding: 6px 10px; background: var(--input-bg); color: var(--text-primary); border: 1px solid var(--border-color); }
.naming-eum .eum-name-row-label { font-weight: 600; min-width: 5.5em; color: var(--text-primary); font-size: 0.9em; }
.naming-eum .combo-slot { margin-bottom: 0.75rem; }
.naming-eum .combo-slot-label { font-size: 0.85em; color: var(--text-secondary); margin-right: 8px; font-weight: 600; min-width: 6em; }
.naming-eum .combo-slot-chars { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.naming-eum input[type="text"].naming-name { width: 120px; padding: 8px; background: var(--input-bg); color: var(--text-primary); border: 1px solid var(--border-color); }
.naming-eum .eum-result, .naming-eum .hanja-result { margin-top: 0.75rem; padding: 0.75rem; background: var(--bg-secondary); color: var(--text-primary); border-radius: 6px; font-size: 0.9em; white-space: pre-wrap; border: 1px solid var(--border-color); }
.naming-eum .hanja-table { width: 100%; border-collapse: collapse; font-size: 0.85em; }
.naming-eum .hanja-table th, .naming-eum .hanja-table td { border: 1px solid var(--table-border); padding: 4px 8px; text-align: left; background: var(--table-bg); color: var(--text-primary); }
.naming-eum .name-cells-row { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin: 0.5rem 0; }
.naming-eum .name-cell-wrap { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.naming-eum .name-cell-wrap label { font-size: 0.7em; color: var(--text-secondary); }
.naming-eum .name-cell { width: 2.2em; height: 2.2em; text-align: center; font-size: 1.25em; border: 1px solid var(--border-color); border-radius: 6px; padding: 0; background: var(--input-bg); color: var(--text-primary); }
.naming-eum .name-cell:focus { border-color: var(--button-bg); outline: none; box-shadow: 0 0 0 2px var(--accent-color); }
.naming-eum .name-cell.active { border-color: var(--button-bg); background: var(--bg-secondary); }
.naming-eum .name-cell.hangul-clickable { cursor: pointer; }
.naming-eum .name-cell.hangul-clickable:hover { background: var(--bg-secondary); }
.naming-eum .name-cell.name-cell-twosung { background: var(--bg-tertiary); color: var(--text-secondary); cursor: default; }
.naming-eum .name-cell.name-cell-twosung:focus { border-color: var(--border-color); box-shadow: none; background: var(--bg-tertiary); }
.naming-eum .name-cell.name-cell-twosung:hover { background: var(--bg-tertiary); }
.naming-eum .eum-direct-hanja-panel { margin-top: 0.75rem; padding: 0.75rem; background: var(--bg-secondary); border-radius: 6px; border: 1px solid var(--border-color); display: none; max-height: 200px; overflow-y: auto; }
.naming-eum .eum-direct-hanja-panel.open { display: block; }
.naming-eum .eum-direct-hanja-panel .hanja-panel-title { font-size: 0.85em; color: var(--accent-color); margin-bottom: 0.5rem; font-weight: 600; }
.naming-eum .eum-direct-hanja-grid { display: flex; flex-wrap: wrap; gap: 6px; }
.naming-eum .eum-direct-hanja-cell { padding: 6px 10px; border: 1px solid var(--border-color); border-radius: 4px; background: var(--input-bg); color: var(--text-primary); cursor: pointer; font-size: 1em; }
.naming-eum .eum-direct-hanja-cell:hover { background: var(--bg-secondary); border-color: var(--button-bg); }
/* 리포트 결과: 섹션 제목(※ 음오행, ※ 삼원오행 등) */
.naming-eum .report-section-title { margin-top: 30px; font-size: 1.3em; font-weight: 700; color: var(--text-primary); }
/* 리포트 결과: 해설 문장 강조(음오행/삼원오행 SENTENCE) */
.naming-eum .report-sentence { margin-top: 15px; font-size: 1.5em; font-weight: 500; color: var(--accent-color); }
.naming-eum .report-count-sentence { font-size: 1.1em; font-weight: 700; color: var(--accent-color); }
.naming-eum .report-data { font-size: 0.9em; }
.naming-eum .naming-desc { color: var(--text-secondary); }
.naming-eum .naming-desc-lead { font-size: 0.9em; }
.naming-eum .naming-desc-note { font-size: 0.8em; margin-top: -0.5rem; }
.naming-eum .naming-combo-hint { font-size: 0.85em; }
.naming-eum .naming-ji-note { font-size: 0.8em; }
.naming-eum .naming-hanja-search-input { width: 6em; padding: 6px 8px; box-sizing: border-box; }
.naming-eum .naming-more-note { font-size: 0.8em; color: var(--text-secondary); }
.naming-eum .naming-hidden { display: none !important; }

/* 감명(성명·분석) 탭: 작명 전용 기능 숨김 — 동일 DOM, 클래스만 토글 */
.naming-gammyeong .naming-eum-hide-in-gammyeong { display: none !important; }
