@charset "utf-8";
/**
 * Стили сайта «Добрые крышечки».
 *
 * Собран из трёх источников:
 *   1. база — https://cdn.cupivan.ru/i/default.css (общие стили cupivan.ru:
 *      nav, таблицы, формы, служебные классы .sm/.gray/.pre). Раньше боевой сайт
 *      подключал её через @import; здесь она лежит рядом, чтобы страница не
 *      зависела от чужого домена;
 *   2. вёрстка сайта — те же правила, что были в <style> на боевом сайте;
 *   3. подвал — на боевом сайте его нет, стили написаны при переезде на ядро.
 *
 * Страницы подключают файл в <head> с ?t=filemtime — правки видны без
 * сброса кэша браузера (см. tpl/main.pattern.php).
 */

/* ------------------------------------------------------------------ */
/* 1. База: cdn.cupivan.ru/i/default.css                                */
/* ------------------------------------------------------------------ */

nav          { margin-bottom: 10px; }
nav>a        { border: 1px solid #999; display: inline-block; padding: 5px 10px; text-decoration: none; color: #999; margin-right: 5px; }
nav>a:hover  { border: 1px solid #00F; }
nav>a.active { border: 1px solid #00F; color: #00F; }

table.t { border: 2px solid #999; border-collapse: collapse; margin-bottom: 10px; margin-right: 10px; }
table.t td,
table.t th { border: 1px solid #999; padding: 5px 10px; }
table.t th { background: #EEE; }
table.t tr:nth-child(odd) td { background: RGBA(0,0,0,0.08); }
table.t tr:hover td { background: RGBA(0,0,0,0.15) !important; }
table.t tr.active { background: RGBA(0,0,0,0.08); }
table.t         { position: relative; }
table.t .sticky { position: sticky; top: 0; background: #EEE; }
table.t tr.sticky { top:  0; z-index: 2;}
table.t td.sticky { left: 0; z-index: 1; }

table.t nav  { margin: 0; }
table.t form { margin: 0; }

.nobr { white-space: pre; }

.currency.RUB:after  { content: ' ₽'; }
.currency.kRUB:after  { content: ' тыс. ₽'; }
.currency.mRUB:after  { content: ' млн. ₽'; }
.currency.USD:before { content: '$ '; }
.currency.EUR:before { content: '€ '; }
.currency .delimiter { margin: 1px; }

.pre { white-space: nowrap; }

.c  { text-align: center; }
.l  { text-align: left; }
.r  { text-align: right; }
.b  { font-weight: bold; }
.sm { font-size: 80%; }

form.f       { margin-bottom: 10px; }
form.f textarea,
form.f input { padding: 5px 10px; height: 30px; box-sizing: border-box; border: 1px solid #999; margin-bottom: 3px; margin-right: 3px; }
form.f input[type=checkbox] { height: auto; }
form.f label { margin-right: 10px; }
form.f input[type=date]             { width: 150px; }
form.f input[type="datetime-local"] { width: 230px; }
form.f input[type=number] { width: 80px; padding-right: 2px; }
form.f input[type=button],
form.f input[type=submit] { cursor: pointer; }
form.f input[type=submit]:hover { outline: 1px solid #999; }
form.f input[type=file] { margin-top: -1px; padding-top: 4px; width: 200px; }
form.f select { height: 30px; }
form.f textarea { height: 50px; width: 400px; }

.green  { color: #090 !important; }
.red    { color: #900 !important; }
.yellow { color: #AA0 !important; }
.gray   { color: #999 !important; }

.bg-green    , .bg-good        { background: #EFE !important; }
.bg-darkgreen, .bg-verygood    { background: #CFC !important; }
.bg-red      , .bg-error       { background: #FEE !important; }
.bg-darkred  , .bg-critical    { background: #FCC !important; }
.bg-yellow   , .bg-warning     { background: #FFE !important; }
.bg-yellow   , .bg-morewarning { background: #FFC !important; }
.bg-gray     , .bg-default     { background: #EEE !important; }

.error { padding: 10px 20px; background: #FEE; display: table; }

table.editItem               { width: 800px; }
table.editItem td:first-child { white-space: pre; }
table.editItem td:last-child { width: 100%; }
table.editItem textarea { height: 100px; }
table.editItem .big td:first-child { vertical-align: top; }
table.editItem .big textarea { height: 400px; }
table.editItem input[type=text],
table.editItem input[type=password],
table.editItem input[type=file],
table.editItem textarea,
table.editItem select { width: 100%; }
table.editItem td:first-child { vertical-align: top; padding-top: 8px; }

nav.paginator .hide { padding: 3px; }

/* ------------------------------------------------------------------ */
/* 2. Вёрстка сайта                                                     */
/* ------------------------------------------------------------------ */

html, body   { margin: 0; padding: 0; }
body         { font-family: sans-serif; }
section      { margin: auto; min-width: 500px; max-width: 1000px; }
h1           { text-align: center; }

/* Ссылки в шапке и меню не обводим рамкой базового стиля nav>a */
#top_menu a, #header a { border: 0 !important; }

/* Шапка: картинка assets/header.jpg. Иконки соцсетей и логотипы фонда
   нарисованы в самой картинке, а ссылки из config.php — прозрачные
   «горячие» прямоугольники поверх неё (позиции — селекторами по href). */
#header   { position: relative; background: URL('/assets/header.jpg') no-repeat; height: 251px; margin: 0 !important; }
#header img { display: block; }
#header a { position: absolute; top: 190px; left: 193px; display: inline-block; width: 36px; height: 36px; box-sizing: border-box; }
#header a:hover { outline: 1px solid #434d59; }
#header a[href^="https://www.inst"] { margin-left: 0px; }
#header a[href^="https://www.face"] { margin-left: 38px; }
#header a[href^="https://ok.ru"]    { margin-left: 76px; }
#header a[href^="https://twit"]     { margin-left: 116px; }
#header a[href^="https://vk.com"]   { margin-left: 155px; }
#header a[href^="https://otkazniki.ru"]         { top: 10px; left: 355px; width: 120px; height: 125px; }
#header a[href^="https://otkazniki.ru/events/"] { top: 5px; left: 30px; width: 140px; height: 135px; }

/* Верхнее меню */
#top_menu          { background: #E9F7FF; text-align: center; display: block; }
#top_menu a:hover  { background: #D4E6F1; border-bottom: 2px solid #00F; }
#top_menu a        { display: inline-block; padding: 10px 20px; text-decoration: none; color: #00F; }
#top_menu a.active { border-bottom: 2px solid #00F; }

#map { width: 100%; height: 600px; }

a[href^="#"] { text-decoration: none; border-bottom: 1px dashed #00F; }

/* ------------------------------------------------------------------ */
/* 3. Страницы                                                          */
/* ------------------------------------------------------------------ */

/* Главная: текстовая колонка уже картинок */
.body { width: 800px; margin: auto; }

/* «Инфографика»: отчёты-картинки идут вертикально, разделённые пунктиром */
center img { max-width: 100%; }
center hr  { display: block; margin: 30px 10px; border: 0; border-bottom: 1px dashed #777; }

/* «Поступления в фонд» */
.paginator a { border: 1px solid #999 !important; }

/* Карта пунктов приёма: легенда-контрол */
.legend {
	background: #BBB;
	border-radius: 5px;
	padding: 10px;
	opacity: 0.8
}
.legend i {
	width: 8px;
	height: 8px;
	display: inline-block;
	margin-right: 4px;
	opacity: 0.7;
	border: 3px solid #000;
	border-radius: 50%;
	vertical-align: middle;
}

/* Карта городов */
.leaflet-popup-content p { margin: 0; }

/* ------------------------------------------------------------------ */
/* 4. Подвал (на боевом сайте его нет)                                  */
/* ------------------------------------------------------------------ */

#footer {
	margin-top: 40px;
	padding: 20px 10px 10px;
	background: #F7FBFE;
	border-top: 2px solid #D4E6F1;
	color: #444;
	font-size: 90%;
}
#footer .footer-cols { display: flex; flex-wrap: wrap; gap: 20px; }
#footer .footer-col  { flex: 1 1 240px; min-width: 240px; }
#footer b           { color: #222; }
#footer p           { margin: 5px 0; }
#footer ul          { list-style: none; margin: 5px 0; padding: 0; }
#footer li          { margin-bottom: 3px; }
#footer a           { color: #00F; }
#footer .footer-bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 10px;
	margin-top: 20px;
	padding-top: 10px;
	border-top: 1px solid #D4E6F1;
	font-size: 85%;
}
