/* 힐링잉글리시 강의 리뷰 탭 (2026-10-16).
   홈페이지와 같은 결: 밤의 기내(잉크), 창밖 하늘, 아이보리 글자, 절제된 청록. 눈에 띄는 건 창문 속 별점 하나뿐이고 나머지는 조용히 읽히게.
   범위는 .he-rv 안만. 원복: 이 파일, templates/single-course/tabs/review.php 삭제 + functions.php 의 he-reviews 블록 제거. */

.he-rv {
	--rv-ink: #0e1a1d;
	--rv-ink-2: #16292e;
	--rv-paper: #f2f0e8;
	--rv-paper-dim: #c2cfd1;
	--rv-ice: #6cc6d6;
	--rv-teal: #24798a;
	--rv-teal-deep: #1b6170;
	--rv-text: #1b2a2d;
	--rv-muted: #56686c;
	--rv-line: #e1e8e9;
	--rv-tint: #e7f1f2;
	--rv-serif: "Noto Serif KR", "AppleMyungjo", serif;
	--rv-sans: "Gothic A1", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
	--rv-ease: cubic-bezier(.23, 1, .32, 1);
	container-type: inline-size;
	padding: clamp(18px, 3vw, 28px) 0 clamp(28px, 5vw, 44px);
	font-family: var(--rv-sans);
	color: var(--rv-text);
}
.he-rv,
.he-rv * {
	box-sizing: border-box;
	word-break: keep-all;
	overflow-wrap: break-word;
}
/* 사이트 전역 '* { font-family: Pretendard }' 가 상속을 끊어서, 리뷰란 안 요소마다 직접 준다. Tutor 별점 아이콘 글꼴은 제외. */
.he-rv *:not([class*="tutor-icon"]) {
	font-family: var(--rv-sans);
}
.he-rv .he-rv-score,
.he-rv .he-rv-title,
.he-rv .he-rv-avatar {
	font-family: var(--rv-serif);
}
.he-rv-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

