.myload-mobile-topup {
	--mt-red: #ee130b;
	--mt-red-dark: #d90000;
	--mt-dark: #111827;
	--mt-muted: #667085;
	--mt-line: #dde3ea;
	--mt-soft: #f8fafc;
	--mt-bg: #ffffff;
	--mt-shadow: rgba(15, 23, 42, .08);
	width: min(100% - 24px, 980px);
	margin: 22px auto 30px;
	color: var(--mt-dark);
	font-family: Arial, Helvetica, sans-serif;
}

.myload-mobile-topup-home-band {
	margin: 0 calc(50% - 50vw);
	padding: clamp(42px, 8vw, 86px) 0;
	background:
		radial-gradient(circle at 22% 20%, rgba(238, 19, 11, .14), transparent 34%),
		radial-gradient(circle at 78% 28%, rgba(0, 123, 255, .16), transparent 36%),
		linear-gradient(135deg, rgba(255, 255, 255, .95), rgba(238, 19, 11, .055) 42%, rgba(0, 123, 255, .08));
	border-bottom: 1px solid var(--mt-line);
}

.myload-mobile-topup-home-band .myload-mobile-topup {
	margin-top: 0;
	margin-bottom: 0;
}

body.myload-has-home-topup .myload-content {
	padding-top: 0;
}

body.myload-has-home-topup .entry-content > .myload-mobile-topup-home-band:first-child {
	margin-top: 0;
}

html[data-theme="dark"] .myload-mobile-topup-home-band,
:root[data-theme="dark"] .myload-mobile-topup-home-band {
	background:
		radial-gradient(circle at 22% 20%, rgba(238, 19, 11, .18), transparent 34%),
		radial-gradient(circle at 78% 28%, rgba(56, 137, 255, .18), transparent 36%),
		linear-gradient(135deg, rgba(22, 25, 31, .98), rgba(238, 19, 11, .08) 42%, rgba(56, 137, 255, .1));
}

html[data-theme="dark"] .myload-mobile-topup,
:root[data-theme="dark"] .myload-mobile-topup {
	--mt-dark: #f7f7f7;
	--mt-muted: #b8c0cc;
	--mt-line: #333b47;
	--mt-soft: #20242b;
	--mt-bg: #16191f;
	--mt-shadow: rgba(0, 0, 0, .35);
}

.myload-mobile-topup *,
.myload-mobile-topup *::before,
.myload-mobile-topup *::after {
	box-sizing: border-box;
}

.myload-mobile-topup__card {
	display: grid;
	align-content: start;
	gap: 14px;
	width: 100%;
	height: auto !important;
	min-height: 0 !important;
	margin: 0;
	padding: clamp(14px, 2.2vw, 24px);
	border: 1px solid var(--mt-line);
	border-radius: 10px;
	background: var(--mt-bg);
	box-shadow: 0 18px 48px var(--mt-shadow);
}

.myload-mobile-topup-benefits {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
	margin-top: 16px;
}

.myload-mobile-topup-benefits div {
	padding: 16px;
	border: 1px solid var(--mt-line);
	border-radius: 10px;
	background: var(--mt-bg);
	box-shadow: 0 12px 34px var(--mt-shadow);
}

.myload-mobile-topup-benefits span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	margin-bottom: 10px;
	border-radius: 999px;
	background: var(--mt-red);
	color: #fff;
	font-size: 18px;
	font-weight: 800;
}

.myload-mobile-topup-benefits h3 {
	margin: 0;
	color: var(--mt-dark);
	font-size: 16px;
	line-height: 1.25;
}

.myload-mobile-topup-benefits p {
	margin: 7px 0 0;
	color: var(--mt-muted);
	font-size: 13px;
	line-height: 1.45;
}

.myload-mobile-topup__card > br,
.myload-mobile-topup__card > p,
.myload-mobile-topup p:empty {
	display: none !important;
}

.myload-mobile-topup__body {
	display: grid;
	gap: 14px;
	min-height: 0;
	padding: 0;
}

.myload-mobile-topup h2 {
	margin: 0;
	font-size: clamp(20px, 2vw, 26px);
	line-height: 1.2;
	letter-spacing: 0;
}

