/*
Theme Name:     Medilink Child
Template:       medilink
Theme URI:      https://radiustheme.com
Author:         Radiustheme
Author URI:     https://radiustheme.com/demo/medilink
Description:    Medilink | Responsive WordPress Medical Theme is one of the Latest and World Standard Multipurpose Responsive WordPress Medical  Theme. Using medilink user can get to Start a  Medical, Medical  Shop and Medical schedule.
Version:        1.0
License:        GNU General Public License v2 or later
License URI:    http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:    medilink
Tags:           one-column, two-columns, right-sidebar, accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, flexible-header, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
*/

.header-action-items > li {
  white-space: nowrap;
}

/* Сторінка послуг: тема додає .single-departments-box-layout1 зайвий
 * padding-left: 15px (для розкладки з сайдбаром у відділеннях). На сторінці
 * послуг сайдбару немає — прибираємо. Скоупимо через .customize-content-selector,
 * щоб справжні single-сторінки відділень лишились незмінні. */
.customize-content-selector .single-departments-box-layout1 {
  padding-left: 0;
}

/* ── Список послуг (archive-services + single department) ──
 * Базові стилі для .item-cost ul li (padding, смугастий фон, колір)
 * вже надає тема: .single-departments-box-layout1 .item-content .item-cost ul li
 * Тут додаємо тільки flex-розкладку для 3 колонок + заголовок таблиці.
 */
.services-box ul {
  list-style: none;
  margin: 0;
}

.services-box ul li {
  display: flex;
  gap: 12px;
}

.services-header {
  display: flex;
  gap: 12px;
  padding: 12px 0 12px 25px;
  margin-bottom: 8px;
  border-bottom: 2px solid #ddd;
  font-weight: 600;
  font-size: 14px;
  color: #555;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.service-code {
  flex: 0 0 110px;
  word-break: break-word;
}

.service-name {
  flex: 1;
  word-break: break-word;
}

.service-price {
  flex: 0 0 140px;
  padding-right: 25px;
  text-align: right;
  white-space: nowrap;
  font-weight: 500;
}

/* ── Список послуг: адаптація під телефони (картки) ──
 * На десктопі 3 колонки (код / назва / ціна) з фікс. ширинами 110+140px,
 * тож на вузькому екрані назві лишається занадто мало місця і таблиця
 * стає нечитабельною. На телефонах кожну послугу робимо окремою карткою:
 * назва — заголовок зверху, під нею код (тег-«пігулка» ліворуч) і
 * ціна (виділена, праворуч). Колонкові заголовки ховаємо.
 * Діє і в архіві, і на сторінці відділення.
 */
@media (max-width: 575px) {
  .services-box .services-header {
    display: none;
  }

  /* Скидаємо смугастий nth-child-фон теми (специфічність 0,4,2),
   * інакше непарні картки лишаться блакитними. */
  .single-departments-box-layout1 .item-content .item-cost ul li:nth-child(odd),
  .single-departments-box-layout1
    .item-content
    .item-cost
    ul
    li:nth-child(even) {
    background: #fff;
  }

  /* Сама картка. Повний ланцюг теми, щоб перекрити її padding (0,3,2). */
  .single-departments-box-layout1 .item-content .item-cost ul li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    margin-bottom: 12px;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  }

  .services-box ul li .service-name {
    flex: 1 1 100%;
    order: 1;
    font-weight: 600;
    font-size: 15px;
    line-height: 1.4;
    color: #222;
  }

  .services-box ul li .service-code {
    flex: 0 0 auto;
    order: 2;
    padding: 3px 10px;
    background: #f1f7fa;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
  }

  /* підпис, щоб було зрозуміло, що це код послуги */
  .services-box ul li .service-code:not(:empty)::before {
    content: 'Код послуги: ';
  }

  /* порожній код не показуємо як пусту пігулку */
  .services-box ul li .service-code:empty {
    display: none;
  }

  .services-box ul li .service-price {
    flex: 0 0 auto;
    order: 3;
    margin-left: auto;
    padding-right: 0;
    white-space: normal;
    font-size: 16px;
    font-weight: 700;
  }
}

/* ── Single-сторінка послуги (тип services) ── */
.service-single-meta {
  margin: 20px 0 25px;
  border: 1px solid #e6ebf1;
  border-radius: 8px;
  overflow: hidden;
}

