/*
 * Страницы кассы: оформление, результат, тарифы, «Мои покупки» (ADR-0095).
 * Только токены темы (--ms-*): тёмная тема работает без отдельного кода.
 */

.msai-shop {
	max-width: 640px;
	margin: 0 auto;
	color: var(--ms-text-main, #1d2327);
	font-family: var(--ms-font-family, inherit);
}

.msai-shop h2 {
	font-size: 1.25rem;
	margin: 1.5rem 0 .75rem;
}

.msai-shop__summary {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	align-items: baseline;
	padding: 1rem 1.25rem;
	border: 1px solid var(--ms-border, #dcdcde);
	border-radius: var(--ms-radius-card, 12px);
	background: var(--ms-surface, #fff);
	margin-bottom: 1.25rem;
}

.msai-shop__price {
	font-size: 1.5rem;
	font-weight: 700;
	white-space: nowrap;
}

.msai-shop__form {
	display: grid;
	gap: .75rem;
}

.msai-shop__field {
	display: grid;
	gap: .35rem;
	font-weight: 600;
}

.msai-shop__field input {
	padding: .6rem .75rem;
	border: 1px solid var(--ms-border, #dcdcde);
	border-radius: var(--ms-radius-ctl, 8px);
	background: var(--ms-surface, #fff);
	color: inherit;
	font: inherit;
}

.msai-shop__hint,
.msai-shop__fine,
.msai-shop__muted {
	color: var(--ms-text-muted, #646970);
	font-size: .9rem;
	margin: 0;
}

.msai-shop__check {
	display: flex;
	gap: .5rem;
	align-items: flex-start;
	line-height: 1.4;
}

.msai-shop__check input {
	margin-top: .2rem;
}

/* Ловушка для ботов: вне экрана, но не display:none — такие поля боты пропускают. */
.msai-shop__trap {
	position: absolute;
	left: -10000px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.msai-shop__btn {
	display: inline-block;
	padding: .6rem 1.1rem;
	border: 0;
	border-radius: var(--ms-radius-ctl, 8px);
	background: var(--ms-primary, #2e7d32);
	color: var(--ms-btn-text, #fff);
	font: inherit;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
}

.msai-shop__btn:hover,
.msai-shop__btn:focus-visible {
	background: var(--ms-primary-2, #1b5e20);
	color: var(--ms-btn-text, #fff);
}

.msai-shop__btn--pay {
	justify-self: start;
	font-size: 1.05rem;
	padding: .75rem 1.5rem;
}

.msai-shop__note,
.msai-shop__error,
.msai-shop__checking {
	padding: 1rem 1.25rem;
	border-radius: var(--ms-radius-card-sm, 10px);
	background: var(--ms-surface-2, #f6f7f7);
	margin-bottom: 1rem;
}

.msai-shop__error {
	border-left: 4px solid var(--ms-danger, #b32d2e);
}

.msai-shop__plans {
	display: grid;
	gap: 1rem;
}

.msai-shop__plan {
	padding: 1.25rem;
	border: 1px solid var(--ms-border, #dcdcde);
	border-radius: var(--ms-radius-card, 12px);
	background: var(--ms-surface, #fff);
}

.msai-shop__plan h3 {
	margin: 0 0 .35rem;
}

.msai-shop__variants {
	list-style: none;
	padding: 0;
	margin: .75rem 0 0;
	display: grid;
	gap: .5rem;
}

.msai-shop__variant {
	display: grid;
	grid-template-columns: 1fr auto auto;
	gap: .75rem;
	align-items: center;
}

.msai-shop__table {
	width: 100%;
	border-collapse: collapse;
}

.msai-shop__table th,
.msai-shop__table td {
	text-align: left;
	padding: .5rem;
	border-bottom: 1px solid var(--ms-border-soft, #eee);
}

@media (max-width: 640px) {
	.msai-shop__summary,
	.msai-shop__variant {
		grid-template-columns: 1fr;
		display: grid;
	}
}