@charset "utf-8";
/**
 * KBoard Q&A Skin - 의료진 Q&A 게시판
 */

:root {
	--dm-qa-primary: #1e293b;
	--dm-qa-primary-hover: #334155;
	--dm-qa-accent: #2563eb;
	--dm-qa-text: #1e293b;
	--dm-qa-text-muted: #64748b;
	--dm-qa-bg: #ffffff;
	--dm-qa-bg-alt: #f8fafc;
	--dm-qa-border: #e2e8f0;
	--dm-qa-radius: 8px;
	--dm-qa-font: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "Segoe UI", Roboto, "Noto Sans KR", sans-serif;
}

/* ============================================
   Q&A 전용 (status / category 컬럼)
   ============================================ */
.dm-notice-table thead .dm-notice-col-status {width:80px;}
.dm-notice-table thead .dm-notice-col-cat {width:110px;}
.dm-notice-row .dm-notice-col-status {text-align:center; padding:20px 8px;}
.dm-notice-row .dm-notice-col-cat {text-align:center;}

/* Q&A 상태 뱃지 - 공통 */
.dm-notice-qa-badge {display:inline-flex; align-items:center; justify-content:center; gap:5px; padding:6px 12px; font-size:11px; font-weight:700; border-radius:50px; letter-spacing:-0.1px; min-width:62px; line-height:1; position:relative; transition:all 0.2s;}
.dm-notice-qa-badge::before {content:''; width:5px; height:5px; border-radius:50%; flex-shrink:0;}

