/**
 * Экраны движка: корзина, оформление заказа, «спасибо».
 *
 * Вид задаёт тема, здесь только сетка и состояния, без которых разметка рассыпается.
 * Токены — те же, что в теме.
 */

.ms-shop {
	--ms-shop-gap: 20px;
	max-width: 1180px;
	margin: 0 auto;
	padding: 8px 0 32px;
	color: var(--ms-text, #1d2b2c);
	font-size: 15px;
	line-height: 1.5;
}

.ms-shop__title {
	margin: 0 0 16px;
	font-size: 26px;
	line-height: 1.2;
}

.ms-shop__h3 {
	margin: 0 0 12px;
	font-size: 17px;
	font-weight: 700;
}

.ms-shop__lead {
	margin: 0 0 16px;
}

.ms-shop__hint {
	margin: 6px 0 0;
	font-size: 13px;
	line-height: 1.4;
	color: #5d6f70;
}

.ms-shop__notice {
	margin: 0 0 16px;
	padding: 10px 14px;
	border-radius: 12px;
	background: #e8f7f7;
	color: #12787a;
}

.ms-shop__errors {
	margin: 0 0 18px;
	padding: 12px 16px;
	border-radius: 12px;
	border: 1px solid #f0c2c2;
	background: #fff4f4;
}

.ms-shop__errors-title {
	margin: 0 0 6px;
	font-weight: 700;
}

.ms-shop__errors ul {
	margin: 0;
	padding-left: 18px;
}

.ms-shop__empty {
	padding: 28px 20px;
	border: 1px dashed #cfd8d8;
	border-radius: 16px;
	text-align: center;
}

/* Корзина */

.ms-shop__table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 20px;
}

.ms-shop__table th,
.ms-shop__table td {
	padding: 12px 10px;
	border-bottom: 1px solid #e6ecec;
	text-align: left;
	vertical-align: top;
}

.ms-shop__table th {
	font-size: 13px;
	font-weight: 600;
	color: #5d6f70;
}

.ms-shop__name a {
	font-weight: 600;
	color: inherit;
	text-decoration: none;
}

.ms-shop__name a:hover {
	color: var(--ms-accent-text, #12787a);
}

.ms-shop__sku,
.ms-shop__warn {
	display: block;
	font-size: 12px;
	color: #6b7c7d;
}

.ms-shop__warn {
	color: #b5651d;
}

.ms-shop__qty input {
	width: 84px;
	padding: 8px 10px;
	border: 1px solid #cfd8d8;
	border-radius: 10px;
	font-size: 15px;
}

.ms-shop__actions,
.ms-shop__remove {
	margin: 0;
}

.ms-shop__foot {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: var(--ms-shop-gap);
	align-items: start;
}

.ms-shop__foot-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	align-items: center;
}

.ms-shop__totals {
	padding: 16px;
	border: 1px solid #e6ecec;
	border-radius: 16px;
}

.ms-shop__total-row {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 6px 0;
	font-size: 14px;
}

.ms-shop__total-row--sum {
	margin-top: 6px;
	padding-top: 10px;
	border-top: 1px solid #e6ecec;
	font-size: 18px;
	font-weight: 700;
}

/* Оформление заказа */

.ms-shop__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: var(--ms-shop-gap);
}

.ms-shop__block {
	padding: 18px;
	border: 1px solid #e6ecec;
	border-radius: 16px;
	background: #fff;
}

.ms-shop__field {
	margin: 0 0 14px;
}

.ms-shop__field > label {
	display: block;
	margin: 0 0 6px;
	font-size: 13px;
	color: #5d6f70;
}

.ms-shop__input {
	width: 100%;
	box-sizing: border-box;
	padding: 11px 14px;
	border: 1px solid #cfd8d8;
	border-radius: 12px;
	font-size: 15px;
	font-family: inherit;
	background: #fff;
}