.service-single-meta .meta-row {
  display: flex;
  gap: 15px;
  padding: 14px 22px;
}

.service-single-meta .meta-row:nth-child(odd) {
  background: #f1f7fa;
}

.service-single-meta .meta-label {
  flex: 0 0 200px;
  font-weight: 600;
  color: #555;
}

.service-single-meta .meta-value {
  flex: 1;
  color: #111;
  word-break: break-word;
}

.service-single-meta .meta-value.price {
  color: #396cf0;
  font-weight: 700;
  font-size: 18px;
  white-space: nowrap;
}

.service-single-content {
  margin-bottom: 25px;
}

.service-single-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.service-single-actions .item-btn i {
  margin-right: 6px;
}

@media (max-width: 575px) {
  .service-single-meta .meta-row {
    flex-direction: column;
    gap: 2px;
    padding: 12px 16px;
  }

  .service-single-meta .meta-label {
    flex: none;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
  }
}

/* ── Fix Magnific Popup Close Button ── */
.mfp-content button.mfp-close {
  width: auto;
  background-color: transparent;
}

/* ── Desktop Search Dropdown ── */
.desktop-search-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  width: 380px;
  background: #fcfcfc;
  box-shadow: 4px 6px 8px rgba(0, 0, 0, 0.12);
  border-radius: 0 0 8px 8px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: all 0.25s ease-in-out;
  z-index: 9999;
}

.desktop-search-dropdown.open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.desktop-search-inner {
  display: flex;
  align-items: center;
  padding: 12px 15px;
  gap: 8px;
}

.desktop-search-input {
  flex: 1;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  padding: 10px 15px;
  font-size: 15px;
  color: #333;
  background: #f8f9ff;
  outline: none;
  box-shadow: none;
}

.desktop-search-input:focus {
  border-color: #396cf0;
  background: #fff;
}

.desktop-search-submit {
  background: #396cf0;
  border: none;
  border-radius: 4px;
  width: 60px;
  height: 42px;
  cursor: pointer;
  transition: background 0.2s;
  flex-shrink: 0;
}

.desktop-search-submit i:before {
  color: #ffffff;
  font-size: 16px;
  margin-left: 0;
}

.desktop-search-submit:hover {
  background: #2756d6;
}

.search-icon-close {
  display: inline-flex;
  align-items: center;
  margin-left: 20px; /* як у flaticon */
}

.search-icon-close svg {
  width: 22px;
  height: 19px;
}

@media (max-width: 1023px) {
  .desktop-search-dropdown {
    display: none;
  }
}

/* ── Топбар (layout-2) + мобільне меню на планшеті (768–1024px) ──
 * Топбар має d-md-block (видимий від 768px), а мобільне меню активне до 1024px,
 * тож у цьому діапазоні топбар стоїть НАД мін-баром і робить хедер вищим, ніж
 * на десктопі. Наслідки, які прибираємо:
 *  1) плаваюча іконка соцмереж «з'їжджала» вгору (float:right при центрованих
 *     контактах) — кладемо весь топбар в один flex-рядок;
 *  2) відкрите меню (.rt-slide-nav: fixed; top:60px) перекривалося хедером, бо
 *     60px розраховані лише на мін-бар без топбару зверху — відкриваємо меню
 *     прямо під мін-баром (absolute; top:100%), незалежно від висоти топбару.
 */
@media (max-width: 1024px) {
  /* Весь вміст топбару — один центрований гнучкий рядок: контакти і соцмережі
   * стоять поряд (іконка вертикально по центру), а не окремими рядками.
   * nowrap + min-width:0 на контактах: якщо адреса+телефон не вміщаються,
   * переноситься САМ текст контактів (на 2 рядки), а іконка лишається поряд,
   * а не «падає» на власний рядок. */
  .header-top-bar.layout-2 .row > .col-sm-12 {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 4px 18px;
  }
  .header-top-bar.layout-2 .tophead-contact {
    float: none;
    flex: 0 1 auto;
    min-width: 0;
  }
  .header-top-bar.layout-2 .tophead-right {
    float: none;
    flex: 0 0 auto;
  }
  /* службовий .clear у flex не потрібен (інакше «ламав» би рядок). */
  .header-top-bar.layout-2 .clear {
    display: none;
  }

  /* Меню «падає» прямо під мін-баром (контейнер #meanmenu = .rt-header-menu). */
  .rt-header-menu {
    position: relative;
  }
  .rt-slide-nav {
    position: absolute;
    top: 100%;
  }
  /* Виняток — «липкий» режим при скролі (JS додає .opt-slideInUp): тоді мін-бар
   * сам стає fixed; top:0, а топбар прокручено, тож повертаємо рідний відступ. */
  .site.site-wrp.opt-slideInUp .rt-slide-nav {
    position: fixed;
    top: 60px;
  }
}