/* 대기 - 회색 */
.dm-notice-qa-badge-waiting {background:#f4f6fb; color:#8a93a8; border:1px solid #dde3ed;}
.dm-notice-qa-badge-waiting::before {background:#a8b2c5;}

/* 처리중 - 네이비 (펄스 효과) */
.dm-notice-qa-badge-processing {background:#eef2f9; color:#1e2a4a; border:1px solid #c8d1e3;}
.dm-notice-qa-badge-processing::before {background:#1e2a4a; animation:dmPulse 1.6s ease-in-out infinite;}

/* 답변완료 - 오렌지 (강조) */
.dm-notice-qa-badge-completed {background:linear-gradient(135deg, #ff6b1a 0%, #ff8642 100%); color:#fff; border:1px solid #ff6b1a; box-shadow:0 2px 6px rgba(255, 107, 26, 0.25);}
.dm-notice-qa-badge-completed::before {background:#fff;}

/* 펄스 애니메이션 (처리중 상태) */
@keyframes dmPulse {
	0%, 100% {opacity:1; transform:scale(1);}
	50% {opacity:0.4; transform:scale(0.85);}
}

/* 행 호버 시 뱃지 강조 */
.dm-notice-row:hover .dm-notice-qa-badge-waiting {background:#fff; border-color:#a8b2c5; color:#4a5468;}
.dm-notice-row:hover .dm-notice-qa-badge-processing {background:#fff; border-color:#1e2a4a;}
.dm-notice-row:hover .dm-notice-qa-badge-completed {box-shadow:0 4px 10px rgba(255, 107, 26, 0.35); transform:translateY(-1px);}

/* 카테고리 텍스트 */
.dm-notice-cat-text {display:inline-flex; align-items:center; padding:4px 12px; background:var(--dm-bg); color:var(--dm-text-sub); font-size:12px; font-weight:500; border-radius:50px; letter-spacing:-0.1px;}

/* ============================================
   반응형 - 태블릿
   ============================================ */
@media screen and (max-width: 1024px) {
	.dm-notice-table thead .dm-notice-col-cat {display:none;}
	.dm-notice-table tbody .dm-notice-col-cat {display:none;}
}

/* ============================================
   반응형 - 모바일 (카드형)
   ============================================ */
@media screen and (max-width: 768px) {
	/* Q&A 상태는 모바일 메타로 이동 */
	.dm-notice-table .dm-notice-col-status {display:none;}
	.dm-notice-mobile-meta .dm-notice-qa-badge {min-width:auto; padding:4px 10px; font-size:10px; gap:4px; margin-right:6px;}
	.dm-notice-mobile-meta .dm-notice-qa-badge::before {width:4px; height:4px;}
}



/* ============================================
   Q&A 뷰 - 질문 라벨 + 상태 뱃지
   ============================================ */
.dm-notice-doc-qa-tag {display:flex; align-items:center; justify-content:space-between; padding:20px 60px; background:linear-gradient(135deg, var(--dm-primary-light) 0%, #fff 100%); border-bottom:1px solid var(--dm-border-light); gap:12px; flex-wrap:wrap;}

.dm-notice-doc-qa-label {display:inline-flex; align-items:center; gap:10px; font-size:14px; font-weight:700; color:var(--dm-text); letter-spacing:-0.2px;}
.dm-notice-doc-qa-q {display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; background:var(--dm-primary); color:#fff; font-size:15px; font-weight:800; border-radius:50%; font-family:Georgia, serif; box-shadow:0 4px 10px rgba(255, 107, 26, 0.25);}

/* Q&A 상태 뱃지 (뷰페이지용 - 큰 사이즈) */
.dm-notice-doc-qa-tag .dm-notice-qa-badge {min-width:84px; padding:8px 16px; font-size:12px;}

/* ============================================
   Q&A 뷰 - 답변 영역
   ============================================ */
.dm-notice-doc-answer-wrap {margin-top:30px; background:#fff; border:1px solid var(--dm-border); border-radius:20px; overflow:hidden;}

.dm-notice-doc-answer-head {display:flex; align-items:center; justify-content:space-between; padding:24px 60px; background:linear-gradient(135deg, var(--dm-accent-light) 0%, #fff 100%); border-bottom:1px solid var(--dm-border-light); gap:12px; flex-wrap:wrap;}

.dm-notice-doc-answer-label {display:inline-flex; align-items:center; gap:10px; font-size:15px; font-weight:700; color:var(--dm-text); letter-spacing:-0.2px;}
.dm-notice-doc-answer-a {display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; background:var(--dm-accent); color:#fff; font-size:17px; font-weight:800; border-radius:50%; font-family:Georgia, serif; box-shadow:0 4px 10px rgba(30, 42, 74, 0.2);}

.dm-notice-doc-answer-status {display:inline-flex; align-items:center; gap:6px; padding:7px 16px; font-size:12px; font-weight:600; border-radius:50px; letter-spacing:-0.2px;}
.dm-notice-doc-answer-status::before {content:''; width:6px; height:6px; border-radius:50%; flex-shrink:0;}
.dm-notice-doc-answer-status {background:var(--dm-primary-light); color:var(--dm-primary); border:1px solid var(--dm-primary-border);}
.dm-notice-doc-answer-status::before {background:var(--dm-primary);}
.dm-notice-doc-answer-status.waiting {background:#f4f6fb; color:#8a93a8; border-color:#dde3ed;}
.dm-notice-doc-answer-status.waiting::before {background:#a8b2c5;}
.dm-notice-doc-answer-status.processing {background:var(--dm-accent-light); color:var(--dm-accent); border-color:#c8d1e3;}
.dm-notice-doc-answer-status.processing::before {background:var(--dm-accent); animation:dmPulse 1.6s ease-in-out infinite;}

/* 답변(댓글) 영역 여백.
   댓글 플러그인이 감싸는 요소는 .kboard-comments-default 이지 .kboard-comments 가 아니다.
   예전 선택자에만 여백을 주면 규칙이 걸리지 않아 내용이 답변 박스 테두리에 붙어
   정렬 select 가 박스 라인에 겹쳐 보인다. 여백은 바깥 래퍼에서 직접 준다. */
.dm-notice-doc-comments {padding:30px 60px !important; margin:0 !important;}
.dm-notice-doc-comments .kboard-comments,
.dm-notice-doc-comments .kboard-comments-default {padding:0 !important; margin:0 !important;}

/* ============================================
   반응형 - 태블릿
   ============================================ */
@media screen and (max-width: 1024px) {
	.dm-notice-doc-qa-tag {padding:18px 44px;}
	.dm-notice-doc-answer-head {padding:22px 44px;}
	.dm-notice-doc-comments {padding:24px 44px !important;}
}

/* ============================================
   반응형 - 모바일
   ============================================ */
@media screen and (max-width: 768px) {
	.dm-notice-doc-qa-tag {padding:16px 24px; gap:10px;}
	.dm-notice-doc-qa-q {width:28px; height:28px; font-size:13px;}
	.dm-notice-doc-qa-label {font-size:13px;}
	.dm-notice-doc-qa-tag .dm-notice-qa-badge {min-width:72px; padding:6px 12px; font-size:11px;}
	
	.dm-notice-doc-answer-wrap {margin-top:20px; border-radius:14px;}
	.dm-notice-doc-answer-head {padding:18px 24px; gap:10px;}
	.dm-notice-doc-answer-a {width:30px; height:30px; font-size:14px;}
	.dm-notice-doc-answer-label {font-size:13px;}
	.dm-notice-doc-answer-status {padding:5px 12px; font-size:11px;}
	.dm-notice-doc-comments {padding:20px 24px !important;}
}


/* ============================================
   Q&A 글쓰기 - 안내 박스
   ============================================ */
.dm-notice-editor-guide {display:flex; gap:16px; padding:20px 24px; margin-bottom:20px; background:linear-gradient(135deg, var(--dm-primary-light) 0%, #fff 100%); border:1px solid var(--dm-primary-border); border-radius:14px; align-items:flex-start;}

.dm-notice-editor-guide-icon {flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; background:var(--dm-primary); color:#fff; border-radius:50%; box-shadow:0 4px 10px rgba(255, 107, 26, 0.2);}

.dm-notice-editor-guide-text {flex:1; min-width:0;}
.dm-notice-editor-guide-text strong {display:block; margin-bottom:6px; font-size:14px; font-weight:700; color:var(--dm-text); letter-spacing:-0.2px;}
.dm-notice-editor-guide-text p {margin:0; font-size:13px; font-weight:400; color:var(--dm-text-sub); line-height:1.6; letter-spacing:-0.2px;}

/* qa_status 필드 - 관리자 전용 강조 */
.dm-notice-editor .kboard-attr-row:has(select[name="kboard_option_qa_status"]) {position:relative; padding:18px 20px !important; background:var(--dm-accent-light) !important; border-radius:10px !important; border:1px dashed var(--dm-accent) !important;}
.dm-notice-editor .kboard-attr-row:has(select[name="kboard_option_qa_status"])::before {content:'관리자 전용'; position:absolute; top:-8px; left:16px; padding:2px 10px; background:var(--dm-accent); color:#fff; font-size:10px; font-weight:700; border-radius:50px; letter-spacing:0.5px;}

/* ============================================
   반응형 - 모바일
   ============================================ */
@media screen and (max-width: 768px) {
	.dm-notice-editor-guide {padding:16px 18px; gap:12px; margin-bottom:16px; border-radius:12px;}
	.dm-notice-editor-guide-icon {width:34px; height:34px;}
	.dm-notice-editor-guide-icon svg {width:18px; height:18px;}
	.dm-notice-editor-guide-text strong {font-size:13px; margin-bottom:4px;}
	.dm-notice-editor-guide-text p {font-size:12px;}
}