@charset "utf-8";
/* =========================================================
   HAEBET Board — Modern, Simple, Trendy (FULL REWRITE)
   - Rhymix xedition 마크업 100% 호환
   - 다크/라이트 자동 톤: var(--*) + 안전한 fallback
   - PC=테이블, Mobile=2줄 컴팩트 리스트
   - 모바일: 날짜/조회 숨김 (요청사항)
   ========================================================= */

/* --------- Color tokens (fallback) --------- */
:root{
  --bg:#0b1118;         /* 페이지 배경 가정치 (없어도 무방) */
  --panel:#0f1720;
  --panel-2:#121b25;
  --line:#22303d;
  --fg:#e9eef6;
  --muted:#98a7b6;

  --brand:#21c2ff;
  --brand-2:#667aff;
}

/* --------- Base --------- */
.board,
.board label, .board table, .board input, .board button,
.board textarea, .board select{
  font-family: "Pretendard","Inter","Open Sans","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  font-size: 13px;
  color: var(--fg,#e9eef6);
}
.board img{ border:0; max-width:100%; height:auto }
.board .iCheck{ width:16px; height:16px; margin:0; vertical-align:middle }
.board .iText{
  padding:8px 10px; line-height:1.2;
  border:1px solid var(--line,#22303d);
  background:var(--panel,#0f1720);
  color:var(--fg,#e9eef6);
  border-radius:10px;
}

/* --------- Category Tabs --------- */
.cTab{ display:flex; gap:8px; margin:8px 0 12px; padding:0; list-style:none; border:0 }
.cTab li{ margin:0; border:0 }
.cTab li a{
  display:inline-flex; align-items:center; gap:6px;
  padding:10px 14px; border-radius:10px; font-size:13px; text-decoration:none;
  color:var(--fg,#e9eef6);
  background:var(--panel-2,#121b25);
  border:1px solid var(--line,#22303d);
  transition:.15s ease;
}
.cTab li.on a, .cTab li a:hover{
  background:var(--panel,#0f1720);
  border-color:var(--line,#22303d);
  box-shadow:0 6px 16px rgba(0,0,0,.18);
}

/* --------- List (PC: table-like cards) --------- */
.board_list{ background:transparent; border:0 }
.board_list table{
  width:100%; border-collapse:separate; border-spacing:0 10px;
  color:var(--fg,#e9eef6);
}
.board_list thead tr th{
  padding:8px 10px; border:0; color:var(--muted,#98a7b6); text-align:left; white-space:nowrap; font-weight:700;
}
.board_list thead tr th.title{ text-align:left }

.board_list tbody tr{
  background:var(--panel,#0f1720);
  border:1px solid var(--line,#22303d);
  box-shadow:0 8px 18px rgba(0,0,0,.18);
  border-radius:14px; overflow:hidden;
}
.board_list tbody tr:hover{
  background:var(--panel-2,#121b25);
  transform:translateY(-1px); transition:.18s ease;
}
.board_list td{
  padding:14px 12px; border:0; vertical-align:middle; color:var(--fg,#e9eef6);
}
.board_list tr:last-child td{ border:0 }

/* 공지 강조 */
.board_list tr.notice{
  background:linear-gradient(180deg, var(--panel,#0f1720), rgba(39,195,255,.07));
  border-color:rgba(39,195,255,.25);
}
.board_list tr.notice td.notice{
  width:74px; text-align:center; font-weight:900; color:#21c2ff;
}

/* 컬럼 폭/정렬 */
.board_list td.no{ width:74px; text-align:center; font-weight:800; color:var(--muted,#98a7b6) }
.board_list td.title{ width:auto; white-space:normal; line-height:1.5 }
.board_list td.title a{ color:var(--fg,#e9eef6); font-weight:700; text-decoration:none }
.board_list td.title a:hover{ text-decoration:underline }
.board_list td.author{ width:120px; color:var(--muted,#98a7b6) }
.board_list td.time{ width:110px; color:var(--muted,#98a7b6) }
.board_list td.readNum{ width:90px; color:var(--muted,#98a7b6); text-align:right }
.board_list td.check{ width:44px; text-align:center }

/* 첨부 아이콘/댓글 배지 */
.board_list .title img{ opacity:.7; margin-left:6px }
.board_list .replyNum{
  display:inline-block; margin-left:6px; padding:0 6px;
  font-size:11px; color:#9ecbff;
  background:rgba(59,130,246,.18);
  border:1px solid rgba(59,130,246,.28);
  border-radius:9999px;
}

/* --------- Footer row (buttons + search + pagination) --------- */
.btnArea{ display:flex; gap:8px; flex-wrap:wrap }
.board .btn{
  display:inline-flex; align-items:center; gap:6px;
  padding:8px 10px !important; height:auto !important; line-height:1 !important;
  background:var(--panel,#0f1720); color:var(--fg,#e9eef6) !important;
  border:1px solid var(--line,#22303d) !important; border-radius:10px; text-decoration:none !important;
}
.board .btn:hover{ background:var(--panel-2,#121b25) }

.board_search{
  display:flex;
  /* align-items:center; */
  gap:8px;
  justify-content: center;
  flex-wrap:wrap
}
.board_search select,
.board_search .iText{
  background:var(--panel,#0f1720); color:var(--fg,#e9eef6);
  border:1px solid var(--line,#22303d); border-radius:10px; padding:8px 10px; line-height:1.2;
}
.board_search .search_input{ position:relative }
.board_search .search_input .iText{ padding-left:30px }
.board_search .xi-magnifier{
  position:absolute; left:10px; top:50%; transform:translateY(-50%); color:var(--muted,#98a7b6)
}
.board_search .btn{
  background:linear-gradient(90deg, var(--brand,#21c2ff), var(--brand-2,#667aff)) !important;
  color:#fff !important; border:0 !important;
}

/* --------- Pagination --------- */
.pagination{ display:flex; gap:6px; justify-content:center; align-items:center; padding:12px 0; clear:both }
.pagination a, .pagination strong{
  min-width:34px; text-align:center; padding:8px 10px; border-radius:10px; font-weight:800;
  background:var(--panel,#0f1720); border:1px solid var(--line,#22303d); color:var(--fg,#e9eef6);
}
.pagination strong{
  background:linear-gradient(90deg, var(--brand,#21c2ff), var(--brand-2,#667aff)); border:0; color:#fff
}
.pagination .direction{ padding:8px 12px }

/* =========================================================
   READ (상세)
========================================================= */
.board .board_read{ margin-bottom:22px }
.board .read_header{
  padding:20px 18px 14px;
  border:1px solid var(--line,#22303d);
  border-radius:14px;
  background:var(--panel,#0f1720);
  box-shadow:0 8px 18px rgba(0,0,0,.18);
}
.board .read_header h1{
  margin:0 0 8px 0; font-size:22px; line-height:1.35; font-weight:800; color:var(--fg,#e9eef6);
}
.board .read_header h1 .category{
  display:inline-block; margin-right:10px; padding:4px 8px;
  border:1px solid var(--line,#22303d); border-radius:999px;
  font-size:12px; color:var(--brand,#21c2ff);
  background:rgba(33,194,255,.08);
}
.board .read_header .meta{
  border:0; margin:4px 0 0; padding:0;
  display:flex; flex-wrap:wrap; gap:10px;
  color:var(--muted,#98a7b6);
}
.board .read_header .meta > span{ display:inline-flex; align-items:center; gap:6px; }

.board .read_body{
  margin-top:14px; padding:22px 18px;
  border:1px solid var(--line,#22303d);
  border-radius:14px; background:var(--panel-2,#121b25);
}
.board .read_body .xe_content{ color:var(--fg,#e9eef6); line-height:1.75; font-size:15px }
.board .read_body .xe_content p{ margin:0 0 12px }

/* 글 내 프로모션 카드 */
.board .read_body .promotion-details{
  max-width:560px; margin:18px auto; text-align:center;
  background:linear-gradient(180deg, rgba(39,195,255,.06), rgba(102,122,255,.06));
  border:1px solid rgba(39,195,255,.25); border-radius:14px; padding:18px;
}
.board .read_body .promotion-details .bonus-text{ opacity:.95 }

/* 푸터: SNS / 추천 / 버튼 */
.board .read_footer{ margin-top:18px }
.board .read_footer .sns ul{ display:flex; gap:10px; justify-content:center; padding:0; margin:0 0 6px; list-style:none }
.board .read_footer .sns li{ list-style:none }
.board .read_footer .sns a{
  width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:10px; border:1px solid var(--line,#22303d); background:var(--panel,#0f1720);
  transition:transform .15s ease, border-color .15s ease, background .15s ease;
}
.board .read_footer .sns i{ font-size:18px; color:var(--muted,#98a7b6) }
.board .read_footer .sns a:hover{ background:var(--panel-2,#121b25) }

.board .read_footer .vote ul{ display:flex; gap:10px; justify-content:center; padding:8px 0 0; margin:0; list-style:none }
.board .read_footer .vote li{ list-style:none }
.board .read_footer .vote a{
  width:120px; height:70px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  border-radius:14px; border:1px solid var(--line,#22303d); background:var(--panel,#0f1720);
  color:var(--fg,#e9eef6); text-decoration:none; font-weight:700;
}
.board .read_footer .vote i{ font-size:20px; color:var(--muted,#98a7b6); margin-bottom:6px }
.board .read_footer .vote a:hover{ background:var(--panel-2,#121b25) }

.board .read_footer .btnArea{ display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end }

/* 댓글 박스 */
.feedback{
  margin-top:18px; border:1px solid var(--line,#22303d); border-radius:14px; background:var(--panel,#0f1720)
}
.feedback .fbHeader{ height:auto; padding:14px 16px; border-top:0; border-bottom:1px solid var(--line,#22303d) }
.feedback .fbHeader h2{ display:flex; align-items:center; gap:8px; margin:0; color:var(--fg,#e9eef6) }
.write_comment{ margin:0; padding:14px 16px 18px }
.write_comment textarea{
  width:100%; height:120px; border-radius:10px;
  background:var(--panel-2,#121b25); border:1px solid var(--line,#22303d);
  color:var(--fg,#e9eef6)
}
.write_author .iText{ background:var(--panel-2,#121b25); border:1px solid var(--line,#22303d); color:var(--fg,#e9eef6) }
.board .btn_insert{
  border-radius:10px; background:linear-gradient(90deg, var(--brand,#21c2ff), var(--brand-2,#667aff));
  height:40px; padding:0 14px; border:0; color:#fff;
}

/* 업로더 톤 */
.xefu-container .xefu-dropzone{
  border:1px dashed var(--line,#22303d); background:var(--panel-2,#121b25);
  border-radius:12px; padding:12px; color:var(--muted,#98a7b6)
}
.xefu-container .xefu-btn{
  background:var(--panel,#0f1720); border:1px solid var(--line,#22303d);
  border-radius:10px; color:var(--fg,#e9eef6)
}


/* =========================================================
   Responsive
========================================================= */

/* 검색 버튼 모바일에서 꽉 차지 않도록 */
@media (max-width:820px){
  .list_footer{ grid-template-columns:1fr }
  .board_search .btn{ width:auto }
}

/* 모바일 리스트 — 컴팩트 2줄, 날짜/조회 숨김 */
@media (max-width:740px){

  /* 테이블 파편 → 블록화 (thead 숨김) */
  .board_list table,
  .board_list thead,
  .board_list tbody,
  .board_list tr,
  .board_list th,
  .board_list td{ display:block; width:100%; border:0; }
  .board_list thead{ display:none; }

  /* 행: 카드박스 제거 + 얇은 구분선 */
  .board_list tbody tr{
    margin:0; padding:14px 16px 12px;
    background:transparent !important; border:0 !important; border-radius:0 !important; box-shadow:none !important;
    position:relative;
  }
  .board_list tbody tr::after{
    content:""; position:absolute; left:16px; right:16px; bottom:0; height:1px;
    background:rgba(255,255,255,.08);
  }
  .board_list tbody tr:last-child::after{ display:none; }
  .board_list tbody tr:hover{ background:rgba(255,255,255,.02) !important; }
  .board_list tbody tr:active{ background:rgba(255,255,255,.04) !important; }

  .board_list td{ padding:0; margin:0; white-space:normal; }

  /* 불필요 요소 숨김 */
  .board_list td.no,
  .board_list td.check,
  .board_list td.notice:not(.title){ display:none !important; }

  /* 제목: 2줄 클램프 + 얇은 chevron */
  .board_list td.title{padding-right:28px;margin-bottom:6px;}
  .board_list td.title a{
    /* display:-webkit-box; */
    /* -webkit-line-clamp:2; */
    /* -webkit-box-orient:vertical; */
    /* overflow:hidden; */
    font-size:16px;
    /* line-height:1.5; */
    /* font-weight:700; */
    color:#e9edf3;
    text-decoration: none !important;
    /* position:relative; */
    /* padding-right:20px; */
  }
  .board_list td.title a::after{
    content:"";
    position:absolute;
    right: 12px;
    top:50%;
    width:8px;
    height:8px;
    margin-top:-6px;
    border-right:2px solid rgba(255,255,255,.35);
    border-top:2px solid rgba(255,255,255,.35);
    transform:rotate(45deg);
  }

  /* 공지 배지 */
  .board_list tbody tr.notice td.title a::before{
    content:"공지"; display:inline-block; margin-right:8px; padding:2px 6px;
    font-size:11px; line-height:1; color:#9ecbff;
    background:rgba(59,130,246,.15); border:1px solid rgba(59,130,246,.35);
    border-radius:9999px; vertical-align:1px;
  }

  /* 메타: 닉네임만 (날짜/조회 숨김) */
  .board_list td.author{ display:inline; font-size:12px; color:rgba(255,255,255,.65); }
  .board_list td.time,
  .board_list td.readNum{ display:none !important; }

  /* 댓글 pill */
  .board_list .replyNum{margin-left:4px;padding:0 6px;font-size: 11px !important;}

  /* 첨부 아이콘 감춤 */
  .board_list .title img{ display:none !important; }

  /* 상세 영역 여백 축소 */
  .board .read_header{ padding:16px 14px }
  .board .read_header h1{ font-size:19px }
  .board .read_body{ padding:16px 14px }
  .board .read_footer .btnArea{ justify-content:center }
}

/* ===== 글쓰기 버튼 강조 & 우측 정렬 ===== */
.btnArea {
  display: flex !important;
  justify-content: flex-end !important;  /* 오른쪽 정렬 */
  gap: 10px !important;
  margin-top: 10px;
}

.btnArea .btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px !important;
  border-radius: 12px !important;
  font-weight: 600;
  font-size: 14px;
  color: #fff !important;
  background: linear-gradient(90deg, var(--brand,#21c2ff), var(--brand-2,#667aff)) !important;
  border: none !important;
  box-shadow: 0 3px 10px rgba(33,194,255,0.25);
  transition: all 0.2s ease;
}

.btnArea .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(33,194,255,0.35);
  background: linear-gradient(90deg, #33d1ff, #788aff) !important;
}

.btnArea .btn i {
  font-size: 16px;
  opacity: 0.9;
}

/* 모바일에서 버튼 중앙 정렬 */
@media (max-width:740px){
  .btnArea {
    justify-content: center !important;
    margin-top: 12px;
  }
  .btnArea .btn {
    width: 90%;
    max-width: 320px;
    justify-content: center;
    font-size: 15px;
  }
}

/* =========================================================
   FEEDBACK (댓글) — Modern Compact
   (Rhymix xedition 마크업 그대로 사용)
========================================================= */

/* 컨테이너 */
.feedback{
  margin-top:18px;
  border:1px solid var(--line,#22303d);
  border-radius:14px;
  background:var(--panel,#0f1720);
  box-shadow:0 8px 18px rgba(0,0,0,.18);
}

/* 헤더 */
.feedback .fbHeader{
  padding:14px 16px;
  border-bottom:1px solid var(--line,#22303d);
}
.feedback .fbHeader h2{
  margin:0;
  display:flex; align-items:center; gap:8px;
  color:var(--fg,#e9eef6); font-weight:800; font-size:16px;
}
.feedback .fbHeader h2 i{ opacity:.9 }
.feedback .fbHeader h2 em{
  font-style:normal; font-weight:700; color:#9ecbff;
  background:rgba(59,130,246,.15); border:1px solid rgba(59,130,246,.35);
  padding:1px 6px; border-radius:9999px; font-size:12px;
}

/* 리스트 기본 */
.feedback .fbList{ list-style:none; margin:0; padding:0 }
.feedback .fbList > li{ list-style:none }
.feedback .fbItem{
  padding:14px 16px;
  border-bottom:1px solid var(--line,#22303d);
}
.feedback .fbItem:last-child{ border-bottom:0 }

/* 메타라인 (프로필/작성자/시간) */
.feedback .fbMeta{
  display:flex; align-items:center; gap:10px;
}
.feedback .fbMeta .profile{ width:28px; height:28px; border-radius:50%; background:rgba(255,255,255,.06); display:inline-block }
.feedback .fbMeta .author{
  margin:0; font-size:14px; font-weight:700; color:var(--fg,#e9eef6);
}
.feedback .fbMeta .author a{ color:inherit; text-decoration:none }
.feedback .fbMeta .time{
  margin-left:auto; font-size:12px; color:var(--muted,#98a7b6)
}

/* 본문 */
.feedback .xe_content{ margin-top:8px; color:var(--fg,#e9eef6); line-height:1.7 }
.feedback .xe_content p{ margin:0 0 8px }

/* 액션 링크 (추천/비추천/답글 등) */
.feedback .action{
  margin-top:8px; display:flex; gap:10px; flex-wrap:wrap;
  font-size:13px;
}
.feedback .action a{
  color:var(--muted,#98a7b6); text-decoration:none;
  padding:4px 8px; border-radius:8px; border:1px solid transparent;
  transition:.15s ease;
}
.feedback .action a:hover{
  color:var(--fg,#e9eef6); background:var(--panel-2,#121b25); border-color:var(--line,#22303d);
}
.feedback .action .reply{
  color:#9ecbff; border-color:rgba(59,130,246,.35); background:rgba(59,130,246,.10);
}
.feedback .action .reply:hover{
  background:rgba(59,130,246,.18); border-color:rgba(59,130,246,.55);
}

/* 작성 폼 (CKEditor + 업로더 + 작성자/비번 + 버튼) */
.write_comment{ margin:0; padding:14px 16px 18px }
#ckeditor_instance_4 .cke_chrome{
  border-radius:10px; overflow:hidden;
  border:1px solid var(--line,#22303d) !important;
  box-shadow:none !important;
}
#ckeditor_instance_4 .cke_top,
#ckeditor_instance_4 .cke_bottom{
  background:var(--panel-2,#121b25) !important;
  border:0 !important;
}

/* 업로더 */
.xefu-container .xefu-dropzone{
  margin-top:10px;
  border:1px dashed var(--line,#22303d);
  background:var(--panel-2,#121b25);
  border-radius:10px; padding:12px; color:var(--muted,#98a7b6)
}
.xefu-container .xefu-btn{
  background:var(--panel,#0f1720); border:1px solid var(--line,#22303d);
  border-radius:10px; color:var(--fg,#e9eef6); padding:6px 10px;
}

/* 작성자/비밀번호 라인 */
.write_author{ margin-top:10px; display:grid; grid-template-columns:1fr 1fr; gap:10px }
.write_author .iText{
  width:100%; padding:10px; height:auto;
  background:var(--panel-2,#121b25); border:1px solid var(--line,#22303d); color:var(--fg,#e9eef6);
  border-radius:10px;
}

/* 등록 버튼 */
.board .btn_insert{
  margin-top:12px;
  display:inline-flex; align-items:center; gap:8px;
  border-radius:12px; border:0;
  padding:10px 16px;
  background:linear-gradient(90deg, var(--brand,#21c2ff), var(--brand-2,#667aff));
  color:#fff; font-weight:700; transition:transform .15s ease, box-shadow .15s ease;
}
.board .btn_insert:hover{ transform:translateY(-1px); box-shadow:0 8px 16px rgba(33,194,255,.25) }

/* 모바일 최적화 */
@media (max-width:740px){
  .feedback .fbItem{ padding:12px 12px }
  .feedback .fbMeta{ gap:8px }
  .feedback .fbMeta .time{ font-size:11.5px }
  .write_author{ grid-template-columns:1fr; }
  .board .btn_insert{ width:100%; justify-content:center }
}

/* ===== 댓글 등록 버튼 정렬 및 위치 보정 ===== */
.write_comment {
  position: relative; /* 버튼 위치 기준점 */
  padding-bottom: 70px; /* 버튼 공간 확보 */
}

.board .btn_insert {
  position: absolute;
  right: 16px;
  bottom: 16px;
  border: none;
  outline: none;
  border-radius: 12px;
  padding: 10px 18px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(90deg, var(--brand,#21c2ff), var(--brand-2,#667aff));
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.2s ease;
  box-shadow: 0 4px 12px rgba(33,194,255,.25);
  z-index: 5;
}

.board .btn_insert:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(33,194,255,.35);
}

/* 모바일에서는 아래 전체폭으로 확장 */
@media (max-width:740px){
  .write_comment {
    padding-bottom: 80px;
  }
  .board .btn_insert {
    position: static;
    width: 100%;
    margin-top: 12px;
    justify-content: center;
  }
}
/* ===========================
   HAEBET KR – Board Write Polish (CSS-only)
   붙여넣기만 하면 기존 xedition_cst 위에 오버라이드
=========================== */

:root{
  --bg:#0b1118;
  --panel:#0f1720;
  --panel-2:#121a22;
  --line:#223242;
  --fg:#e8eef6;
  --muted:#9eb0bf;
  --brand:#23c9ff;
  --brand-2:#6c7dff;
  --accent:#58f5c4;
}

/* 컨테이너 폭 및 가운데 정렬 */
.board .board_write{
  max-width: 980px;
  margin: 22px auto 120px;
  background: var(--panel);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.02);
}

/* 상단 헤더(분류/제목/공지) → 가로 정렬 */
.board .board_write .write_header{
  display: grid;
  grid-template-columns: 160px 1fr 140px;
  gap: 10px;
  padding: 16px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(35,201,255,.06), rgba(108,125,255,.04));
}
.board .board_write .write_header select,
.board .board_write .write_header input[type="text"]{
  height: 42px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.12);
  background: var(--panel-2);
  color: var(--fg);
  outline: none;
}
.board .board_write .write_header input[type="text"]::placeholder{ color: #93a6b7; }
.board .board_write .write_header select:focus,
.board .board_write .write_header input[type="text"]:focus{
  box-shadow: 0 0 0 3px rgba(35,201,255,.15);
  border-color: rgba(35,201,255,.5);
}

/* 확장폼(테이블) → 카드형 */
.board .board_write .exForm{
  padding: 12px 16px 0 16px;
}
.board .board_write .exForm > table{
  width: 100%;
  border: 0;
  border-collapse: separate;
  border-spacing: 0 10px;
}
.board .board_write .exForm caption{ 
  position: absolute; 
  height: 0; width: 0; overflow: hidden; 
}
.board .board_write .exForm th,
.board .board_write .exForm td{
  border: 0;
  padding: 0;
}
.board .board_write .exForm tbody tr{
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 12px;
  align-items: center;
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  padding: 12px;
}
.board .board_write .exForm th{
  color: #cfe3ff;
  font-weight: 800;
}
.board .board_write .exForm input[type="text"]{
  width: 100%;
  height: 42px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.12);
  background: var(--panel-2);
  color: var(--fg);
}
.board .board_write .exForm input[type="text"]:focus{
  box-shadow: 0 0 0 3px rgba(108,125,255,.15);
  border-color: rgba(108,125,255,.45);
}

/* CKEditor 영역 테두리/라운드 */
.board .board_write .write_editor{
  padding: 12px 16px 0 16px;
}
.board .board_write .write_editor .cke{
  /* border-radius: 12px !important; */
  /* overflow: hidden; */
  border: 1px solid rgba(255,255,255,.10) !important;
  /* box-shadow: 0 6px 26px rgba(0,0,0,.25); */
}
.board .board_write .write_editor .cke_contents{
  background: var(--panel-2) !important;
}

/* 파일 업로드 드롭존 */
.board .board_write .xefu-container .xefu-dropzone{
  background: rgba(255,255,255,.03);
  border: 1px dashed rgba(255,255,255,.16);
  border-radius: 12px;
  margin-top: 12px;
}
.board .board_write .xefu-container .xefu-btn{
  background: linear-gradient(90deg,var(--brand),var(--brand-2));
  color:#001628;
  border:0;
  font-weight: 800;
  border-radius: 10px;
  padding: 8px 12px;
}
.board .board_write .xefu-container .xefu-dropzone-message{
  color: var(--muted);
}

.board .board_write .write_footer .write_option{
  display: flex; flex-wrap: wrap; gap: 16px;
  padding: 10px 0 14px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  margin-bottom: 12px;
}
.board .board_write .write_footer .write_author{
  padding-top: 8px;
}
.board .board_write .write_footer .iLabel{color:#7fa0b8 !important;}
.board .board_write .write_footer input#tags{
  height: 40px;
  padding: 0 12px;
  border-radius: 10px;
  background: var(--panel-2);
  color: var(--fg);
  border:1px solid rgba(255,255,255,.12);
}

/* 액션 바(고정) – 등록 버튼을 크고 가운데 배치 */
.board .board_write::after{
  /* content:""; */
  /* display:block; */
  /* height:78px; */ /* 내용 가리지 않도록 패딩 역할 */
}
.board .board_write .btn_insert,
.board .board_write .btn[x-data-primary]{ /* 안전한 선택자 보조 */
  all: unset;
  display: inline-flex; align-items:center; justify-content:center;
  min-width: 240px; height: 48px; padding: 0 22px;
  border-radius: 12px; cursor: pointer; user-select: none;
  color: #fff; font-weight: 900; letter-spacing:.02em;
  background: linear-gradient(90deg,var(--brand),var(--brand-2));
  box-shadow: 0 10px 24px rgba(35,201,255,.25), inset 0 -2px 0 rgba(0,0,0,.25);
  transition: transform .12s ease, filter .12s ease, box-shadow .12s ease;
}
.board .board_write .btn_insert:hover{ transform: translateY(-1px); filter: saturate(1.05); }

.board .board_write .write_footer > div[style*="float:right"]{
  float: none !important; /* 기존 float 제거 */
}

/* 고정 하단바 */
.board .write-sticky{
  position: fixed; left: 0; right: 0; bottom: 18px;
  display: flex; justify-content: center; gap: 10px;
  pointer-events: none; /* 내부 버튼만 클릭되도록 */
}
.board .write-sticky .btn_insert,
.board .write-sticky .btn{
  pointer-events: auto;
}
.board .write-sticky .btn{ /* 임시저장/불러오기 보조 버튼 */
  all: unset;
  display: inline-flex; align-items:center; justify-content:center;
  height: 42px; padding: 0 14px; border-radius: 10px; cursor: pointer;
  color:#d9ebff; background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12);
}

/* 스티키 바 자동 추가용 – 기존 컨테이너의 하단 버튼 묶음을 스티키로 보이게 */
.board .board_write .write_footer > div:last-child{
  position: static !important;
}
.board .board_write .write_footer > div:last-child{
  display:flex;
  gap:10px;
  justify-content:center;
}
@media (min-width: 640px){
  .board .board_write .write_footer > div:last-child{
    /* position: fixed; */
    /* left:0; */
    /* right:0; */
    /* bottom:18px; */
    z-index: 50;
    /* justify-content:center; */
  }
  .board .board_write .write_footer > div:last-child::before{ display:none; }
}

/* 체크박스/라디오 살짝 키우기 */
.board input[type="checkbox"], .board input[type="radio"]{
  transform: scale(1.1);
}

/* 모바일 최적화 */
@media (max-width: 860px){
  .board .board_write{ margin: 14px 10px 110px; }
  .board .board_write .write_header{
    grid-template-columns: 1fr;
  }
  .board .board_write .exForm tbody tr{
    grid-template-columns: 1fr;
  }
  .board .board_write .write_footer{ padding-bottom: 96px; }
}
/* =========================================================
   Board Write – Polish (delta overrides)
   이전 스타일 위에 '추가'로 붙여주세요
========================================================= */

/* 1) 헤더 라인 – 분류/제목/공지 비율 조정 + 여백 정리 */
.board .board_write .write_header{
  grid-template-columns: 150px 1fr 120px;  /* 제목을 더 넓게 */
  gap: 12px;
  padding: 18px 18px 14px;
}
.board .board_write .write_header .iText,
.board .board_write .write_header select{
  height: 44px;
  border-radius: 12px;
  transition: box-shadow .12s ease, border-color .12s ease, background .12s ease;
}
.board .board_write .write_header .iText::placeholder{
  color:#8fa4b5;
}

/* 2) 확장폼 – label 대비 더 선명하게 */
.board .board_write .exForm tbody tr{
  background: rgba(255,255,255,.028);
  border: 1px solid rgba(255,255,255,.10);
  margin-top: 6px;
}
.board .board_write .exForm th{
  color:#d6eaff;
  letter-spacing:.01em;
}
.board .board_write .exForm input[type="text"]{
  height: 44px;
}

/* 3) CKEditor – 상단 툴바 컴팩트, 바텀 경로바 숨김 */
.board .board_write .write_editor .cke_top{
  /* padding: 6px 8px !important; */
}
.board .board_write .write_editor .cke_button,
.board .board_write .write_editor .cke_combo_button{
  border-radius: 8px !important;
}
.board .board_write .write_editor .cke_bottom{ display:none !important; } /* 요소 경로 바 제거 */
.board .board_write .write_editor .cke{
  /* border: 1px solid rgba(255,255,255,.10) !important; */
}

/* 4) 업로드 드롭존 – 밀도/가독성 */
.board .board_write .xefu-container .xefu-dropzone{
  margin: 12px 0 10px;
  padding: 12px 14px;
  backdrop-filter: blur(4px);
}
.board .board_write .xefu-container .upload_info{
  color:#8aa0b3;
}

/* 5) 하단 옵션 – 라인 정리 & 정렬 */
.board .board_write .write_footer{
  padding: 10px 18px;
}
.board .board_write .write_footer .write_option{
  gap: 18px;
  padding: 12px 0;
}
.board .board_write .write_footer .write_author{
  display:flex; align-items:center; gap:10px;
}
.board .board_write #tags{
  width: min(520px, 100%);
}

/* 6) 버튼영역 – 글로우+유리감, 중앙 집중 */
.board .board_write .btn_insert{
  min-width: 260px; height: 52px;
  border-radius: 14px;
  font-size: 16px;
  background: linear-gradient(90deg, var(--brand), var(--brand-2));
  box-shadow: 0 16px 36px rgba(35,201,255,.25),
              0 0 0 1px rgba(255,255,255,.06) inset;
}
.board .board_write .btn_insert:active{ transform: translateY(0); filter:saturate(1); }

/* 하단 고정 바(유리 효과) */
.board .board_write .write_footer > div:last-child{
  /* position: fixed !important; */
  /* left: 0; */
  /* right: 0; */
  /* bottom: 18px; */
  /* z-index: 60; */
  /* display:flex; */
  /* gap:10px; */
  /* justify-content:center; */
  /* align-items:center; */
  padding: 10px;
  /* pointer-events: none; */   /* 바는 클릭 안되게 */
}
.board .board_write .write_footer > div:last-child > *{
  pointer-events: auto;   /* 버튼만 클릭되게 */
}
.board .board_write .write_footer > div:last-child::before{
  content:"";
  position:absolute; inset:0 18px;
  background: linear-gradient(180deg, rgba(15,23,32,.6), rgba(15,23,32,.3));
  border:1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  backdrop-filter: blur(8px);
  box-shadow: 0 6px 24px rgba(0,0,0,.4);
  z-index:-1;
}

/* 보조 버튼(임시저장/불러오기) 시각 균형 */
.board .board_write .write_footer .btn{
  all: unset;
  height: 44px; padding: 0 14px;
  color:#dbebff; border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  border-radius: 12px; cursor: pointer;
}

/* 7) 체크박스 인풋 라인 정렬 & hover */
.board .board_write input[type="checkbox"]{
  transform: translateY(1px) scale(1.05);
}
.board .board_write label:hover{ color:#e0f2ff; }

/* 8) 다크 환경 셀렉트 드롭다운(가능한 범위) */
.board .board_write select{
  color-scheme: dark;                /* 크롬/엣지/파폭 드롭다운 컬러 동기화 */
  background-image: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
}

/* 9) 모바일 최적화 – 하단바 간격 확보 */
@media (max-width: 860px){
  .board .board_write{ margin: 10px 8px 120px; }
  .board .board_write .write_footer{ padding-bottom: 110px; }
  .board .board_write .btn_insert{ min-width: 220px; height: 50px; }
}

/* ==============================
   태그 입력 영역 정렬 개선
============================== */

.board .board_write .write_footer .item {
  position: relative;
  display: inline-flex;
  align-items: center;
}

/* 라벨 중앙 정렬 + placeholder 느낌 */
.board .board_write .write_footer .item .iLabel {
  position: absolute !important;
  top: 50%;
  left: 14px;
  transform: translateY(-50%);
  margin: 0;
  color: #9ab3c9;
  font-size: 14px;
  pointer-events: none; /* 클릭 통과 */
  transition: all 0.15s ease;
}

/* 입력창 스타일 통일 */
.board .board_write .write_footer #tags {
  width: 100%;
  height: 44px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  color: #eaf3ff;
  font-size: 14px;
}

/* 포커스 시 테두리 강조 + 라벨 위로 이동 */
.board .board_write .write_footer #tags:focus {
  outline: none;
  border-color: rgba(108,125,255,.6);
  box-shadow: 0 0 0 3px rgba(108,125,255,.15);
}
.board .board_write .write_footer #tags:focus + .iLabel,
.board .board_write .write_footer #tags:not(:placeholder-shown) + .iLabel,
.board .board_write .write_footer #tags[value]:not([value=""]) + .iLabel {
  transform: translateY(-155%);
  font-size: 12px;
  color: #70a6ff;
}

/* Safari placeholder-shown fallback */
.board .board_write .write_footer #tags:valid + .iLabel {
  transform: translateY(-155%);
  font-size: 12px;
  color: #70a6ff;
}