

/* Start:/bitrix/components/webimed/paid_services_order/templates/tokpb/style.css?178789824815569*/
/* Шаблон tokpb.ru. Сайт не грузит Bootstrap (свой стек: jQuery 1.12.4,
   Font Awesome 4.6.2, без bootstrap.js) — поэтому, как и у medsantomsk,
   здесь заданы свои базовые стили .btn/.form-control и свой аккордеон
   (сайт использует data-toggle нигде, значит своя реализация в script.js).

   ВАЖНО про красный: изначально в шаблоне был красный #BC262C — оказался
   ошибкой. Это цвет CSS-правила для меню `.default/components/bitrix/
   menu/tokpb/...` — устаревший/неиспользуемый на реальных страницах
   шаблон меню. Фактическая навигация сайта (`#body` в template_styles.css)
   красится картинкой `/bitrix/templates/tokpb_inner/images/menubg.png` —
   это зелёная лента, никакого красного в реальном хроме сайта нет.
   Красный в CSS встречается только в разовых правилах (h3, выбранный
   пункт подменю) и к бренду/навигации отношения не имеет — по фидбэку
   пользователя убран из компонента полностью.

   Палитра: зелёный #6ABF26 с синей рамкой #3184C7 — кнопки, тоже Georgia
   italic (класс .button сайта, включая кнопку "Задать вопрос" на
   /patsientam/zadat-vopros/); синий #2D82B8/#2D6DB5 — заголовки и ссылки,
   те же цвета что у настоящих h2 и <a> сайта. Текст — Trebuchet MS/Arial.
   В CSS сайта не встретилось незаскоуленных правил button{}/input{} по
   тегу — дополнительный сброс не понадобился. Сайт также нигде не
   использует border-radius/box-shadow — вёрстка ниже намеренно оставлена
   плоской, без скруглений, чтобы не выбиваться.

   Таблицы каталога оформлены как настоящая табличка сайта (класс
   table.display на /o-bolnitse/vakansii/ — зелёная рамка #72B238 вокруг
   каждой ячейки, БЕЗ какой-либо заливки — там просто жирный центрированный
   текст на белом фоне). Строки аккордеона — по той же логике: без заливки,
   только текст/иконка синего цвета (не серый фон .paid-accordion__toggle,
   который был раньше). */

.paid-services {
	font-family: "Trebuchet MS", Arial, sans-serif;
	color: #534741;
	font-size: 14px;
	line-height: 22px;
}

/* ==================== Каталог: таблица услуг ==================== */

.paid-services table {
	width: 100%;
	table-layout: fixed;
	border: 1px solid #72B238;
	border-collapse: collapse;
	margin-bottom: 8px;
}
.paid-services table tr:first-child td {
	font-weight: bold;
	color: #534741;
	text-align: center;
	font-size: 12px;
}
.paid-services table td {
	padding: 8px 12px;
	border: 1px solid #72B238;
	vertical-align: middle;
	overflow-wrap: break-word;
}
/* Явные проценты по колонкам — иначе table-layout:fixed "гуляет" от таблицы
   к таблице из-за разной длины названий услуг в разных разделах. */
.paid-services table td:nth-child(1) { width: 20%; }
.paid-services table td:nth-child(2) { width: 34%; }
.paid-services table td:nth-child(3) { width: 14%; }
.paid-services table td:nth-child(4) { width: 32%; }

/* ==================== Кнопка "Оформить" в таблице ==================== */

.paid-service-cta {
	display: inline-block;
	width: auto;
	height: auto;
	background-color: #6ABF26;
	border: 1px solid #3184C7;
	color: #000000;
	font-family: Georgia, "Trebuchet MS", serif;
	font-style: italic;
	font-size: 13px;
	line-height: 1;
	margin: 0;
	padding: 8px 16px;
	cursor: pointer;
	white-space: nowrap;
	text-decoration: none;
}
.paid-service-cta:hover {
	background-color: #5aa621;
}

/* ==================== Аккордеон каталога (свой, без Bootstrap) ====================
   Без заливки — как и настоящие таблицы сайта (table.display на
   /o-bolnitse/vakansii/), никакого фона у строки-заголовка. Текст/иконка —
   синий #2D6DB5, цвет обычной ссылки сайта (тот, что реально используется
   в контенте, не разовый цвет одного h3-правила). */

