@charset "utf-8";

// [HQ] style.css
// Version: v9.0.0 (Monochrome & Zero-Line)
// Date: 2026-01-18
// [디자인 컨셉]
// 1. 파란색 전면 제거 -> 무광 회색(Gray Scale)으로 모던화
// 2. 가로 구분선 완전 제거 -> 불필요한 라인을 없애 공간감 확보
// 3. 다크모드 입력창 가시성 -> 밝은 회색 배경 + 검정 글씨 고정

/* ==========================================================================
   1. 통합 컬러 시스템 (Variables)
   ========================================================================== */
:root {
  --bo-text-main: #212529;
  --bo-border: #dee2e6;
  --bo-accent: #6c757d; /* 메인 회색 */
  --bo-accent-hover: #495057; /* 호버 회색 */

  /* 입력창 (라이트) */
  --bo-input-bg: #ffffff;
  --bo-input-text: #212529;
}

/* [다크 모드 변수] */
html[data-bs-theme="dark"] :root,
body.na-dark :root {
  --bo-bg-body: #121212;
  --bo-text-main: #ffffff; /* 글자색 흰색 고정 */
  --bo-border: transparent; /* 구분선 제거를 위해 투명화 */

  /* [중요] 입력창: 배경은 밝게, 글자는 검정 */
  --bo-input-bg: #e9ecef;
  --bo-input-text: #212529;

  /* 포인트 컬러: 파란색 대신 회색 */
  --bo-accent: #adb5bd;
  --bo-accent-hover: #ced4da;
}

/* ==========================================================================
   2. [입력창 & AI선택박스] 가독성 (최우선 강제 적용)
   - 검정색 배경 절대 금지
   ========================================================================== */
html body .form-control,
html body .custom-select,
html body textarea,
html body input[type="text"],
html body select,
html body .admin-ai-toolbar select {
  background-color: #f2f2f2 !important; /* 밝은 회색 */
  color: #000000 !important; /* 검정 글씨 */
  border: 1px solid #ced4da !important;
  border-radius: 3px !important;
  box-shadow: none !important;
}

/* 포커스 시 효과 */
html body .form-control:focus,
html body textarea:focus {
  background-color: #ffffff !important;
  border-color: #999 !important;
  outline: none !important;
}

/* AI 툴바 및 댓글 박스 배경 보정 */
html body.na-dark .cmt-box,
html body.na-dark .admin-ai-toolbar {
  background-color: #e9ecef !important;
  border: 1px solid #ced4da !important;
  color: #000000 !important;
}

/* 드롭다운 옵션 */
html body option {
  background-color: #ffffff !important;
  color: #000000 !important;
}

/* ==========================================================================
   3. [목록 디자인] 가로줄 제거 & 파란색 박멸
   ========================================================================== */

/* [핵심] 목록 가로 구분선 완전 삭제 */
html body #bo_list .border-bottom,
html body.na-dark #bo_list .border-bottom,
html[data-bs-theme="dark"] #bo_list .border-bottom {
  border: none !important;
  border-bottom: 0 !important;
}

/* 글자색: 선명한 흰색 */
html body.na-dark .na-subject,
html body.na-dark #bo_list a,
html body.na-dark #bo_list span {
  color: #ffffff !important;
  text-decoration: none !important;
}

/* 파란색(text-primary) 무력화 -> 흰색/회색으로 변경 */
html body.na-dark .text-primary,
html body.na-dark a.text-primary,
html body.na-dark .bg-light .text-primary {
  color: #ffffff !important;
  background: none !important;
  font-weight: normal !important;
}

/* '열람' 뱃지 등 -> 파란색 대신 무채색 뱃지로 변경 */
html body.na-dark .bg-light .na-text.text-primary {
  background-color: #6c757d !important; /* 회색 배경 */
  color: #ffffff !important; /* 흰색 글자 */
  padding: 2px 5px;
  border-radius: 2px;
  font-size: 11px;
}

/* ==========================================================================
   4. [버튼] 무광 회색 (Monochrome)
   ========================================================================== */

/* 쓰기, 검색 버튼 (btn-primary) -> 파란색 제거 후 회색 적용 */
html body .btn-primary,
html body.na-dark .btn-primary {
  background-color: #6c757d !important; /* 무광 회색 */
  border-color: #6c757d !important;
  color: #ffffff !important;
  border-radius: 3px !important;
}
html body .btn-primary:hover {
  background-color: #495057 !important;
}

/* 일반 버튼 (btn-basic) */
html body.na-dark .btn_b01,
html body.na-dark .btn-basic {
  background-color: #343a40 !important;
  border-color: #495057 !important;
  color: #ffffff !important;
}

/* ==========================================================================
   5. [페이지네이션] 통일감 있는 회색
   ========================================================================== */
.pagination .page-item .page-link {
  background-color: #212529 !important;
  border-color: #333 !important;
  color: #e9ecef !important;
  margin: 0 2px;
}
.pagination .page-item.active .page-link {
  background-color: #6c757d !important; /* 활성 페이지 회색 */
  border-color: #6c757d !important;
  color: #ffffff !important;
}