/* 기내: 별점 요약 */
.he-rv-cabin {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	gap: clamp(22px, 5cqi, 44px);
	padding: clamp(24px, 5cqi, 38px) clamp(22px, 6cqi, 48px);
	border-radius: 22px;
	background: var(--rv-ink);
	color: var(--rv-paper);
}
.he-rv-window {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 112px;
	height: 150px;
	border-radius: 48% 48% 43% 43% / 25% 25% 29% 29%; /* 홈페이지 첫 화면 비행기 창(.window-glass)과 같은 모양 */
	background: radial-gradient(130% 85% at 50% 6%, #2b5d68 0%, #173a42 44%, #0b1619 100%);
	box-shadow:
		inset 0 0 0 1px rgba(214, 228, 230, .32),
		inset 0 14px 22px rgba(4, 10, 12, .45),
		0 0 0 7px var(--rv-ink-2),
		0 0 0 8px rgba(214, 228, 230, .16);
}
.he-rv-score {
	font-family: var(--rv-serif);
	font-weight: 300;
	font-size: 44px;
	line-height: 1;
	letter-spacing: -.03em;
	color: var(--rv-paper);
	font-variant-numeric: lining-nums;
}
.he-rv-title {
	margin: 0;
	font-family: var(--rv-serif);
	font-weight: 400;
	font-size: clamp(20px, 3.6cqi, 25px);
	line-height: 1.35;
	letter-spacing: -.01em;
	color: var(--rv-paper);
}
.he-rv-lede {
	margin: 10px 0 0;
	font-size: 15.5px;
	line-height: 1.85;
	color: var(--rv-paper-dim);
}
.he-rv-dist {
	display: grid;
	gap: 6px;
	max-width: 320px;
	margin: 16px 0 0;
}
.he-rv-dist-row {
	display: grid;
	grid-template-columns: 52px minmax(0, 1fr);
	align-items: center;
	gap: 12px;
	font-size: 13px;
	color: var(--rv-paper-dim);
}
.he-rv-dist dt,
.he-rv-dist dd {
	margin: 0;
}
.he-rv-dist dd {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 30px;
	align-items: center;
	gap: 10px;
}
.he-rv-bar {
	display: block;
	height: 3px;
	overflow: hidden;
	border-radius: 3px;
	background: rgba(242, 240, 232, .14);
}
.he-rv-bar i {
	display: block;
	height: 100%;
	border-radius: 3px;
	background: var(--rv-ice);
}
.he-rv-n {
	text-align: right;
	font-variant-numeric: tabular-nums;
}

/* 별 */
.he-rv-stars {
	display: inline-flex;
	gap: 2px;
	line-height: 0;
}
.he-rv-stars svg {
	display: block;
	width: 14px;
	height: 14px;
}
.he-rv-star-bg {
	fill: #d3dfe1;
}
.he-rv-star-fg {
	fill: var(--rv-teal);
}
.he-rv-stars--ice svg {
	width: 12px;
	height: 12px;
}
.he-rv-stars--ice .he-rv-star-bg {
	fill: rgba(242, 240, 232, .2);
}
.he-rv-stars--ice .he-rv-star-fg {
	fill: var(--rv-ice);
}

/* 후기 목록: 카드 없이, 읽히는 글로 */
.he-rv-list-wrap {
	margin-top: clamp(6px, 1.6cqi, 12px);
}
.he-rv-item {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr);
	gap: 16px;
	padding: clamp(22px, 3.8cqi, 30px) clamp(2px, 1.6cqi, 10px);
	border-bottom: 1px solid var(--rv-line);
}
.he-rv-avatar {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	overflow: hidden;
	border-radius: 50%;
	background: var(--rv-tint);
	color: var(--rv-teal);
	font-family: var(--rv-serif);
	font-size: 17px;
	line-height: 1;
}
.he-rv-avatar img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.he-rv-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 2px 10px;
	margin: 0;
	line-height: 1.5;
}
.he-rv-name {
	font-weight: 600;
	font-size: 15px;
	color: var(--rv-text);
}
.he-rv-time {
	font-size: 13px;
	color: var(--rv-muted);
}
.he-rv-pending {
	padding: 1px 8px;
	border-radius: 999px;
	background: #fbf0d8;
	color: #7a5200;
	font-size: 12px;
}
.he-rv-item .he-rv-stars {
	margin: 7px 0 10px;
}
.he-rv-text {
	max-width: 68ch;
	font-size: 15.5px;
	line-height: 1.9;
	letter-spacing: -.003em;
	color: var(--rv-text);
}

/* 더 보기, 후기 쓰기 */
.he-rv-foot {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	padding-top: clamp(22px, 3.8cqi, 30px);
}
.he-rv-progress {
	margin: 0;
	font-size: 13px;
	color: var(--rv-muted);
	font-variant-numeric: tabular-nums;
}
.he-rv-foot nav {
	display: flex;
	justify-content: center;
}
.he-rv-foot nav:empty {
	display: none;
}
.he-rv .he-rv-foot a.page-numbers,
.he-rv .he-rv-write-btn,
.he-rv .he-rv-submit {
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	margin: 0 !important;
	padding: 0 28px;
	border-radius: 999px;
	font: 600 14px/1 var(--rv-sans);
	letter-spacing: .01em;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .14s var(--rv-ease);
}
.he-rv .he-rv-foot a.page-numbers {
	border: 1px solid var(--rv-ink);
	background: transparent;
	color: var(--rv-ink);
}
.he-rv .he-rv-write-btn,
.he-rv .he-rv-submit {
	border: 1px solid var(--rv-teal);
	background: var(--rv-teal);
	color: var(--rv-paper);
}
@media (hover: hover) and (pointer: fine) {
	.he-rv .he-rv-foot a.page-numbers:hover {
		background: var(--rv-ink);
		color: var(--rv-paper);
	}
	.he-rv .he-rv-write-btn:hover,
	.he-rv .he-rv-submit:hover {
		border-color: var(--rv-teal-deep);
		background: var(--rv-teal-deep);
	}
}
.he-rv .he-rv-foot a.page-numbers:active,
.he-rv .he-rv-write-btn:active,
.he-rv .he-rv-submit:active {
	transform: scale(.97);
}
.he-rv .he-rv-foot a.page-numbers:focus-visible,
.he-rv .he-rv-write-btn:focus-visible,
.he-rv .he-rv-submit:focus-visible {
	outline: 2px solid var(--rv-teal);
	outline-offset: 3px;
}
.he-rv .he-rv-foot a.page-numbers.is-loading {
	opacity: .55;
	pointer-events: none;
}