.paid-accordion {
	background-color: #ffffff;
	border: 1px solid #e0e0e0;
	margin: 15px 0;
}
.paid-accordion__item {
	border-bottom: 1px solid #e0e0e0;
}
.paid-accordion__item:last-child {
	border-bottom: 0;
}
.paid-accordion__toggle {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	text-align: left;
	background: none;
	border: none;
	cursor: pointer;
	padding: 12px 16px;
	font-family: "Trebuchet MS", Arial, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #2D6DB5;
}
.paid-accordion__toggle:hover {
	color: #1c4d80;
}
.paid-accordion__icon {
	display: inline-block;
	width: 14px;
	margin-right: 8px;
	color: #2D6DB5;
	transition: transform 0.15s ease-in-out;
}
.paid-accordion__toggle[aria-expanded="true"] .paid-accordion__icon {
	transform: rotate(90deg);
}
.paid-accordion__toggle[aria-expanded="true"] {
	color: #1c4d80;
}
.paid-accordion__body {
	padding: 4px 16px 16px;
	background-color: #ffffff;
}

/* ==================== Плоский режим каталога — заголовки вместо аккордеона ==================== */

.paid-services-flat__heading {
	font-family: Georgia, "Trebuchet MS", serif;
	font-style: italic;
	font-size: 18px;
	font-weight: normal;
	color: #2D82B8;
	margin: 28px 0 12px;
}
.paid-services-flat__heading:first-child {
	margin-top: 0;
}
.paid-services-flat__table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 8px;
}

.paid-services__license-note {
	font-size: 12px;
	color: #999;
	margin: 0 0 12px;
}

/* ==================== Базовые стили .btn/.form-control ====================
   На tokpb.ru нет Bootstrap — border/padding/display задаём сами. */

.paid-order-modal .btn {
	display: inline-block;
	box-sizing: border-box;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0 20px;
	font-family: Georgia, "Trebuchet MS", serif;
	font-style: italic;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid #3184C7;
	background-color: #6ABF26;
	color: #000000;
}
.paid-order-modal .btn:hover {
	background-color: #5aa621;
}

.paid-order-modal .form-control {
	display: block;
	box-sizing: border-box;
	width: 100%;
	background-color: #ffffff;
	border: 1px solid #888888;
	color: #534741;
	font-family: "Trebuchet MS", Arial, sans-serif;
}
.paid-order-modal .form-control:focus {
	border-color: #3184C7;
	outline: none;
}

/* ==================== Модальное окно оформления заявки ==================== */

.paid-order-modal {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1050;
}
.paid-order-modal.is-open {
	display: block;
}
.paid-order-modal__overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
}
.paid-order-modal__box {
	position: relative;
	max-width: 640px;
	width: 90%;
	margin: 5vh auto;
	max-height: 90vh;
	background: #fff;
	overflow: hidden;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
}
.paid-order-form {
	display: flex;
	flex-direction: column;
	min-height: 0;
	max-height: 90vh;
}
.paid-order-modal__scroll {
	overflow-y: auto;
	padding: 30px;
	min-height: 0;
}
.paid-order-modal__footer {
	flex: none;
	padding: 16px 30px 24px;
	border-top: 1px solid #e5e5e5;
	background: #fff;
}
.paid-order-modal__footer .btn-question {
	width: 100%;
	height: auto;
	line-height: 50px;
	font-size: 16px;
	padding: 0;
}
.js-captcha-box {
	min-height: 100px;
}
.paid-order-modal__footer .btn-question:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}
.paid-order-modal__close {
	position: absolute;
	top: 8px;
	right: 14px;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	font-family: Arial, sans-serif;
	font-style: normal;
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
	color: #888;
	z-index: 1;
}
.paid-order-modal__close:hover {
	color: #444;
}
.paid-order-form .form-group {
	margin-bottom: 14px;
}
.paid-order-modal .form-control {
	height: 36px !important;
	padding: 6px 10px !important;
	font-size: 14px;
}
.paid-order-form .form-divider {
	margin: 24px 0 14px;
	padding-top: 16px;
	border-top: 1px solid #e5e5e5;
	font-weight: bold;
	font-size: 12px;
	letter-spacing: 0.05em;
	color: #6b6b6b;
}
.paid-order-form .form-group.has-error .form-control {
	border-color: #a94442 !important;
}
.paid-order-form .form-group.has-error .help-block {
	color: #a94442;
	display: block !important;
	margin-top: 4px;
	font-size: 13px;
}
.paid-order-form .agree_container {
	margin-bottom: 10px;
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 12px;
	line-height: 1.45;
	color: #767676;
}
.paid-order-form .agree_container:first-of-type {
	margin-top: 20px;
}
.paid-order-form .agree_container input[type="checkbox"] {
	flex: none;
	margin: 2px 8px 0 0;
	width: 15px;
	height: 15px;
}
.paid-order-form .agree_container label {
	font-weight: normal;
	cursor: pointer;
	margin: 0;
}
.paid-order-form .agree_container.has-error {
	outline: 1px solid #a94442;
	outline-offset: 4px;
}
body.paid-order-modal-open {
	overflow: hidden;
}

