.delivery_type.hidden{
	display:none;
}
#np_loader.hidden{
	display:none;
}
.spinner{
	width:20px;
	height:20px;
	border:3px solid #eee;
	border-top:3px solid #333;
	border-radius:50%;
	animation:spin 0.8s linear infinite;
}

@keyframes spin{
	100%{transform:rotate(360deg)}
}
.cart-modal__btns .btn{
	display:block;
}
.cart-modal__btns .btn:first-child,
.cart-modal__btns .btn:disabled,
.cart-modal__btns .btn--dark-grey{
	display:none;
}
.cart-modal__btns .btn,
.cart-modal__btns .btn:nth-child(2),
.cart-modal__btns .btn:last-child{
	width:100%;
	max-width:100%;
	border-radius:20px;
}
.cart-modal__btns .btn::before,
.cart-modal__btns .btn::after{
	display:none;
}
.order-step.current{
	overflow:auto;
	padding-bottom:30px;
}
.article-news p{
	text-align:justify;
}
.order-table__total li b{
	width:auto;
}
.product-show__name h1{
	font-family:"Fira Sans",sans-serif;
	font-weight:500;
	font-size:28px;
	line-height:130%;
	color:#2D2D2D;
}
.product-details__description h1,
.product-details__description h2,
.product-details__description h3,
.product-details__description h4,
.product-details__description h5,
.product-details__description h6,
.article-news h1,
.article-news h2,
.article-news h3,
.article-news h4,
.article-news h5,
.article-news h6{
	font-family:"Fira Sans",sans-serif;
	font-weight:500;
	line-height:130%;
	color:#2D2D2D;
	padding:0;
	text-transform:none;
}
.product-details__description h1,
.article-news h1{
	font-size:28px;
}
.product-details__description h2,
.article-news h2{
	font-size:26px;
}
.product-details__description h3,
.article-news h3{
	font-size:24px;
}
.product-details__description h4,
.article-news h4{
	font-size:22px;
}
.product-details__description h5,
.article-news h5{
	font-size:20px;
}
.product-details__description h6,
.article-news h6{
	font-size:18px;
}
.product-details__description>*{
	margin-bottom:20px;
}
.article-news #hero-content-headline,
.article-news .hero-content-headline{
	line-height:130%;
}
.product-show__buttons .add_tinting{
	margin-right:18px;
	line-height:20px;
	cursor:pointer;
}
.product-show__buttons .add_tinting input[type=checkbox],
.product-show__buttons .add_tinting span{
	display:inline-block;
	vertical-align:middle;
}
.product-show__buttons .add_tinting input[type=checkbox]{
	width:20px;
	height:20px;
	accent-color:#2c8395;
	margin-right:7px;
}


/* Снятый с продажи товар: вместо калькулятора и кнопки «купить» — надпись */
.product-show__buttons .product-not-available{
	margin:0;
	padding:14px 0;
	font-weight:600;
	color:#8a8a8a;
}

/*
=== Заголовок страницы: h1 вместо h2/h3/h4 =====================================
На страницах не было заголовка первого уровня: шаблоны печатали название страницы
в h2, на текстовых страницах — в h4. Теги в шаблонах заменены на h1, а размеры в
теме привязаны к имени тега (.ip-heading h2{...}), поэтому переносим их на h1.
Внешний вид не меняется: ниже сначала восстановлен базовый вид прежнего тега
внутри каждого контейнера, затем — правила самого контейнера, один в один как в
application.css.
*/

/* --- базовый вид: там, где был h2 --- */
.page-header-container .page-heading h1,
.ip-heading h1,
.colors-page h1,
.color-palettes-heading h1,
.color-families-heading h1,
.find-us h1,
.heading-wrapper__content h1{
	font-family:"Prata",serif;
	font-size:32px;
	line-height:140%;
	font-weight:normal;
	color:#2D2D2D;
	text-transform:uppercase;
}
@media screen and (max-width: 1440px){
	.page-header-container .page-heading h1,
	.ip-heading h1,
	.colors-page h1,
	.color-palettes-heading h1,
	.color-families-heading h1,
	.find-us h1,
	.heading-wrapper__content h1{font-size:24px;}
}
@media screen and (max-width: 840px){
	.page-header-container .page-heading h1,
	.ip-heading h1,
	.colors-page h1,
	.color-palettes-heading h1,
	.color-families-heading h1,
	.find-us h1,
	.heading-wrapper__content h1{font-size:18px;}
}
@media screen and (max-width: 640px){
	.page-header-container .page-heading h1,
	.ip-heading h1,
	.colors-page h1,
	.color-palettes-heading h1,
	.color-families-heading h1,
	.find-us h1,
	.heading-wrapper__content h1{font-size:26px;}
}

/* --- базовый вид: там, где был h3 (карта сайта) --- */
.site-map-page__heading h1{
	font-family:"Prata",serif;
	font-size:28px;
	line-height:130%;
	font-weight:normal;
	color:#2D2D2D;
	text-transform:uppercase;
}
@media screen and (max-width: 1440px){
	.site-map-page__heading h1{font-size:22px;}
}
@media screen and (max-width: 840px){
	.site-map-page__heading h1{font-size:18px;}
}