/* ── Топбар (layout-2): парний вивід контактів на десктопі ──
 * Клас .rt-tophead-pairs додається шаблоном header-top-2.php, коли в Theme
 * Options заповнено phone_2 або address_2. DOM-порядок:
 *   addr1, phone1, addr2, phone2, opening
 * Перетворюємо <ul> у 2-колонкову grid (адреса | телефон в одному рядку).
 * Активуємо лише на десктопі (≥1025px), бо на планшеті (768–1024px) вище є
 * власне правило .layout-2, яке стискає топбар у один flex-рядок.
 */
@media (min-width: 1025px) {
  .tophead-contact.rt-tophead-pairs > ul {
    display: grid;
    grid-template-columns: auto auto;
    column-gap: 40px;
    row-gap: 4px;
    align-items: center;
    padding: 0;
    margin: 0;
  }
  .tophead-contact.rt-tophead-pairs > ul > li {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    border: 0;
  }
  /* opening (якщо заповнено) — окремим рядком на всю ширину контактів. */
  .tophead-contact.rt-tophead-pairs > ul > li.rt-tophead-opening {
    grid-column: 1 / -1;
  }
}

/* ── Картки лікарів у відділенні ── */
.single-departments-box-layout1 .item-content .item-specialist .item-img img {
  width: 315px;
  height: 400px;
  max-height: none;
  object-fit: cover;
  object-position: top;
}

.single-departments-box-layout1
  .item-content
  .item-specialist.layout-2
  .media-body {
  top: 50%;
}

/* ── Departments Slider (Style 3): однакова висота карток ──
 * Owl Carousel за замовчуванням не вирівнює висоту слайдів, тож при
 * назвах різної довжини (1–3 рядки) сусідні картки різні. Робимо
 * .owl-stage/.owl-item flex-контейнерами, щоб картка тягнулась на 100%.
 * Скоуп — лише обгортка .rt-equal-height (маркер на view Style 3).
 */
.rt-equal-height .owl-carousel .owl-stage {
  display: flex;
}

.rt-equal-height .owl-carousel .owl-item {
  display: flex;
}

.rt-equal-height .owl-item .rtin-item {
  display: flex;
  width: 100%;
}

.rt-equal-height .rtin-item > .departments-box-layout4 {
  display: flex;
  flex-direction: column;
  width: 100%;
}

/* ── Синя skew-підкладка слайдера: адаптивні висота + ширина ──
 * У батьківській темі .skewbg має жорсткі height/width у px на кожному
 * брейкпоінті, тож розмір стрибає сходинками і не співпадає з реальними
 * картками (iPad Air і iPad Pro потрапляють в один брейкпоінт).
 * Замість сходинок робимо плавний розмір через clamp() + vw. Обидва
 * виміри прив'язані до vw в одній пропорції (35.16 / 77.6 ≈ 0.453),
 * тож блок масштабується цілісно, зберігаючи форму:
 *   при 1024px (iPad Pro) → ~360×795px, пропорційно менше вниз (Air, телефони).
 * Перекриває всі px-правила теми ≤1024.
 */
@media only screen and (max-width: 1024px) {
  .skewbg {
    height: clamp(140px, 35.16vw, 360px);
    width: clamp(240px, 77.6vw, 795px);
  }
}
/* skewbg: тема не задає width вище 1640px → блок стискається до контенту */
@media only screen and (min-width: 1641px) {
  .skewbg {
    width: 650px;
    height: 450px;
  }
}

/* ── Сторінка "Відділення": однакова висота карток ──
 * Картки лежать у Bootstrap-сітці, колонки float, тож при різній довжині
 * назви (1–3 рядки) сусідні картки різної висоти. Робимо ряд flex-
 * контейнером — колонки тягнуться до висоти найвищої в ряду, а картка
 * .departments-box-layout4 (на ній фон/padding) заповнює колонку.
 *
 * Покриваємо два варіанти виводу:
 *  1) Elementor-віджет Departments  → .rt-departments .menu-list > .rtin-item.col-*
 *  2) WP-архів (template archive)   → .rt-departments-archive .auto-clear > .col-* > article
 */