/* Заголовок формы ("Оформление услуги") — Georgia italic, синий #2D82B8
   (реальный цвет h2 сайта — HEADER_MESSAGE рендерится тегом <h2>, поэтому
   взят цвет именно этого тега, а не разовый красный h3-правила). Задан
   явно, а не через каскад site h1-h6, чтобы не зависеть от того, какой
   тег реально пришёл в HEADER_MESSAGE.
   margin-bottom увеличен до 20px (был 8px) — по фидбэку пользователя
   заголовок слишком близко прилипал к строке "Услуга:" под ним. */
.header_message {
	font-family: Georgia, "Trebuchet MS", serif;
	font-style: italic;
	font-weight: normal;
	color: #2D82B8;
	font-size: 20px;
	margin: 0 0 20px;
}

.paid-order-modal__success {
	display: flex;
	flex-direction: column;
	min-height: 0;
	max-height: 90vh;
}
.paid-order-modal__success-scroll {
	overflow-y: auto;
	padding: 32px 30px 8px;
	text-align: center;
	min-height: 0;
}
.paid-order-modal__success-footer {
	flex: none;
	padding: 12px 30px 24px;
	text-align: center;
}
.paid-order-modal__success-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	line-height: 1;
	border-radius: 50%;
	background: #eaf6df;
	color: #4e8a1f;
	font-size: 22px;
	margin: 0 auto 12px;
}
.paid-order-modal__success .header_message {
	margin-bottom: 8px;
}
.paid-order-modal__order-box {
	margin: 16px 0;
	padding: 14px 20px;
	border: 1px solid #b7c9e0;
	background: #eef4fb;
}
.paid-order-modal__order-box-label {
	font-size: 12px;
	letter-spacing: 0.05em;
	color: #2D6DB5;
	margin-bottom: 4px;
}
.paid-order-modal__order-box-number {
	font-size: 24px;
	font-weight: bold;
	color: #1f3a5f;
	line-height: 1.3;
}
.paid-order-modal__order-box-hint {
	margin-top: 6px;
	font-size: 13px;
	line-height: 1.5;
	color: #5a7189;
}
.paid-order-modal__success-service {
	color: #767676;
	font-size: 14px;
	line-height: 1.6;
	margin: 16px 0 0;
	text-align: left;
}
.paid-order-modal__success-service-name {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	vertical-align: bottom;
}
.paid-order-modal__success-service-name.is-expanded {
	-webkit-line-clamp: unset;
	overflow: visible;
}
.paid-order-modal__success-service-expand-link {
	display: block;
	width: auto;
	height: auto;
	margin: 4px 0 0;
	padding: 0;
	border: none;
	background: none;
	color: #2D6DB5;
	font-size: 13px;
	line-height: 1.4;
	text-decoration: underline;
	cursor: pointer;
	text-align: left;
}
.paid-order-modal__success-service-expand-link:hover {
	color: #1c4d80;
}
.paid-order-modal__success-price {
	color: #767676;
	font-size: 14px;
	line-height: 1.6;
	margin: 8px 0 0;
	text-align: left;
}
.paid-order-modal__success .btn-question {
	min-width: 180px;
	height: auto;
	line-height: 44px;
	font-size: 15px;
	padding: 0 30px;
}

/* Мобильные экраны: модалка на весь экран, без отступов, более компактные
   паддинги, увеличенная область нажатия у крестика. */