/* 후기 쓰기 폼 (수강생에게만 보임) */
.he-rv-write {
	margin-top: 16px;
}
.he-rv-write .tutor-write-review-form {
	padding: clamp(18px, 4cqi, 28px);
	border: 1px solid var(--rv-line);
	border-radius: 18px;
	background: #fafbfb;
}
.he-rv-write .tutor-form-group {
	margin: 0 0 14px;
}
.he-rv-pick-label {
	margin: 0 0 6px;
	font-size: 13px;
	color: var(--rv-muted);
}
.he-rv-write .tutor-ratings-selectable {
	color: var(--rv-teal);
}
.he-rv-write textarea {
	width: 100%;
	min-height: 140px;
	padding: 14px 16px;
	border: 1px solid #cddadc;
	border-radius: 14px;
	background: #fdfefe;
	color: var(--rv-text);
	font: 15px/1.8 var(--rv-sans);
	resize: vertical;
}
.he-rv-write textarea:focus {
	border-color: transparent;
	outline: 2px solid var(--rv-teal);
	outline-offset: 0;
	box-shadow: none;
}

/* 테마가 제출 버튼에 '!important' 기본색(검정)을 걸어 둬서, 리뷰란 안에서만 같은 세기로 되돌린다. */
.he-rv .he-rv-write .he-rv-submit {
	border-color: var(--rv-teal) !important;
	background-color: var(--rv-teal) !important;
	color: var(--rv-paper) !important;
}
@media (hover: hover) and (pointer: fine) {
	.he-rv .he-rv-write .he-rv-submit:hover {
		border-color: var(--rv-teal-deep) !important;
		background-color: var(--rv-teal-deep) !important;
	}
}
/* Tutor 별점 고르기 별(아이콘 글꼴)을 브랜드 청록으로 */
.he-rv .he-rv-write .tutor-ratings-selectable [class*="tutor-icon"] {
	color: var(--rv-teal) !important;
}

/* 좁은 화면(강의 본문 칸 기준) */
@container (max-width: 480px) {
	.he-rv-cabin {
		gap: 18px;
		padding: 22px 20px;
	}
	.he-rv-window {
		width: 94px;
		height: 126px;
	}
	.he-rv-score {
		font-size: 38px;
	}
	.he-rv-item {
		grid-template-columns: 38px minmax(0, 1fr);
		gap: 12px;
	}
	.he-rv-avatar {
		width: 38px;
		height: 38px;
		font-size: 15px;
	}
}
@container (max-width: 330px) {
	.he-rv-cabin {
		grid-template-columns: 1fr;
	}
}

/* 탭을 열 때 후기가 차례로 들어온다. 움직임 줄이기 설정이면 그냥 나타난다. */
@media (prefers-reduced-motion: no-preference) {
	.he-rv-item {
		animation: he-rv-in .28s var(--rv-ease) both;
	}
	.he-rv-list > .he-rv-item:nth-child(2) { animation-delay: .04s; }
	.he-rv-list > .he-rv-item:nth-child(3) { animation-delay: .08s; }
	.he-rv-list > .he-rv-item:nth-child(4) { animation-delay: .12s; }
	.he-rv-list > .he-rv-item:nth-child(5) { animation-delay: .16s; }
	.he-rv-list > .he-rv-item:nth-child(n+6) { animation-delay: .2s; }
}
@keyframes he-rv-in {
	from {
		opacity: 0;
		transform: translateY(6px);
	}
}
