/* 하단 상담바 (이름, 연락 방법, 연락처, 상담 부위 입력 폼)
   글자 12px 이상, 누르는 요소는 좁은 화면에서 44px 이상. */

.ce-cbar { --ce-cbar-bg: #1A1A1A; --ce-cbar-line: rgba(255, 255, 255, 0.35); --ce-cbar-accent: #09549C; }

/* 지면에 박힌 고정 높이 규칙을 이기기 위해 선택자를 한 번 더 겹쳐 쓴다. */
[data-ce-cbar="on"][data-ce-cbar] { min-height: 0 !important; padding-top: 0 !important; }
.ce-mobar[data-ce-cbar="on"] { height: auto !important; }
.ce-cbar__form { margin: 0; }

/* ── 모바일 ─────────────────────────────────────────── */
/* 두 번째 칸이 여닫는 토글 버튼(data-ce-cbar-toggle)이 없는 지면은 스크립트가
   폼 판을 "계속 열어 둔다" — 4칸바(약 62px) 위에 폼(약 178px)이 항상 겹쳐 쌓여
   375px 화면의 30%를 고정 UI가 먹는다. 그 지면(.ce-bottombar-m)에서는 폼을 접어
   4칸 바로가기만 남긴다 — 전화·카톡·오시는 길·예약은 그 4칸에 그대로 있다. */
.ce-bottombar-m .ce-cbar-m { display: none !important; }
.ce-cbar-m {
	display: block; width: 100%;
	background: var(--ce-cbar-bg); backdrop-filter: blur(10px);
	border-top: 1px solid rgba(255, 255, 255, 0.15);
	padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px));
	box-sizing: border-box;
}
.ce-cbar__row { display: flex; align-items: center; gap: 6px; }
.ce-cbar__row + .ce-cbar__row { margin-top: 6px; }