.myload-mobile-topup__choices {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.myload-mobile-topup__choices button {
	display: grid;
	align-content: center;
	gap: 6px;
	min-height: 74px;
	padding: 15px;
	border: 1px solid var(--mt-line);
	border-radius: 8px;
	background: var(--mt-bg);
	color: var(--mt-dark);
	cursor: pointer;
	text-align: left;
	font-size: 16px;
	font-weight: 700;
	transition: border-color .16s ease, box-shadow .16s ease, color .16s ease, background .16s ease;
}

.myload-mobile-topup__choices button:hover,
.myload-mobile-topup__choices button.is-selected {
	border-color: var(--mt-red);
	background: rgba(238, 19, 11, .05);
	box-shadow: 0 0 0 3px rgba(238, 19, 11, .12);
	color: var(--mt-red);
}

.myload-mobile-topup__choices strong {
	font-size: 22px;
	line-height: 1;
}

.myload-mobile-topup__choices span {
	color: var(--mt-muted);
	font-size: 12px;
	font-weight: 600;
}

.myload-mobile-topup select,
.myload-mobile-topup input {
	width: 100%;
	min-height: 52px;
	padding: 11px 13px;
	border: 1px solid var(--mt-line);
	border-radius: 8px;
	background: var(--mt-bg);
	color: var(--mt-dark);
	font-size: 16px;
	line-height: 1.25;
	outline: 0;
}

.myload-mobile-topup select:focus,
.myload-mobile-topup input:focus {
	border-color: var(--mt-red);
	box-shadow: 0 0 0 3px rgba(238, 19, 11, .12);
}

.myload-mobile-topup__alert,
.myload-mobile-topup__note,
.myload-mobile-topup__empty {
	margin: 0;
	padding: 11px 13px;
	border: 1px solid #ffd1ca;
	border-left: 4px solid var(--mt-red);
	border-radius: 8px;
	background: rgba(238, 19, 11, .06);
	color: var(--mt-dark);
	font-size: 13px;
	font-weight: 700;
}

.myload-mobile-topup__alert[hidden] {
	display: none !important;
}

.myload-mobile-topup__note {
	border-color: var(--mt-line);
	border-left-color: var(--mt-red);
	background: var(--mt-soft);
	color: var(--mt-muted);
	font-weight: 600;
}

.myload-mobile-topup__empty {
	border-color: var(--mt-line);
	background: var(--mt-soft);
	color: var(--mt-muted);
}

.myload-mobile-topup__review {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin: 0;
}

.myload-mobile-topup__review div {
	display: grid;
	gap: 5px;
	padding: 12px;
	border: 1px solid var(--mt-line);
	border-radius: 8px;
	background: var(--mt-soft);
}

.myload-mobile-topup__review dt {
	color: var(--mt-muted);
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
}

.myload-mobile-topup__review dd {
	margin: 0;
	color: var(--mt-dark);
	font-size: 15px;
	font-weight: 800;
	overflow-wrap: anywhere;
}

.myload-mobile-topup__actions {
	display: flex;
	align-items: center;
	gap: 10px;
	justify-content: space-between;
}

.myload-mobile-topup__actions button {
	min-height: 44px;
	padding: 0 16px;
	border: 1px solid var(--mt-line);
	border-radius: 8px;
	background: var(--mt-bg);
	color: var(--mt-muted);
	cursor: pointer;
	font-size: 14px;
	font-weight: 800;
	transition: background .16s ease, border-color .16s ease, color .16s ease;
}

.myload-mobile-topup__actions [data-next],
.myload-mobile-topup__actions [data-submit] {
	margin-left: auto;
	border-color: var(--mt-red);
	background: var(--mt-red);
	color: #fff;
}

.myload-mobile-topup__actions [data-next]:hover,
.myload-mobile-topup__actions [data-submit]:hover {
	border-color: var(--mt-red-dark);
	background: var(--mt-red-dark);
}

.myload-mobile-topup__timeline {
	display: flex;
	justify-content: center;
	gap: 8px;
	padding-top: 2px;
}

.myload-mobile-topup__timeline span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border: 1px solid var(--mt-line);
	border-radius: 999px;
	background: var(--mt-bg);
	color: var(--mt-muted);
	font-size: 12px;
	font-weight: 800;
}

.myload-mobile-topup__timeline span.is-active,
.myload-mobile-topup__timeline span.is-complete {
	border-color: var(--mt-red);
	background: var(--mt-red);
	color: #fff;
}

.myload-mobile-topup-toast {
	position: fixed;
	right: 14px;
	bottom: 14px;
	z-index: 100000;
	max-width: min(360px, calc(100% - 28px));
	padding: 12px 14px;
	border-radius: 8px;
	background: #212529;
	color: #fff;
	box-shadow: 0 16px 40px rgba(0, 0, 0, .22);
	opacity: 0;
	transform: translateY(10px);
	transition: opacity .18s ease, transform .18s ease;
}

.myload-mobile-topup-toast.is-visible {
	opacity: 1;
	transform: translateY(0);
}

@media (max-width: 640px) {
	.myload-mobile-topup-home-band {
		padding: 22px 0;
	}

	.myload-mobile-topup {
		width: min(100% - 14px, 980px);
		margin-top: 14px;
	}

	.myload-mobile-topup__choices,
	.myload-mobile-topup__review,
	.myload-mobile-topup-benefits {
		grid-template-columns: 1fr;
	}
}

@media (min-width: 641px) and (max-width: 920px) {
	.myload-mobile-topup-benefits {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 420px) {
	.myload-mobile-topup__card {
		padding: 12px;
	}

	.myload-mobile-topup__actions {
		flex-wrap: wrap;
	}

	.myload-mobile-topup__actions button {
		min-width: 92px;
	}
}