/* Встроенные SVG-карты и их локальные легенды. */
.thematic1{position:relative;width:100%;min-height:620px;border:1px solid var(--border);}
.thematic2{display:block;width:100%;height:600px;}
.thematic3{display:block;width:100%;height:auto;margin-top:25px;}
.thematic2 svg,.thematic3{max-width:100%;}
.thematic1>.legenda{position:absolute;left:5px;bottom:0;z-index:3;}
.thematic1>.legenda table,.legenda-map table{margin:5px 0 10px 0;}
.thematic1>.legenda td,.legenda-map td{border:0;padding:1px 5px 1px 2px;font-size:13px;}
.leg-map{position:absolute;top:10px;left:10px;z-index:4;}
.leg-map>input{position:absolute;opacity:0;}
.leg-chec{display:block;width:30px;height:30px;background:#fff url('images/legenda.svg') center/24px no-repeat;box-shadow:1px 1px 4px rgba(0,0,0,.25);cursor:pointer;}
.leg-map>div{display:none;width:350px;max-height:560px;padding:10px;overflow:auto;background:#fff;box-shadow:0 4px 16px rgba(0,0,0,.2);}
.leg-map>input:checked~div{display:block;}
.legenda-hed{font-size:16px;text-align:left;}

/* Обертка ArcGIS-карты и динамическая правая панель. */
.map-panel-toggle{position:absolute;opacity:0;pointer-events:none;}
.layer-map{position:relative;display:flex;width:100%;height:615px;overflow:visible;}
.layer1{flex:0 0 auto;width:77%;min-width:0;}
.r-panel{position:relative;flex:0 0 auto;width:23%;min-width:0;padding-right:5px;border-left:1px solid var(--border);background:#fff;}
.map-panel-handle{position:absolute;top:0;right:-10px;z-index:4;width:10px;height:54px;border-radius:0 4px 4px 0;background:var(--menu);cursor:pointer;opacity:.65;}
.map-panel-handle::before{content:"";display:block;width:0;height:0;margin:22px 0 0 3px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:5px solid #fff;}
.map-panel-toggle:checked+.layer-map .layer1{flex:1 1 auto;width:100%;}
.map-panel-toggle:checked+.layer-map .r-panel{width:0;flex-basis:0;padding:0;border-left-color:transparent;}
.map-panel-toggle:checked+.layer-map .map-list-panel{display:none;}
.map-panel-toggle:checked+.layer-map .map-panel-handle::before{margin-left:2px;border-right:5px solid #fff;border-left:0;}

#mapShell {width:100%;height:100%;margin:0;padding:0;}

/* Область карты:ArcGIS canvas снизу, наш UI поверх него. */
.map-area {position:relative;flex:1 1 auto;min-width:0;height:100%;overflow:hidden;background:#dfe6ea;touch-action:none;overscroll-behavior:contain;}
#viewDiv,
#viewDiv.esri-view {position:absolute;inset:0;width:100%;height:100%;overflow:hidden;touch-action:none;-ms-touch-action:none;user-select:none;-webkit-user-select:none;}

/* Эти классы оставлены только для поверхности карты и служебных контейнеров. */
#viewDiv .esri-view-root,
#viewDiv .esri-view-surface,
#viewDiv .esri-view-surface--inset-outline {position:absolute;inset:0;width:100%;height:100%;overflow:hidden;touch-action:none;-ms-touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;}
#viewDiv .esri-view-surface canvas {display:block;touch-action:none;-ms-touch-action:none;user-select:none;-webkit-user-select:none;}
#viewDiv .esri-ui {position:absolute;inset:0;z-index:1;pointer-events:none;}
#viewDiv .esri-component {pointer-events:auto;}

/* Кнопки управления картой.
   Высота блока считается по фактическому количеству кнопок, включая кнопку слоев на страницах областей. */
.map-controls {position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:3px;
top:0;width:auto;max-height:100%;padding:5px;background-color:#fff;box-sizing:border-box;}
.map-controls--left {left:0;}
.map-button {display:grid;place-items:center;width:28px;height:28px;border:0;background:rgba(255, 255, 255, 0.96);box-shadow:1px 1px 1px rgba(0, 0, 0, 0.3);cursor:pointer;}
.map-button:hover,
.map-button:focus {background:#f4f7f9f5;}
.open {content:url("images/open.svg");margin-bottom:5px;}
.close {display:none;content:url("images/close.svg");margin-bottom:5px;}
.plus {content:url("images/plus.svg");}
.minus {content:url("images/minus.svg");}
.home {content:url("images/home.svg");}
.map-button.legenda {background:rgba(255, 255, 255, 0.96) url("images/legenda.svg") center/20px no-repeat;color:transparent;font-size:0;}
.map-button.legenda:hover,
.map-button.legenda:focus {background-color:#f4f7f9f5;}
:fullscreen {padding:20px;background:#fff;}
:fullscreen .open {display:none;}
:fullscreen .close {display:block;}
:fullscreen .layer-map {height:100%;}

/* Переключатель базовой карты. */
.map-basemap-toggle {position:absolute;top:0;right:0;z-index:1;width:auto;height:auto;padding:0;border:5px solid #ffffff;border-radius:0;background:transparent;cursor:pointer;overflow:hidden;}
.map-basemap-toggle:hover,
.map-basemap-toggle:focus {outline:1px solid #ffffff;outline-offset:0;}

/* Кнопка показывает не текущую, а следующую базовую карту. */
.map-basemap-toggle__thumb {display:block;width:50px;height:50px;background-image:url("images/hybrid.jpg");background-repeat:no-repeat;background-position:left top;background-size:auto;}
.map-basemap-toggle.is-next-topo .map-basemap-toggle__thumb {background-image:url("images/topo.jpg");}

/* Элементы ручного управления слоями создаются картографическим движком. */
.map-layer-control__toggle{display:grid;place-items:center;width:28px;height:28px;border:0;background:rgba(255,255,255,.96);box-shadow:1px 1px 1px rgba(0,0,0,.3);cursor:pointer;}
.map-layer-control__toggle::before{content:"";display:block;width:28px;height:28px;background:url("images/layer.svg") center/contain no-repeat;}
.map-layer-control__toggle:hover,.map-layer-control__toggle:focus{background:var(--header-bg);outline:none;}
.map-layer-control{position:absolute;top:5px;left:45px;z-index:6;min-width:200px;max-width:250px;max-height:calc(100% - 10px);padding:8px;overflow:auto;background:#fff;box-shadow:0 8px 22px rgba(15,23,42,.18);}
.map-layer-control[hidden]{display:none;}
.map-layer-control__title{margin:0;padding-bottom:5px;border-bottom:1px solid var(--border);font-size:16px;text-align:left;}
.map-layer-control__all,.map-layer-control__item{display:flex;align-items:flex-start;gap:8px;width:100%;padding:5px 0;border:0;background:transparent;color:var(--menu);text-align:left;cursor:pointer;}
.map-layer-control__all-text,.map-layer-control__item-text{flex:1;min-width:0;//text-align:right;}
.map-layer-control__all-text{text-align:right;font-size:15px;color:var(--accent);}
.map-layer-control input[type="checkbox"]{appearance:none;flex:0 0 12px;width:12px;height:12px;margin-top:2px;border:0;background:url("images/11check.png") center/contain no-repeat;}
.map-layer-control input[type="checkbox"]:checked{background-image:url("images/11check-ch.png");}
.map-layer-control__all-checkbox{position:absolute !important;width:1px !important;height:1px !important;overflow:hidden;clip:rect(0 0 0 0);}

/* Легенда ArcGIS-карты. */
.map-legend {position:absolute;top:135px;left:40px;z-index:1;min-width:200px;max-width:300px;max-height:min(350px, calc(100% - 24px));overflow:auto;border-radius:4px;color:#1f2937;background:rgba(255, 255, 255, 0.98);box-shadow:0 8px 22px rgba(15, 23, 42, 0.18);}
.map-legend[hidden] {display:none;}
.map-legend__title {margin:0;padding:5px 10px;border-bottom:1px solid #e5e7eb;color:#111827;font-size:16px;}
.map-legend__items {padding:5px;}
.map-legend__item {display:grid;grid-template-columns:20px 1fr;gap:5px;align-items:center;min-height:20px;}
.map-legend__icon {max-width:24px;max-height:24px;justify-self:center;}
.map-legend__label {color:#374151;font-size:13px;line-height:1.1;}

/* Собственный popup карты. */
.map-popup {position:absolute;z-index:1;min-width:275px;max-width:calc(100% - 24px);max-height:min(420px, calc(100% - 24px));overflow:visible;border-radius:4px;color:#374151;background:#ffffff;box-shadow:0 10px 26px rgba(15, 23, 42, 0.24);}
.map-popup[hidden] {display:none;}

/* Хвостик визуально связывает popup с объектом. */
.map-popup::after {content:"";position:absolute;left:var(--popup-anchor-x, 50%);width:0;height:0;transform:translateX(-50%);}
.map-popup.is-above::after {bottom:-7px;border-top:7px solid #ffffff;border-right:7px solid transparent;border-left:7px solid transparent;}
.map-popup.is-below::after {top:-7px;border-right:7px solid transparent;border-bottom:7px solid #ffffff;border-left:7px solid transparent;}
.map-popup__header {display:flex;align-items:flex-start;overflow:hidden;border-radius:4px 4px 0 0;border-bottom:1px solid #e5e7eb;background:#ffffff;}
.map-popup__title {flex:1 1 auto;margin:0;padding:7px 5px 5px 7px;color:#0b4d5b;font-size:16px;line-height:1.1;font-weight: normal;}
.map-popup__footer {display:flex;align-items:center;justify-content:flex-end;gap:4px;width:auto;padding:4px 10px;border-top:1px solid #e5e7eb;border-radius:0 0 4px 4px;background:#ffffff;}
.map-popup__footer[hidden] {display:none;}
.map-popup__nav-button {display:grid;place-items:center;width:26px;height:26px;border:0;border-radius:4px;color:#374151;background:transparent;font:inherit;font-size:20px;line-height:1;cursor:pointer;}
.map-popup__nav-button:hover,
.map-popup__nav-button:focus {color:#111827;background:#f3f4f6;outline:none;}
.map-popup__nav-button:disabled {color:#9ca3af;background:transparent;cursor:default;}
.map-popup__counter {min-width:34px;color:#64748b;font-size:12px;line-height:1;text-align:center;white-space:nowrap;}
.map-popup__close {flex:0 0 auto;width:32px;height:32px;border:0;color:#374151;background:transparent;font:inherit;font-size:20px;line-height:1;cursor:pointer;}
.map-popup__close:hover,
.map-popup__close:focus {color:#111827;background:#f3f4f6;outline:none;}
.map-popup__content {max-height:350px;overflow:auto;padding:5px 5px 8px 7px;background:#ffffff;line-height:1.1;}
.map-popup-content p {margin:0 0 5px 0;line-height:normal;text-align:left;font-size:13px;}
.map-popup-content p:last-child {margin-bottom:0;}

/* HTML внутри popup: разрешены абзацы, ссылки, списки, переносы и простые таблицы. */
.map-popup-content a {color:#2563eb;text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere;}
.map-popup-content a:hover,
.map-popup-content a:focus {color:#1d4ed8;}
.map-popup-content ul {margin:4px 0 7px 18px;padding:0;}
.map-popup-content li {margin:0 0 3px 0;padding:0;}
.map-popup-content table {width:100%;margin:5px 0 7px 0;border-collapse:collapse;table-layout:auto;font-size:12px;line-height:1.3;}
.map-popup-content td {padding:4px 5px;border:0;vertical-align:top;overflow-wrap:anywhere;}
.map-popup-content tr:nth-child(even) td {background:#f8fafc;}

/* Правая панель списка объектов */
.map-list-panel {display:flex;flex-direction:column;height:99%;background:#ffffff;}
.map-list-panel__header {flex:0 0 auto;padding:5px;margin:0 0 5px 0;border-bottom:1px solid var(--border);}
.map-list-panel__title {padding:0 0 0 5px;color:var(--accent);font-size:16px;}

/* Кнопка в шапке панели выглядит как ссылка и управляет всеми группами списка. */
.map-list-panel__toggle {width:100%;border:0;background:transparent;text-align:right;cursor:pointer;}
.map-list-panel__toggle:hover,
.map-list-panel__toggle:focus {color:#648bab;outline:none;}
.map-list-panel__search {width:100%;height:28px;margin:5px 0;padding:2px 5px;border:1px solid var(--border);color:#111827;background:#ffffff;box-sizing:border-box;font:inherit;font-size:14px;}
.map-list-panel__search:focus {border-color:#648bab;outline:2px solid rgba(100, 139, 171, 0.24);outline-offset:0;}
.map-list-panel__status {flex:0 0 auto;padding:9px 14px;color:#64748b;font-size:12px;line-height:1.35;border-bottom:1px solid var(--border);}
.map-list-panel__status[hidden] {display:none;}
.map-list-panel__items {flex:1 1 auto;overflow:auto;padding:4px;}
.map-list-panel__item {display:grid;grid-template-columns:auto 1fr;column-gap:5px;align-items:start;width:100%;margin:0;padding:2px 2px 2px 3px;border:0;color:#1f2937;background:transparent;text-align:left;font-size:14px;line-height:1.35;cursor:pointer;}

/* Level 1 в list-*.csv работает как заголовок группы: клик сворачивает/разворачивает level 2. */
.map-list-panel__item--group {position:relative;margin-top:5px;padding-top:5px;padding-bottom:5px;border-top:1px solid var(--border);font-size:15px;color: #106475;}
.map-list-panel__item--group:first-child {margin-top:0;border-top:0;}
.map-list-panel__item--level-2 {padding-left:15px;font-size:14px;}

/* Маркеры списка приходят из CSV и получают картинки из общего CSS. */
.map-list-panel__item::before {grid-column:1;margin-right:0;}
.map-list-panel__item__text {grid-column:2;min-width:0;}
.map-list-panel__item:hover,
.map-list-panel__item:focus {color:#0f172a;background:#e6e1dd99;outline:none;}
.map-list-panel__item.is-active {color:#0f172a;background:#e6e1dd;box-shadow:inset 3px 0 0 #999185;}

/* Attribution оставляем от ArcGIS, но задаем компактный вид локально. */
#viewDiv .esri-attribution {position:absolute;bottom:0;left:0;width:auto;max-width:calc(100% - 8px);padding:0 2px;color:#4b5563;font-size:8px;line-height:1;background:rgba(255, 255, 255, 0.74);}
#viewDiv .esri-attribution__sources,
#viewDiv .esri-attribution__powered-by {display:inline;}
#viewDiv .esri-attribution a{font-size:8px;}

@media (max-width:1024px) {
.open,.close,.map-panel-handle{display:none;}
.r-panel{display:block;width:100%;height:43vh;margin-top:30px;padding:0;border-left:0;border-top:1px solid var(--border);}
.layer-map{display:block;height:auto;min-height:80vh;}
.layer1{display:block;width:100%;height:45vh;}
}

@media (max-width:760px) {
.tab-labels{flex-wrap:wrap;}
.tab-labels label{font-size:16px;padding:3px 10px;}
.thematic1>.legenda{bottom:15%;}
.leg-map>div{display:block;position:absolute;top:300px;left:0;max-height:270px;padding:10px;overflow:auto;background:none;box-shadow:none;}
}

@media (max-width:480px) {
.map-list-panel {border-top:1px solid var(--border);}
.map-legend{top:15px;left:35px;width:min(200px, calc(100% - 66px));}
.map-controls{gap:5px;width:auto;max-height:100%;padding:3px;}
.map-button {width:24px;height:24px;}
.map-area {width:100%;}
}