/* --- базовый вид: там, где был h4 (текстовые страницы) --- */
.page-header h1{
	font-family:"Fira Sans",sans-serif;
	font-size:24px;
	line-height:130%;
	font-weight:normal;
	color:#2D2D2D;
	text-transform:none;
}
@media screen and (max-width: 1440px){
	.page-header h1{font-size:18px;}
}
@media screen and (max-width: 840px){
	.page-header h1{font-size:14px;}
}

/* --- правила самих контейнеров, перенесённые с h2/h3/h4 --- */
.page-header h1{font-size:28px;line-height:34px;font-weight:500;text-transform:uppercase}
@media screen and (max-width: 1023px){
	.page-header h1{font-size:22px;line-height:28px}
}
.page-header-container .page-heading h1{padding-bottom:65px}
.page-header-container .page-heading--news h1{padding-bottom:0}
.page-header-container--app .page-heading h1{color:#fff;padding-bottom:0}
.ip-heading h1{padding:200px 0}
@media screen and (max-width: 1440px){
	.ip-heading h1{padding:100px 0}
}
@media screen and (max-width: 640px){
	.ip-heading h1{padding:50px 0 90px}
}
.ip-heading--inspiration h1{color:#2D2D2D}
.ip-heading--services h1{color:#FFF}
.ip-heading--news h1{color:#FFF}
.colors-page h1{max-width:390px;margin:86px auto 0 auto;text-align:center}
@media screen and (max-width: 480px){
	.colors-page h1{font-size:22px;margin:24px auto 0 auto}
}
.color-palettes-heading--show h1{color:#FFF}
.color-families-heading--img h1{color:#FFF}
.color-families-heading--bg h1{color:#2D2D2D}
.color-families-heading.reversed h1{color:#FFFFFF}
@media screen and (max-width: 1023px){
	.color-families-heading h1{font-size:22px;line-height:30px}
}
.heading-wrapper__content h1{color:#FFF}
@media screen and (max-width: 767px){
	.heading-wrapper__content h1{max-width:264px;font-size:18px}
}
.site-map-page__heading h1{font-family:"Fira Sans", sans-serif;font-weight:500}
@media screen and (max-width: 640px){
	.site-map-page__heading h1{font-size:22px;line-height:26px}
}
.find-us h1{padding:85px 0 50px}
@media screen and (max-width: 1023px){
	.find-us h1{padding:23px 0;font-size:22px;line-height:30px}
}

/*
Страница цвета: имя и номер обёрнуты в h1. Своё оформление h1 (Prata, 72px, белый,
CAPS) здесь не нужно — размер и цвет задают .color-details-header span.
*/
.color-details-header h1.color-title{
	font:inherit;
	color:inherit;
	text-transform:none;
	margin:0;
	padding:0;
}

/*
Врезка в тексте статьи была h1 и стала h2 (заголовок первого уровня на странице
теперь один). Размер у неё остаётся прежний — его держит класс article-h1.
*/
.product-details__description .article-h1,
.article-news .article-h1{
	font-size:28px;
}

/*
Оплата заказа. Плашки способа оплаты и её состояния в кабинете и на странице
заказа; классы общие (.bm-paymethod/.bm-paystate/.bm-paylink), поэтому их же
использует список заказов, а в админке — style-new.css.
*/
.bm-paymethods{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:8px;
	margin:6px 0;
}
.bm-paymethod{
	font-size:14px;
	line-height:20px;
	color:#2D2D2D;
}
.bm-paystate{
	display:inline-block;
	padding:2px 10px;
	border-radius:12px;
	font-size:12px;
	line-height:18px;
	white-space:nowrap;
}
.bm-paystate--paid{
	background:#E4F1E8;
	color:#1A7F37;
}
.bm-paystate--pending{
	background:#FDF0E3;
	color:#B35309;
}
.bm-paystate--failed{
	background:#FBE9E9;
	color:#B42318;
}
.bm-paystate--refunded{
	background:#EDEDF2;
	color:#4B4B63;
}
.bm-paylink{
	margin-top:8px;
}
/* Подсказка под выбором способа оплаты в корзине: показывается только для карты */
.payment-hint{
	margin:8px 0 0;
	font-size:13px;
	line-height:18px;
	color:#7A7A7A;
}
/* Сообщения о результате оплаты на странице заказа */
.order-page__msg{
	padding:14px 18px;
	margin:0 0 20px;
	border-radius:4px;
	font-size:15px;
	line-height:22px;
}
.order-page__msg--ok{
	background:#E4F1E8;
	color:#1A7F37;
}
.order-page__msg--warn{
	background:#FDF0E3;
	color:#B35309;
}
/*
На ширинах до 1023px легаси-вёрстка прячет все ячейки итога в списке заказов,
кроме первой: там лежало пустое место. В последней теперь кнопка оплаты, и
скрывать её нечем — показываем эту ячейку обратно.
*/
@media screen and (max-width: 1023px){
	.shopping-order__total .cell.bm-paycell{
		display:block;
		width:100%;
		padding:15px 0 0;
	}
}
