/* 댓글 입력폼 간소화(SNS형) — 뉴스툰. form.rtc-form 안에서만 적용한다(기존 댓글 출력·다른 게시판 영향 없음).
   기존 newstoon.css 의 에디터 규칙(body.rt-newstoon #comment …)보다 뒤에 로드되고, 겹치는 속성은 !important 로 이긴다. */
.rtc-form { --rtc-bg: var(--c-bg, #0f1a2e); --rtc-bg2: var(--c-bg2, #16233d); --rtc-line: var(--c-line, #263556); --rtc-text: var(--c-text, #f7f7fa);
	--rtc-text2: var(--c-text2, #aab1c7); --rtc-brand: var(--c-brand, #956bff); --rtc-brand-hi: var(--c-brand-hi, #b49aff); }
.rtc-form.write_comment { display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 12px; row-gap: 8px; align-items: start; }
.rtc-form.write_comment::after { display: none; }
.rtc-form > .nt-cm-write-title { grid-column: 1 / -1; }
.rtc-avatar { grid-column: 1; grid-row: 2; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; overflow: hidden;
	border-radius: 50%; background: var(--rtc-bg2); color: var(--rtc-text2); }
.rtc-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rtc-box { grid-column: 2; grid-row: 2; position: relative; min-width: 0; border: 1px solid var(--rtc-line); border-radius: 16px; background: var(--rtc-bg); }
.rtc-box:focus-within, .rtc-box.is-focus { border-color: var(--rtc-brand); box-shadow: 0 0 0 3px rgba(149, 107, 255, .18); }
.rtc-form > .write_author, .rtc-form > .write_captcha { grid-column: 2; margin: 2px 0 0; }

/* CKEditor: 툴바·경로줄 숨김, 테두리·배경은 카드가 맡는다 */
.rtc-form .rx_ckeditor { min-height: 0 !important; }
.rtc-form .cke_chrome { border: 0 !important; border-radius: 16px 16px 0 0 !important; background: transparent !important; box-shadow: none !important; }
.rtc-form .cke_inner, .rtc-form .cke_contents { background: transparent !important; }
.rtc-form .cke_contents { height: 96px !important; }
.rtc-form .cke_top { display: none !important; }
.rtc-form.rtc-tools-on .cke_top { display: block !important; border-bottom: 1px solid var(--rtc-line) !important; }
.rtc-form .cke_bottom { display: none !important; }

/* 모바일 기본 편집기(simpleeditor) */
.rtc-form .rx_simpleeditor_wrapper { min-width: 0; }
.rtc-form .rx_simpleeditor { min-height: 96px; padding: 14px 16px; border: 0 !important; border-radius: 16px 16px 0 0; background: transparent !important; color: var(--rtc-text) !important; font-size: 14.5px; line-height: 1.6; resize: none; }

/* 안내 문구(에디터 본문 위에 겹쳐 놓고 클릭은 통과) */
.rtc-ph { position: absolute; left: 16px; top: 14px; z-index: 1; color: #7d869c; font-size: 14.5px; line-height: 1.5; pointer-events: none; }
.rtc-ph[hidden] { display: none; }

/* 첨부: 선택창은 기존 업로더 입력을 단추로 연다. 안내·선택 단추는 숨기고, 진행 막대·파일 목록만 남긴다 */
.rtc-form .xefu-container { margin: 0; padding: 0; border: 0 !important; border-radius: 0; background: transparent !important; }
.rtc-form .xefu-dropzone { margin: 0; padding: 0; border: 0 !important; background: transparent !important; min-height: 0; }
.rtc-form .xefu-act-selectfile { position: absolute !important; width: 1px; height: 1px; margin: -1px !important; padding: 0 !important; overflow: hidden; clip: rect(0 0 0 0); border: 0 !important; }
.rtc-form .xefu-dropzone-message, .rtc-form .upload_info { display: none !important; }
.rtc-form .xefu-progress-status { margin: 0; padding: 6px 14px 0; color: var(--rtc-text2); font-size: 12.5px; }
.rtc-form .xefu-progressbar { margin: 4px 14px 6px; }
.rtc-form .xefu-controll { display: none; margin: 0; padding: 6px 14px 0; border: 0; color: var(--rtc-text2); font-size: 12.5px; }
.rtc-form.rtc-has-files .xefu-controll { display: block; }
.rtc-form .xefu-list { margin: 0; padding: 0 14px; }
.rtc-form .xefu-list ul { margin: 0; padding: 6px 0 2px; }
.rtc-form .xefu-btn, .rtc-form .xefu-container input.xefu-btn { border: 1px solid var(--rtc-line); border-radius: 8px; background: var(--rtc-bg2); color: var(--rtc-text2); font-size: 12px; }

/* 하단 줄: 이모지·사진·파일·서식 / 우측 취소·등록 */
.rtc-bar { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 2px; padding: 6px 10px 10px 8px; }
.rtc-tool { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--rtc-text2); font: 700 14px/1 inherit; cursor: pointer; transition: background-color .14s, color .14s; }
.rtc-tool[hidden] { display: none; }
/* 파일 첨부·서식(Aa) 버튼은 숨긴다(기능·마크업은 그대로 — 사진 버튼이 같은 업로더 입력을 쓴다) */
.rtc-tool[data-rtc="file"], .rtc-tool[data-rtc="tools"] { display: none !important; }
.rtc-tool:hover, .rtc-tool:focus-visible, .rtc-tool[aria-pressed="true"], .rtc-tool[aria-expanded="true"] { background: rgba(149, 107, 255, .18); color: var(--rtc-brand-hi); outline: none; }
.rtc-aa { width: auto; min-width: 36px; padding: 0 8px; border-radius: 18px; font-size: 13px; letter-spacing: -.02em; }
.rtc-submit { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.rtc-form .btn_insert { height: 36px !important; min-height: 36px; padding: 0 20px; border: 0; border-radius: 8px; background: #8b5cf6; color: #101322; font-size: 14px; font-weight: 750; cursor: pointer; transition: background-color .14s; }
.rtc-form .btn_insert:hover { background: #7c4def; }
.rtc-form .nt-cm-cancel, .rtc-form .rtc-cancel { display: none; height: 36px !important; min-height: 36px; margin: 0; padding: 0 14px; border: 1px solid var(--rtc-line); border-radius: 8px; background: transparent; color: var(--rtc-text2); font-size: 13.5px; font-weight: 650; cursor: pointer; }
.rtc-form.is-reply .nt-cm-cancel, .rtc-form .rtc-cancel { display: inline-flex; align-items: center; }
.rtc-form .nt-cm-cancel:hover, .rtc-form .rtc-cancel:hover { border-color: var(--rtc-brand); color: var(--rtc-text); }

/* 이모지 팝오버 */
.rtc-emoji { position: absolute; left: 6px; bottom: calc(100% - 4px); z-index: 20; display: grid; grid-template-columns: repeat(8, 1fr); gap: 2px; width: min(310px, calc(100vw - 48px)); padding: 8px;
	border: 1px solid var(--rtc-line); border-radius: 12px; background: var(--rtc-bg2); box-shadow: 0 8px 24px rgba(0, 0, 0, .45); }
.rtc-emoji[hidden] { display: none; }
.rtc-emoji button { width: 100%; aspect-ratio: 1; padding: 0; border: 0; border-radius: 8px; background: transparent; font-size: 20px; line-height: 1; cursor: pointer; }
.rtc-emoji button:hover, .rtc-emoji button:focus-visible { background: rgba(149, 107, 255, .22); outline: none; }

/* 모바일: 프로필 이미지를 줄이고 카드를 가득 쓴다 */
@media (max-width: 720px) {
	.rtc-form.write_comment { grid-template-columns: 32px minmax(0, 1fr); column-gap: 8px; }
	.rtc-avatar { width: 32px; height: 32px; }
	.rtc-avatar svg { width: 18px; height: 18px; }
	.rtc-box { border-radius: 14px; }
	.rtc-ph { left: 12px; font-size: 14px; }
	.rtc-bar { padding: 4px 8px 8px 4px; }
	.rtc-form .btn_insert { padding: 0 18px; }
}

/* 인라인 수정: 그 댓글 본문 자리에 같은 입력폼을 끼운다(아바타는 댓글 줄에 이미 있다) */
.nt-edit-host { grid-column: 2 / -1; grid-row: 2; min-width: 0; }
body.rt-newstoon #comment .nt-edit-host .rtc-form.write_comment { display: block; margin: 0 !important; padding: 0 !important; border: 0 !important; }
.nt-edit-host .rtc-avatar { display: none; }