/* ==========================================================================
   acf/tariffs — стили блока (только фронт, viewStyle)
   Все правила ограничены .block-tariffs, чтобы не влиять на остальной сайт.
   ========================================================================== */

.block-tariffs {
	--tariffs-bg: #233244;
	--tariffs-accent: #f97316;
	--tariffs-highlight: #ff7926;
	--tariffs-green: #6ba729;
	--tariffs-text: #3d3d3d;
	--tariffs-muted: #666;
	--tariffs-gap: 20px;

	padding-top: 50px;
	background: var(--tariffs-bg);
}

.block-tariffs .tariffs-sprite {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
}

/* ---------- Заголовки ---------- */
.block-tariffs .name_gutenberg_block {
	color: #fff;
	text-align: center;
}

.block-tariffs .tariffs-hl {
	color: var(--tariffs-highlight);
}

.block-tariffs .tariffs-head {
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
}

.block-tariffs .name_b_tariffs {
	margin: 0;
	font-size: 32px;
	font-weight: 700;
	color: #fff;
}  
span.desk_span {
    margin: 0px;
    padding: 0;
    margin-top: 0px !important;
    font-size: 15px !important;
}
.desk_div {
    display: flex;
    justify-content: flex-start;
    gap: 8px;
    font-size: 15px; 
}
/* ---------- Общие контейнеры ---------- */
.block-tariffs .tariff-block-1,
.block-tariffs .tariff-block-2,
.block-tariffs .tariff-block-3 {
	overflow: hidden;
	max-width: 1640px;
	margin: 0 auto;
}

.block-tariffs .tariff-block-1 {
	padding-top: 45px;
}

/* ---------- Карточки ---------- */
.block-tariffs .tariff-card,
.block-tariffs .cat-additional-card,
.block-tariffs .bg-card {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 20px;
	background-color: #fff;
	border-radius: 0.8rem;
	box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
	box-sizing: border-box;
}

.block-tariffs .name_block_tariff,
.block-tariffs .cat-title-product,
.block-tariffs .title_product {
	margin-bottom: 20px;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.3;
}

.block-tariffs .cat-title-product span,
.block-tariffs .title_product span {
	display: block;
	clear: both;
	margin-top: 9px;
	font-size: 20px;
	font-weight: 500;
	color: var(--tariffs-muted);
}

/* ---------- Цены ---------- */
.block-tariffs .price-line,
.block-tariffs .price-block,
.block-tariffs .cat-price-fixed,
.block-tariffs .price-fixed {
	display: flex;
	align-items: center;
	margin-bottom: 15px;
	font-size: 32px;
	font-weight: 500;
	color: #333;
}

.block-tariffs span.woocommerce-Price-amount.amount {
	display: block;
	font-size: 32px;
	font-weight: 500;
	text-align: left;
	text-decoration: none;
}

/* ---------- Описания ---------- */
.block-tariffs .desc-product,
.block-tariffs .desc-product-vip {
	position: relative;
	min-height: 60px;
	font-size: 18px;
	font-weight: 500;
	color: var(--tariffs-text);
}

.block-tariffs .desc-product-vip {
	max-width: 280px;
}

/* ---------- Кнопки ---------- */
.block-tariffs .btn-wrapper a {
	display: block;
	text-align: center;
	color: var(--tariffs-green);
}

