@charset "UTF-8";
/* ==========================================================================
   Gửi tiết kiệm + giao dịch — phần bổ sung của ndh_auto (không có trong theme WordPress)
   ==========================================================================

   Trang /gui-tiet-kiem/<ngân-hàng>/: hàng "gửi trực tuyến" trong bảng lãi suất, bảng
   phụ "Hình thức nhận lãi khác (nhập tay…)", dòng nguồn của biểu nhập tay, mục
   "Sản phẩm tiết kiệm đặc biệt", "Bảo hiểm tiền gửi".
   Trang /gui-tiet-kiem/: nhãn "Ưu đãi đến x%" cạnh tên ngân hàng.
   Trang /giao-dich/<slug>/: "Biểu phí chính thức", "Tra soát giao dịch lỗi".
   Chỉ nạp khi trang có một trong các khối trên (banking/saving-extra.ts, txn-extra.ts).
   Dùng lại lớp sẵn có của theme (cmp__table, svmatrix, termgrid/termbox, refinfo__h3,
   riders__lead, btn-ghost, verified) — tệp này chỉ thêm phần còn thiếu.
   -------------------------------------------------------------------------- */

/* --- Chung ---------------------------------------------------------------- */
.svx-muted { margin-top: 12px; font-size: 13.5px; line-height: 1.6; color: var(--gray-2); }
.svx-muted a { color: var(--purple); text-decoration: underline; text-underline-offset: 3px; }
.svx .termgrid { margin-top: 0; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
.svx .termbox dd { overflow-wrap: anywhere; }
.svx-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }

/* --- Bảng lãi suất: hàng kênh trực tuyến ---------------------------------- */
.svx-online th[scope="row"] { color: var(--green-dark); }
.svmatrix .svx-online td { border-top: 1px dashed var(--edge); }
.svmatrix .svx-online th { border-top: 1px dashed var(--edge); }
.svmatrix__cell.svx-up { font-weight: 700; color: var(--green-dark); background: rgba(46, 125, 80, .07); }

/* --- Dòng nguồn của biểu nhập tay ----------------------------------------- */
.svx-src { margin-top: 10px; }
.svx-src a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

/* --- Bảng phụ: hình thức nhận lãi khác (nhập tay) -------------------------- */
.svx-manual {
	margin-top: 26px;
	padding: 16px 18px 18px;
	background: #FAF9F7;
	border: 1px dashed var(--edge);
	border-radius: 14px;
}
.svx-manual .refinfo__h3 { margin-top: 0; }
.svx-manual .svx-muted { margin: 4px 0 12px; }
.svx-manual__table { background: #fff; }
.svx-manual__table .svmatrix__cell { color: var(--gray); }

/* --- Sản phẩm tiết kiệm đặc biệt ------------------------------------------ */
/* .cmp__table viết cho bảng 8 cột (min-width 900px); bảng này 4 cột — vừa khung nội dung, chỉ cuộn trên điện thoại. */
.svx-special { min-width: 600px; }
.svx-special th, .svx-special td { padding-inline: 13px; vertical-align: top; }
.svx-special th[scope="row"] { text-align: left; width: 32%; }
.svx-special__name { display: block; font-weight: 700; color: var(--ink); line-height: 1.4; }
.svx-special__term { white-space: nowrap; }
.svx-special__rate { font-weight: 700; color: var(--c-act-800); white-space: nowrap; font-variant-numeric: tabular-nums; }
.svx-special__cond { font-size: 14px; line-height: 1.55; color: var(--gray); }
.svx-special__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 6px; font-size: 12.5px; color: var(--gray-2); }
.svx-special__meta span { display: inline-flex; align-items: center; gap: 5px; }
.svx-special__meta .ico { width: 14px; height: 14px; color: var(--c-act-700); }
.svx-kind {
	display: inline-block;
	margin-top: 5px;
	padding: 2px 9px;
	border-radius: var(--r-pill, 999px);
	background: var(--c-act-50);
	border: 1px solid #E9DCC7;
	font-size: 12px; font-weight: 600; line-height: 1.5;
	color: var(--c-act-800);
}
.svx-kind--online { background: rgba(46, 125, 80, .08); border-color: rgba(46, 125, 80, .25); color: var(--green-dark); }
.svx-kind--tich-luy, .svx-kind--cctg { background: var(--c-soft); border-color: var(--edge); color: var(--ink); }

/* --- Bảo hiểm tiền gửi / biểu phí / tra soát ------------------------------- */
.svx-facts { margin-top: 4px; }
.svx-notes { display: grid; gap: 8px; margin-top: 14px; }
.svx-notes li {
	display: flex; align-items: flex-start; gap: 9px;
	padding: 11px 15px;
	background: #FAF9F7; border: 1px solid var(--edge); border-radius: 12px;
	font-size: 14.5px; line-height: 1.55; color: var(--gray);
}
.svx-notes .ico { width: 18px; height: 18px; flex: none; margin-top: 1px; color: var(--c-act-700); }

/* --- Trang so sánh: nhãn ưu đãi ------------------------------------------- */
.svbank .svx-flag {
	display: inline-flex; align-items: center; gap: 4px;
	flex: none;
	margin-left: auto;
	padding: 2px 8px;
	border-radius: var(--r-pill, 999px);
	background: var(--c-act-50);
	border: 1px solid #E9DCC7;
	font-size: 11.5px; font-weight: 700; line-height: 1.5; white-space: nowrap;
	color: var(--c-act-800);
	font-variant-numeric: tabular-nums;
}
.svx-flag .ico { width: 13px; height: 13px; color: var(--c-act-700); }
.svx-flag-note .ico { color: var(--c-act-700); }

@media (max-width: 640px) {
	.svbank { flex-wrap: wrap; }
	.svbank .svx-flag { margin-left: 48px; }
	.svx-manual { padding: 14px 12px 14px; }
}

/* Nhãn số liệu nhập tay ("Nhập tay 05/10") — trang ngân hàng, bảng so sánh /gui-tiet-kiem/. */
.svx-badge { display: inline-block; padding: 1px 7px; border-radius: 999px; background: #fff4dc; color: #8a5a00; font-size: 12px; font-weight: 600; line-height: 1.6; white-space: nowrap; vertical-align: middle; }
.svbank .svx-badge { margin-left: 6px; }
/* Ngân hàng chưa có biểu lãi suất đã đối chiếu. */
.svx-nodata__box { display: flex; gap: 10px; align-items: flex-start; margin-top: 12px; padding: 14px 16px; border: 1px solid var(--line, #e6e6e6); border-radius: 12px; background: #fafafa; font-size: 15px; line-height: 1.6; }
.svx-nodata__box svg { flex: none; width: 20px; height: 20px; margin-top: 2px; }
.svx-nodata__box a { color: var(--purple); text-decoration: underline; text-underline-offset: 3px; }
.svx-badge--none { background: #f1f1f1; color: #6b6b6b; font-weight: 500; }