.rt-departments .menu-list,
.rt-departments-archive .auto-clear {
  display: flex;
  flex-wrap: wrap;
}

.rt-departments .menu-list > .rtin-item,
.rt-departments-archive .auto-clear > [class*='col-'] {
  display: flex;
}

.rt-departments-archive .auto-clear > [class*='col-'] > article {
  display: flex;
  width: 100%;
}

.rt-departments .menu-list > .rtin-item > .departments-box-layout4,
.rt-departments-archive article > .departments-box-layout4 {
  width: 100%;
}

/* Резервуємо квадрат 60×60 під іконку (тема задає лише width:60px, без
 * висоти), щоб .icon-img тримала місце ще до завантаження картинки —
 * інакше при першому показі картки "стрибають" (layout shift). */
.departments-box-layout4 .box-content .icon-img img {
  width: 60px;
  height: 60px;
  object-fit: contain;
}

/* ── Картки-посилання "Дізнайтеся більше" (info-box style11) ──
 * Клас rt-column-sticky-min-1024 робить колонку sticky + align-self:flex-start
 * (≥1025px), що заважає рівній висоті. Для колонок з info-box нейтралізуємо це
 * (через :has, не чіпаючи справжні сайдбари) і розкладаємо .media вертикально:
 * іконка → заголовок → стрілка, з виділенням у вигляді картки.
 */
@media (min-width: 1025px) {
  .rt-column-sticky-min-1024:has(.rt-el-info-box.rtin-style11) {
    position: static !important;
    align-self: stretch !important;
    top: auto !important;
  }
}

/* однакова висота колонок (рівний ряд) */
.rt-column-sticky-min-1024:has(.rt-el-info-box.rtin-style11)
  .elementor-widget-wrap,
.rt-column-sticky-min-1024 .elementor-widget-rt-info-box,
.rt-column-sticky-min-1024
  .elementor-widget-rt-info-box
  .elementor-widget-container {
  height: 100%;
}

/* вертикальний вирівняний стек + картка */
.rt-column-sticky-min-1024 .rt-el-info-box.rtin-style11 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  gap: 18px;
  height: 100%;
  margin: 0;
  padding: 28px 26px;
  background: #fff;
  border: 1px solid #eef1f6;
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(40, 50, 80, 0.05);
  transition:
    box-shadow 0.3s ease,
    transform 0.3s ease;
}

.rt-column-sticky-min-1024 .rt-el-info-box.rtin-style11:hover {
  box-shadow: 0 12px 28px rgba(40, 50, 80, 0.1);
  transform: translateY(-3px);
}

/* тема робить .media-body горизонтальним рядком (space-between, gap:60px) —
   перебудовуємо у вертикальний стек без розриву */
.rt-column-sticky-min-1024 .rtin-style11 .media-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  width: 100%;
  margin: 0;
}

.rt-column-sticky-min-1024 .rtin-style11 .rt-content {
  width: 100%;
}

/* прибираємо Elementor-овий margin-left:24px на .rtin-content (він з горизонтального
   layout), щоб заголовок/стрілка вирівнялись із іконкою по лівому краю картки */
.rt-column-sticky-min-1024 .rtin-style11 .rtin-content {
  margin-left: 0 !important;
}

/* стрілка одразу під заголовком */
.rt-column-sticky-min-1024 .rtin-style11 .rt-readmore {
  margin: 0;
}

/* ── Заокруглення лінії розділювача Elementor ── */
.elementor-divider-separator {
  border-radius: 4px;
}

/* ── CTA "Понад 30 відділень": поведінка картинки на вузьких екранах ──
 * Тема притискає .item-img до правого краю контейнера з текстом
 * (right: calc((100%-1110px)/2) на ≤1399px), тож на ноутбуках вона занадто
 * близько до тексту, а на планшеті (≤991px) лізе під текст.
 * Ноутбуки (992–1399px): зсуваємо картинку до краю екрана (right:0).
 * Планшет і нижче (≤991px): ховаємо картинку.
 * Скоуп — лише ваш клас .departments-call-to-action.
 */
@media only screen and (min-width: 992px) and (max-width: 1399px) {
  .departments-call-to-action .call-to-action-wrap-layout4 .item-img {
    right: 0;
  }
}

