/* ---------------------------------------------------------------------------
 * Базовая тема сайта.
 * Стили Bootstrap заменены темой Bootswatch Minty (подключается в layout'ах
 * вместо bootstrap.min.css), поэтому все цвета берём из CSS-переменных темы:
 * primary #78c2ad, текст #888, заголовки #5a5a5a, границы #eceeef,
 * светлый фон #f8f9fa. Значения переменных при необходимости меняются
 * централизованно — здесь их дублировать не нужно.
 * ------------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------
 * Фон страницы и «поверхности» (колонка с контентом).
 * Значения зависят от темы, поэтому переключатель светлая/тёмная действует и
 * на основной блок с контентом: в светлой теме — светлый фон страницы и белая
 * колонка, в тёмной — тёмный фон страницы и чуть более светлая колонка
 * (так принято в тёмных темах Bootstrap).
 * ------------------------------------------------------------------------- */
:root {
    --np-page-bg: var(--bs-tertiary-bg);
    --np-surface-bg: var(--bs-body-bg);
}
[data-bs-theme="dark"] {
    --np-page-bg: var(--bs-dark-bg-subtle);
    --np-surface-bg: var(--bs-body-bg);
}
body {
    /* В теме Minty текст — системный sans-serif, заголовки/меню/кнопки —
       Montserrat (задано в bootstrap.min.css темы). Если нужно вернуть
       прежний шрифт сайта, раскомментируйте строку ниже.
       font-family: Georgia, "Times New Roman", Times, serif; */
    color: var(--bs-body-color);
    background-color: var(--np-page-bg);
    /* Sticky-footer на flexbox: футер прижат к низу окна, если контента мало,
       и растягивается вместе с контентом, если его много. Раньше футер был
       position:absolute с фиксированной высотой 80px, и на мобильных
       переносы строк вылезали за его заливку. */
    display: flex;
    flex-direction: column;
    min-height: 100%;
    margin-bottom: 0;
}
footer {box-shadow: none;}
.container-main {
    width: 100%;
    max-width: 1280px;
    background-color: var(--np-surface-bg);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
    /* Занимает всё свободное место по высоте — это и прижимает футер вниз. */
    flex: 1 0 auto;
    /* Отступ контента от меню (раньше страницы без хлебных крошек начинались
       вплотную к шапке). 1.5rem = 24px, значение легко изменить. */
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}
/* Хлебные крошки: отступ сверху теперь задаёт сам .container-main,
   поэтому собственный margin у крошек не нужен. */
.container-main .breadcrumb {margin-top: 0;}
.menu {
    box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.15);
    background-color: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
    border-radius: 0px;
}
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6{margin-top:0;color:var(--bs-heading-color);}
/* Длинный h1 переносится на следующую строку, а не обрезается многоточием.
   Раньше в шаблонах стоял inline-стиль text-overflow:ellipsis;overflow:hidden,
   из-за чего длинный заголовок скрывался за краем блока. */
h1, .h1{overflow:visible;text-overflow:clip;white-space:normal;overflow-wrap:break-word;}

/* ---------------------------------------------------------------------------
 * Ссылки: подчёркивания нет, оно появляется только при наведении/фокусе.
 * Исключения — элементы, которые визуально являются кнопками и навигацией:
 * им подчёркивание не нужно ни в каком состоянии.
 * ------------------------------------------------------------------------- */
/* Цвет ссылок — только для светлой темы: обычная ссылка #407f65, при наведении
   и в фокусе #408368. Тема Minty берёт цвет из primary (#78c2ad), мы задаём свои
   оттенки переменными темы, поэтому их подхватывают все ссылки — текст, хлебные
   крошки, пагинация, ссылки в карточках и комментариях.
   Селектор с :not([data-bs-theme="dark"]) нужен, потому что правила тёмной темы
   в Bootstrap имеют такую же специфичность, как :root: иначе наши цвета попали
   бы и в тёмную тему. */
:root:not([data-bs-theme="dark"]) {
    --bs-link-color: #407f65;
    --bs-link-color-rgb: 64, 127, 101;
    --bs-link-hover-color: #408368;
    --bs-link-hover-color-rgb: 64, 131, 104;
}

