/* ---------------------------------------------------------------------------
 * Единая ширина сайта.
 *
 * Одно правило на все контейнеры сайта — свои (.ms-container) и чужие:
 * сетка Bootstrap (.container / .container-fluid) и разметка WooCommerce/Dokan.
 * Значения берутся из токенов --ms-container / --ms-gutter в style.css,
 * поэтому ширина сайта меняется в одном месте.
 * ------------------------------------------------------------------------- */
.ms-container,
.martfury-container,
.container,
.container-fluid {
	width: 100%;
	max-width: var(--ms-container, 1650px);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--ms-gutter, 30px);
	padding-right: var(--ms-gutter, 30px);
	box-sizing: border-box;
}

/* Bootstrap 3 задаёт .container фиксированные ширины на каждом брейкпоинте — снимаем. */
.container {
	width: 100%;
}

/* Внутри нашего контейнера чужие контейнеры не должны добавлять отступы дважды. */
.ms-container .container,
.ms-container .container-fluid {
	max-width: none;
	padding-left: 0;
	padding-right: 0;
}

@media (max-width: 767px) {
	.ms-container,
	.martfury-container,
	.container,
	.container-fluid {
		padding-left: var(--ms-gutter-sm, 15px);
		padding-right: var(--ms-gutter-sm, 15px);
	}
}

/* ---------------------------------------------------------------------------
 * Полоса заголовка и хлебные крошки: ширина та же, что у контента.
 *
 * Фон у полосы намеренно нейтральный (без серой заливки) — заголовки и крошки
 * читаются как обычный текст страницы, как и просили в приёмке.
 * ------------------------------------------------------------------------- */
.ms-page-header,
.ms-product-top {
	background: transparent;
	border-bottom: 1px solid var(--ms-line);
}

/* Полоса заголовка уже внутри контейнера страницы (страницы, каталог) —
   внутренний контейнер не должен добавлять второй отступ, иначе заголовок и
   хлебные крошки стоят правее контента. На всю ширину (вне контейнера)
   правило не действует, там отступ нужен. */
.ms-container .ms-page-header .ms-container,
.ms-container .ms-product-top .ms-container,
.ms-layout .ms-page-header .ms-container {
	padding-left: 0;
	padding-right: 0;
}

.ms-breadcrumbs,
.ms-page-header__title,
.ms-page-header__row,
.ms-page-header .ms-page-header__sub {
	text-align: left;
}

/* ---------------------------------------------------------------------------
 * Контент страницы: основная колонка + сайдбар блога.
 * ------------------------------------------------------------------------- */
.ms-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 34px;
	padding-top: 28px;
	padding-bottom: 48px;
	align-items: start;
}

.ms-layout__main {
	min-width: 0;
}

.ms-layout__main--single {
	max-width: 980px;
}

.ms-layout__side {
	min-width: 0;
	position: sticky;
	top: 24px;
}

@media (max-width: 1023px) {
	.ms-layout {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}

	.ms-layout__side {
		position: static;
	}
}

/* ---------------------------------------------------------------------------
 * Блоки Gutenberg: wide/full выравниваем по нашему контейнеру.
 * ------------------------------------------------------------------------- */
.ms-entry__content > .alignwide {
	width: 100%;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
}

.ms-entry__content > .alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}