@media (max-width: 600px) {
	.paid-order-modal__box {
		width: 100%;
		max-width: 100%;
		height: 100%;
		max-height: 100dvh;
		margin: 0;
	}
	.paid-order-form {
		max-height: 100dvh;
	}
	.paid-order-modal__scroll {
		padding: 20px 16px;
	}
	.paid-order-modal__footer {
		padding: 12px 16px 18px;
	}
	.paid-order-modal__success {
		max-height: 100dvh;
	}
	.paid-order-modal__success-scroll {
		padding: 24px 16px 8px;
	}
	.paid-order-modal__success-footer {
		padding: 12px 16px 18px;
	}
	.paid-order-modal__close {
		top: 6px;
		right: 6px;
		width: 44px;
		height: 44px;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.paid-order-modal__order-box {
		padding: 14px 16px;
	}
	.paid-order-modal__success-icon {
		width: 48px;
		height: 48px;
		font-size: 22px;
	}
}

/* Попап согласия системного компонента bitrix:main.userconsent.request —
   по умолчанию узкий, текст договора читается только через маленькую
   textarea с частой прокруткой. !important — попап собирается JS-ом ядра,
   наши правила должны гарантированно перебивать инлайновые/более
   специфичные стили ядра. */
.main-user-consent-request-popup-cont {
	width: 90vw !important;
	max-width: 800px !important;
}
.main-user-consent-request-popup-body {
	max-height: 85vh !important;
	overflow-y: auto;
	box-sizing: border-box;
}
.main-user-consent-request-popup-textarea-block {
	width: 100% !important;
}
.main-user-consent-request-popup-text {
	width: 100% !important;
	box-sizing: border-box !important;
	height: 55vh !important;
	min-height: 320px !important;
	font-size: 15px;
	line-height: 1.6;
}

@media (max-width: 600px) {
	.main-user-consent-request-popup-cont {
		width: 95vw !important;
		max-width: 95vw !important;
	}
	.main-user-consent-request-popup-body {
		max-height: 90vh !important;
	}
	.main-user-consent-request-popup-text {
		height: 45vh !important;
		min-height: 220px !important;
		font-size: 14px;
	}
}

/* End */


/* Start:/bitrix/components/bitrix/main.userconsent.request/templates/.default/user_consent.min.css?17647498453805*/
.main-user-consent-request a{cursor:pointer}.main-user-consent-request-popup{position:fixed;top:0;left:0;bottom:0;right:0;background-color:rgba(0,0,0,.5);overflow:hidden;z-index:9000}.main-user-consent-request-popup-cont{min-height:290px;position:absolute;top:50%;left:50%;margin:0 auto;padding:20px;min-width:320px;width:100%;max-width:600px;background:#fff;text-align:center;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-border-radius:5px;border-radius:5px;-webkit-box-sizing:border-box;box-sizing:border-box;overflow-y:auto}.main-user-consent-request-popup-header{margin:0 0 10px;font:normal 18px var(--ui-font-family-primary,var(--ui-font-family-helvetica));color:#000;text-align:left;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;max-width:260px}.main-user-consent-request-popup-textarea-block{margin:0 0 20px}.main-user-consent-request-popup-buttons{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.main-user-consent-request-popup-button{display:inline-block;height:39px;margin:0 10px 5px 0;padding:0 18px;border:none;border-radius:2px;font:normal 12px/39px var(--ui-font-family-primary,var(--ui-font-family-helvetica));color:#535c69;outline:none;vertical-align:middle;text-decoration:none;text-transform:uppercase;text-shadow:none;white-space:nowrap;-webkit-font-smoothing:antialiased;-webkit-transition:background-color .2s linear,color .2s linear;transition:background-color .2s linear,color .2s linear;cursor:pointer}.main-user-consent-request-popup-button-acc{background:#bbed21}.main-user-consent-request-popup-button-acc:hover{background:#d2f95f}.main-user-consent-request-popup-button-rej{-webkit-box-shadow:inset 0 0 0 1px #a1a6ac;box-shadow:inset 0 0 0 1px #a1a6ac;background:none}.main-user-consent-request-popup-button-rej:hover{background:#cfd4d8}.main-user-consent-request-popup-text{border:1px solid #999;overflow:auto;padding:8px;text-align:left;color:#545454}.main-user-consent-request-popup-link{height:130px;display:flex;justify-content:center;align-items:center;flex-direction:column}.main-user-consent-request-popup-link a{display:block;margin:20px 0 0;text-overflow:ellipsis;overflow:hidden;max-width:260px}.main-user-consent-request-loader{position:relative;height:100px;width:100px;margin:0 auto;-webkit-transform:translateY(50%);transform:translateY(50%)}.main-user-consent-request-path{stroke:#80868e;stroke-dasharray:100,200}.main-user-consent-request-loader:before{content:"";display:block;padding-top:100%}.main-user-consent-request-circular{position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;height:inherit;width:inherit;-webkit-animation:rotate 1s linear infinite;animation:rotate 1s linear infinite;-webkit-transform-origin:center center;transform-origin:center center}.main-user-consent-request-path{stroke:#ccc;stroke-dasharray:60,200;stroke-dashoffset:0;-webkit-animation:dash 1.5s ease-in-out infinite;animation:dash 1.5s ease-in-out infinite;stroke-linecap:round}.main-user-consent-request-announce{color:#333;font-size:13px;line-height:15px}.main-user-consent-request-announce-link{cursor:pointer}.main-user-consent-request-announce-required{color:red}@keyframes rotate{to{transform:rotate(1turn)}}@-webkit-keyframes rotate{to{-webkit-transform:rotate(1turn)}}@media (min-width:1000px){.main-user-consent-request-popup-cont{min-height:400px;min-width:640px}.main-user-consent-request-popup-header{max-width:590px}.main-user-consent-request-popup-link,.main-user-consent-request-popup-text{height:240px}.main-user-consent-request-popup-link a{max-width:200px}}@media (max-width:768px){.main-user-consent-request-popup-cont{height:100%}}
/* End */
/* /bitrix/components/webimed/paid_services_order/templates/tokpb/style.css?178789824815569 */
/* /bitrix/components/bitrix/main.userconsent.request/templates/.default/user_consent.min.css?17647498453805 */