a {
    text-decoration: none;
}
a:hover,
a:focus {
    text-decoration: underline;
}
.btn,
.btn:hover,
.btn:focus,
.nav-link,
.nav-link:hover,
.nav-link:focus,
.navbar-brand,
.navbar-brand:hover,
.navbar-brand:focus,
.dropdown-item,
.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-toggle,
.page-link,
.page-link:hover,
.page-link:focus,
.list-group-item,
.list-group-item:hover,
.list-group-item:focus,
.badge {
    text-decoration: none;
}

/* ---------------------------------------------------------------------------
 * Переключатель темы (кнопка в меню) и служебный класс для замера ширины
 * пунктов меню (см. скрипт автосвёртки меню в /js/functions.js).
 * ------------------------------------------------------------------------- */
.np-theme-toggle {
    cursor: pointer;
    line-height: 1;
    color: var(--bs-body-color);
}
.np-theme-toggle:hover,
.np-theme-toggle:focus {
    color: var(--bs-link-color);
}
.np-theme-toggle .bi {
    font-size: 1.05rem;
    vertical-align: -.125em;
}
.navbar .np-theme-toggle {
    color: var(--bs-navbar-color);
}
.navbar .np-theme-toggle:hover,
.navbar .np-theme-toggle:focus {
    color: var(--bs-navbar-hover-color);
}
/* Блок счётчиков и кнопки темы в шапке: виден на мобильных (меню свёрнуто
   всегда) и на любой ширине, когда меню свёрнуто в бургер (класс navbar-expand
   снимает скрипт автосвёртки). Развёрнутое меню показывает кнопку темы внутри
   .navbar-nav, поэтому в шапке она в этом случае не нужна. */
.np-header-mobile {
    display: none;
    /* .nav-link вне .navbar-nav идёт без паддингов, поэтому раньше кнопка темы
       липла к бургеру — задаём отступы сами. */
    gap: .5rem;
    margin-right: .75rem;
}
.np-navbar:not(.navbar-expand) .np-header-mobile {
    display: flex;
}
@media (max-width: 767.98px) {
    .np-header-mobile {
        display: flex;
    }
}
/* На время измерения пункты не должны сжиматься и переносить текст, иначе
   замеренная ширина окажется меньше реальной. */
