/**
 * Expertis – Thiết kế cơ cấu lương
 *
 * ĐỘ ƯU TIÊN — phần dễ sai nhất khi nhúng vào Elementor.
 *
 *   Theme + Elementor          ~0,2,1   (vd .elementor-widget-text-editor p)
 *   A. RESET   .esd.esd.esd :where(tag)  = 0,3,0   → thắng Elementor
 *   B. THIẾT KẾ .esd.esd.esd .lớp        = 0,4,0   → thắng cả reset lẫn Elementor
 *
 * Reset phải đủ cao để chặn kế thừa từ theme, nhưng phải THẤP HƠN phần thiết kế,
 * nếu không nó xoá sạch chính giao diện của công cụ. `:where()` có độ ưu tiên
 * bằng 0 nên giữ được khoảng cách đó mà không cần dùng !important.
 *
 * Khi thêm quy tắc mới, LUÔN viết đủ tiền tố `.esd.esd.esd`.
 */

/* ============================================================
   A. RESET — chặn mọi thứ theme và Elementor áp vào
   ============================================================ */

.esd.esd.esd,
.esd.esd.esd :where(*),
.esd.esd.esd :where(*)::before,
.esd.esd.esd :where(*)::after {
	box-sizing: border-box;
	min-width: 0;
}

.esd.esd.esd {
	display: block;
	float: none;
	clear: both;
	isolation: isolate;
	width: 100%;
	max-width: 1120px;
	margin: 0 auto;
	padding: 0;
	border: 0;
	background: none;
	text-align: left;
	text-indent: 0;
	text-transform: none;
	letter-spacing: normal;
	font-variant-numeric: tabular-nums;
	-webkit-font-smoothing: antialiased;
}

.esd.esd.esd :where(div, section, header, article, aside, p, span, strong, em, small,
h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, table, thead, tbody, tr, th, td,
figure, form, fieldset, legend, label, details, summary, blockquote, a, b, i) {
	margin: 0;
	padding: 0;
	text-indent: 0;
	border: 0;
	background: none;
	float: none;
	position: static;
	width: auto;
	max-width: none;
	min-height: 0;
	text-transform: none;
	letter-spacing: normal;
	text-shadow: none;
	box-shadow: none;
	border-radius: 0;
	font-family: inherit;
	font-weight: inherit;
	font-style: normal;
	font-size: inherit;
	line-height: inherit;
	color: inherit;
	text-align: inherit;
}

.esd.esd.esd :where(ul, ol) {
	list-style: none;
}

/*
 * Nhiều theme khai font chữ tiêu đề kèm !important (ví dụ ép Fraunces cho mọi h2).
 * !important thắng mọi độ ưu tiên, nên đây là chỗ duy nhất trong file buộc phải
 * dùng lại !important để giành lại quyền kiểm soát. Bên trong công cụ luôn dùng
 * font sans của hệ thiết kế: phần trang là editorial, phần công cụ là vận hành.
 */
.esd.esd.esd,
.esd.esd.esd :where(*) {
	font-family: inherit !important;
}

.esd.esd.esd :where(h1, h2, h3, h4, h5, h6) {
	line-height: 1.3;
}

.esd.esd.esd :where(table) {
	border-collapse: collapse;
	width: 100%;
}

.esd.esd.esd :where(details, summary) {
	display: block;
}

.esd.esd.esd :where(summary) {
	list-style: none;
	cursor: pointer;
}

.esd.esd.esd :where(summary)::-webkit-details-marker,
.esd.esd.esd :where(summary)::marker {
	display: none;
	content: '';
}

.esd.esd.esd :where(input, select, textarea) {
	-webkit-appearance: none;
	appearance: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
	border-radius: 0;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	color: inherit;
	letter-spacing: normal;
	text-transform: none;
	width: 100%;
	max-width: 100%;
	min-height: 0;
	height: auto;
}

/* Button được dựng lại hoàn toàn, nên gỡ sạch trước rồi mới style. */
.esd.esd.esd :where(button) {
	all: unset;
	box-sizing: border-box;
	display: block;
	cursor: pointer;
	font-family: inherit;
	max-width: 100%;
}

