/**
 * CSS riêng cho trang "THANH TOÁN – XÁC THỰC – KÍCH HOẠT TÀI KHOẢN"
 * (post ID 192, bimtool.dscons.vn/verification/). Theo đúng bảng màu
 * và cấu trúc mockup chủ site cung cấp — chỉ áp dụng khi có class
 * .dscons-activation-page bao ngoài, không ảnh hưởng trang khác.
 */
.dscons-activation-page {
	--dscons-navy: #082F57;
	--dscons-blue: #087CC1;
	--dscons-action-blue: #0667E8;
	--dscons-bg-light: #F3F8FE;
	--dscons-green: #0BB35B;
	--dscons-text: #102A43;
	--dscons-text-secondary: #52667A;
	--dscons-border: #DCE7F2;
	--dscons-radius: 14px;

	max-width: 1180px;
	margin: 0 auto;
	padding: 32px 20px 56px;
	color: var(--dscons-text);
}

.dscons-activation-hero {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	background-image: url('https://bimtool.dscons.vn/wp-content/uploads/2026/07/ChatGPT_Image_17_48_58_25_thg_7_2026.png');
	background-size: cover;
	background-position: center;
	border-radius: var(--dscons-radius);
	padding: 24px;
	margin-bottom: 24px;
}

.dscons-activation-hero .dscons-success-notice {
	flex: 1 1 400px;
	margin-bottom: 0;
}

.dscons-hero-illustration {
	flex: 0 0 auto;
	width: 220px;
	max-width: 35%;
	height: auto;
	display: block;
}

.dscons-invoice-card__illustration img {
	width: 100%;
	height: auto;
	display: block;
}

.dscons-success-notice {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	background: #ffffff;
	border: 1px solid var(--dscons-border);
	border-radius: var(--dscons-radius);
	box-shadow: 0 4px 16px rgba(8, 47, 87, 0.06);
	padding: 20px 24px;
	margin-bottom: 24px;
}

.dscons-success-notice__icon {
	flex: 0 0 auto;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--dscons-green);
	display: flex;
	align-items: center;
	justify-content: center;
}

.dscons-success-notice__icon svg {
	width: 20px;
	height: 20px;
}

.dscons-success-notice p {
	margin: 0;
	color: var(--dscons-text);
	line-height: 1.6;
}

.dscons-payment-shortcode-wrap {
	margin-bottom: 24px;
}

.dscons-download-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	background: #ffffff;
	border: 1px solid var(--dscons-border);
	border-radius: var(--dscons-radius);
	box-shadow: 0 4px 16px rgba(8, 47, 87, 0.06);
	padding: 24px;
	margin-bottom: 24px;
}

.dscons-download-card__left {
	display: flex;
	align-items: center;
	gap: 16px;
}

.dscons-download-card__icon {
	flex: 0 0 auto;
	width: 52px;
	height: 52px;
	border-radius: 12px;
	background: var(--dscons-action-blue);
	display: flex;
	align-items: center;
	justify-content: center;
}

.dscons-download-card__icon svg {
	width: 26px;
	height: 26px;
}

.dscons-download-card__left h2 {
	margin: 0 0 4px;
	font-size: 20px;
	color: var(--dscons-navy);
}

.dscons-download-card__left p {
	margin: 0;
	color: var(--dscons-text-secondary);
	font-size: 14px;
}

.dscons-download-card__actions {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.dscons-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 20px;
	border-radius: 8px;
	font-weight: 700;
	font-size: 14px;
	text-decoration: none;
	white-space: nowrap;
	min-height: 44px;
	box-sizing: border-box;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

.dscons-btn svg {
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
}

.dscons-btn--primary {
	background: var(--dscons-action-blue);
	color: #ffffff;
	border: 1px solid var(--dscons-action-blue);
}

.dscons-btn--primary:hover,
.dscons-btn--primary:focus {
	background: #054fb8;
	color: #ffffff;
}

.dscons-btn--outline {
	background: #ffffff;
	color: var(--dscons-action-blue);
	border: 1px solid var(--dscons-action-blue);
}

.dscons-btn--outline:hover,
.dscons-btn--outline:focus {
	background: var(--dscons-bg-light);
	color: var(--dscons-action-blue);
}

.dscons-invoice-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	background: var(--dscons-bg-light);
	border: 1px solid var(--dscons-border);
	border-radius: var(--dscons-radius);
	box-shadow: 0 4px 16px rgba(8, 47, 87, 0.06);
	padding: 28px;
}

.dscons-invoice-card__left {
	flex: 1 1 320px;
	min-width: 0;
}

.dscons-invoice-card__left h2 {
	margin: 0 0 8px;
	font-size: 20px;
	color: var(--dscons-navy);
	letter-spacing: .02em;
}

.dscons-invoice-card__underline {
	width: 48px;
	height: 3px;
	background: var(--dscons-action-blue);
	border-radius: 2px;
	margin-bottom: 14px;
}

.dscons-invoice-card__left p {
	margin: 0 0 16px;
	color: var(--dscons-text-secondary);
}

.dscons-invoice-card__actions {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.dscons-invoice-card__illustration {
	flex: 0 0 auto;
	width: 360px;
	max-width: 45%;
}

.dscons-invoice-card__illustration svg {
	width: 100%;
	height: auto;
}

@media (max-width: 680px) {
	.dscons-download-card,
	.dscons-invoice-card {
		flex-direction: column;
		align-items: stretch;
	}
	.dscons-download-card__actions,
	.dscons-invoice-card__actions {
		flex-direction: column;
	}
	.dscons-btn {
		width: 100%;
		justify-content: center;
	}
	.dscons-invoice-card__illustration {
		display: none;
	}
	.dscons-hero-illustration {
		display: none;
	}
	.dscons-activation-hero {
		background-image: none;
	}
}