@charset "utf-8";
/* ==========================================================================
   rb.minitalk — 미니톡 채팅 위젯 모양
   어느 리빌더 테마에서도 돌게 기본색을 따로 두고, 테마가 색 변수(--sky-500 · --line …)를
   가지고 있으면 그 값을 따른다(보드팩토리 테마 등). 채팅창 안쪽은 미니톡 템플릿이 그린다.
   ========================================================================== */
.rbmt {
  --rbmt-point: var(--sky-500, #3E9FDE);
  --rbmt-point-d: var(--sky-700, #1F669E);
  --rbmt-bg: var(--surface, #fff);
  --rbmt-soft: var(--sky-50, #F5FAFE);
  --rbmt-line: var(--line, #E4EDF4);
  --rbmt-ink: var(--ink-900, #14262F);
  --rbmt-ink2: var(--ink-500, #6B7F8E);
  position: relative;
  width: 100%;
}
/* 채팅창 — 바깥에서 잘라 내지 않는다(overflow:hidden 으로 둥글게 자르면 미니톡 창의 테두리가
   모서리에서 잘렸다). 모서리 · 테두리는 미니톡 템플릿이 창 안에서 그린다.
   위젯 바깥의 템플릿별 모양(.rbmt-t-템플릿이름)은 테마가 준다 — 예) 보드팩토리 테마의 theme.css */
.rbmt-chat { width: 100%; }
.rbmt-chat iframe { display: block; width: 100% !important; border: 0; background: transparent; }

/* 안내 칸 — 설정 전 · 점검 · 회원 전용 · 연결 실패 */
.rbmt-empty {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  margin: 0; padding: 36px 20px;
  border: 1px dashed var(--rbmt-line); border-radius: 6px;
  background: var(--rbmt-soft);
  text-align: center;
}
.rbmt-empty b { font-size: 15px; font-weight: 700; color: var(--rbmt-ink); }
.rbmt-empty span { font-size: 13.5px; line-height: 1.55; color: var(--rbmt-ink2); }
.rbmt-login {
  display: inline-flex; align-items: center; justify-content: center;
  height: 36px; margin-top: 8px; padding: 0 18px;
  border-radius: 6px; background: var(--rbmt-point); color: #fff !important;
  font-size: 14px; font-weight: 700; text-decoration: none;
}
.rbmt-login:hover { background: var(--rbmt-point-d); }

/* ⚙ 설정 단추 — 최고관리자에게만 */
.rbmt-gear {
  position: absolute; top: 8px; right: 8px; z-index: 5;
  display: inline-flex; align-items: center; gap: 5px;
  height: 30px; padding: 0 10px;
  border: 1px solid var(--rbmt-line); border-radius: 4px;
  background: var(--rbmt-bg); color: var(--rbmt-ink2);
  font-size: 12.5px; font-weight: 600; cursor: pointer;
  box-shadow: 0 2px 8px rgba(20, 38, 47, .08);
}
.rbmt-gear:hover, .rbmt-gear[aria-expanded="true"] { border-color: var(--rbmt-point); color: var(--rbmt-point-d); }
.rbmt-gear svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* 설정 판 */
.rbmt-set {
  margin: 0 0 12px; padding: 16px 16px 14px;
  border: 1px solid var(--rbmt-line); border-top: 3px solid var(--rbmt-point); border-radius: 6px;
  background: var(--rbmt-bg);
  font-size: 13.5px; color: var(--rbmt-ink);
}
.rbmt-set[hidden] { display: none; }
.rbmt-set-tit { margin: 4px 0 8px; font-size: 14px; font-weight: 800; }
.rbmt-set-tit + * { margin-top: 0; }
.rbmt-set-tit ~ .rbmt-set-tit { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--rbmt-line); }
.rbmt-set-tit em { margin-left: 6px; font-size: 12px; font-style: normal; font-weight: 500; color: var(--rbmt-ink2); }
.rbmt-row { display: flex; flex-wrap: wrap; gap: 10px; }
.rbmt-row > * { flex: 1 1 140px; min-width: 0; }
.rbmt-f { display: block; margin: 0 0 10px; }
.rbmt-f > span, .rbmt-f > legend { display: block; margin-bottom: 4px; font-size: 12.5px; font-weight: 700; color: var(--rbmt-ink2); }
.rbmt-f input[type="text"], .rbmt-f input[type="url"], .rbmt-f input[type="password"],
.rbmt-f input[type="number"], .rbmt-f select {
  box-sizing: border-box; width: 100%; height: 36px; padding: 0 10px;
  border: 1px solid var(--rbmt-line); border-radius: 4px;
  background: var(--rbmt-soft); color: var(--rbmt-ink); font-size: 13.5px;
}
.rbmt-f input:focus, .rbmt-f select:focus { outline: 2px solid var(--rbmt-point); outline-offset: -1px; background: var(--rbmt-bg); }
.rbmt-ok, .rbmt-no { margin-left: 4px; padding: 1px 6px; border-radius: 3px; font-size: 11px; }
.rbmt-ok { background: #E4F8F3; color: #0F9D86; }
.rbmt-no { background: #FFF0EE; color: #E0533F; }
.rbmt-modes { margin: 0 0 10px; padding: 0; border: 0; }
/* 그누보드 default.css 가 legend 를 화면 밖으로 숨긴다 — 이 칸 제목은 보여야 한다 */
.rbmt-modes > legend {
  position: static; float: none; width: auto; height: auto; margin: 0 0 4px; padding: 0;
  font-size: 12.5px; line-height: 1.4; text-indent: 0; overflow: visible; clip: auto;
}
.rbmt-modes label { display: flex; align-items: center; gap: 6px; padding: 5px 0; font-size: 13.5px; cursor: pointer; }
/* 라디오 · 체크박스를 다시 보이게 — 리빌더 기본 테마(rb.basic rb.css/form.css)처럼 사이트의 모든
   input[type=radio|checkbox] 를 display:none 으로 숨기고 'input + label' 에 그림을 그리는 테마가 있다.
   이 판은 <label> 안에 단추를 넣으므로 그 그림이 안 붙고 글자만 남아 '고를 수 없는' 판이 됐다
   (문의: 비회원도 대화를 고를 수 없음). 판 안에서만 브라우저 기본 단추로 되돌린다. */
.rbmt-set input[type="radio"],
.rbmt-set input[type="checkbox"] {
  position: static !important; display: inline-block !important; float: none !important;
  visibility: visible !important; opacity: 1 !important; clip: auto !important; clip-path: none !important;
  width: 16px !important; height: 16px !important; min-width: 16px; margin: 0 !important; padding: 0 !important;
  -webkit-appearance: auto !important; appearance: auto !important;
  flex: none; accent-color: var(--rbmt-point); cursor: pointer; vertical-align: middle;
}
.rbmt-chk { display: flex; align-items: center; gap: 6px; align-self: flex-end; height: 36px; margin-bottom: 10px; font-size: 13.5px; cursor: pointer; }
.rbmt-note { margin: 2px 0 12px; padding: 10px 12px; border-radius: 4px; background: var(--rbmt-soft); font-size: 12.5px; line-height: 1.6; color: var(--rbmt-ink2); }
.rbmt-set-btns { display: flex; align-items: center; justify-content: flex-end; gap: 6px; }
.rbmt-msg { flex: 1 1 auto; font-size: 13px; color: var(--rbmt-ink2); }
.rbmt-msg.is-ok { color: #0F9D86; }
.rbmt-msg.is-err { color: #E0533F; }
.rbmt-cancel, .rbmt-save { height: 34px; padding: 0 16px; border-radius: 4px; font-size: 13.5px; font-weight: 700; cursor: pointer; }
.rbmt-cancel { border: 1px solid var(--rbmt-line); background: var(--rbmt-bg); color: var(--rbmt-ink2); }
.rbmt-save { border: 0; background: var(--rbmt-point); color: #fff; }
.rbmt-save:hover { background: var(--rbmt-point-d); }
.rbmt-save:disabled { opacity: .6; cursor: default; }

/* 설정 판이 열렸을 때는 ⚙ 단추가 판 위에 겹치지 않게 */
.rbmt-gear[aria-expanded="true"] { position: static; margin: 0 0 8px auto; display: flex; }