.esd.esd.esd :where(a) {
	text-decoration: none;
	text-underline-offset: auto;
	text-decoration-style: solid;
	box-shadow: none;
	border: 0;
	background: none;
	font-family: inherit;
	font-weight: inherit;
	font-style: normal;
}

.esd.esd.esd :where(input, select, textarea, button, a, summary):focus-visible {
	outline: 2px solid var(--esd-brand);
	outline-offset: 2px;
}

.esd.esd.esd [hidden] {
	display: none !important;
}

/* ============================================================
   B. TOKEN
   ============================================================ */

.esd.esd.esd {
	--esd-ink: var(--exp-ink, #0A1140);
	--esd-ink-2: var(--exp-ink-2, #2A368C);
	--esd-brand: var(--exp-brand, #F87B1B);
	--esd-brand-2: var(--exp-brand-2, #FF9442);
	--esd-brand-ink: var(--exp-brand-ink, #BC580E);
	--esd-paper: var(--exp-paper, #F6F4F1);
	--esd-paper-2: var(--exp-paper-2, #FAF8F5);
	--esd-card: var(--exp-card, #FFFFFF);
	--esd-body: var(--exp-body, #1F2640);
	--esd-muted: var(--exp-muted, #525A73);
	--esd-line: var(--exp-line-l, rgba(10, 17, 64, .12));
	--esd-font: var(--exp-sans, 'Be Vietnam Pro', system-ui, sans-serif);

	--esd-high: #B3362B;
	--esd-medium: var(--exp-brand-ink, #BC580E);
	--esd-low: #8A6A1F;
	--esd-clear: #2E7D4F;

	font-family: var(--esd-font) !important;
	font-size: 16px;
	line-height: 1.6;
	color: var(--esd-body);
}


/* ============================================================
   C. GIAO DIỆN
   ============================================================ */

/* ---- Vỏ ---- */

.esd.esd.esd {
	background: var(--esd-card);
	border: 1px solid var(--esd-line);
	border-top: 4px solid var(--esd-brand);
	border-radius: 16px;
	box-shadow: 0 1px 2px rgba(10, 17, 64, .04), 0 10px 28px rgba(10, 17, 64, .05);
	overflow: hidden;
}

.esd.esd.esd .esd-head {
	padding: 28px 28px 22px;
	border-bottom: 1px solid var(--esd-line);
	background: var(--esd-paper-2);
}

.esd.esd.esd .esd-title {
	font-size: 22px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -.01em;
	color: var(--esd-ink);
}

.esd.esd.esd .esd-lead {
	margin-top: 8px;
	font-size: 15px;
	color: var(--esd-muted);
	max-width: 62ch;
}

.esd.esd.esd .esd-stamp {
	margin-top: 12px;
	font-size: 12px;
	letter-spacing: .02em;
	color: var(--esd-muted);
}

/* ---- Bước ---- */

.esd.esd.esd .esd-step {
	padding: 26px 28px 30px;
}

.esd.esd.esd .esd-step-mark {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--esd-brand-ink);
	margin-bottom: 18px;
}

/* ---- Trường nhập ---- */

.esd.esd.esd .esd-field {
	margin-bottom: 20px;
}

.esd.esd.esd .esd-label {
	display: block;
	font-size: 16px;
	font-weight: 600;
	color: var(--esd-ink);
	margin-bottom: 8px;
}

.esd.esd.esd .esd-input {
	display: block;
	width: 100%;
	padding: 11px 13px;
	border: 1px solid var(--esd-line);
	border-radius: 9px;
	background: var(--esd-card);
	font-size: 16px;
	color: var(--esd-ink);
	transition: border-color .15s ease, box-shadow .15s ease;
}

.esd.esd.esd .esd-input:focus {
	border-color: var(--esd-brand);
	box-shadow: 0 0 0 3px rgba(248, 123, 27, .16);
	outline: none;
}

.esd.esd.esd .esd-money {
	position: relative;
}

.esd.esd.esd .esd-money .esd-input {
	padding-right: 62px;
	font-size: 20px;
	font-weight: 600;
	letter-spacing: -.01em;
}

.esd.esd.esd .esd-unit {
	position: absolute;
	right: 13px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 13px;
	color: var(--esd-muted);
	pointer-events: none;
}

.esd.esd.esd .esd-note {
	margin-top: 7px;
	font-size: 13px;
	line-height: 1.55;
	color: var(--esd-muted);
}

.esd.esd.esd .esd-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}

.esd.esd.esd .esd-error {
	margin-bottom: 14px;
	padding: 11px 13px;
	border-radius: 9px;
	background: rgba(179, 54, 43, .07);
	border-left: 3px solid var(--esd-high);
	font-size: 14px;
	color: var(--esd-high);
}

/* ---- Nút ---- */

.esd.esd.esd .esd-button {
	display: inline-block;
	padding: 12px 22px;
	border-radius: 9px;
	background: var(--esd-brand);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	transition: background .15s ease, transform .1s ease;
}

.esd.esd.esd .esd-button:hover {
	background: var(--esd-brand-2);
}

.esd.esd.esd .esd-button:active {
	transform: translateY(1px);
}

.esd.esd.esd .esd-link {
	display: inline-block;
	padding: 12px 4px;
	font-size: 14px;
	font-weight: 600;
	color: var(--esd-brand-ink);
	border-bottom: 1px solid transparent;
}

.esd.esd.esd .esd-link:hover {
	border-bottom-color: currentColor;
}

.esd.esd.esd .esd-actions {
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
	margin-top: 22px;
}

/* ---- Thanh trượt ---- */

.esd.esd.esd .esd-slider {
	padding: 22px 22px 18px;
	border: 1px solid var(--esd-line);
	border-radius: 13px;
	background: var(--esd-paper-2);
	margin-bottom: 22px;
}

.esd.esd.esd .esd-slider-head {
	display: flex;
	align-items: baseline;
	gap: 8px;
	flex-wrap: wrap;
	margin-bottom: 18px;
}

.esd.esd.esd .esd-slider-label {
	font-size: 15px;
	color: var(--esd-muted);
}

.esd.esd.esd .esd-slider-value {
	font-size: 30px;
	font-weight: 700;
	letter-spacing: -.02em;
	color: var(--esd-ink);
	line-height: 1;
}

.esd.esd.esd .esd-track {
	position: relative;
	height: 30px;
	display: flex;
	align-items: center;
}

/*
 * Nền thanh vẽ bằng một lớp riêng, không dùng nền mặc định của input range —
 * nếu để input tự vẽ nền, nó sẽ nằm đè lên dải khuyến nghị.
 */
.esd.esd.esd .esd-rail {
	position: absolute;
	left: 12px;
	right: 12px;
	top: 11px;
	height: 8px;
	border-radius: 4px;
	background: rgba(10, 17, 64, .12);
	pointer-events: none;
}

.esd.esd.esd .esd-floor {
	position: absolute;
	top: 4px;
	width: 2px;
	height: 22px;
	margin-left: -1px;
	border-radius: 1px;
	background: var(--esd-high);
	pointer-events: none;
	z-index: 1;
}

.esd.esd.esd .esd-floor-note {
	flex: 1 1 auto;
	text-align: center;
	color: var(--esd-high);
	font-weight: 600;
}

.esd.esd.esd .esd-invalid {
	margin-top: 9px;
	padding: 9px 11px;
	border-radius: 8px;
	background: rgba(179, 54, 43, .07);
	border-left: 3px solid var(--esd-high);
	font-size: 13px;
	line-height: 1.55;
	color: var(--esd-high);
}

.esd.esd.esd .esd-split {
	margin-top: 14px;
	padding-top: 13px;
	border-top: 1px solid var(--esd-line);
	font-size: 14px;
	line-height: 1.6;
	color: var(--esd-body);
}

.esd.esd.esd .esd-range {
	position: relative;
	width: 100%;
	height: 30px;
	background: none;
	cursor: pointer;
}

.esd.esd.esd .esd-range::-webkit-slider-runnable-track {
	height: 8px;
	border-radius: 4px;
	background: transparent;
}

.esd.esd.esd .esd-range::-moz-range-track {
	height: 8px;
	border-radius: 4px;
	background: transparent;
}

.esd.esd.esd .esd-range::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 24px;
	height: 24px;
	margin-top: -8px;
	border-radius: 50%;
	background: var(--esd-brand);
	border: 3px solid #fff;
	box-shadow: 0 1px 4px rgba(10, 17, 64, .28);
}

.esd.esd.esd .esd-range::-moz-range-thumb {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--esd-brand);
	border: 3px solid #fff;
	box-shadow: 0 1px 4px rgba(10, 17, 64, .28);
}

.esd.esd.esd .esd-scale {
	position: relative;
	height: 9px;
	margin-top: 1px;
}

.esd.esd.esd .esd-scale span {
	position: absolute;
	top: 0;
	width: 1px;
	height: 4px;
	margin-left: -1px;
	background: rgba(10, 17, 64, .20);
}

.esd.esd.esd .esd-scale span[data-major] {
	height: 8px;
	background: rgba(10, 17, 64, .38);
}

.esd.esd.esd .esd-track-ends {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 10px;
	margin-top: 4px;
	font-size: 12px;
	color: var(--esd-muted);
}

.esd.esd.esd .esd-neutral {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid var(--esd-line);
	font-size: 13px;
	line-height: 1.6;
	color: var(--esd-muted);
}

/* ---- Bốn thẻ hệ quả ---- */

.esd.esd.esd .esd-cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}

/*
 * Hai thẻ cùng hàng cao bằng nhau, và phần "số này ra từ đâu" của cả hai đều
 * neo xuống đáy thẻ — nhờ vậy hai nút mở bảng chi tiết nằm ngang nhau thay vì
 * lệch nhau theo độ dài nội dung.
 */
.esd.esd.esd .esd-card {
	display: flex;
	flex-direction: column;
	padding: 18px;
	border: 1px solid var(--esd-line);
	border-radius: 12px;
	background: var(--esd-card);
}

.esd.esd.esd .esd-card .esd-break {
	margin-top: auto;
}

.esd.esd.esd .esd-card-label {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--esd-muted);
	margin-bottom: 9px;
}

.esd.esd.esd .esd-card-value {
	font-size: 24px;
	font-weight: 700;
	letter-spacing: -.02em;
	line-height: 1.2;
	color: var(--esd-ink);
}

.esd.esd.esd .esd-card-tier {
	font-size: 17px;
	font-weight: 600;
	color: var(--esd-ink);
	line-height: 1.35;
}

.esd.esd.esd .esd-card-text {
	margin-top: 8px;
	font-size: 13px;
	line-height: 1.6;
	color: var(--esd-muted);
}

.esd.esd.esd .esd-card[data-tone="good"] .esd-card-value {
	color: var(--esd-clear);
}

.esd.esd.esd .esd-card[data-tone="watch"] .esd-card-value {
	color: var(--esd-medium);
}

.esd.esd.esd .esd-gauge {
	display: flex;
	gap: 5px;
	margin-top: 10px;
}

.esd.esd.esd .esd-gauge span {
	display: block;
	height: 5px;
	flex: 1 1 0;
	border-radius: 3px;
	background: rgba(10, 17, 64, .12);
}

.esd.esd.esd .esd-gauge span[data-on="1"] {
	background: var(--esd-brand);
}

/* ---- Cách vận hành phần biến động ---- */

/* ---- Lựa chọn dạng ô ---- */

.esd.esd.esd .esd-choice {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin-top: 8px;
	padding: 9px 11px;
	border: 1px solid var(--esd-line);
	border-radius: 8px;
	background: var(--esd-card);
	font-size: 13px;
	line-height: 1.5;
	cursor: pointer;
	transition: border-color .15s ease, background .15s ease;
}

.esd.esd.esd .esd-choice:hover {
	border-color: var(--esd-brand);
}

.esd.esd.esd .esd-choice:has( input:checked ) {
	border-color: var(--esd-brand);
	background: rgba(248, 123, 27, .06);
}

.esd.esd.esd .esd-choice input {
	-webkit-appearance: auto;
	appearance: auto;
	width: 16px;
	min-width: 16px;
	height: 16px;
	margin-top: 2px;
	accent-color: var(--esd-brand);
	cursor: pointer;
}

/* ---- Hai bảng tính ---- */

.esd.esd.esd .esd-tables {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: start;
	gap: 14px;
	margin-bottom: 14px;
}

.esd.esd.esd .esd-table {
	padding: 18px;
	border: 1px solid var(--esd-line);
	border-radius: 12px;
	background: var(--esd-paper);
}

.esd.esd.esd .esd-table-title {
	font-size: 16px;
	font-weight: 700;
	letter-spacing: -.01em;
	color: var(--esd-ink);
}

.esd.esd.esd .esd-table-caption {
	margin-top: 3px;
	font-size: 12px;
	color: var(--esd-muted);
}

.esd.esd.esd .esd-break-list {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 0 14px;
	margin-top: 10px;
	font-size: 13px;
	line-height: 1.5;
}

.esd.esd.esd .esd-break-list dt {
	padding: 8px 0;
	color: var(--esd-muted);
	border-top: 1px solid var(--esd-line);
}

.esd.esd.esd .esd-break-list dd {
	padding: 8px 0;
	text-align: right;
	white-space: nowrap;
	color: var(--esd-ink);
	border-top: 1px solid var(--esd-line);
	font-variant-numeric: tabular-nums;
}

.esd.esd.esd .esd-break-list dt[data-total],
.esd.esd.esd .esd-break-list dd[data-total] {
	font-weight: 700;
	color: var(--esd-ink);
	border-top-color: var(--esd-ink);
}

.esd.esd.esd .esd-break-list dt[data-warn],
.esd.esd.esd .esd-break-list dd[data-warn] {
	color: var(--esd-high);
}

.esd.esd.esd .esd-break-list dd[data-hint] {
	grid-column: 1 / -1;
	text-align: left;
	white-space: normal;
	padding: 0 0 8px;
	border-top: 0;
	font-size: 12px;
	line-height: 1.55;
	color: var(--esd-muted);
}

/* ---- Bảng chi tiết mở ra được ---- */

.esd.esd.esd .esd-break {
	margin-top: 14px;
	padding-top: 13px;
	border-top: 1px solid var(--esd-line);
}

.esd.esd.esd .esd-break-summary {
	font-size: 13px;
	font-weight: 600;
	color: var(--esd-brand-ink);
}

.esd.esd.esd .esd-break-summary::after {
	content: ' ›';
}

.esd.esd.esd .esd-break[open] .esd-break-summary::after {
	content: ' ⌄';
}

/* ---- Khối đánh giá rủi ro ---- */

.esd.esd.esd .esd-risk {
	margin-top: 14px;
	padding: 20px;
	border: 1px solid var(--esd-line);
	border-left: 4px solid var(--esd-brand);
	border-radius: 12px;
	background: var(--esd-paper-2);
}

.esd.esd.esd .esd-risk-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
}

.esd.esd.esd .esd-risk-title {
	font-size: 17px;
	font-weight: 700;
	letter-spacing: -.01em;
	color: var(--esd-ink);
}

.esd.esd.esd .esd-risk-level {
	display: inline-block;
	padding: 4px 11px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	white-space: nowrap;
	background: rgba(10, 17, 64, .08);
	color: var(--esd-ink);
}

.esd.esd.esd .esd-risk-level[data-level="qualified"] {
	background: rgba(46, 125, 79, .14);
	color: var(--esd-clear);
}

.esd.esd.esd .esd-risk-level[data-level="partial"] {
	background: rgba(188, 88, 14, .12);
	color: var(--esd-brand-ink);
}

.esd.esd.esd .esd-risk-level[data-level="weak"] {
	background: rgba(179, 54, 43, .12);
	color: var(--esd-high);
}

.esd.esd.esd .esd-legal {
	margin-top: 12px;
	padding: 11px 14px;
	border-left: 3px solid var(--esd-ink);
	border-radius: 0 8px 8px 0;
	background: var(--esd-card);
	font-size: 13px;
	line-height: 1.65;
	color: var(--esd-ink);
}

.esd.esd.esd .esd-risk-intro {
	margin-top: 9px;
	font-size: 13px;
	line-height: 1.6;
	color: var(--esd-muted);
}

.esd.esd.esd .esd-risk-summary {
	margin-top: 8px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--esd-body);
}

.esd.esd.esd .esd-criteria {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	margin-top: 18px;
}

/* Tiêu chí lẻ cuối cùng trải hết hàng thay vì để trống nửa bên phải. */
.esd.esd.esd .esd-criterion:last-child:nth-child(odd) {
	grid-column: 1 / -1;
}

.esd.esd.esd .esd-criterion {
	padding: 14px 15px;
	border: 1px solid var(--esd-line);
	border-radius: 10px;
	background: var(--esd-card);
}

.esd.esd.esd .esd-criterion-legend {
	display: block;
	font-size: 14px;
	font-weight: 600;
	color: var(--esd-ink);
	line-height: 1.4;
}

.esd.esd.esd .esd-criterion-no {
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 7px;
	border-radius: 50%;
	background: var(--esd-ink);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	line-height: 20px;
	text-align: center;
	vertical-align: 1px;
}

.esd.esd.esd .esd-risk-result {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	margin-top: 18px;
	padding-top: 16px;
	border-top: 1px solid var(--esd-line);
}

.esd.esd.esd .esd-risk-list + .esd-risk-list {
	margin-top: 14px;
}

.esd.esd.esd .esd-risk-list-title {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--esd-muted);
	margin-bottom: 7px;
}

.esd.esd.esd .esd-ticks li {
	position: relative;
	padding: 5px 0 5px 24px;
	font-size: 13px;
	line-height: 1.55;
	color: var(--esd-body);
}

.esd.esd.esd .esd-ticks li::before {
	content: '✓';
	position: absolute;
	left: 0;
	top: 5px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: rgba(46, 125, 79, .14);
	color: var(--esd-clear);
	font-size: 10px;
	font-weight: 700;
	line-height: 16px;
	text-align: center;
}

.esd.esd.esd .esd-ticks-gap li::before {
	content: '!';
	background: rgba(188, 88, 14, .14);
	color: var(--esd-brand-ink);
}

.esd.esd.esd .esd-risk-amount {
	padding: 16px 17px;
	border: 1px solid var(--esd-line);
	border-radius: 10px;
	background: var(--esd-card);
	align-self: start;
}

.esd.esd.esd .esd-risk-amount[data-tone="good"] .esd-card-value {
	color: var(--esd-clear);
	font-size: 19px;
}

.esd.esd.esd .esd-risk-amount[data-tone="watch"] .esd-card-value {
	color: var(--esd-medium);
}

.esd.esd.esd .esd-risk-amount[data-tone="weak"] .esd-card-value {
	color: var(--esd-high);
}

/* ---- Kết luận ---- */

.esd.esd.esd .esd-verdict {
	padding: 20px 22px;
	border-radius: 13px;
	background: var(--esd-paper);
	border-left: 4px solid var(--esd-brand);
}

.esd.esd.esd .esd-verdict-label {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--esd-muted);
}

.esd.esd.esd .esd-verdict-value {
	margin-top: 6px;
	font-size: 22px;
	font-weight: 700;
	letter-spacing: -.01em;
	color: var(--esd-ink);
	line-height: 1.3;
}

.esd.esd.esd .esd-verdict-split {
	margin-top: 8px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--esd-body);
}