@media only screen and (max-width: 991px) {
  .departments-call-to-action .call-to-action-wrap-layout4 .item-img {
    display: none;
  }
}

/* ── Телефонний довідник (шорткод [phone_directory]) */
.contacts-directory {
  background: #fff;
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(20, 40, 80, 0.06);
  overflow: hidden;
}

/* шапка — світлий рядок (лише пошук + опційний заголовок) */
.contacts-directory__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 20px;
  padding: 16px 20px;
  border-bottom: 1px solid #eef0f4;
}

.contacts-directory__title {
  font-weight: 700;
  font-size: 18px;
  line-height: 1.2;
  color: #212a3a;
}

/* поле пошуку */
.contacts-directory__search-wrap {
  position: relative;
  flex: none;
}

.contacts-directory__search-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #9aa3b2;
  font-size: 13px;
  pointer-events: none;
}

.contacts-directory__search {
  width: 320px;
  max-width: 60vw;
  height: 42px;
  padding: 0 16px 0 36px;
  border: 1px solid #d8dee8;
  border-radius: 4px;
  background: #fff;
  color: #333;
  font-size: 14px;
  outline: none;
}

.contacts-directory__search::placeholder {
  color: #9aa3b2;
}

.contacts-directory__search:focus {
  border-color: #396cf0;
  box-shadow: 0 0 0 3px rgba(57, 108, 240, 0.15);
}

.contacts-directory__scroll {
  overflow-x: auto;
}

.contacts-table {
  width: 100%;
  min-width: 760px;
  margin: 0;
  border-collapse: collapse;
  font-size: 16px;
  color: #3a4456;
}

/* шапка таблиці */
.contacts-table thead th {
  padding: 15px 22px;
  text-align: left;
  background: #f6f8fc;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  color: #6b7585;
  border-bottom: 1px solid #e6eaf1;
  white-space: nowrap;
}

/* комірки. Базовий розмір 14px — інакше колонки з телефонами успадкували б
 * 16px від .contacts-table й виглядали б більшими за посаду/ПІБ. */
.contacts-table td {
  padding: 15px 22px;
  text-align: left;
  vertical-align: middle;
  font-size: 14px;
  border-bottom: 1px solid #eef0f4;
}

/* 1-а колонка — посада (рядки без класу): 14px, не жирна.
 * :not(.contacts-section):not(.contacts-highlight) — щоб НЕ перебивати стиль
 * розділів і виділених рядків (їх td теж :first-child, інакше це правило
 * виграло б за специфічністю). */
.contacts-table
  tbody
  tr:not(.contacts-section):not(.contacts-highlight)
  td:first-child {
  font-weight: 400;
  font-size: 14px;
  color: #2a3344;
  line-height: 1.45;
}

/* 2-а колонка — ПІБ */
.contacts-table tbody td:nth-child(2) {
  font-size: 14px;
  color: #5a6475;
}

/* hover звичайних рядків (розділи не зачіпаємо) */
.contacts-table tbody tr:not(.contacts-section):hover {
  background: #f6f8fc;
}

/* рядок-розділ (без іконок) — назва розділу: жирний (700), UPPERCASE, 14px.
 * Посади поряд — 400 (не жирні), тож контраст ваги явний навіть якщо шрифт
 * теми має лише 400/700. */