.block-tariffs .buy-btn,
.block-tariffs .cat-cart-button,
.block-tariffs a.ajax_add_to_cart.add_to_cart_button {
	display: block;
	width: 100%;
	min-width: 140px;
	padding: 5px;
	line-height: 50px;
	text-align: center;
	text-decoration: none;
	color: #000;
	border: 1px solid var(--tariffs-green);
	border-radius: 2rem;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.block-tariffs .buy-btn {
	font-size: 1.3rem;
	color: #fff !important;
	background-color: var(--tariffs-green);
}

.block-tariffs .buy-btn:hover,
.block-tariffs .cat-cart-button:hover,
.block-tariffs a.ajax_add_to_cart.add_to_cart_button:hover,
.block-tariffs a.ajax_add_to_cart.add_to_cart_button:focus-visible {
	color: #fff !important;
	background-color: #5E872A;
	cursor: pointer;
}

/* ---------- Списки возможностей ---------- */
.block-tariffs .feature-list ul,
.block-tariffs .tariff-vip ul {
	margin-bottom: 0;
	padding-left: 0;
	list-style: none;
}

.block-tariffs .feature-list li,
.block-tariffs .tariff-vip li {
	display: flex;
	align-items: center;
	margin-bottom: 0.3rem;
}

.block-tariffs li span.me-1 {
	display: inline-flex;
	flex-shrink: 0;
	margin-right: 0.25rem;
}

.block-tariffs .ti {
	display: block;
}

/* ---------- 1. Тарифы: выделенный ---------- */
.block-tariffs .tariff-card.highlighted {
	overflow: visible;
	border: 5px solid var(--tariffs-accent);
	border-radius: 0 0 15px 15px !important;
}

.block-tariffs .tariff-card .badge-top {
	position: absolute;
	top: -40px;
	left: -5px;
	width: calc(100% + 10px);
	padding: 12px;
	color: #fff;
	text-transform: uppercase;
	background-color: var(--tariffs-accent);
	border-radius: 15px 15px 0 0 !important;
	box-sizing: border-box;
}

/* ---------- 1. Тарифы: VIP-строки ---------- */
.block-tariffs .tariff-vip {
	position: relative;
	margin-bottom: 30px;
	padding: 25px;
	background-color: #fff;
	border-radius: 0.8rem;
	box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.block-tariffs .text-orange {
	color: var(--tariffs-accent);
}

.block-tariffs .vip-label {
	display: flex;
	align-items: center;
	font-size: 2rem;
	font-weight: 700;
}

.block-tariffs .vip_title_block {
	position: relative;
}

.block-tariffs .vip-icon {
	position: absolute;
	top: -20px;
	line-height: 0;
}

.block-tariffs .tariff-vip .buy-btn {
	max-width: 340px;
	margin: 0 auto;
}

/* ---------- Примечания и банки (page-templates/pay_info_block) ---------- */
.block-tariffs .uvaga {
	position: relative;
	display: flex;
	float: left;
	overflow: hidden;
	max-width: 520px;
	margin-bottom: 12px;
	text-align: left;
	color: #fff;
}

.block-tariffs .container-bank {
	display: grid;
	grid-template-rows: repeat(1, 1fr);
	grid-auto-flow: column;
	gap: 17px;
	justify-content: right;
	align-items: center;
}





.block-tariffs .container-bank .item {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #fff;
	border-radius: 50%;
}

.block-tariffs .container-bank img {
	padding: 5px;
	border-radius: 50%;
   width: 32px;
    height: 32px;
    object-fit: contain;
}

.block-tariffs .name-bank {
	position: relative;
	display: block;
	margin-bottom: 10px;
	font-weight: 700;
	text-align: center;
}

.block-tariffs .block_bank p {
	margin-bottom: 0;
}

.block-tariffs .bank_detal {
	margin: 3px 0;
	padding: 10px;
}

.block-tariffs .bank_detal ul {
	margin-top: 10px;
	padding-left: 20px;
	text-align: left;
}

.block-tariffs .bank_detal ul li {
	margin: 5px 0;
}

/* Bootstrap добавляет tooltip в <body>, поэтому селектор без .block-tariffs */
.tooltip .tooltip-inner {
	width: auto !important;
	max-width: 400px;
	font-size: 13px;
}

/* ---------- Слайдеры (2 и 3) ---------- */
.block-tariffs button.btns {
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
}

.block-tariffs .swiper-button-prev-custom,
.block-tariffs .swiper-button-next-custom {
	color: #fff;
	transition: opacity 0.3s;
}

.block-tariffs .swiper-button-disabled {
	opacity: 0.2;
}

.block-tariffs .swiper {
	overflow: visible;
}

.block-tariffs .tariff2-swiper-nav {
	display: none;
	gap: 1rem;
}

.block-tariffs .tariff-block-3 .swiper-wrapper {
	align-items: stretch;
}

.block-tariffs .tariff-block-3 .swiper-slide {
	display: flex;
	flex-direction: column;
	height: auto;
}

.block-tariffs .tariff-block-3 .bg-card > .d-flex {
	flex: 1;
}

/* Фолбэк, пока Swiper не запущен (медленная сеть, без JS):
   горизонтальная прокрутка вместо "поломанной" ленты. */
.block-tariffs .swiper:not(.swiper-initialized) .swiper-wrapper {
	display: flex;
	gap: var(--tariffs-gap);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
}

.block-tariffs .swiper:not(.swiper-initialized) .swiper-slide {
	flex: 0 0 min(80%, 420px);
	scroll-snap-align: start;
}

/* ---------- ≥ 1280px: категории сеткой ---------- */
@media (min-width: 1280px) {
	.block-tariffs .tariff-block-2 .swiper-wrapper,
	.block-tariffs .tariff-block-2 .swiper:not(.swiper-initialized) .swiper-wrapper {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 20px;
		overflow: visible;
	}

	.block-tariffs .tariff-block-2 .swiper-slide {
		width: auto;
		height: auto;
	}

	.block-tariffs .tariff-block-2 .tariff2-swiper-nav {
		display: none !important;
	}

	.block-tariffs .tariff-block-3 .swiper:not(.swiper-initialized) .swiper-slide {
		flex-basis: calc((100% - 3 * var(--tariffs-gap)) / 3.3);
	}
}

/* ---------- < 1280px ---------- */
@media (max-width: 1279.98px) {
	.block-tariffs .tariff-block-1 {
		padding-top: 0;
	}

	.block-tariffs .name_b_tariffs {
		font-size: 28px;
	}

	.block-tariffs .tariff-card-content {
		padding: 0;
	}

	.block-tariffs .feature-list {
		padding-top: 20px;
	}

	.block-tariffs .tariff-block-1 .tariff-card,
	.block-tariffs .tariff-card.highlighted {
		margin-top: 35px;
	}

	.block-tariffs .tariff-block-1 .row > div:first-child .tariff-card {
		margin-top: 0;
	}

	.block-tariffs .tariff-vip {
		margin-top: 35px;
		padding: 10px;
	}

	.block-tariffs .uvaga {
		display: block;
		float: none;
		width: 100%;
		max-width: 100%;
		margin-bottom: 5px;
		text-align: center;
	}

	.block-tariffs .cat-additional-card {
		padding: 30px;
	}

	.block-tariffs .container-bank {
		justify-content: center;
		margin-top: 15px;
	}
}

/* ---------- < 992px ---------- */
@media (max-width: 991.98px) {
	.block-tariffs .tariffs-head {
		margin-top: 0.5rem;
		margin-bottom: 0.5rem;
	}
}

/* ---------- ≤ 768px ---------- */
@media (max-width: 768px) {
	.block-tariffs .name_b_tariffs {
		font-size: 20px;
	}

	.block-tariffs .cat-title-product {
		font-size: 25px;
	}

	.block-tariffs span.woocommerce-Price-amount.amount {
		font-size: 27px;
	}

	.block-tariffs .tariff-vip {
		text-align: center;
	}

	.block-tariffs .tariff-vip .vip-label {
		justify-content: center;
	}

	.block-tariffs .tariff-vip .d-flex.flex-column {
		align-items: center;
	}

	.block-tariffs .tariff-vip ul {
		max-width: 400px;
		margin-right: auto;
		margin-left: auto;
	}

	.block-tariffs .tariff-vip .btn-wrapper {
		display: flex;
		justify-content: center;
		margin-top: 1.5rem;
	}

	.block-tariffs .container-bank {
		gap: 5px;
		justify-content: space-around;
		margin-bottom: 15px;
	}

	.block-tariffs .container-bank .item {
		width: 30px;
		height: 30px;
	}
}

/* ---------- ≤ 479px ---------- */
@media (max-width: 479px) {
	.block-tariffs .container-bank {
		gap: 4px;
	}

	.block-tariffs .container-bank .item {
		width: 25px;
		height: 25px;
	}

	.block-tariffs .container-bank .img-fluid {
		padding: 1px;
	}
}