.esd.esd.esd .esd-verdict-band {
	margin-top: 9px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--esd-body);
}

.esd.esd.esd .esd-quote {
	margin-top: 20px;
	padding: 20px 22px;
	border: 1px solid var(--esd-line);
	border-radius: 13px;
	background: var(--esd-card);
}

.esd.esd.esd .esd-quote-label {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--esd-brand-ink);
	margin-bottom: 9px;
}

.esd.esd.esd .esd-quote-text {
	font-size: 17px;
	line-height: 1.65;
	color: var(--esd-ink);
}

.esd.esd.esd .esd-todo {
	margin-top: 20px;
}

.esd.esd.esd .esd-todo-label {
	font-size: 15px;
	font-weight: 600;
	color: var(--esd-ink);
	margin-bottom: 10px;
}

.esd.esd.esd .esd-todo-list {
	counter-reset: esd-todo;
}

.esd.esd.esd .esd-todo-list li {
	counter-increment: esd-todo;
	position: relative;
	padding: 10px 0 10px 34px;
	border-top: 1px solid var(--esd-line);
	font-size: 14px;
	line-height: 1.6;
	color: var(--esd-body);
}

.esd.esd.esd .esd-todo-list li::before {
	content: counter(esd-todo);
	position: absolute;
	left: 0;
	top: 11px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--esd-brand);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	line-height: 22px;
	text-align: center;
}