.contacts-table tbody tr.contacts-section td {
  padding: 12px 22px;
  background: #f8f8f8;
  border-bottom: 1px solid #dbe3fb;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

/* tel:-посилання */
.contacts-table a[href^='tel:'] {
  color: #1c58ef;
  font-weight: 500;
  white-space: nowrap;
  text-decoration: none;
}

.contacts-table a[href^='tel:']:hover {
  text-decoration: underline;
}

/* виділений рядок */
.contacts-table .contacts-highlight {
  background: #fdf3dd;
}

.contacts-table .contacts-highlight:hover {
  background: #fbecc6;
}

.contacts-table .contacts-highlight td {
  border-bottom-color: #f3e6c2;
  font-size: 14px;
}

.contacts-table .contacts-highlight td:first-child {
  color: #5a4a1e;
  font-weight: 700;
}

.contacts-table .contacts-highlight a[href^='tel:'] {
  color: #9a7b1e;
  font-weight: 700;
}

/* порожній стан пошуку (показує JS) */
.contacts-directory__empty {
  display: none;
  padding: 44px 22px;
  text-align: center;
  color: #8a93a3;
  font-size: 18px;
}

/* На десктопі (≥992px) номери НЕ клікабельні — звичайний текст.
 * Клік (tel:) лишається тільки на планшеті/мобільному (≤991px).
 * Через CSS (не визначення пристрою), щоб не ламалось кешем. */
@media (min-width: 992px) {
  .contacts-table a[href^='tel:'] {
    color: inherit;
    font-weight: inherit;
    text-decoration: none;
    pointer-events: none;
    cursor: text;
  }
}

/* ── Пошук по відділеннях у віджеті Departments (.dep-search) ──
 * Поле інжектиться JS-ом (departments-search.js) над сіткою; фільтрує
 * картки клієнтсько. Вигляд 1:1 як пошук платних послуг: біла картка-блок
 * (.team-search-box) з полем #f1f7fa всередині. Кнопки немає — пошук «живий».
 * Стилі лише для віджета з класом .dep-search. */
.dep-search .dep-search-bar {
  margin: 0 0 40px;
  padding: 20px;
  background-color: #fff;
  box-shadow: 0 1px 2px 0 rgba(194, 205, 211, 0.75);
  border-radius: 4px;
}

.dep-search .dep-search-input {
  width: 100%;
  height: 50px;
  padding: 5px 20px;
  background-color: #f1f7fa;
  border: 1px solid #f1f7fa;
  border-radius: 4px;
  font-size: 16px;
  color: #111;
  outline: none;
  transition:
    border-color 0.2s ease,
    background-color 0.2s ease;
}

.dep-search .dep-search-input::placeholder {
  color: #7a8694;
}

/* Колір плейсхолдера пошуку платних послуг такий самий, як у пошуку
 * відділень. Батьківська тема ставить #111111 (темний) із вендорними
 * префіксами — перекриваємо тими ж селекторами (дочірня тема грузиться пізніше). */
.team-search-box input.form-control::-webkit-input-placeholder {
  color: #7a8694;
}
.team-search-box input.form-control::-moz-placeholder {
  color: #7a8694;
}
.team-search-box input.form-control:-moz-placeholder {
  color: #7a8694;
}
.team-search-box input.form-control:-ms-input-placeholder {
  color: #7a8694;
}
.team-search-box input.form-control::placeholder {
  color: #7a8694;
}

.dep-search .dep-search-empty {
  padding: 30px 0;
  text-align: center;
  color: #8a93a3;
  font-size: 18px;
}

/* Розкладкою цього грида керує Isotope (абсолютне позиціонування), тож
 * прибираємо flex рівних висот — інакше конфлікт. Однакову висоту карток
 * забезпечує JS (min-height по найвищій картці) у departments-search.js. */
.dep-search .rt-departments .menu-list,
.dep-search .rt-departments .menu-list > .rtin-item {
  display: block;
}

/* ── Фікс розміру шрифту для номера телефона в футері */
.widget.widget_medilink_about ul li a {
  font-size: 16px;
}


@media (max-width: 991.98px) {
    #department-lode-area {
        flex-wrap: wrap;
    }
    #department-lode-area > .rt-content {
        order: 1;
    }
    #department-lode-area > .rt-sidebar {
        order: 2;
    }
}




.step-number {
    position: relative;
}
.step-number::after {
    content: '';
    position: absolute;
    top: 64px;
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    height: stretch;
    background-color: #e1e6ee;
}
.step-number.step-last::after {
    display: none;
}

/* ── Фікс переносу слів заголовку сторінки в breadcrumbs */
.entry-banner .inner-page-banner .breadcrumbs-area h1 {
	word-break: normal;
}

/* ── Соц-іконки в мобільному барі (.header-action-items) ──
 * Виводяться з template-parts/header/header-offscreen.php, коли
 * Mobile Header Layout = 2 і "Header Top social in mobile" увімкнено.
 * Клас .header-social-layout1 на обгортці дає ті самі стилі іконок, що й на
 * десктопі (правила теми глобальні). Тут лише прибираємо зайву min-height,
 * скидаємо маркери списку та трохи зсуваємо блок ліворуч від кнопки пошуку. */
.mean-bar .header-action-items > li.rt-mobile-social {
  min-height: auto;
  margin-right: 14px;
}
.mean-bar .rt-mobile-social .tophead-social {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}