.np-navbar.np-navbar-measure .navbar-nav .nav-item {
    flex-shrink: 0;
}
.np-navbar.np-navbar-measure .navbar-nav .nav-link {
    white-space: nowrap;
}
/* В тёмной теме тень под колонкой контента не видна — отключаем её */
[data-bs-theme="dark"] .container-main {
    box-shadow: none;
}
@media (min-width:1200px){.container{width:970px;}
}
.blog-masthead{background-color:#428bca;box-shadow:inset 0 -2px 5px rgba(0,0,0,.1);}
.blog-nav-item{position:relative;display:inline-block;padding:10px;font-weight:500;color:#cdddeb;}
.blog-nav-item:hover,
.blog-nav-item:focus{color:#fff;text-decoration:none;}
.blog-nav .active{color:#fff;}
.blog-nav .active:after{position:absolute;bottom:0;left:50%;width:0;height:0;margin-left:-5px;vertical-align:middle;content:" ";border-right:5px solid transparent;border-bottom:5px solid;border-left:5px solid transparent;}
.blog-header{padding-top:20px;padding-bottom:20px;}
.blog-title{margin-top:30px;margin-bottom:0;font-size:60px;font-weight:normal;}
.blog-description{font-size:20px;color:#999;}
.blog-main{font-size:18px;line-height:1.5;}
.sidebar-module{padding:15px;margin:0 -15px 15px;}
.sidebar-module-inset{padding:15px;background-color:var(--bs-tertiary-bg);border-radius:4px;}
.sidebar-module-inset p:last-child,
.sidebar-module-inset ul:last-child,
.sidebar-module-inset ol:last-child{margin-bottom:0;}
.pager{margin-bottom:60px;text-align:left;}
.pager > li > a{width:140px;padding:10px 20px;text-align:center;border-radius:30px;}
.blog-post{margin-bottom:60px;}
.blog-post-title{margin-bottom:5px;font-size:40px;}
.blog-post-meta{margin-bottom:20px;color:#999;}
.blog-footer{padding:40px 0;color:#999;text-align:center;background-color:#f9f9f9;border-top:1px solid #e5e5e5;height: 60px;}
.error{color:red;}
.desc_table{font-size:14px;border-spacing:0;text-align:left;}
.desc_th{background:var(--bs-tertiary-bg);padding:10px 20px;}
.desc_th, .desc_td{border-style:solid;border-width:0 2px 2px 0;border-color:var(--bs-body-bg);}
.desc_th:first-child, .desc_td:first-child{text-align:left;}
.desc_th:first-child{}
.desc_th:last-child{border-right:none;}
.desc_td{padding:10px 20px;background:var(--bs-tertiary-bg);}
.desc_td:first-child{background:var(--bs-secondary-bg);}
.desc_th:first-child{background:var(--bs-secondary-bg);}
.desc_tr:last-child .desc_td:first-child{}
.desc_tr:last-child .desc_td:last-child{}
.desc_tr .desc_td:last-child{border-right:none;}

.thisperson{border:3px solid grey;padding:7px;}
.row{margin-top:2px;}
.bordered{overflow-y:auto;}
html{position:relative;height:100%;}
/* Футер — обычный блок в конце flex-колонки body (см. правило body выше).
   Высота auto: раньше она была жёстко 80px, из-за чего заливка не покрывала
   перенесённый на мобильных текст. */
.footer{
    flex-shrink:0;
    width:100%;
    height:auto;
    padding:1rem 0;
    background-color:var(--bs-tertiary-bg);
    border-top:1px solid var(--bs-border-color);}
.footer p{margin-bottom:0;}
.favorites, #empty_star{height:35px;cursor:pointer;}
.column{-webkit-column-width:200px;-moz-column-width:200px;column-width:200px;-webkit-column-count:3;-moz-column-count:3;column-count:3;-webkit-column-gap:30px;-moz-column-gap:30px;column-gap:30px;margin-top:15px;margin-bottom:15px;}
.column4{-webkit-column-width:150px;-moz-column-width:150px;column-width:150px;-webkit-column-count:4;-moz-column-count:4;column-count:4;-webkit-column-gap:30px;-moz-column-gap:30px;column-gap:30px;margin-top:15px;margin-bottom:15px;}
.alphabet_ukazatel{margin-top:10px;margin-bottom:15px;}
.description{font-size:14pt; word-wrap: break-word; word-break: normal; word-break: break-word; -ms-word-break:break-all;}
img.banner{width:100%;}
/* Подпись слайда лежит поверх фотографии, поэтому текст всегда белый: в тёмной
   теме Minty подставляет --bs-carousel-caption-color:#000 и подпись на снимке
   становится нечитаемой. */
.carousel-caption{color:#fff;}
/* Подпись слайда карусели — тоже ссылка на документ: на мобильных подпись
   закрывает картинку, и без ссылки в тексте перейти по баннеру было нельзя.
   Цвет наследуется от .carousel-caption (белый), подчёркивание — по наведению. */
.carousel-caption a{color:inherit;text-decoration:none;}
.carousel-caption a:hover,
.carousel-caption a:focus{color:inherit;text-decoration:underline;}
.panel-letter {-webkit-box-shadow: 5px 5px 5px -5px rgba(34, 60, 80, 0.6);
-moz-box-shadow: 5px 5px 5px -5px rgba(34, 60, 80, 0.6);
box-shadow: 5px 5px 5px -5px rgba(34, 60, 80, 0.6);}
.message {word-wrap: break-word; word-break: normal; word-break: break-word;-ms-word-break:break-all;}
.message > img{max-width: 100%;}
.message > div > img{max-width: 100%;}
.letters_lenta {/*-webkit-box-shadow: 3px 3px 5px -5px rgba(34, 60, 80, 0.6) inset;
-moz-box-shadow: 3px 3px 5px -5px rgba(34, 60, 80, 0.6) inset;
box-shadow: 3px 3px 5px -5px rgba(34, 60, 80, 0.6) inset;*/
  height: 80%;
  overflow: auto;
  /*width: 200px;*/

}
/* Подменю страниц (локации, церкви, профиль, архив): пункты переносятся по
   строкам, а длинные названия — внутри своей колонки. Так они не вылезают за
   границы блока и не наезжают на соседей (было сломанное nowrap). */
.submenu{text-align: center;}
.submenu > div{min-width: 0; overflow-wrap: anywhere;}
.submenu a{overflow-wrap: anywhere;}

/* В кабинете подменю из семи разделов, поэтому шрифт там меньше — иначе
   пункты распирают строку и «слипаются». */
.submenu-home{font-size: 12pt;}

.np-header-mobile{flex-wrap: wrap; row-gap: .25rem;}
.np-header-mobile .nav-link{white-space: nowrap;}
.tab-pane{padding-top: 10px; padding-bottom: 10px;}
h2.collapseHead{font-size: 14pt; margin-bottom: 3px;}
div.link { border-radius: 5px; border: 1px solid #1e2460; }
/* Блоки ссылок (bs5.blocks.link / links / external_link / fs_link,
   location_address_list, archive/document3, church — данные из links и
   external_links): в тёмной теме рамка тёмно-зелёная, в светлой — как была. */
[data-bs-theme="dark"] div.link { border: 1px solid #164a23; }
div.link:hover{-webkit-transform: scale(1.01); -ms-transform: scale(1.01); transform: scale(1.01);}
/* @font-face 'Arvo' удалён: шрифт нигде не использовался, а файл тянулся
   с fonts.gstatic.com (внешний запрос). См. локальный Montserrat в
   /vendor/fonts/montserrat/. */

.block-with-text {
    display: block;
    display: -webkit-box;
    height: 100px;
    /* max-width: 200px; */
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

a.masked {
color: var(--bs-body-color); cursor: pointer; text-decoration: none;
}
a.masked:hover {
	color: var(--bs-body-color); cursor: pointer; text-decoration: none;
}
a.masked:visited {
	color: var(--bs-body-color); cursor: pointer; text-decoration: none;
}

ul.pagination {text-align: center;}
ul.pagination li span, ul.pagination li a {
	padding: 6px 6px;
}

table.revision {
  margin: 100px 0px 30px 0px;
  font-style: italic;
  width: 100%;
}

table.revision td {
  border-bottom: 1px solid var(--bs-border-color);
  padding: 5px;
}

table.touchable tbody>tr {
  cursor: pointer;
}

.dropdown-submenu {
    position:relative;
}
.dropdown-submenu>.dropdown-menu {
    top:0;
    left:100%;
    margin-top:-6px;
    margin-left:-1px;
    -webkit-border-radius:0 6px 6px 6px;
    -moz-border-radius:0 6px 6px 6px;
    border-radius:0 6px 6px 6px;
}
.dropdown-submenu:hover>.dropdown-menu {
    display:block;
}
.dropdown-submenu>a:after {
    display:block;
    content:" ";
    float:right;
    width:0;
    height:0;
    border-color:transparent;
    border-style:solid;
    border-width:5px 0 5px 5px;
    border-left-color:#cccccc;
    margin-top:5px;
    margin-right:-10px;
}
.dropdown-submenu:hover>a:after {
    border-left-color:#ffffff;
}
.dropdown-submenu.pull-left {
    float:none;
}
.dropdown-submenu.pull-left>.dropdown-menu {
    left:-100%;
    margin-left:10px;
    -webkit-border-radius:6px 0 6px 6px;
    -moz-border-radius:6px 0 6px 6px;
    border-radius:6px 0 6px 6px;
}

.panel-footer-success,
.card-footer-success {
    background: var(--bs-success-bg-subtle);
}

/* ---------------------------------------------------------------------------
 * Шим для классов .media*: в Bootstrap 5 блок .media удалён, а разметка
 * проекта (комментарии, карточки пользователей) на нём построена.
 * Классы .media-list/.media-body/.media-text используются в comments.css.
 * ------------------------------------------------------------------------- */
.media {
    display: flex;
    align-items: flex-start;
    width: 100%;
}
.media > .media-left,
.media > .flex-shrink-0 {
    margin-right: 10px;
}
.media-body {
    flex: 1 1 auto;
    min-width: 0;
}
.media-object {
    display: block;
    max-width: none;
}
.media-heading {
    margin-top: 0;
    margin-bottom: 5px;
}
.media-list {
    width: 100%;
    padding-left: 0;
    list-style: none;
}

/* Bootstrap 3 -> 5: заголовок панели/страницы */
.page-header {
    padding-bottom: 9px;
    margin: 40px 0 20px;
    border-bottom: 1px solid var(--bs-border-color);
}


/* ---------------------------------------------------------------------------
 * Cookie-баннер и настройки cookie (152-ФЗ, требования РКН 2026)
 * ------------------------------------------------------------------------- */
.cookie-banner {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1080;
    background: var(--bs-body-bg);
    border-top: 1px solid var(--bs-border-color);
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.08);
    padding: 12px 16px;
}

.cookie-banner__inner {
    max-width: 1320px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
}

.cookie-banner__text {
    flex: 1 1 520px;
}

.cookie-banner__title {
    margin-bottom: 4px;
}

.cookie-banner__message {
    margin-bottom: 0;
    font-size: 0.875rem;
    color: var(--bs-secondary-color);
}

.cookie-banner__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 0;
}

.cookie-settings {
    margin-bottom: 0;
}

.cookie-settings__row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid var(--bs-border-color);
}

.cookie-settings__info {
    flex: 1 1 520px;
}

.cookie-settings__info p {
    margin-bottom: 0;
    font-size: 0.875rem;
    color: var(--bs-secondary-color);
}

.cookie-settings__control {
    flex: 0 0 auto;
}

.cookie-settings__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 12px;
}

/* Настройки участника (/home/settings): строки-карточки со свитчами — тот же
   вид, что у блока согласий на cookie ниже на этой же странице. */
.settings-title {
    margin: 1.25rem 0 0.25rem;
    font-size: 1.15rem;
}

.settings-list {
    border-top: 1px solid var(--bs-border-color);
}

.settings-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid var(--bs-border-color);
}

.settings-info {
    flex: 1 1 520px;
}

.settings-info p {
    margin-bottom: 0;
    font-size: 0.875rem;
    color: var(--bs-secondary-color);
}

.settings-control {
    flex: 0 0 auto;
}

.settings-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 16px;
}

@media (max-width: 767.98px) {
    .cookie-banner__inner {
        flex-direction: column;
        align-items: flex-start;
    }
    /* В колоночном контейнере flex-basis 520px задаёт не ширину, а ВЫСОТУ блока:
       баннер растягивался на весь экран и перекрывал содержимое страницы
       (в том числе карусель на главной). */
    .cookie-banner__text,
    .settings-info {
        flex: 0 1 auto;
    }
}

/* ---------------------------------------------------------------------------
 * Баннер режима «только чтение» (config/site.php, SITE_READ_ONLY)
 *
 * Показывается под верхним меню на всех страницах, когда включён режим
 * «только чтение»: пользователь заранее видит, что записи не сохранятся.
 * Сама блокировка запросов — /js/np-readonly.js.
 * ------------------------------------------------------------------------- */
.np-read-only-banner {
    padding: 10px 16px;
    background-color: var(--bs-warning-bg-subtle);
    border-bottom: 1px solid var(--bs-warning-border-subtle);
}

.np-read-only-banner__inner {
    max-width: 1280px; /* как .container-main — баннер выровнен с контентом сайта */
    margin: 0 auto;
}

.np-read-only-banner__icon {
    flex: 0 0 auto;
    font-size: 1.15rem;
    line-height: 1.5;
    color: var(--bs-warning-text-emphasis);
}

.np-read-only-banner__title,
.np-read-only-banner__message {
    margin-bottom: 0;
}

.np-read-only-banner__title {
    margin-bottom: 2px;
    font-size: 0.9375rem;
}

.np-read-only-banner__message {
    font-size: 0.875rem;
}

/* ---------------------------------------------------------------------------
 * Окно подтверждения документов (Пользовательское соглашение, Политика ПДн)
 * ------------------------------------------------------------------------- */
.documents-notice {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1090;
    background: var(--bs-warning-bg-subtle);
    border-top: 2px solid var(--bs-warning);
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.12);
    padding: 12px 16px;
}

.documents-notice__inner {
    max-width: 1320px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
}

.documents-notice__text {
    flex: 1 1 520px;
}

.documents-notice__title {
    margin-bottom: 4px;
}

.documents-notice__message {
    margin-bottom: 0;
    font-size: 0.875rem;
    color: var(--bs-secondary-color);
}

.documents-notice__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

@media (max-width: 767.98px) {
    .documents-notice__inner {
        flex-direction: column;
        align-items: flex-start;
    }
    /* см. комментарий у .cookie-banner__text: в колонке flex-basis — это высота */
    .documents-notice__text {
        flex: 0 1 auto;
    }
}

/* ---------------------------------------------------------------------------
 * Ссылки внутри alert-сообщений.
 *
 * Bootstrap 5.3 задаёт .alert-link цветом варианта алерта
 * (color: var(--bs-alert-link-color)), из-за чего в тёмной теме ссылка
 * становилась почти неотличимой от фона. Ниже — явный цвет для светлой
 * и тёмной темы; файл подключается после bootstrap.min.css, поэтому
 * правило перекрывает вариант алерта (селектор с .alert-link специфичнее).
 * ------------------------------------------------------------------------- */
.alert a,
.alert a:visited,
.alert a.alert-link {
    color: #0a58ca;
    text-decoration: underline;
}

.alert a:hover,
.alert a:focus,
.alert a.alert-link:hover,
.alert a.alert-link:focus {
    color: #084298;
}

[data-bs-theme="dark"] .alert a,
[data-bs-theme="dark"] .alert a:visited,
[data-bs-theme="dark"] .alert a.alert-link {
    color: #9ec5fe;
}

[data-bs-theme="dark"] .alert a:hover,
[data-bs-theme="dark"] .alert a:focus,
[data-bs-theme="dark"] .alert a.alert-link:hover,
[data-bs-theme="dark"] .alert a.alert-link:focus {
    color: #cfe2ff;
}

/* Форма-действие внутри окна документов: название документа + кнопка в одну строку */
.documents-notice__form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 0;
}

.documents-notice__link {
    font-size: 0.875rem;
}

/* Яндекс.Карты: фон контейнера до загрузки тайлов.
   Рендерер отдаёт тёмные тайлы (см. /js/np_map_theme.js), но фон под ними
   задаёт CSS JS API — в тёмной теме он светлый и заметно мигает при загрузке. */
[data-bs-theme="dark"] .ymaps-2-1-79-map-bg {
    background-color: #2b313a;
}

/* ---------------------------------------------------------------------------
 * Таблица упоминаний (/vklad/mentions).
 *
 * На широких экранах это привычные шесть колонок, на узких они сворачиваются
 * в две: «Событие» (документ, событие, дата) и «Упоминание» (роль, ФИО,
 * откуда) — см. mentions_rows.blade.php. Значения подписаны, чтобы в одной
 * ячейке было понятно, что есть что.
 * ------------------------------------------------------------------------- */
.np-mention-part + .np-mention-part {
    margin-top: 6px;
}

.np-mention-label {
    display: block;
    font-size: 0.72rem;
    line-height: 1.2;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--bs-secondary-color, #6c757d);
}

@media (max-width: 991.98px) {
    .np-mentions-table {
        font-size: 0.9rem;
    }

    .np-mentions-table > thead > tr > th {
        padding: 8px 6px;
    }
}

/* Недоступная ссылка в таблице правки (bs5.blocks.links_table).
   Штатный table-warning в этой теме рисует белый текст на ярком жёлтом фоне —
   в тёмной теме строку почти не видно. Поэтому подсвечиваем сами: полупрозрачная
   жёлтая заливка (ложится и на светлый, и на тёмный фон) плюс полоса слева. */
.np-link-broken {
    --bs-table-color: var(--bs-body-color);
    --bs-table-bg: rgba(var(--bs-warning-rgb), 0.16);
    /* полосатость строк не должна перебивать заливку */
    --bs-table-bg-type: transparent;
    --bs-table-bg-state: transparent;
    --bs-table-hover-bg: rgba(var(--bs-warning-rgb), 0.26);
}

.np-link-broken > td:first-child {
    border-left: 3px solid rgba(var(--bs-warning-rgb), 0.9);
}

/* --------------------------------------------- избранное: звезда вместо сердца --- */

/* Заполненная золотая звезда — объект в избранном, пустая (в цвет текста) — нет.
   Классы переключает скрипт избранного (см. public/js/functions.js). */
.np-star {color: inherit;}
.np-star.is-on {color: #f0ad4e;}

/* Minty в светлой теме делает основной текст серым (#888) — читается хуже, чем
   хотелось бы. Тёмный серый #343a40 — тот же оттенок, что у заголовков темы. */
[data-bs-theme="light"] {
    --bs-body-color: #343a40;
    --bs-body-color-rgb: 52, 58, 64;
}

/* ----------------------------------------- таблица документов архивного дела --- */

/* Список документов дела (resources/views/bs5/archive/delo.blade.php): длинные
   названия населённых пунктов и храмов переносятся, поэтому таблица влезает
   в блок, а .table-responsive страхует её на узких экранах. */
.np-docs-table td,
.np-docs-table th {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* ------------------------------------------------- спиннер загрузки карты --- */

/* Карта населённого пункта (resources/views/bs5/location.blade.php): пока
   грузится Яндекс.Карта, на месте будущей карты — той же высоты (300px, как в
   скрипте) — по центру крутится стандартный спиннер Bootstrap. */
.np-map-loader {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 300px;
}

.np-map-loader[hidden] {
    display: none;
}

/* ------------------- форма создания НП: список похожих НП внутри той же модалки --- */

/* Результаты поиска дублей показываются не отдельной модалкой поверх формы
   создания населённого пункта, а внутри неё: основная панель (поля формы) уезжает
   вверх, панель со списком похожих НП выезжает снизу. Класс is-duplicates
   переключает js/forms/location_duplicates.js.
   Разметка: обёртка .np-slide — в modals/add_location_new.blade.php и в
   modals/blocks/add_location_fields.blade.php, сама панель дублей —
   modals/blocks/np_duplicates_panel.blade.php. */
.np-slide {
    position: relative;
}

/* Прячем уехавшие за край панели только пока идёт скольжение и пока открыт
   список дублей: в обычном состоянии обрезка не нужна, иначе выпадающий список
   selectize у нижних полей формы обрезался бы краем блока. */
.np-slide.is-sliding,
.np-slide.is-duplicates {
    overflow: hidden;
}

.np-slide-panel {
    background-color: var(--bs-body-bg);
    transition: transform 0.35s ease, opacity 0.35s ease, visibility 0s linear 0s;
}

/* Панель дублей лежит поверх основной и имеет её высоту: длинный список
   прокручивается внутри панели, поэтому форма не «дёргается» в высоту. */
.np-slide-duplicates {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    transform: translateY(100%);
    opacity: 0;
    pointer-events: none;
}

.np-slide.is-duplicates > .np-slide-main {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
}

.np-slide.is-duplicates > .np-slide-duplicates {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}

/* Скрытая панель не должна ловить Tab, но исчезать она должна только после
   скольжения — поэтому visibility переключается с задержкой. */
.np-slide-panel[aria-hidden="true"] {
    visibility: hidden;
    transition: transform 0.35s ease, opacity 0.35s ease, visibility 0s linear 0.35s;
}

/* ---------------------------------------------------------------------------
   Страница правки топонима (/toponym/edit/{id}).

   Таблицы частей списка, дочерних топонимов и истории изменений шире телефона,
   поэтому на узком экране они превращаются в карточки: строки перестают быть
   таблицей, каждая ячейка показывает подпись своей колонки (data-label) и своё
   поле во всю ширину. Горизонтальной прокрутки нет, а объединённые колонки
   (годы «с» и «по», порядок и краткое название части) сузили таблицы и на
   широком экране.

   Шапку скрываем только в мобильной версии. Строк, не попавших на страницу,
   DataTables в разметке не держит, поэтому display: block применяется к каждой
   оставшейся строке и перебивать его через !important не нужно.

   Строка управления таблицей (поиск, выбор числа строк) на телефоне тоже
   разворачивается в столбик: рядом друг с другом поля ввода сжимаются до пары
   символов, а поиск стоит в правом верхнем углу таблицы (layout.topEnd).
   --------------------------------------------------------------------------- */
/* Ячейки переносят длинные названия, а ширину колонок задаёт разметка:
   у DataTables выключен autoWidth (см. npEditTable в bs5/toponyms/edit.blade.php),
   иначе ширины считаются по содержимому, и таблица выезжает за экран */
.np-edit-table td,
.np-edit-table th {
    overflow-wrap: anywhere;
}

/* Поля управления DataTables (поиск, длина страницы) — во всю ширину строки */
.np-edit-table-wrap .dt-search input,
.np-edit-table-wrap .dt-length select {
    width: 100%;
}

@media (max-width: 767.98px) {

    .np-edit-table thead {
        display: none;
    }

    .np-edit-table tbody tr {
        display: block;
        margin-bottom: 0.75rem;
        padding: 0.5rem 0.75rem;
        border: 1px solid var(--bs-border-color);
        border-radius: 0.5rem;
    }

    /* Полосы таблицы внутри карточки не нужны: фон даёт сама карточка */
    .np-edit-table.table-striped > tbody > tr > td {
        --bs-table-bg-type: transparent;
    }

    .np-edit-table tbody td {
        display: block;
        width: auto !important;
        padding: 0.25rem 0;
        border: 0;
    }

    .np-edit-table tbody td[data-label]::before {
        content: attr(data-label);
        display: block;
        color: var(--bs-secondary-color);
        font-size: 0.8rem;
    }

    /* В карточке float из ячейки вреден: строка стала блоком, float выходит из
       своей ячейки, сужает следующий блок и выталкивает его содержимое за
       правый край карточки — так кнопки правки в таймлайне уезжали за границу.
       Ссылки в ячейках таймлайна класс float-start больше не носят, правило
       страхует остальные таблицы правки (!important — у утилит Bootstrap он
       тоже стоит, например в .float-start) */
    .np-edit-table tbody td > .float-start,
    .np-edit-table tbody td > .float-end {
        float: none !important;
    }

    /* Кнопки правки и удаления: текст скрыт (d-none d-md-inline), значки в ряд */
    .np-edit-table tbody td.np-edit-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        padding-top: 0.5rem;
    }

    /* Строка управления таблицей (выбор числа строк и поиск): на телефоне каждая
       часть — на своей строке во всю ширину, иначе поля ввода сжимаются. У
       DataTables 3 с темой Bootstrap строка — это .row, а её части —
       .dt-layout-start / .dt-layout-end / .dt-layout-full с col-md-auto */
    .np-edit-table-wrap .dt-container > .row > [class*="dt-layout-"] {
        flex: 1 1 100%;
    }

    /* Поля поиска и выбора числа строк занимают всю ширину: внешние отступы
       DataTables (margin: .5em) вынесли бы поле за край экрана */
    .np-edit-table-wrap .dt-search input,
    .np-edit-table-wrap .dt-length select {
        margin-left: 0;
        margin-right: 0;
    }
}

/* ---------------------------------------------------------------------------
 * Значок книги вместо обложки источника
 * (resources/views/bs5/book/blocks/cover_placeholder.blade.php).
 *
 * Заглушка выводится и на страницах источника (там подключается book.css), и в
 * блоке «Ссылки и другие источники» — в плитке ссылки на пункт книги и в
 * карточке «Открыть источник». Блок ссылок есть почти на всех страницах сайта,
 * а book.css на них не подключается, поэтому базовые размеры и оттенок значка
 * задаются здесь, в теме: её грузит каждый layout. Без этих правил SVG
 * остаётся 16×16 и прилипает к левому краю плитки.
 *
 * Размер значка — 64px: в плитках блока ссылок площадка такая же, как у соседних
 * картинок (.np-book-link-thumb), в шапке страницы источника значок крупнее
 * (public/css/book.css, .np-book-page-cover--empty).
 * ------------------------------------------------------------------------- */
.np-book-cover-placeholder {
    width: 64px;
    height: 64px;
    /* Значок рисуется currentColor, оттенок берём из темы */
    color: var(--bs-secondary-color, #6c757d);
    opacity: .65;
}

/* Плитки блока ссылок: ссылка на книгу (bs5.book.blocks.entity_chapter_card)
   и карточка «Открыть источник» (bs5.blocks.links). Соседние картинки стоят
   как <img width="64px" style="padding: 10px;">, а box-sizing: border-box
   включает отступы в ширину — значит площадка 64px, а сам значок 44px.
   Заглушке даём ровно такую же площадку, чтобы плитки выстраивались одинаково */
.np-book-link-thumb {
    display: inline-block;
    box-sizing: border-box;
    width: 64px;
    height: 64px;
    padding: 10px;
    line-height: 0;
}

.np-book-link-thumb .np-book-cover-placeholder {
    display: block;
    width: 100%;
    height: 100%;
}