/* 댓글 입력폼 간소화(SNS형) — 경기분석(ranktipster 스킨). form.rtc-form 안에서만 적용한다.
   색은 사이트 토큰(--rt-*)을 읽고, 겹치는 기존 에디터 규칙(html[data-theme] .rtb-read .rtb-editor …)은 !important 로 이긴다. */
.rtc-form { --rtc-bg: var(--rt-surface, #0f1a2e); --rtc-bg2: var(--rt-surface-2, #16233d); --rtc-line: var(--rt-border, #263556); --rtc-text: var(--rt-text, #f7f7fa);
	--rtc-text2: var(--rt-text-2, #aab1c7); --rtc-brand: var(--rt-brand, #956bff); --rtc-brand-hi: var(--rt-accent-hover, #b49aff); }
.rtc-form[hidden] { display: none !important; }
.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-avatar { grid-column: 1; grid-row: 1; 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: 1; 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 > .rtb-cmt-fields, .rtc-form > .rtb-captcha { grid-column: 2; margin: 2px 0 0; }

/* CKEditor: 툴바·경로줄 숨김, 테두리·배경은 카드가 맡는다 */
.rtc-form .rx_ckeditor { min-height: 0 !important; }
.rtc-form .rtb-editor { margin: 0; }
.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 .rtb-btn-primary { height: 36px; min-height: 36px; padding: 0 20px; border: 0; border-radius: 8px; background: #8b5cf6; color: var(--rt-on-brand, #101322); font-size: 14px; font-weight: 750; cursor: pointer; transition: background-color .14s; }
.rtc-form .rtb-btn-primary:hover { background: #7c4def; color: var(--rt-on-brand, #101322); }
.rtc-form .rtb-cmt-cancel { height: 36px; 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 .rtb-cmt-cancel:hover { border-color: var(--rtc-brand); color: var(--rtc-text); }
.rtc-form .rtb-cmt-submit { margin: 0 0 0 auto; }

/* 이모지 팝오버 */
.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 .rtb-btn-primary { padding: 0 18px; }
}

/* 댓글 신고 링크(코어 공식 신고) — 다른 액션과 같은 크기, 색만 경고색 */
.rtb-cmt-act.is-report { color: var(--rt-danger, #b42318); }
.rtb-cmt-act.is-report:hover { background: var(--rt-danger-bg, rgba(251, 113, 133, .12)); color: var(--rt-danger, #b42318); }

/* PC(768px~) 경기분석 댓글 작성 폼 색: 청록 남색 토큰 대신 다크 인디고·퍼플. 포커스·등록 버튼은 단색 #7549eb, 글로우 없음. 모바일은 위의 기존 값 그대로. */
@media (min-width: 768px) {
	.rtc-form { --rtc-bg: rgba(14, 12, 46, .75); --rtc-bg2: rgba(124, 104, 255, .16); --rtc-line: rgba(149, 107, 255, .28); --rtc-text2: #b8bfd6; }
	.rtc-box:focus-within, .rtc-box.is-focus { border-color: #7549eb; box-shadow: none; }
	.rtc-ph { color: #98a2bf; }
	.rtc-form .rtb-btn-primary { background: #7549eb; color: #fff; }
	.rtc-form .rtb-btn-primary:hover { background: #8157f2; color: #fff; }
	.rtc-form .rtb-cmt-fields input[type="checkbox"] { accent-color: #7549eb; }
}

/* 모바일은 기존처럼 작성폼을 접어 두고 토글로 연다. PC(768px~)는 뉴스 상세처럼 토글·빈 댓글 안내 없이 항상 펼친다. 제목·알림 체크박스도 PC 에서만 보인다. */
.rtc-write-title, .rtc-notify { display: none; }
@media (max-width: 767px) {
	.rtc-form.write_comment.rtas-fold { display: none; }
}
@media (min-width: 768px) {
	.rtb-btn.rtb-cmt-toggle, .rtb-cmt-empty-hint { display: none; }
	.rtc-form > .rtc-write-title { display: block; grid-column: 1 / -1; margin: 0 0 4px; color: var(--rt-text, #f7f7fa); font-size: 15px; font-weight: 800; }
	.rtc-form > .rtc-write-title { grid-row: 1; }
	.rtc-form > .rtc-avatar, .rtc-form > .rtc-box { grid-row: 2; }
	.rtc-form .rtc-notify { display: inline-flex; align-items: center; gap: 6px; color: #b8bfd6; }
	.rtc-form .rtb-cmt-fields .rtb-check { font-size: 12px; }
}