.ms-shop__input:focus {
	outline: 2px solid var(--ms-accent, #28afb1);
	outline-offset: 1px;
}

textarea.ms-shop__input {
	min-height: 84px;
	resize: vertical;
}

.ms-shop__field.is-invalid .ms-shop__input {
	border-color: #d0342c;
}

.ms-shop__error {
	display: block;
	margin-top: 6px;
	font-size: 13px;
	color: #d0342c;
}

.ms-shop__options {
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
}

.ms-shop__option {
	margin: 0 0 10px;
}

.ms-shop__option-label {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	padding: 12px 14px;
	border: 1px solid #e6ecec;
	border-radius: 14px;
	cursor: pointer;
}

.ms-shop__option-label:has(input:checked) {
	border-color: var(--ms-accent, #28afb1);
	box-shadow: inset 0 0 0 1px var(--ms-accent, #28afb1);
}

.ms-shop__option-label input {
	margin-top: 3px;
}

.ms-shop__option-name {
	display: block;
	font-weight: 600;
}

.ms-shop__option-note {
	display: block;
	font-size: 13px;
	color: #5d6f70;
}

.ms-shop__option-meta {
	display: block;
	margin-top: 4px;
	font-weight: 600;
}

.ms-shop__option-error {
	display: block;
	margin-top: 4px;
	font-size: 13px;
	color: #b5651d;
}

.ms-shop__field--consent {
	margin-top: 6px;
}

.ms-shop__consent {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: 13px;
	line-height: 1.5;
}

.ms-shop__field--consent .ms-shop__error {
	margin-left: 26px;
}

.ms-shop__summary {
	grid-column: 1 / -1;
	padding: 18px;
	border: 1px solid #e6ecec;
	border-radius: 16px;
	background: #fbfdfd;
}

.ms-shop__summary-items {
	margin: 0 0 12px;
	padding: 0;
	list-style: none;
}

.ms-shop__summary-item {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	gap: 10px;
	padding: 6px 0;
	border-bottom: 1px dashed #e6ecec;
	font-size: 14px;
}

.ms-shop__summary-name {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
}

.ms-shop__summary-qty,
.ms-shop__summary-sum {
	white-space: nowrap;
}

.ms-shop__facts {
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
}

.ms-shop__facts li {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 6px 0;
	border-bottom: 1px dashed #e6ecec;
	font-size: 14px;
}

.ms-shop__facts li > span:first-child {
	color: #5d6f70;
}

/* Кнопки */

.ms-shop__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 20px;
	border: 0;
	border-radius: 12px;
	background: var(--ms-accent, #28afb1);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
}

.ms-shop__btn:hover {
	background: var(--ms-accent-text, #12787a);
	color: #fff;
}

.ms-shop__btn--ghost {
	background: #fff;
	color: var(--ms-accent-text, #12787a);
	border: 1px solid var(--ms-accent, #28afb1);
}

.ms-shop__btn--ghost:hover {
	background: #e8f7f7;
	color: var(--ms-accent-text, #12787a);
}

.ms-shop__btn--submit {
	width: 100%;
	min-height: 48px;
	margin-top: 14px;
	font-size: 16px;
}

.ms-shop__btn[disabled] {
	opacity: 0.6;
	cursor: progress;
}

.ms-shop__link {
	display: inline-block;
	margin-top: 10px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--ms-accent-text, #12787a);
	font-size: 14px;
	text-decoration: underline;
	cursor: pointer;
}

/* Телефон */

@media (max-width: 900px) {
	.ms-shop__grid,
	.ms-shop__foot {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 640px) {
	.ms-shop {
		font-size: 14px;
	}

	.ms-shop__table thead {
		display: none;
	}

	.ms-shop__table tr {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 6px 12px;
		padding: 12px 0;
		border-bottom: 1px solid #e6ecec;
	}

	.ms-shop__table td {
		padding: 0;
		border: 0;
	}

	.ms-shop__qty input {
		width: 100%;
		min-height: 44px;
	}

	.ms-shop__option-label {
		min-height: 44px;
	}

	.ms-shop__summary-item {
		grid-template-columns: minmax(0, 1fr) auto;
	}
}

/* ---------------------------------------------------------------------------
 * Кабинет покупателя: «Мои заказы», карточка заказа, адреса
 * ------------------------------------------------------------------------ */

.ms-shop__head {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	align-items: flex-start;
	justify-content: space-between;
	margin: 0 0 14px;
}

.ms-shop__head .ms-shop__title {
	margin-bottom: 6px;
}

.ms-shop__head-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}

.ms-shop__back {
	display: inline-block;
	margin: 0 0 14px;
}

.ms-shop__inline {
	display: inline-flex;
	margin: 0;
}

.ms-shop__filters,
.ms-shop__pages {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 16px;
}

.ms-shop__chip {
	display: inline-flex;
	align-items: center;
	min-height: 38px;
	padding: 0 14px;
	border: 1px solid #cfd8d8;
	border-radius: 999px;
	font-size: 14px;
	color: inherit;
	text-decoration: none;
	background: #fff;
}

.ms-shop__chip:hover {
	border-color: var(--ms-accent, #28afb1);
	color: var(--ms-accent-text, #12787a);
}

.ms-shop__chip.is-active {
	border-color: var(--ms-accent, #28afb1);
	background: #e8f7f7;
	color: var(--ms-accent-text, #12787a);
	font-weight: 600;
}

.ms-shop__orders {
	margin: 0 0 18px;
	padding: 0;
	list-style: none;
}

.ms-shop__order {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	gap: 12px 18px;
	align-items: center;
	padding: 14px 16px;
	margin: 0 0 10px;
	border: 1px solid #e6ecec;
	border-radius: 16px;
	background: #fff;
}

.ms-shop__order-main {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}

.ms-shop__order-number {
	font-size: 16px;
	font-weight: 700;
	color: inherit;
	text-decoration: none;
}

.ms-shop__order-number:hover {
	color: var(--ms-accent-text, #12787a);
}

.ms-shop__order-date {
	font-size: 13px;
	color: #5d6f70;
}

.ms-shop__order-side {
	display: flex;
	flex-direction: column;
	gap: 2px;
	text-align: right;
}

.ms-shop__order-sum {
	font-size: 16px;
	font-weight: 700;
	white-space: nowrap;
}

.ms-shop__order-qty {
	font-size: 12px;
	color: #6b7c7d;
}

.ms-shop__order-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	justify-content: flex-end;
}

.ms-shop__badge {
	display: inline-flex;
	align-items: center;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.6;
	background: #eef2f2;
	color: #4a5c5d;
	white-space: nowrap;
}

.ms-shop__badge--warn {
	background: #fff4e5;
	color: #9a5b00;
}

.ms-shop__badge--active {
	background: #e8f7f7;
	color: #12787a;
}

.ms-shop__badge--ok {
	background: #eaf7ec;
	color: #226b32;
}

.ms-shop__badge--bad {
	background: #fdecec;
	color: #97231f;
}

.ms-shop__badge--muted {
	background: #eef2f2;
	color: #5d6f70;
}

.ms-shop__btn--small {
	padding: 8px 14px;
	font-size: 14px;
	min-height: 38px;
}

.ms-shop__btn--danger {
	background: #b3261e;
	color: #fff;
}

.ms-shop__btn--danger:hover {
	background: #94201a;
	color: #fff;
}

.ms-shop__history {
	margin: 0 0 12px;
	padding: 0;
	list-style: none;
}

.ms-shop__history-row {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 10px;
	padding: 6px 0;
	border-bottom: 1px dashed #e6ecec;
	font-size: 13px;
}

.ms-shop__history-date {
	color: #6b7c7d;
	white-space: nowrap;
}

.ms-shop__actions-bar {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
	margin: 18px 0 0;
}

.ms-shop__cancel {
	width: 100%;
	margin: 6px 0 0;
}

.ms-shop__cancel > summary {
	cursor: pointer;
}

.ms-shop__cancel-form {
	margin: 10px 0 0;
	padding: 14px 16px;
	border: 1px solid #f0c2c2;
	border-radius: 14px;
	background: #fff9f9;
	max-width: 520px;
}

.ms-shop__addresses {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 14px;
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
}

.ms-shop__address {
	padding: 14px 16px;
	border: 1px solid #e6ecec;
	border-radius: 16px;
	background: #fff;
}

.ms-shop__address.is-default {
	border-color: var(--ms-accent, #28afb1);
}

.ms-shop__address-head {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	justify-content: space-between;
	margin: 0 0 6px;
}

.ms-shop__address-text {
	margin: 0 0 4px;
	font-size: 14px;
}

.ms-shop__address-method {
	margin: 0 0 10px;
	font-size: 12px;
	color: #6b7c7d;
}

.ms-shop__address-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}

.ms-shop__address-form {
	margin-top: 8px;
}

.ms-shop__check {
	display: flex;
	gap: 8px;
	align-items: center;
	margin: 0 0 14px;
	font-size: 14px;
}

@media (max-width: 767px) {

	.ms-shop__order {
		grid-template-columns: minmax(0, 1fr);
	}

	.ms-shop__order-side {
		flex-direction: row;
		gap: 10px;
		align-items: baseline;
		text-align: left;
	}

	.ms-shop__order-actions {
		justify-content: flex-start;
	}
}