.esd.esd.esd .esd-cta {
	display: inline-block;
	margin-top: 22px;
	padding: 13px 24px;
	border-radius: 9px;
	background: var(--esd-ink);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	transition: background .15s ease;
}

.esd.esd.esd .esd-cta:hover {
	background: var(--esd-ink-2);
}

/* ---- Công khai thông số ---- */

.esd.esd.esd .esd-disclosure {
	margin-top: 26px;
	border-top: 1px solid var(--esd-line);
	padding-top: 18px;
}

.esd.esd.esd .esd-disclosure-summary {
	font-size: 14px;
	font-weight: 600;
	color: var(--esd-brand-ink);
}

.esd.esd.esd .esd-disclosure-summary::after {
	content: ' ›';
}

.esd.esd.esd .esd-disclosure[open] .esd-disclosure-summary::after {
	content: ' ⌄';
}

.esd.esd.esd .esd-disclosure-body {
	margin-top: 14px;
	font-size: 13px;
	line-height: 1.7;
	color: var(--esd-muted);
}

.esd.esd.esd .esd-disclosure-heading {
	margin-top: 16px;
	margin-bottom: 5px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .03em;
	text-transform: uppercase;
	color: var(--esd-ink);
}

.esd.esd.esd .esd-disclosure-list li {
	position: relative;
	padding-left: 16px;
	margin-top: 5px;
}

