@charset "UTF-8";
/* =========================================================================
   도장통 djt2026 — 게시판 버튼 통합 디자인 (Unified Board Button System)
   -------------------------------------------------------------------------
   · 메인페이지 블루 포털 팔레트 기준 (솔리드 + 아웃라인 / 8px 라운드)
   · skin/board/* 모든 게시판의 글쓰기·작성완료·수정·삭제·목록·검색·답변·
     취소·관리(이동/복사)·댓글 버튼을 한 파일에서 통일한다.
   · 각 스킨 style.css 보다 강하게 적용되도록 !important 사용
     (스킨들은 버튼에 !important 를 쓰지 않으므로 항상 본 파일이 우선).
   · head.php / mobile/head.php 에서 add_stylesheet 로 마지막 우선순위 로드.
   ========================================================================= */

/* ---- 디자인 토큰 (head.php 의 --djt-* 와 동일 값, 독립 동작 보장용 재선언) ---- */
:root{
  --djtb-primary:#1D5FBF;        /* 메인 블루  — 글쓰기 / 작성완료 / 댓글등록 */
  --djtb-primary-dark:#154C9E;   /* hover 진한 블루 */
  --djtb-navy:#0B2A4A;           /* 관리자(이동/복사) / 유틸 */
  --djtb-ink:#16212E;            /* 본문 텍스트 */
  --djtb-ink-60:#6B7686;         /* 보조 텍스트(취소) */
  --djtb-line:#E3E8EF;           /* 기본 테두리 */
  --djtb-surface:#FFFFFF;        /* 버튼 흰 배경 */
  --djtb-tint:#F4F8FF;           /* 보조버튼 hover 연한 배경 */
  --djtb-radius:8px;             /* 통일 모서리 */
}

/* ===================================================================
   1) 표준(40px) 액션 버튼 공통 형태
   목록 / 수정 / 삭제 / 검색 / 글쓰기 / 작성완료 / 취소 / 관리 / 유틸
   =================================================================== */
a.btn_b01, .btn_b01,
a.btn_b011, .btn_b011,
a.btn_b02, .btn_b02,
a.btn_b04, .btn_b04,
a.btn_admin, .btn_admin,
input.btn_submit, button.btn_submit, .btn_submit,
a.btn_cancel, button.btn_cancel, .btn_cancel,
a.btn_frmline, button.btn_frmline,
.bo_vc_w .btn_submit{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  box-sizing:border-box !important;
  width:auto !important;              /* 기존 btn_b01 고정 width:80px 해제 */
  min-width:74px !important;
  height:40px !important;
  padding:0 18px !important;
  border:1px solid transparent !important;
  border-radius:var(--djtb-radius) !important;
  font-family:inherit !important;
  font-size:14px !important;
  font-weight:700 !important;
  line-height:1 !important;
  text-align:center !important;
  text-decoration:none !important;
  vertical-align:middle !important;
  white-space:nowrap !important;
  cursor:pointer !important;
  box-shadow:none !important;         /* default.css 의 box-shadow !important 무력화 */
  -webkit-appearance:none !important;
  appearance:none !important;
  transition:background-color .15s ease, border-color .15s ease, color .15s ease !important;
}

/* 버튼 안의 아이콘(fa) 여백 정리 — gap 으로 간격 통일 */
a.btn_b01 > i, .btn_b01 > i,
a.btn_b02 > i, .btn_b02 > i,
a.btn_b03 > i, .btn_b03 > i,
a.btn_admin > i, .btn_admin > i,
.btn_submit > i, .btn_cancel > i{
  margin:0 !important;
  background:none !important;
  width:auto !important;
  line-height:1 !important;
}

/* ===================================================================
   2) 색상 변형 (Variants)
   =================================================================== */

/* 2-1. PRIMARY (솔리드 블루) — 글쓰기 / 작성완료 / 댓글등록 */
a.btn_b02, .btn_b02,
input.btn_submit, button.btn_submit, .btn_submit,
.bo_vc_w .btn_submit{
  background:var(--djtb-primary) !important;
  color:#fff !important;
  border-color:var(--djtb-primary) !important;
}
a.btn_b02:hover, .btn_b02:hover, a.btn_b02:focus, .btn_b02:focus,
input.btn_submit:hover, button.btn_submit:hover, .btn_submit:hover,
input.btn_submit:focus, button.btn_submit:focus, .btn_submit:focus,
.bo_vc_w .btn_submit:hover{
  background:var(--djtb-primary-dark) !important;
  border-color:var(--djtb-primary-dark) !important;
  color:#fff !important;
}

/* 2-2. SECONDARY (흰 배경 + 아웃라인) — 목록 / 수정 / 삭제 / 검색 */
a.btn_b01, .btn_b01,
a.btn_b011, .btn_b011{
  background:var(--djtb-surface) !important;
  color:var(--djtb-ink) !important;
  border-color:var(--djtb-line) !important;
}
a.btn_b01:hover, .btn_b01:hover, a.btn_b01:focus, .btn_b01:focus,
a.btn_b011:hover, .btn_b011:hover{
  background:var(--djtb-tint) !important;
  color:var(--djtb-primary) !important;
  border-color:var(--djtb-primary) !important;
}

