/*
 * Экран результатов. Своего стиля по минимуму: панель WordPress уже даёт
 * таблицы, кнопки и типографику, а плагин, который перекрашивает чужую
 * админку под себя, раздражает — за это конкурента и ругают.
 */

/*
 * Атрибут hidden сам по себе НЕ прячет элемент: он задаёт всего лишь
 * display:none в стилях браузера, а любое правило с display перебивает его.
 * Здесь так и вышло — админка задаёт кнопкам display:block, а фильтрам
 * display:flex ставим мы сами, и «скрытые» кнопки оставались на экране.
 */
.onsite-a11y-ekran [hidden] {
	display: none !important;
}

.onsite-a11y-vstuplenie {
	max-width: 46em;
}

.onsite-a11y-panel {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 16px 0 12px;
	flex-wrap: wrap;
}

.onsite-a11y-hod {
	color: #50575e;
}

.onsite-a11y-filtry {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 12px;
	flex-wrap: wrap;
}

.onsite-a11y-filtry label {
	font-weight: 600;
}

.onsite-a11y-schet {
	color: #50575e;
	margin-left: auto;
}

/* Метка важности: цвет — подсказка, но не единственный признак.
   Слово написано текстом, потому что по одному цвету человек с нарушением
   цветовосприятия важность не различит, а это плагин доступности. */
.onsite-a11y-metka {
	display: inline-block;
	padding: 2px 8px;
	border-radius: 3px;
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
	border: 1px solid;
}

.onsite-a11y-metka-critical {
	background: #fcf0f1;
	border-color: #d63638;
	color: #8a1f22;
}

.onsite-a11y-metka-serious {
	background: #fcf9e8;
	border-color: #dba617;
	color: #7a5c00;
}

.onsite-a11y-metka-moderate {
	background: #f0f6fc;
	border-color: #72aee6;
	color: #1d4e78;
}

.onsite-a11y-metka-vruchnuyu {
	background: #f6f7f7;
	border-color: #8c8f94;
	color: #3c434a;
}

.onsite-a11y-tablica td {
	vertical-align: top;
	padding-top: 12px;
	padding-bottom: 12px;
}

.onsite-a11y-vazhnost {
	width: 150px;
}

.onsite-a11y-skolko {
	width: 70px;
	text-align: center;
}

.onsite-a11y-nado {
	margin-top: 4px;
	color: #1d4e78;
}

.onsite-a11y-pravilo {
	margin-top: 6px;
	font-size: 12px;
	color: #646970;
}

/*
 * Ссылки подчёркнуты намеренно. Ссылка, которая отличается от текста только
 * цветом, — это нарушение того самого правила, которое мы сами и находим
 * (link-in-text-block). Плагину доступности такое не прощают.
 */
.onsite-a11y-ekran .onsite-a11y-pravilo a,
.onsite-a11y-ekran .onsite-a11y-stranicy a {
	text-decoration: underline;
}

.onsite-a11y-gde code {
	display: inline-block;
	max-width: 34em;
	overflow-wrap: anywhere;
	background: #f6f7f7;
}

.onsite-a11y-stranicy {
	margin-top: 6px;
	font-size: 12px;
}

.onsite-a11y-eshchyo {
	color: #646970;
}

.onsite-a11y-pusto {
	background: #fff;
	border: 1px solid #c3c4c7;
	border-left: 4px solid #72aee6;
	padding: 12px 16px;
	max-width: 46em;
}

.onsite-a11y-pusto h2 {
	margin-top: 4px;
}

.onsite-a11y-chisto {
	border-left-color: #00a32a;
}