/*!
 * Pay2S Elementor Widgets — Promo Banner (banner "OPEN API BANKING")
 * Dùng chung cho widget Pay2S Promo Banner và banner cuối Pay2S Operation Tools.
 * Số đo pay2s.vn (.hp-openbank-banner):
 *  flex, gap 20, padding 24, viền #d7ecdf, bo 12, nền gradient 115° #e8f7ee → #f6fcf9
 *  icon 46×46 · tiêu đề 16px (margin 5/0) · mô tả 12px · lời kêu gọi 12px #157a4d, dạt phải
 *  ≤1000: xuống dòng, lời kêu gọi thụt 66px · ≤800: thụt 0 · ≤480: padding 18, gap 12
 */

/* Widget độc lập: khoảng đệm trên/dưới mặc định (chỉnh trong Style → Bố cục section). */
.p2sew-promo-banner .p2sew-promo-banner__inner {
	padding-block: 24px;
}

.p2sew .p2sew-promo,
.p2sew a.p2sew-promo:hover,
.p2sew a.p2sew-promo:focus {
	color: var(--p2s-ink);
	text-decoration: none;
}

.p2sew .p2sew-promo {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 24px;
	border: 1px solid #d7ecdf;
	border-radius: 12px;
	background: linear-gradient(115deg, #e8f7ee, #f6fcf9);
	transition: transform 0.2s, box-shadow 0.2s;
}

.p2sew .p2sew-promo:hover {
	transform: translateY(var(--p2s-promo-lift, 0px));
}

.p2sew .p2sew-promo__title {
	margin: 5px 0;
}

.p2sew .p2sew-promo__text {
	font-size: 12px;
}

.p2sew .p2sew-promo__cta {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-left: auto;
	color: #157a4d;
	font-size: 12px;
	font-weight: 700;
	white-space: nowrap;
}

@media (max-width: 1000px) {
	.p2sew .p2sew-promo {
		flex-wrap: wrap;
	}

	.p2sew .p2sew-promo__cta {
		margin-left: 66px;
	}
}

/* container-mode: bản sao tự sinh từ @media phía trên (tools/container-mode.js) */
@container p2sew (max-width: 1000px) {
	.p2sew .p2sew-promo {
		flex-wrap: wrap;
	}

	.p2sew .p2sew-promo__cta {
		margin-left: 66px;
	}
}

@media (max-width: 800px) {
	.p2sew .p2sew-promo__cta {
		margin-left: 0;
	}
}

/* container-mode: bản sao tự sinh từ @media phía trên (tools/container-mode.js) */
@container p2sew (max-width: 800px) {
	.p2sew .p2sew-promo__cta {
		margin-left: 0;
	}
}

@media (max-width: 480px) {
	.p2sew .p2sew-promo {
		gap: 12px;
		padding: 18px;
	}

	.p2sew .p2sew-promo__body {
		flex: 1 1 0%;
		min-width: 180px;
	}
}

/* container-mode: bản sao tự sinh từ @media phía trên (tools/container-mode.js) */
@container p2sew (max-width: 480px) {
	.p2sew .p2sew-promo {
		gap: 12px;
		padding: 18px;
	}

	.p2sew .p2sew-promo__body {
		flex: 1 1 0%;
		min-width: 180px;
	}
}
