@charset "UTF-8";
/* ==========================================================================
   Hồ sơ ngân hàng — phần bổ sung của ndh_auto (không có trong theme WordPress)
   ==========================================================================

   Thẻ "Hồ sơ ngân hàng" dùng chung dưới hero các trang ngân hàng: thẻ tín dụng,
   thẻ ghi nợ, thẻ trả trước, mở tài khoản, giao dịch, gửi tiết kiệm và tổ chức
   cho vay (khi hồ sơ tổ chức còn trống). Bố cục dùng lại .insco__* và .insx-chip
   của ndh-ins.css (nạp cùng tệp này); tệp này chỉ thêm phần còn thiếu: nhãn,
   mã (SWIFT/BIN/CK), dải "khoá thẻ khẩn cấp", dịch vụ số, nút tải ứng dụng.
   Chỉ nạp khi trang có thẻ hồ sơ (src/lib/ndh/banking/bank-profile.ts).
   Màu lấy từ biến của tokens.css / lender.css.
   -------------------------------------------------------------------------- */

.bankp__kicker {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 5px 13px;
	background: var(--purple-50);
	border: 1px solid var(--purple-100);
	border-radius: var(--r-pill, 999px);
	font-size: 13px; font-weight: 600; color: var(--purple); line-height: 1.4;
}
.bankp__kicker .ico { width: 16px; height: 16px; }

.bankp__code {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 14.5px; letter-spacing: .6px; font-weight: 700; color: var(--ink);
}
a.bankp__code { color: var(--purple); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a.bankp__code:hover { color: var(--purple-dark, var(--purple)); }

/* --- Khoá thẻ khẩn cấp (trang thẻ) ---------------------------------------- */
.bankp__sos {
	display: flex; align-items: center; gap: 12px 16px; flex-wrap: wrap;
	padding: 14px 16px 14px 18px;
	background: #FDF3F2;
	border: 1px solid #F1CFCB;
	border-left: 4px solid var(--c-danger, #B3261E);
	border-radius: 12px;
}
.bankp__sos-ico { width: 22px; height: 22px; flex: none; color: var(--c-danger, #B3261E); }
.bankp__sos-text { flex: 1 1 280px; min-width: 0; font-size: 14.5px; line-height: 1.55; color: var(--gray); }
.bankp__sos-text b { color: var(--ink); }
.bankp__sos-call {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 9px 16px;
	background: var(--c-danger, #B3261E);
	border-radius: var(--r-pill, 999px);
	font-size: 15.5px; font-weight: 700; color: #fff; white-space: nowrap;
	font-variant-numeric: tabular-nums;
}
.bankp__sos-call .ico { width: 17px; height: 17px; }
.bankp__sos-call:hover, .bankp__sos-call:focus-visible { background: #8E1D17; color: #fff; }
.insco__contact .bankp__sosline > a { color: var(--c-danger, #B3261E); }
.insco__contact .bankp__sosline .ico { color: var(--c-danger, #B3261E); }

/* --- Dịch vụ số ----------------------------------------------------------- */
.bankp__digital { display: grid; gap: 10px; }
.bankp__h3 { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 700; color: var(--ink); }
.bankp__h3 .ico { width: 17px; height: 17px; color: var(--green); }
.bankp .insx-chip.bankp__chip--hl { background: var(--purple-50); border-color: var(--purple); color: var(--purple); }
.bankp .insx-chip.bankp__chip--hl .ico { color: var(--purple); }

/* --- Ứng dụng ------------------------------------------------------------- */
.bankp__apps {
	display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap;
	padding: 14px 16px;
	background: #FAF9F7;
	border: 1px solid var(--edge);
	border-radius: 14px;
}
.bankp__app-name { display: inline-flex; align-items: center; gap: 9px; font-size: 14.5px; color: var(--gray); }
.bankp__app-name .ico { width: 18px; height: 18px; color: var(--green); }
.bankp__app-name b { color: var(--ink); }
.bankp__stores { display: flex; gap: 8px; flex-wrap: wrap; }
.bankp__store {
	display: inline-flex; align-items: center; gap: 7px;
	padding: 8px 14px;
	background: #fff;
	border: 1px solid var(--edge);
	border-radius: var(--r-pill, 999px);
	font-size: 13.5px; font-weight: 700; color: var(--ink);
	transition: border-color .2s, color .2s;
}
.bankp__store .ico { width: 15px; height: 15px; color: var(--gray-2); }
.bankp__store:hover { border-color: var(--purple); color: var(--purple); }

/* Ngay sau hero (đã có khoảng đệm dưới): bỏ đệm trên để thẻ không trôi xa nội dung đầu trang. */
.carc__hero + .bankp, .parc__hero + .bankp, .ihero + .bankp { padding-top: 0; }
/* Trang tiết kiệm: thẻ nằm giữa hero và thân trang (không có .section-g phía sau). */
.sv-page .bankp { padding-bottom: clamp(4px, 1vw, 10px); }

@media (max-width: 640px) {
	.bankp__sos { padding: 12px 14px; }
	.bankp__sos-call { width: 100%; justify-content: center; }
	.bankp__apps { padding: 12px 14px; }
	.bankp__stores { width: 100%; }
	.bankp__store { flex: 1 1 0; justify-content: center; }
}