.ce-cbar__field {
	flex: 1 1 0; min-width: 0; height: 44px; min-height: 44px; box-sizing: border-box;
	padding: 0 10px; border-radius: 6px;
	border: 1px solid var(--ce-cbar-line); background: rgba(255, 255, 255, 0.15);
	color: #fff; font-size: 14px; font-family: inherit; -webkit-appearance: none; appearance: none;
}
.ce-cbar__field::placeholder { color: rgba(255, 255, 255, 0.6); }
.ce-cbar__field:focus { outline: 2px solid rgba(255, 255, 255, 0.6); outline-offset: 1px; background: rgba(255, 255, 255, 0.22); }
.ce-cbar__field[aria-invalid="true"] { border-color: #FF9A9A; }

/* 고른 값이 없는 동안에는 첫 칸을 안내문처럼 흐리게 둔다. */
.ce-cbar__select {
	padding-right: 24px;
	background-image: linear-gradient(45deg, transparent 50%, rgba(255, 255, 255, 0.7) 50%),
		linear-gradient(135deg, rgba(255, 255, 255, 0.7) 50%, transparent 50%);
	background-position: right 11px center, right 6px center;
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
}
.ce-cbar__select option { background: #1A1A1A; color: #fff; }
.ce-cbar__field--subject[data-filled="no"] { color: rgba(255, 255, 255, 0.5); }

.ce-cbar__icon {
	flex: 0 0 auto; width: 44px; height: 44px; border-radius: 6px;
	display: inline-flex; align-items: center; justify-content: center;
	border: 1px solid var(--ce-cbar-line); background: rgba(255, 255, 255, 0.15);
	color: #fff; text-decoration: none;
}
.ce-cbar__icon svg { width: 20px; height: 20px; }
.ce-cbar__icon--kakao { background: #FAE100; border-color: #FAE100; color: #191600; }

.ce-cbar__agree {
	flex: 1 1 auto; min-width: 0; display: inline-flex; align-items: center; gap: 6px;
	min-height: 44px; color: rgba(255, 255, 255, 0.75); font-size: 12px; line-height: 1.35; cursor: pointer;
}
.ce-cbar__agree input { width: 20px; height: 20px; flex: 0 0 auto; accent-color: var(--ce-cbar-accent); }
.ce-cbar__agree a { color: #fff; text-decoration: underline; }

.ce-cbar__submit {
	flex: 0 0 auto; min-width: 104px; height: 44px; padding: 0 16px;
	display: inline-flex; align-items: center; justify-content: center; gap: 6px;
	border: 0; border-radius: 6px; background: var(--ce-cbar-accent); color: #fff;
	font-size: 14px; font-weight: 600; font-family: inherit; cursor: pointer;
}
.ce-cbar__submit:hover { opacity: 0.9; }
.ce-cbar__submit:disabled { opacity: 0.5; cursor: not-allowed; }
.ce-cbar__send { width: 13px; height: 13px; flex: 0 0 13px; }

/* 수집 항목, 목적, 보유기간 안내문. 화면에 항상 보여야 한다. */
.ce-cbar__note { margin: 3px 2px 0; font-size: 12px; line-height: 1.35; color: rgba(255, 255, 255, 0.72); }
.ce-cbar__msg { margin: 3px 2px 0; font-size: 12px; line-height: 1.35; color: #fff; }
.ce-cbar__msg:empty { display: none; }
.ce-cbar__msg[data-tone="err"] { color: #FFC2C2; }

/* ── PC ─────────────────────────────────────────────── */
/* 넓은 화면 바는 한 줄이다. 빠른 상담 폼만 둔다. */
.ce-bottombar[data-ce-cbar="on"] {
	height: 64px !important; flex-wrap: nowrap !important;
	padding-top: 0 !important; padding-bottom: 0 !important;
	background: #1A1A1A !important;
}
/* 폼이 붙으면 왼쪽 안내 문구(라벨·전화번호·진료시간)와 오른쪽 바로가기 링크가
   폼과 한 줄에서 자리를 다투다 폼의 입력칸·동의문·버튼이 그 위로 겹쳐 그려진다
   (겹침 폭은 문항 배치에 따라 달라진다 — 넓은 화면일수록 note 문구까지 붙어 더 겹친다).
   전화·카톡은 폼의 연락 방법 선택과 우측 세로 퀵바에 그대로 남아 있으니 여기서는 접는다. */
.ce-bottombar[data-ce-cbar="on"] .ce-bottombar__title,
.ce-bottombar[data-ce-cbar="on"] .ce-bottombar__info,
.ce-bottombar[data-ce-cbar="on"] .ce-bottombar__sep,
.ce-bottombar[data-ce-cbar="on"] .ce-bottombar__links {
	display: none !important;
}
.ce-cbar-pc {
	flex: 1 1 auto; margin: 0; min-width: 0;
	display: flex; align-items: center; justify-content: center;
	border-top: 0; padding-top: 0;
}
.ce-cbar__title {
	flex: 0 0 auto; margin-right: 4px; white-space: nowrap;
	font-size: 15px; font-weight: 700; color: #fff; letter-spacing: -0.02em;
}
.ce-cbar-pc .ce-cbar__form {
	display: flex; align-items: center; flex-wrap: nowrap; gap: 10px;
	width: 100%; max-width: 1400px; margin: 0 auto; padding: 0 24px; box-sizing: border-box;
}
.ce-cbar-pc .ce-cbar__field { flex: 0 0 auto; height: 38px; min-height: 38px; font-size: 13px; }
.ce-cbar-pc .ce-cbar__field--name { width: 90px; }
.ce-cbar-pc .ce-cbar__field--method { width: 90px; }
.ce-cbar-pc .ce-cbar__field--tel { width: 130px; }
.ce-cbar-pc .ce-cbar__field--subject { width: 110px; }
.ce-cbar-pc .ce-cbar__agree { flex: 0 0 auto; min-height: 38px; font-size: 12px; white-space: nowrap; }
.ce-cbar-pc .ce-cbar__agree input { width: 14px; height: 14px; }
.ce-cbar-pc .ce-cbar__submit { margin-left: auto; height: 38px; min-width: 0; padding: 0 16px; font-size: 14px; }
/* 안내문과 응답문은 폼 오른쪽에 이어 붙인다. */
.ce-cbar-pc .ce-cbar__note,
.ce-cbar-pc .ce-cbar__msg { flex: 0 0 auto; margin: 0; white-space: nowrap; }
@media (max-width: 1180px) {
	.ce-cbar-pc .ce-cbar__note { display: none; }
}
@media (max-width: 1000px) {
	.ce-cbar-pc .ce-cbar__form { gap: 6px; padding: 0 12px; }
	.ce-cbar-pc .ce-cbar__field--name { width: 74px; }
	.ce-cbar-pc .ce-cbar__field--method { width: 84px; }
	.ce-cbar-pc .ce-cbar__field--tel { width: 118px; }
	.ce-cbar-pc .ce-cbar__field--subject { width: 100px; }
}

/* 모바일 키보드가 올라오면 --ce-cbar-lift 값만큼 바를 올린다. */
.ce-cbar-host { transform: translateY(calc(-1 * var(--ce-cbar-lift, 0px))); }

/* 모바일 상담 폼 판 — 두 번째 칸이 여닫는다 */
.ce-mobar .ce-cbar-m {
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	padding-bottom: 8px;
}
.ce-mobar .ce-cbar-m[hidden] { display: none !important; }
.ce-mobar.is-cbar-open .ce-mobar__list li:nth-child(2) { background: #2E2E2E; }