/* Not part of the gulp build (its toolchain no longer installs); plain CSS loaded after build/css. */

/* Accordion: core Details block with class card-toggler — the look of the former Getwid toggles. */
.wp-block-details.card-toggler {
	background: #fff;
	border: 1px solid rgba(218, 218, 218, .525);
	box-shadow: -1px 1px 5px rgba(0, 0, 0, .1);
	border-radius: 8px;
	margin: 0 0 20px;
	padding: 18px 51px 20px; /* content inset 21px more than the header, as Getwid had */
	font: 400 14px/1.8 'Open Sans', sans-serif;
	color: #000;
}
.card-toggler > summary {
	display: flex;
	align-items: center;
	margin: 0 -21px;
	padding: 5px 7.5px;
	cursor: pointer;
	list-style: none;
	font: 800 20px/1.2 'Open Sans', sans-serif;
}
.card-toggler > summary::-webkit-details-marker { display: none; }
.card-toggler > summary::before {
	content: '';
	flex: none;
	width: 7px;
	height: 7px;
	margin: 0 15px 0 0;
	border: solid #505050;
	border-width: 0 2px 2px 0;
	transform: rotate(-45deg);
}
.card-toggler[open] > summary::before { transform: rotate(45deg); }
.wp-block-details.card-toggler[open] { padding-bottom: 41px; }
.card-toggler > summary img { margin-left: auto; height: auto; }
.card-toggler > summary + * { margin-top: 21px; }
.card-toggler img { height: auto; }
.card-toggler strong { display: block; padding: 0 0 5px; font: 800 20px/1.2 'Open Sans', sans-serif; color: #505050; }
@media (max-width: 1023px) {
	.wp-block-details.card-toggler, .wp-block-details.card-toggler[open] { padding: 18px 4vw 10px; }
	.card-toggler > summary { margin: 0; }
}
@media (max-width: 767px) {
	.card-toggler > summary, .card-toggler strong { font-size: 16px; }
}

/* Sitemap: a section with nested subsections (Услуги) spans the row, its subsections stand in columns.
   The build CSS did this by category IDs (.cat-item-9...), which are gone with the categories. */
.sitemap-block > .sitemap-wide { width: 100%; }
.sitemap-block > .sitemap-wide > .children { display: flex; justify-content: space-between; }
.sitemap-block > .sitemap-wide > .children > .cat-item { width: 30%; }
.sitemap-block > .sitemap-wide > .children > .cat-item > .children .cat-item { width: 100%; }
@media (min-width: 768px) and (max-width: 1280px) {
	.sitemap-block > .sitemap-wide > .children > .cat-item { width: 50%; }
}
@media (max-width: 767px) {
	.sitemap-block > .sitemap-wide > .children { flex-direction: column; }
	.sitemap-block > .sitemap-wide > .children > .cat-item { width: auto; }
}

/* Sitemap «Прочая информация» block: WordPress 6+ gives headings and lists wp-block-* classes, so the build CSS rule
   for top-level blocks ([class^="wp-block"]: 30% wide, no margins) caught them too and squeezed the column. */
.sitemap-block .wp-block-heading, .sitemap-block .wp-block-list { width: auto; order: 0; }
.sitemap-block .wp-block-heading { margin: 0 0 20px !important; }
/* That block is a core Group (was an Otter column): the rule above also caught the Group's inner container,
   and the links were grey by the theme's rule for Otter columns. */
.sitemap-block .wp-block-group__inner-container { width: auto; }
.sitemap-block .wp-block-group ul li a { color: #505050; }

/* Footer menu: the column «Хелипорт» + «Контакты» sits at the right. The build CSS pinned it by menu item IDs
   (#menu-item-2751...), now by classes set on the menu items («CSS-классы» in Внешний вид → Меню). */
.footer-nav .menu > li.footer-heliport { position: absolute; right: 51px; margin: 0; }
html[lang="en-US"] .footer-nav .menu > li.footer-heliport { right: 80px; }
html[lang="zh-CN"] .footer-nav .menu > li.footer-heliport { right: 84px; }
.footer-nav .menu > li.footer-contacts { margin-top: 24px; }
.footer-nav .menu li.nowrap, .footer-nav .menu li.nowrap a { white-space: nowrap; }
@media (min-width: 768px) and (max-width: 1023px) {
	.footer-nav .menu > li.footer-heliport, html[lang] .footer-nav .menu > li.footer-heliport { right: 0; top: 105px; }
}
@media (max-width: 767px) {
	.footer-nav .menu > li.footer-heliport, html[lang] .footer-nav .menu > li.footer-heliport { position: relative; right: unset; }
	.footer-nav .menu > li.footer-contacts { margin: 0; position: absolute; right: 0; bottom: 30px; }
}

/* Slider: core Gallery with the style «Слайдер» (functions.php) — the look of the former Otter slider. */
.vnukovo-slider {
	position: relative;
	overflow: hidden;
	box-sizing: content-box; /* 260px of picture inside the 1px border, as Otter */
	height: 260px;
	margin: 0 0 30px;
	border: 1px solid #fff;
	border-radius: 15px;
}
.card-toggler .vnukovo-slider { height: 210px; }
.vnukovo-slider .swiper-slide { height: 100%; }
.vnukovo-slider .wp-block-image { height: 100%; margin: 0; }
.vnukovo-slider img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 15px; }
.vnukovo-slider .swiper-button-prev,
.vnukovo-slider .swiper-button-next {
	position: absolute;
	top: 50%;
	z-index: 2;
	width: 9px;
	height: 15px;
	padding: 20px 15px;
	background: url('build/img/svg/arrow-slider.svg') no-repeat 50% 50% rgba(0, 0, 0, .3);
	cursor: pointer;
	transform: translateY(-50%);
}
.vnukovo-slider .swiper-button-prev { left: 7px; transform: translateY(-50%) scaleX(-1); }
.vnukovo-slider .swiper-button-next { right: 7px; }

/* Former Otter columns are core Groups now; the theme broke long words (URLs) in Otter columns, keep doing so. */
.wp-block-group { word-break: break-word; }

/* Buttons that were Otter's (class button-large, set by migrate-db.sh): Otter's size, larger than core buttons. */
.wp-block-button.button-large .wp-block-button__link { font-size: 15px; padding: 15px 30px; }
