/*
 * Баннер согласия Complianz на узких экранах.
 *
 * Зачем файл. На телефоне баннер из коробки занимал почти весь экран:
 * логотип, девять строк текста, четыре переключателя категорий и три
 * кнопки в столбик. Сайта за ним видно не было, и это само по себе
 * давление на выбор — посетитель соглашается, лишь бы убрать.
 *
 * Что сделано не здесь: категории убраны с первого экрана настройкой
 * самого Complianz (use_categories = view-preferences). Они открываются
 * по кнопке «Einstellungen ansehen». Здесь только то, что настройками
 * плагина не выражается.
 *
 * Текст согласия не трогаем: это юридическая формулировка, её меняет
 * владелец сайта осознанно, а не таблица стилей.
 *
 * Селекторы начинаются с body только ради веса: собственные правила
 * Complianz имеют ту же специфичность, и полагаться на порядок
 * подключения (он зависит от того, в какой момент плагин встал
 * в очередь) не хочется.
 */

@media ( max-width: 767px ) {

	/*
	 * Логотип Apoli уже нарисован в шапке сайта прямо над баннером.
	 * Второй раз он не сообщает ничего нового, а съедает 44px.
	 * Крестик закрытия остаётся на месте.
	 */
	body .cmplz-cookiebanner .cmplz-header .cmplz-logo {
		display: none;
	}

	body .cmplz-cookiebanner .cmplz-header {
		min-height: 0;
	}

	/*
	 * «Akzeptieren» и «Ablehnen» — в один ряд и одинаковой ширины.
	 * Равная заметность согласия и отказа сохраняется (это требование,
	 * а не украшение), но ряд экономит высоту кнопки с промежутком.
	 * flex-basis с вычетом половины промежутка, иначе две кнопки по 50%
	 * вместе с gap не помещаются и переносятся по одной.
	 */
	body .cmplz-cookiebanner .cmplz-buttons {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 8px;
	}

	body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-accept,
	body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-deny {
		flex: 1 1 calc( 50% - 4px );
		width: auto;
		min-width: 0;
	}

	/*
	 * Кнопки настроек остаются на всю ширину: у них длинные подписи,
	 * а «Einstellungen speichern» появляется вместо «ansehen» уже после
	 * раскрытия категорий — ряд из двух там был бы пустым наполовину.
	 */
	body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-view-preferences,
	body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-save-preferences {
		flex: 1 1 100%;
		width: auto;
	}

	/* Поля вокруг содержимого: 20px по бокам на 375px экрана — много. */
	body .cmplz-cookiebanner {
		padding: 12px 16px;
		gap: 8px;
	}

	/*
	 * Страховка от переполнения: если в баннер когда-нибудь добавят
	 * ещё блок, он не должен закрывать экран целиком и прятать кнопки.
	 * Прокручивается текст, кнопки остаются видимыми.
	 */
	body .cmplz-cookiebanner {
		max-height: 80vh;
	}

	body .cmplz-cookiebanner .cmplz-body {
		overflow-y: auto;
	}
}