.esd.esd.esd .esd-disclosure-list li::before {
	content: '';
	position: absolute;
	left: 3px;
	top: 10px;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--esd-brand);
}

.esd.esd.esd .esd-disclosure-body a {
	color: var(--esd-brand-ink);
	border-bottom: 1px solid rgba(188, 88, 14, .35);
}

.esd.esd.esd .esd-disclosure-foot {
	margin-top: 16px;
	padding-top: 12px;
	border-top: 1px solid var(--esd-line);
	font-size: 12px;
}

/* ---- Màn hẹp ---- */

@media (max-width: 720px) {

	.esd.esd.esd .esd-head,
	.esd.esd.esd .esd-step {
		padding-left: 18px;
		padding-right: 18px;
	}

	.esd.esd.esd .esd-row,
	.esd.esd.esd .esd-cards,
	.esd.esd.esd .esd-tables,
	.esd.esd.esd .esd-criteria,
	.esd.esd.esd .esd-risk-result {
		grid-template-columns: 1fr;
	}

	.esd.esd.esd .esd-table,
	.esd.esd.esd .esd-risk {
		padding-left: 15px;
		padding-right: 15px;
	}

	.esd.esd.esd .esd-break-list {
		font-size: 12.5px;
	}

	.esd.esd.esd .esd-scale {
	position: relative;
	height: 9px;
	margin-top: 1px;
}

.esd.esd.esd .esd-scale span {
	position: absolute;
	top: 0;
	width: 1px;
	height: 4px;
	margin-left: -1px;
	background: rgba(10, 17, 64, .20);
}

.esd.esd.esd .esd-scale span[data-major] {
	height: 8px;
	background: rgba(10, 17, 64, .38);
}

.esd.esd.esd .esd-track-ends {
		flex-wrap: wrap;
	}

	.esd.esd.esd .esd-floor-note {
		order: 3;
		flex-basis: 100%;
		text-align: left;
		margin-top: 4px;
	}

	.esd.esd.esd .esd-title {
		font-size: 20px;
	}

	.esd.esd.esd .esd-slider-value {
		font-size: 26px;
	}

	.esd.esd.esd .esd-card-value {
		font-size: 21px;
	}

	.esd.esd.esd .esd-quote-text {
		font-size: 16px;
	}

	.esd.esd.esd .esd-slider,
	.esd.esd.esd .esd-verdict,
	.esd.esd.esd .esd-quote {
		padding-left: 16px;
		padding-right: 16px;
	}

	.esd.esd.esd .esd-scale {
	position: relative;
	height: 9px;
	margin-top: 1px;
}

.esd.esd.esd .esd-scale span {
	position: absolute;
	top: 0;
	width: 1px;
	height: 4px;
	margin-left: -1px;
	background: rgba(10, 17, 64, .20);
}

.esd.esd.esd .esd-scale span[data-major] {
	height: 8px;
	background: rgba(10, 17, 64, .38);
}

.esd.esd.esd .esd-track-ends {
		font-size: 11px;
	}
}