/* 2-3. ADMIN (네이비 아웃라인 → hover 채움) — 이동 / 복사 / 관리 */
a.btn_admin, .btn_admin{
  background:var(--djtb-surface) !important;
  color:var(--djtb-navy) !important;
  border-color:var(--djtb-navy) !important;
}
a.btn_admin:hover, .btn_admin:hover, a.btn_admin:focus, .btn_admin:focus{
  background:var(--djtb-navy) !important;
  color:#fff !important;
  border-color:var(--djtb-navy) !important;
}

/* 2-4. CANCEL / NEUTRAL-LIGHT — 취소 / btn_b04 */
a.btn_cancel, button.btn_cancel, .btn_cancel,
a.btn_b04, .btn_b04{
  background:var(--djtb-surface) !important;
  color:var(--djtb-ink-60) !important;
  border-color:var(--djtb-line) !important;
}
a.btn_cancel:hover, button.btn_cancel:hover, .btn_cancel:hover,
a.btn_b04:hover, .btn_b04:hover{
  background:#F1F3F6 !important;
  color:var(--djtb-ink) !important;
  border-color:#CFD6DF !important;
}

/* 2-5. FRMLINE (유틸 — 주소검색 등) — 솔리드 네이비 */
a.btn_frmline, button.btn_frmline{
  background:var(--djtb-navy) !important;
  color:#fff !important;
  border-color:var(--djtb-navy) !important;
  min-width:auto !important;
}
a.btn_frmline:hover, button.btn_frmline:hover{
  background:var(--djtb-primary-dark) !important;
  border-color:var(--djtb-primary-dark) !important;
}

/* ===================================================================
   3) 컴팩트(30px) 버튼 — 답변 / 스크랩 / 댓글 수정·삭제 / 관리 인풋
   =================================================================== */
a.btn_b03, .btn_b03,
.btn_bo_adm input{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  box-sizing:border-box !important;
  width:auto !important;
  min-width:auto !important;
  height:30px !important;
  padding:0 12px !important;
  border:1px solid var(--djtb-line) !important;
  border-radius:6px !important;
  background:var(--djtb-surface) !important;
  color:var(--djtb-ink-60) !important;
  font-family:inherit !important;
  font-size:13px !important;
  font-weight:700 !important;
  line-height:1 !important;
  text-decoration:none !important;
  vertical-align:middle !important;
  white-space:nowrap !important;
  cursor:pointer !important;
  box-shadow:none !important;
  -webkit-appearance:none !important;
  appearance:none !important;
  transition:background-color .15s ease, border-color .15s ease, color .15s ease !important;
}
a.btn_b03:hover, .btn_b03:hover, a.btn_b03:focus, .btn_b03:focus,
.btn_bo_adm input:hover{
  background:var(--djtb-tint) !important;
  color:var(--djtb-primary) !important;
  border-color:var(--djtb-primary) !important;
}
/* 관리 인풋은 네이비 톤으로 구분 */
.btn_bo_adm input{
  color:var(--djtb-navy) !important;
  border-color:var(--djtb-navy) !important;
}
.btn_bo_adm input:hover{
  background:var(--djtb-navy) !important;
  color:#fff !important;
}

/* ===================================================================
   4) 버튼 행 간격 / 정렬 보정
   =================================================================== */
/* 작성완료 ↔ 취소 인접 간격 (취소 다음 작성완료 순서) */
.btn_confirm .btn_cancel + .btn_submit,
.write_div .btn_cancel + .btn_submit,
.btn_confirm .btn_submit{
  margin-left:8px !important;
}
/* 보기/목록 하단 버튼 그룹(ul.btn_bo_user 등) 내부 줄간격 보정 */
.btn_bo_user li, .btn_bo_adm li{ margin-bottom:6px !important; }

/* 비활성(제출 후 disabled) 버튼 */
.btn_submit:disabled, input.btn_submit[disabled]{
  opacity:.6 !important;
  cursor:default !important;
}

/* ===================================================================
   5) 댓글목록 토글(.cmt_btn) — 배경 화살표 이미지는 유지, 색만 통일
   =================================================================== */
.cmt_btn{ color:var(--djtb-navy) !important; }
.cmt_btn:hover{ color:var(--djtb-primary) !important; }

/* ===================================================================
   6) 접근성 — 키보드 포커스 표시
   =================================================================== */
a.btn_b01:focus-visible, a.btn_b02:focus-visible, a.btn_b03:focus-visible,
a.btn_admin:focus-visible, .btn_submit:focus-visible, .btn_cancel:focus-visible,
a.btn_frmline:focus-visible{
  outline:2px solid var(--djtb-primary) !important;
  outline-offset:2px !important;
}

/* ===================================================================
   7) 모바일 보정 (≤ 480px) — 손가락 터치 영역 확보
   =================================================================== */
@media (max-width:480px){
  a.btn_b01, .btn_b01, a.btn_b02, .btn_b02,
  input.btn_submit, button.btn_submit, .btn_submit,
  a.btn_cancel, button.btn_cancel, .btn_cancel,
  a.btn_admin, .btn_admin{
    height:42px !important;
    padding:0 16px !important;
    font-size:14px !important;
  }
}
