/**
 * Общие стили плашек и компонентов бюро: используются и в списке (карточка), и на странице бюро.
 * Подключается на страницах со списком бюро и на single agency.
 * В WP нет встроенного аналога SDC/компонентного CSS — подключаем файл по контексту (PspbAssets).
 */

.bureau-description {
	color: var(--smoke-gray);
}

/* Дополнительные услуги: блок и бейджи */
.wrapper-services {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}

.services-marker {
	background-color: var(--gray);
	border-radius: 32px;
	padding: 5px 10px;
	white-space: nowrap;
	font-size: 12px;
	text-wrap: auto;
}

.services-marker a {
	text-decoration: none;
	color: var(--blue);
	font-weight: bold;
}

/* Плашка блока информации (адреса, контакты) */
.bureau-block-info {
	background-color: var(--light-gray);
	border-radius: 32px;
	padding: 15px 40px 60px 40px;
	box-shadow: 3px 3px 10px 0px #00000033;
	margin: 3rem 0;
}

.bureau-block-info:first-of-type,
.bureau-block-info:last-of-type {
	margin-top: 0;
}

.bureau-block-info img {
	border-radius: 30px;
}

/* Оценка/рейтинг в синем блоке */
.grade-blue-block {
	background-color: var(--blue);
	height: 43px;
	width: 45px;
	color: var(--white);
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 5px;
}

.grade-blue-block.text {
	width: fit-content;
	height: fit-content;
}

.intermediary {
	margin-top: -16px;
}

.none-grade-block {
	background-color: var(--smoke-gray);
	width: fit-content;
	height: fit-content;
	text-align: center;
	padding: 5px;
	color: var(--white);
	font-weight: bold;
}

.btn-blue {
	background-color: var(--blue);
	color: var(--white);
	font-weight: bold;
	padding: 15px 35px;
	border-radius: 30px;
}

.btn-blue:hover {
	color: var(--blue);
	background-color: var(--gray);
}

.img-none {
	border: 10px solid #11385B;
	border-radius: 30px;
}

/* Иконки (общие) */
.icon {
	color: var(--blue);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.icon svg {
	width: 30px;
	height: 30px;
	fill: currentColor;
}

.icon--metro svg {
	width: 15px;
	height: 12px;
}

.icon--star-rating {
	color: #FF9500;
}

.icon--star-rating svg {
	width: 16px;
	height: 16px;
}

.icon--site svg {
	width: 16px;
	height: 16px;
}

/* Иконки подтверждено и Промо: заливки и размер 99×27 (в карточке списка размер галочки переопределяется в bureau-list.css) */
.icon--bureau-confirmed svg path,
.icon-bureau-confirmed-information svg path {
	fill: #fff;
}

.icon--bureau-priority svg {
	width: 99px;
	height: 27px;
}

.icon--bureau-priority svg > path:nth-of-type(1),
.icon--bureau-priority svg > path:nth-of-type(2) {
	fill: #11385B;
}

.icon--bureau-priority svg g[clip-path],
.icon--bureau-priority svg g[clip-path] path {
	fill: #fff;
}

.icon--bureau-priority svg > path:nth-of-type(3) {
	fill: #fff;
}

.bureau-not-working {
	opacity: 0.5;
}

div.address-information a {
	text-decoration: underline;
}

button.accordion-button {
	background-color: rgba(217, 217, 217, 1);
	color: var(--blue);
}

/* Тултипы (используются в карточке и на странице бюро) */
.tooltip-inner {
	max-width: 325px;
	background: white;
	border: 1px solid var(--gray);
	color: #000;
	margin: 0;
	padding: 5px;
}

.tooltip.bottom .tooltip-arrow {
	top: 0;
	left: 50%;
	margin-left: -5px;
	border-bottom-color: var(--gray);
	border-width: 0 5px 5px;
}

.bs-tooltip-bottom .tooltip-arrow:before {
	border-bottom-color: var(--gray);
}

/* Цвета линий метро (переменные заданы в style.css темы) */
.red-line {
	color: var(--red-line);
}

.blue-line {
	color: var(--blue-line);
}

.green-line {
	color: var(--green-line);
}

.purple-line {
	color: var(--purple-line);
}

.orange-line {
	color: var(--orange-line);
}

.brown-line {
	color: var(--brown-line);
}