@font-face {
        font-family: 'Roboto';
        src: url("assets/Roboto-Bold.a0449ee93f83.woff2") format('woff2'),
        url("assets/Roboto-Bold.e0dca0c496df.woff") format('woff');
        font-weight: 700;
        font-style: normal;
    }

    @font-face {
        font-family: 'Roboto';
        src: url("assets/Roboto-Regular.750621a1c341.woff2") format('woff2'),
        url("assets/Roboto-Regular.328c2f31bef3.woff") format('woff');
        font-weight: 400;
        font-style: normal;
    }

    html, body {
        overflow: hidden !important;
        font-family: 'Roboto', Arial, sans-serif;
    }

    .maplibre-top.maplibre-left {
        width: 35px !important;
    }

    .myactive {
        /* width: 30% !important;
         min-width: 30% !important;*/
        -webkit-transition: all 0.2s;
        -o-transition: all 0.2s;
        transition: all 0.2s;
    }

    #sidebar {
        width: 0;
        min-width: 0;
        -webkit-transition: all 0.2s;
        -o-transition: all 0.2s;
        transition: all 0.2s;
    }

    .sidebar__content {
        overflow: auto;
    }

    .local-search-list {
        overflow-y: scroll;
    }


    .maplibre-control-coord-projection {
        font-family: Courier, serif;
        font-size: 14px !important;
        color: #5a6268 !important;
        font-weight: bolder;
        margin-right: 10px !important;

    }

    .btn-close {
        box-sizing: content-box;
        width: 1em;
        height: 1em;
        padding: 0.25em 0.25em;
        color: #000;
        background: transparent url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27 fill=%27%23000%27%3e%3cpath d=%27M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z%27/%3e%3c/svg%3e") center/1em auto no-repeat;
        border: 0;
        border-radius: 0.25rem;
        opacity: 0.5;
    }

    .btn-close:hover {
        color: #000;
        text-decoration: none;
        opacity: 0.75;
    }

    .btn-close:focus {
        outline: 0;
        box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
        opacity: 1;
    }

    .btn-close:disabled, .btn-close.disabled {
        pointer-events: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
        opacity: 0.25;
    }

    .btn-close-white {
        filter: invert(1) grayscale(100%) brightness(200%);
    }

    .visually-hidden,
    .visually-hidden-focusable:not(:focus):not(:focus-within) {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        padding: 0 !important;
        margin: -1px !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
        border: 0 !important;
    }

    .maplibre-control-zoom.maplibre-bar, .maplibre-bar, .maplibre-control.maplibre-searchbox-container,
    .maplibre-control-layers.maplibre-control-layers-expanded.maplibre-control,
    .maplibre-control-layers.maplibre-control {
        clear: both !important;
    }


    .showAlert {
        opacity: 1 !important;
        z-index: 1200 !important;
        /* display: block !important;*/
        border: 0.1rem solid #ad2332;
        -webkit-transition: all 0.2s;
        -o-transition: all 0.2s;
        transition: all 0.2s;
    }

    #alertDanger {
        position: absolute;
        margin-left: auto;
        margin-right: auto;
        top: 12%;
        left: 0;
        right: 0;
        width: 300px;
        text-align: center;
        border: 0.1rem solid #ad2332;
        opacity: 0;
        /*display: none;*/
        z-index: 1;
        -webkit-transition: all 0.2s;
        -o-transition: all 0.2s;
        transition: all 0.2s;
    }

    .listofmarkers {
        /*background-color: #9b9b9b !important;*/
        filter: brightness(130%);
    }


    /*иконки для кнопок, создание событий и создание объектов*/

    .background_image-1 {
        background-size: 14px 22px;
        background-image: url("assets/marker-icon-2x-black.3cea109550ad.png");
        background-position: center;
    }

    .button_battleclash {
        background-size: 26px 24px;
        background-image: url("assets/button_battleclash.a45b0f601f8c.png");
        background-position: center;
    }

    .button_shelling {
        background-size: 26px 24px;
        background-image: url("assets/button_shelling.d412f6e506ed.png");
        background-position: center;
    }

    .button_terror {
        background-size: 26px 24px;
        background-image: url("assets/button_terror.b627df45bd3e.png");
        background-position: center;
    }

    .button_assault {
        background-size: 26px 24px;
        background-image: url("assets/button_assault.ce2ea2e65418.png");
        background-position: center;
    }

    .button_exchange {
        background-size: 26px 24px;
        background-image: url("assets/button_exchange.b95737ac937a.png");
        background-position: center;
    }

    .button_emergency {
        background-size: 26px 24px;
        background-image: url("assets/button_emergency.9ca0c94f9723.png");
        background-position: center;
    }

    .button_protest {
        background-size: 26px 24px;
        background-image: url("assets/button_protest.ed03388770bf.png");
        background-position: center;
    }

    .button_airstrike {
        background-size: 26px 24px;
        background-image: url("assets/button_airstrike.4465e7fadb00.png");
        background-position: center;
    }

    .button_airdrone {
        background-size: 26px 24px;
        background-image: url("assets/button_airdrone.d07c0c969522.png");
        background-position: center;
    }

    .button_airdefence {
        background-size: 26px 24px;
        background-image: url("assets/button_airdefence.9a014b1598fe.png");
        background-position: center;
    }

    .button_arrest {
        background-size: 26px 24px;
        background-image: url("assets/button_arrest.d88d896098dc.png");
        background-position: center;
    }

    .button_marinedrone {
        background-size: 26px 24px;
        background-image: url("assets/button_marinedrone.3c5ce39b8694.png");
        background-position: center;
    }

    .button_blast {
        background-size: 26px 24px;
        background-image: url("assets/button_blast.8de2144f3000.png");
        background-position: center;
    }

    .button_disaster {
        background-size: 26px 24px;
        background-image: url("assets/button_disaster.3b3c5c2618e2.png");
        background-position: center;
    }

    .button_warship {
        background-size: 26px 24px;
        background-image: url("assets/button_warship.17f2cb841972.png");
        background-position: center;
    }

    .button_helicopter {
        background-size: 26px 24px;
        background-image: url("assets/button_helicopter.4767ecec6f75.png");
        background-position: center;
    }

    .button_heran {
        background-size: 26px 24px;
        background-image: url("assets/button_heran.8d309bf17271.png");
        background-position: center;
    }

    .button_rubaka {
        background-size: 26px 24px;
        background-image: url("assets/button_rubaka.4739c4bfae6f.png");
        background-position: center;
    }

    .button_airplane {
        background-size: 26px 24px;
        background-image: url("assets/button_airplane.5d1f3573ed22.png");
        background-position: center;
    }

    .button_pogrom {
        background-size: 26px 24px;
        background-image: url("assets/button_pogrom.801e44f30308.png");
        background-position: center;
    }

    .object_back_image-1 {
        background-size: 15px 24px;
        background-image: url("assets/marker-icon-2x-red.07aea9c9e256.png");
        background-position: center;
    }

    .powerstationIcon {
        background-size: 26px 24px;
        background-image: url("assets/powerstation.447136f9f95c.png");
        background-position: center;
    }

    .atomstationIcon {
        background-size: 26px 24px;
        background-image: url("assets/atomstation.e14c1e0f9812.png");
        background-position: center;
    }

    .bridgeIcon {
        background-size: 26px 24px;
        background-image: url("assets/bridge.488f87cc7c55.png");
        background-position: center;
    }

    .administrativeIcon {
        background-size: 26px 24px;
        background-image: url("assets/administrative.08693b187f87.png");
        background-position: center;
    }

    .aerodromeIcon {
        background-size: 26px 24px;
        background-image: url("assets/aerodrome.b83366536f9d.png");
        background-position: center;
    }

    .commandIcon {
        background-size: 26px 24px;
        background-image: url("assets/command.6d9c61b164a1.png");
        background-position: center;
    }

    .crossingIcon {
        background-size: 26px 24px;
        background-image: url("assets/crossing.edafe0b97f34.png");
        background-position: center;
    }

    .factoryIcon {
        background-size: 26px 24px;
        background-image: url("assets/factory.4d2deefa2502.png");
        background-position: center;
    }

    .firingrangeIcon {
        background-size: 26px 24px;
        background-image: url("assets/firingrange.7ab480cb57b8.png");
        background-position: center;
    }

    .hospitalIcon {
        background-size: 26px 24px;
        background-image: url("assets/hospital.eafe6c3dd717.png");
        background-position: center;
    }

    .locationIcon {
        background-size: 26px 24px;
        background-image: url("assets/location.62dd78ce3386.png");
        background-position: center;
    }

    .miliaryunitIcon {
        background-size: 26px 24px;
        background-image: url("assets/miliaryunit.7ec75643338d.png");
        background-position: center;
    }

    .radarIcon {
        background-size: 26px 24px;
        background-image: url("assets/radar.f0254a487cb6.png");
        background-position: center;
    }

    .repairIcon {
        background-size: 26px 24px;
        background-image: url("assets/repair.ca2ace3c2575.png");
        background-position: center;
    }

    .storehouseIcon {
        background-size: 26px 24px;
        background-image: url("assets/storehouse.9f6d1bbae915.png");
        background-position: center;
    }

    .waterpowerIcon {
        background-size: 26px 24px;
        background-image: url("assets/waterpower.e5becb29a878.png");
        background-position: center;
    }

    .mineIcon {
        background-size: 26px 24px;
        background-image: url("assets/mine.d6d690976d89.png");
        background-position: center;
    }

    .careerIcon {
        background-size: 26px 24px;
        background-image: url("assets/career.e98efdc7c0b0.png");
        background-position: center;
    }

    .trucpowerstationIcon {
        background-size: 26px 24px;
        background-image: url("assets/trucpowerstation.ea6e0f62e181.png");
        background-position: center;
    }

    .damIcon {
        background-size: 26px 24px;
        background-image: url("assets/dam.a08148c3d52f.png");
        background-position: center;
    }

    .researchinstituteIcon {
        background-size: 26px 24px;
        background-image: url("assets/researchinstitute.c12aa50c4b81.png");
        background-position: center;
    }

    .natoIcon {
        background-size: 26px 24px;
        background-image: url("assets/nato.cc37d59defb8.png");
        background-position: center;
    }

    .religionIcon {
        background-size: 26px 24px;
        background-image: url("assets/religion.2dcc3461a25d.png");
        background-position: center;
    }

    .learningIcon {
        background-size: 26px 24px;
        background-image: url("assets/learning.71acd84be7d8.png");
        background-position: center;
    }
    
    .seaportIcon {
        background-size: 26px 24px;
        background-image: url("assets/seaport.22b0718e591f.png");
        background-position: center;
    }

    .policeIcon {
        background-size: 26px 24px;
        background-image: url("assets/police.8b180abed892.png");
        background-position: center;
    }

    .prisonIcon {
        background-size: 26px 24px;
        background-image: url("assets/prison.04fbed787e92.png");
        background-position: center;
    }

    /*style for side panel, showing events*/
    .eventsidepanel {
        width: 0;
        position: fixed;
        z-index: 5;
        height: 450px;
        top: 0;
        right: 0;
        background-color: #dadada;
        overflow-x: hidden;
        transition: 0.2s;
        padding-top: 30px;
    }

    .eventsidepanel a {
        padding: 8px 8px 8px 18px;
        text-decoration: none;
        font-size: 25px;
        color: #1c1c1c;
        display: block;
        transition: 0.1s;
    }

    .eventsidepanel a:hover {
        color: #343434;
    }

    .eventsidepanel .closebtn {
        position: absolute;
        top: 0;
        right: 32px;
        font-size: 32px;
        padding: 0 !important;
    }

    /*some styles from Rodion*/
    .side-modal__info-item--place {
        padding-left: 17px;
        background: url("assets/coordinates.9698466a1d6a.svg") no-repeat left center;
    }

    .side-modal__info-item--date {
        padding-left: 17px;
        background: url("assets/calendar.19dae431167e.svg") no-repeat left center;
    }

    .maplibre-control-attribution a {
        display: none !important;
    }

    .maplibre-control-attribution {
        display: none !important;
    }

    .maplibre-top .maplibre-control {
        clear: both !important;
    }

    .maplibre-top .maplibre-draw-toolbar {
        margin-top: 5px !important;
    }

    .maplibre-draw-actions-bottom li:last-child {
        /*display: none !important;*/
    }

    .maplibre-control-cascadeButtons + .maplibre-draw {
        margin-top: 5px !important;
    }


    .list-group-item-action:focus, .list-group-item-action:hover {
        z-index: 1;
        color: #252a2d !important;
        text-decoration: none;
        background-color: #9b9b9b !important;
    }

    .maplibre-control-coord-projection.maplibre-control {
        min-width: 262px;
    }

    #mySidepanel {
        z-index: 802;
    }

    .maplibre-popup-content {
        margin: 4px !important;
    }

    /*Данный класс используется для подсвечивания маркера при наведении на него*/
    .marker_icon:hover > .back_fill {
        fill: #e3510d !important;
    }

    /*Данный класс используется для подсвечивания маркера при наведении список маркеров в правой панели*/
    /*.hover_from_list {
        fill: #e3510d !important;
    }*/

    .hideClearSearch {
        display: none;
    }

    .maplibre-control-zoom {
        border: none !important;
    }

    .maplibre-control-zoom-out {
        margin-top: 50px;
    }

    .resetView {
        margin-left: 0 !important;
        cursor: pointer;
    }

    .maplibre-control-cascadeButtons.vertical.maplibre-control {
        margin-left: 7px;
        margin-top: 7px;
        box-shadow: 0 0 40px 0 rgba(var(--bg-2-rgb), 0.33);

    }

    #maincascadebutton {
        background-color: var(--bg-control) !important;
        border: 1px solid var(--line-strong);
        border-radius: 4px !important;
    }

    .tooltips {
        position: absolute;
        font-size: 14px;
        line-height: 9pt;
        top: 15px;
        right: 20px;
        background: var(--bg-control);
        height: 30px;
        color: var(--text);
        padding: 2px;
        box-shadow: 0 0 40px 0 rgba(var(--bg-2-rgb), 0.33);
        border: 1px solid var(--line-strong);
        border-radius: 4px !important;
        opacity: 0;
        z-index: 900;
    }

    /**/
    .event-feed__light input[type="date"]::-webkit-calendar-picker-indicator {
        background: transparent;
        bottom: 0;
        color: transparent;
        cursor: pointer;
        height: auto;
        left: 0;
        position: absolute;
        right: 0;
        top: 0;
        width: auto;
    }

    /* @media (max-width: 820px) {
        #sliderContainer {
            display: none;
        }
    } */

    .popup-with-no-events { /*for displaying popUp for polygons*/
        pointer-events: none;
    }



    path.country-border {
        -webkit-filter: drop-shadow(0 0 1mm rgb(0, 0, 0));
        filter: drop-shadow(0 0 1mm rgba(0, 0, 0));
        z-index: 100 !important;
    }



    .pagination {
        display: flex;
        justify-content: center;
    }

    .pagination__list {
        display: flex;
        align-items: center;
        justify-content: center;
        list-style-type: none;
        color: var(--text);
        padding-left: 6px;
    }

    .pagination__item {
        padding: 6px;
        margin: 6px;
        cursor: pointer;
    }

    .pagination__item--active {
        font-weight: 800;
        color: coral;
    }




    .left-button-position {
        position: absolute;
        left: 16px;
    }

    .maplibre-ruler {
        margin-top: 10px !important;
        height: 30px;
        width: 30px;
        background-image: url("assets/ruller.1782e11d68e8.png") !important;
        background-size: 20px 20px;
        background-repeat: no-repeat;
        background-position: center;
        background-color: var(--bg-control) !important;
        border: 1px solid var(--line-strong);
        border-radius: 4px !important;
    }

    .maplibre-ruler:hover {
        background-color: #FF6C3E;
    }

    .maplibre-ruler-clicked {
        margin-top: 10px !important;
        height: 30px;
        width: 30px;
        background-image: url("assets/ruller.1782e11d68e8.png") !important;
        background-size: 20px 20px;
        background-repeat: no-repeat;
        background-position: center;
        background-color: var(--bg-control) !important;
        border: 3px solid #FF6C3E;
        border-radius: 6px !important;
    }

    .maplibre-rul {
        background-color: #ffffff;
    }

    .maplibre-control {
        cursor: pointer;
    }

    #messageContainer {
        position: fixed;
        top: 15%;
        left: 50%;
        transform: translateX(-50%);
        color: var(--text) !important;
        text-decoration: none;
        border-radius: 2px;
        border: 0.5px solid var(--line-strong);
        background: rgba(var(--bg-2-rgb), 0.9);
        margin-top: 10px;
        padding: 10px 10px 8px 17px;
        opacity: 0;
        /*transition: opacity 0.5s ease-in-out;*/
        z-index: 0;
    }

    .messageError {
        border: 0.5px solid var(--line-strong) !important;
        background: rgba(166, 0, 9, 0.9) !important;
    }

    .showMessage {
        opacity: 1 !important;
        z-index: 99999 !important;
    }

    .local-label {
        background-color: transparent;
        border: none;
        box-shadow: none;
        font-family: "Roboto", sans-serif;
        color: var(--text);
        font-weight: bolder;
        font-size: 14px;
        display: inline-block;
        letter-spacing: 0.9px;
        text-shadow: -1px -1px 0 black,
        1px -1px 0 black,
        -1px 1px 0 black,
        1px 1px 0 black; /* Цвет обводки */
    }

    /*.local-label::before {
        background-color: transparent;
        border: none;
        content: attr(data-label); 
        position: absolute;
        z-index: -1;      
        font-weight: bolder;
        font-size: 14px;
        letter-spacing: 0.9px;
        color: black;
        -webkit-text-stroke: 2px black;         
    }*/

    /*----------------------Start Layer Selection-----------*/
    .collapsedlist {
        background-image: url("assets/layers-icon.efe94a4612bd.svg") !important;
        background-size: 28px 28px !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
        overflow: hidden !important;
        cursor: pointer !important;
    }

    .hiddenlistclass {
        display: none;

    }

    #layerSelection {
        width: 50px !important;
        height: 50px !important;
        background: rgba(var(--bg-rgb), 0.66);
        border: 1px solid var(--line-strong);
        z-index: 45;
    }


    #layerSelection:hover {
        filter: brightness(110%);
    }

    #layerSelectionHidden {
        position: absolute;
        width: max-content;
        max-height: 400px;
        bottom: -1px;
        left: -1px;
        overflow: auto;
        scrollbar-color: #FF6C3E var(--line-strong);
        scrollbar-width: thin;
    }

    #closeLayersList {
        float: right;
    }


    #layerSelectionHidden .layers-title {
        font-weight: 600;
        color: var(--text-strong);
        margin-left: 5px;
    }

    #layerSelectionHidden .sidecontent::-webkit-scrollbar {
        width: 7px;
    }

    #layerSelectionHidden .sidecontent::-webkit-scrollbar-track {
        background: var(--inverse-bg);
    }

    #layerSelectionHidden .sidecontent::-webkit-scrollbar-thumb {
        background-color: #FF6C3E;
    }

    #layerSelectionHidden .btn-close {
        color: #000;
        background-color: #FF6C3E;
        opacity: 1;
        margin-left: 5px;
        margin-right: 5px; /*new*/
    }

    .listoflayers {
        padding: 10px 10px 10px 0;
        /*padding-right: 10px; new*/
        background-color: var(--bg);
        bottom: 0;
        left: 0;
        border-radius: 4px;

    }

    .layer-list-elem .layer-list-label {
        display: inline-block !important;
        cursor: pointer;
    }

    .listoflayers .layer-list-elem {
        background-color: var(--bg);
        color: var(--text-strong);
    }

    .addlayers {
        display: inline-block;
        margin-left: .55em;
        vertical-align: -0.5em;
        content: "";
        border-top: 0.4em solid #FE7F45 !important;
        border-right: .4em solid transparent;
        border-bottom: 0;
        border-left: .4em solid transparent;
        cursor: pointer;
        height: 15px;
        width: 11px;
    }

    .listoflayers .list-group-item {
        padding: 0.3rem 0.5rem;
    }

    input.marker-event.addpseudo + span::after {
        opacity: 0 !important;
        background-image: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 20 20%27><path fill=%27none%27 stroke=%27%23fff%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%273%27 d=%27M6 10h8%27/></svg>") !important;
    }

    input.marker-event.addpseudo + span {
        background-image: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 20 20%27><path fill=%27none%27 stroke=%27%23fff%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%273%27 d=%27M6 10h8%27/></svg>") !important;
    }

    /* Скрываем стандартный чекбокс и радиокнопку */
    .layers-list input[type="checkbox"],
    .layers-list input[type="radio"] {
        display: none;
    }

    /* Создаем кастомный чекбокс */
    .layer-list-elem span.list-custom-checkbox,
    .layer-list-elem span.list-custom-radio {
        display: inline-block;
        width: 15px;
        height: 15px;
        background-color: #e1e1e1;
        border: 1px solid #e1e1e1;
        border-radius: 1px;
        position: relative;
        cursor: pointer;
        margin-right: 8px;
    }

    /* Стилизуем галочку для чекбокса */
    .list-custom-checkbox::after {
        content: '';
        position: absolute;
        top: 0;
        left: 2px;
        width: 8px;
        height: 8px;
        border: solid #e1e1e1;
        border-width: 0 3px 3px 0;
        transform: rotate(45deg);
        opacity: 0;
        transition: opacity 0.2s;
    }

    /* Состояние при checked для чекбокса */
    .layer-list-elem input[type=checkbox]:checked + span {
        background-color: #FE7F45 !important;
        border-color: #FE7F45 !important;
    }

    .layer-list-elem input[type="checkbox"]:checked + span::after {
        opacity: 1;
    }

    /* Создаем кастомную радиокнопку */
    .layer-list-elem span.list-custom-radio {
        border-radius: 50%;
    }

    /* Стилизуем внутренний кружок радиокнопки */
    .list-custom-radio::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 9px;
        height: 9px;
        background-color: #e1e1e1;
        border-radius: 50%;
        transform: translate(-49%, -51%);
        opacity: 0;
        transition: opacity 0.1s;
    }

    /* Состояние при checked для радиокнопки */
    .layer-list-elem input[type="radio"]:checked + span {
        background-color: #FE7F45;
        border-color: #FE7F45;
    }

    .layer-list-elem input[type="radio"]:checked + span::after {
        opacity: 1;
    }

    .layers-list {
        padding: 4px 10px;
    }

    ul.listoflayers {
        list-style-type: none;
    }

    .sub-layers-list {
        margin-left: 15px;
        margin-top: 1px;
    }

    /*----------------------End Layer Selection-----------*/

    /*-------------------set local-pin zindex------------*/
    /*-----------------set z-index for cluster and events--------------*/
    .huge_z_index {
        z-index: 2000 !important;
    }


    /*-----------------Start searchBox--------------------------*/
    .maplibre-searchbox-wrapper {
        display: flex;
        justify-content: right;
        height: 40px;
        /*border-top-left-radius: 20px 50%;
        border-bottom-left-radius: 20px 50%;
        border-top-right-radius: 20px 50%;
        border-bottom-right-radius: 20px 50%;*/
    }

    .maplibre-searchbox-wrapper .maplibre-searchbox,
    .maplibre-searchbox-wrapper .maplibre-searchbox-button,
    .maplibre-searchbox-container .maplibre-searchbox-autocomplete,
    .maplibre-searchbox-autocomplete .maplibre-searchbox-autocomplete-item {
        background-color: white;
        border: 1px rgba(0, 0, 0, 0.3) solid;
        outline: none;
        transition-duration: 0.2s;
    }

    .maplibre-searchbox-wrapper .maplibre-searchbox {
        width: 300px;
        font-size: 17px;
        transition-delay: 0.1s;
        z-index: 702;
    }

    .maplibre-searchbox-wrapper .maplibre-searchbox-left {
        /*border-top-left-radius: 20px 50%;
        border-bottom-left-radius: 20px 50%;*/
        border-right: none;
        padding: 0px 0px 0px 15px;
    }

    .maplibre-searchbox-wrapper .maplibre-searchbox-right {
        /*border-top-right-radius: 20px 50%;
        border-bottom-right-radius: 20px 50%;*/
        border: 0.5px solid var(--line-strong);
        border-left: none;
        background-color: var(--bg);
        color: var(--text);
        padding: 0px 5px 0px 8px;
        margin-left: -2px;
    }

    .maplibre-searchbox-wrapper .maplibre-searchbox-button {
        width: 40px;
        transition-delay: 0s;
        z-index: 702;
    }

    .maplibre-searchbox-wrapper .maplibre-searchbox-button:hover {
        cursor: pointer;
    }

    .maplibre-searchbox-wrapper .maplibre-searchbox-button-right {
        /*border-top-right-radius: 20px 50%;
        border-bottom-right-radius: 20px 50%;*/
        border-left: none;
    }

    .maplibre-searchbox-wrapper .maplibre-searchbox-button-left {
        /*border-top-left-radius: 20px 50%;
        border-bottom-left-radius: 20px 50%;*/
        border-right: none;
    }

    .maplibre-searchbox-wrapper .maplibre-searchbox-button i {
        font-size: 130%;
    }

    .maplibre-searchbox-container .maplibre-searchbox-icon {
        width: 100%;
        height: auto;
    }

    .maplibre-searchbox-container .maplibre-searchbox-autocomplete {
        /*position: absolute;*/
        /*top: 20px;*/
        width: 100%;
        list-style-type: none;
        margin-top: 0px;
        padding: 20px 0px 0px 0px;
        background-color: white;
        border-top: none;
        z-index: 701;
    }

    .maplibre-searchbox-container .maplibre-searchbox-autocomplete:empty {
        display: none;
    }

    .maplibre-searchbox-autocomplete .maplibre-searchbox-autocomplete-item {
        width: 100%;
        border-left: none;
        border-right: none;
        border-top: none;
        z-index: 701;
        font-size: 15px;
        padding: 3px 10px;
        cursor: pointer;
    }

    .maplibre-searchbox-autocomplete .maplibre-searchbox-autocomplete-item:hover {
        background-color: #f3f3f3;
    }

    .collapsed .maplibre-searchbox {
        width: 0px !important;
        padding: 0px;
        transition-delay: 0s;
    }

    .collapsed .maplibre-searchbox {
        border-left: none;
        border-right: none;
    }

    .collapsed .maplibre-searchbox-button {
        border-radius: 50%;
        transition-delay: 0.2s;
        border: 1px rgba(0, 0, 0, 0.3) solid;
    }

    .collapsed .maplibre-searchbox-autocomplete {
        display: none;
    }

    .maplibre-searchbox-wrapper.open .maplibre-searchbox,
    .maplibre-searchbox-wrapper.open .maplibre-searchbox-button {
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .maplibre-searchbox-wrapper {
        width: auto;
        height: 30px;
        margin-top: 10px;
        line-height: 26px;
        color: black;
    }

    .maplibre-searchbox-button img {
        /*filter: invert(1);*/
        padding-bottom: 2px;
    }

    .card {
        position: absolute;
        top: 50%;
        left: 45px;
        display: flex;
        flex-direction: column;
        min-width: 10rem;
        word-wrap: break-word;
        background-color: var(--bg-2);
        background-clip: border-box;
        /*border: 0.5px solid var(--line-strong);*/
        width: 18rem;
        max-height: 20rem;
        z-index: 2000;
    }

    #localSearchHeader {
        padding: 0.5rem 1rem;
        margin-bottom: 0;
        background-color: var(--bg-2);
        color: var(--text-strong);
        border-bottom: 1px solid var(--line-strong);
        cursor: move;
    }

    #localSearchHeader .btn-close {
        filter: invert(1) !important;
        color: var(--text-strong);
    }

    #localSearchList {
        scrollbar-color: #FF6C3E var(--line-strong);
        scrollbar-width: thin;
    }

    #localSearchList li {
        margin-top: 0 !important;
        border-color: var(--line-strong);
        border-width: 0 0 0.5px 0 !important;
    }

    /*-----------------End searchBox--------------------------*/

    .jvectormap-tip {
        display: none !important;
    }

    /*----------------New polygon-------------------*/
    .tooltip-poly-info {
        position: absolute;
        pointer-events: none;
        opacity: 0.7;
        background-color: rgba(0, 0, 0, 0.7) !important;
        color: var(--text-strong) !important;
        padding: 3px 8px 3px 8px !important;
        border: 1px solid var(--line-strong);
        border-radius: 1px;
        z-index: 2000;
    }

    .cnt-menu-poly-info {
        position: absolute;
        pointer-events: auto;
        display: flex;
        flex-wrap: nowrap;
        flex-direction: column;
        justify-content: start;
        background-color: rgba(0, 0, 0, 0.7);
        color: var(--text-strong);
        border: 1px solid var(--line-strong);
        border-radius: 1px;
        z-index: 2000;
    }

    .cnt-menu-poly-info .cnt-button {
        vertical-align: middle;
        width: 250px;
        padding: 6px 5px 6px 8px;
        cursor: pointer;
        border: 1px solid transparent;
        border-bottom: 1px solid var(--line);
    }

    .cnt-menu-poly-info .cnt-button:hover {
        background-color: rgba(0, 0, 0, 0.8);
        font-weight: 600;
        cursor: pointer;
    }

    /*-------------End New Polygon-----------------*/
    /**------------------------Buttons control------------------*/
    .maplibre-middle-right {
        margin-top: 10px !important;
        width: 35px;
        height: 150px;
        background-color: transparent;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .contr-edit-button {
        width: 30px;
        height: 30px;
        border: 1px solid var(--line-strong);
        background-image: url("assets/spritesheet.deac1d4aa2cc.png");
        background-repeat: no-repeat;
        background-size: 300px 30px;
        background-clip: padding-box;
        background-color: var(--bg-control) !important;
        border-radius: 4px !important;
        display: flex;
        flex-wrap: nowrap;
        text-align: center;
        text-decoration: none;
    }

    .contr-edit-button:nth-child(1) {
        background-position: -30px -2px !important;
    }

    .contr-edit-button:nth-child(2) {
        background-position: -0px -1px !important;
    }

    .contr-edit-button:nth-child(3) {
        background-position: -150px -2px !important;
    }

    .contr-edit-button:nth-child(4) {
        background-position: -180px -1px !important;
    }

    .contr-edit-button:hover {
        cursor: pointer;
    }

    .maplibre-top {
        pointer-events: auto !important;
    }

    .button-disable {
        opacity: 0.5 !important;
        cursor: default !important;
        pointer-events: none !important;
    }

    .list-buttons {
        display: flex;
        flex-wrap: nowrap;
        flex-direction: row;
        background-color: rgba(165, 165, 165, 0.85);
        justify-content: flex-start;
        align-items: center;
        white-space: nowrap;
        position: relative;
        top: 0;
        left: 0;
        cursor: default;
    }

    .list-buttons:first-child {
        margin-left: 32px;
    }

    .list-sub-buttons {
        display: flex;
        flex-wrap: nowrap;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        white-space: nowrap;
        padding: 1px 12px 1px 12px;
    }

    .edit-buttons {
        margin-left: 0 !important;
        padding-left: 32px !important;
    }

    .active-sub-buttons {
        cursor: pointer !important;
    }

    /**------------------------END Buttons control------------------*/

    .elem-disable {
        pointer-events: none !important;
        z-index: 600 !important;
        /*touch-action: none; !important;*/
    }

    .elem-disable:hover {
        cursor: not-allowed !important;
    }

    .zindex-105 {
        z-index: 105 !important;
    }

    .region-z-index {
        z-index: 205 !important;
    }

    /**-----------------------subscribe-buttons---------------------*/
    .navbar-collapse .navbar-text .subscribe-button {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        border: 2px solid var(--line-strong);
        border-radius: 2px;
        background: rgb(255, 85, 53);
        background: -o-linear-gradient(81deg, rgb(255, 85, 53) 0%, rgb(254, 127, 69) 54%);
        background: linear-gradient(9deg, rgb(255, 85, 53) 0%, rgb(254, 127, 69) 54%);
        color: #fff;
        cursor: pointer;
        display: flex;
        font-size: 14px;
        height: 24px;
        justify-content: center;
        padding: 3px 7px;
        position: relative;
    }

    .navbar-collapse .navbar-text .subscribe-button:hover {
        filter: brightness(140%);
    }


    .navbar-collapse .navbar-text .subscribe-button::after {
        display: none;
    }

    .popup-welcome__text a {
        color: #fe7f45;
    }

    .popup-welcome__text a:hover {
        color: var(--text-muted);
    }


    .maplibre-canvas-layer {
        will-change: transform;
        backface-visibility: hidden;
    }

    .local-label.is-hidden {
        opacity: 0;
    }


    #pagButtons {
        /*margin-top: auto;  пагинация уезжает вниз */
        padding-top: 12px; /* небольшой отступ от списка */
    }


    @media (max-height: 720px) {
        #layerSelectionHidden {
            max-height: 210px;
        }
    }

    @media (max-height: 300px) {
        #layerSelectionHidden {
            max-height: 90px;
        }
    }


    /* Увеличиваем шрифт на экранах шире 2560px */
    @media (min-width: 2080px) {
        .local-label {
            font-size: 18px;
        }
    }

    /*@media (min-resolution: 192dpi) {
        .local-label {
            font-size: 18px;
        }
    }*/

    /* Если нужно ещё больше на очень больших экранах */
    @media (min-width: 2560px) {
        .local-label {
            font-size: 20px;
        }

        /* Если нужно ещё больше на очень больших экранах */
        @media (min-width: 3656px) {
            .local-label {
                font-size: 22px;
            }
        }
    }

    @media (max-height: 650px) {
        .maplibre-control-zoom.maplibre-bar.maplibre-control {
            display: none;
        }

        .maplibre-top.maplibre-right .maplibre-legend.maplibre-bar.maplibre-control {
            position: fixed !important;
            left: 80px !important;
            bottom: 20px !important;
        }

    }

    @media (max-height: 465px) {
        .maplibre-middle-right.maplibre-control {
            display: none;
        }

        .maplibre-control-zoom.maplibre-bar.maplibre-control {
            display: none;
        }

    }

    @media (max-height: 450px) or (max-width: 850px) {
        .marker_cluster .mc {
            width: 27px;
            height: 29px;
            background-size: 27px 29px;
            background-repeat: no-repeat;
            background-position: center;
            background-image: var(--cluster-bg);
        }

    }

    @media (min-height: 650px) {
        .maplibre-legend {
            position: absolute;
            top: -55px;
            left: -3px;
        }
    }


    /* Стили трансформационной рамки */
    .transform-box {
        position: absolute;
        box-sizing: border-box;
        border: 2px dashed blue;
        pointer-events: none;
        padding: 12px;
        top: 0;
        left: 0;
    }

    .rotate-dot {
        box-sizing: border-box;
        width: 20px;
        height: 20px;
        background-image: url("data:image/svg+xml,<%3Fxml version=\"1.0\" encoding=\"iso-8859-1\"%3F><svg fill=\"%230000FF\" height=\"800px\" width=\"800px\" version=\"1.1\" id=\"Capa_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 214.367 214.367\" xml:space=\"preserve\"><path d=\"M202.403,95.22c0,46.312-33.237,85.002-77.109,93.484v25.663l-69.76-40l69.76-40v23.494c27.176-7.87,47.109-32.964,47.109-62.642c0-35.962-29.258-65.22-65.22-65.22s-65.22,29.258-65.22,65.22c0,9.686,2.068,19.001,6.148,27.688l-27.154,12.754c-5.968-12.707-8.994-26.313-8.994-40.441C11.964,42.716,54.68,0,107.184,0S202.403,42.716,202.403,95.22z\"/></svg>");
        background-repeat: no-repeat;
        background-position: center;
        background-size: 20px 20px;
        position: absolute;
        pointer-events: all;
        top: -38px;
        left: 42%;
        border-radius: 50%;
        cursor: alias;
    }

    /* Узлы */
    .resize-handle {
        width: 7px;
        height: 7px;
        background: blue;
        position: absolute;
        pointer-events: all;
        border-radius: 50%;
        cursor: grab;
    }

    .handle-topleft {
        top: -5px;
        left: -5px;
        cursor: nwse-resize;
    }

    /*.handle-tm {
        top: -5px;
        left: 50%;
        transform: translateX(-50%);
        cursor: ns-resize;
    }*/

    .handle-topright {
        top: -5px;
        right: -5px;
        cursor: nesw-resize;
    }

    /*.handle-ml {
        top: 50%;
        left: -5px;
        transform: translateY(-50%);
        cursor: ew-resize;
    }*/

    /*.handle-mr {
        top: 50%;
        right: -5px;
        transform: translateY(-50%);
        cursor: ew-resize;
    }*/

    .handle-botleft {
        bottom: -5px;
        left: -5px;
        cursor: nesw-resize;
    }

    /*.handle-bm {
        bottom: -5px;
        left: 50%;
        transform: translateX(-50%);
        cursor: ns-resize;
    }*/

    .handle-botright {
        bottom: -5px;
        right: -5px;
        cursor: nwse-resize;
    }


    .maplibre-pane.maplibre-circle-pane, .maplibre-pane.maplibre-circle-pane svg {
        pointer-events: none;
    }

.copy-coord-btn {
    /*position: relative;
    transform: translate(8px, 8px);*/
    margin-left: 16px;
    z-index: 10;
    width: 16px;
    height: 16px;
    border: none;
    background-color: transparent;
    cursor: pointer;
    opacity: 0.2;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAABQCAYAAACOEfKtAAAACXBIWXMAAAsTAAALEwEAmpwYAAABiElEQVR4nO3bsUrEQBRG4XnsW7gv4BRrITYJbiWyW4ovIejLyIpgsSNZrDXJ72TuzZ4Dtw0zXwKZFEmJ6KKy3BcPs9nev6aIWe7L+1dpOsMarrv9aXOze0nRMieAx4/Pkrv96Wq7e0uRMieAQyERzRFgSERzBhgO0RwChkI0p4BhEM0xYAhEcw44G7H1l4H9zO3DU3PAWYhjLlo7y33J3aHcPT43B5yM6AXweF70oeqTOGWvoxG9AA7VRpy611GIngBrI87Z65+I3gBrIs7d66+IHgFrIf7HaSEM4NASL5apNyAUoDfEkICeEMMCekEMDegBMTxga8RVALZEXA1gK8RVAbZAdA1o4lw0oBqAYgCKASgGoBiAYgCKASgGoBiAYgCKASgGoBiAYgCKASgGoBiAYgCKASgGoBiAYgCKASgGoBiAYgCKASgGoBiAYgCKASgGoBiAYgCKASgGoBiAYgCKTf0lQpnVAqZWASgGoBiAYgCKASgGoBiAYgCKLXmKtyW/EIjSmvsGOd8rWqRrpGwAAAAASUVORK5CYII=);

    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.copy-coord-btn:hover {
    opacity: 0.8;
}

/*for sidepanel filter*/
 .events-sidebar-tools {
    display: flex;
    align-items: center;
    gap: 5px;
    min-height: 28px;
    padding: 3px 6px;
    background: var(--bg);
    /*border-top: 1px solid rgba(220, 230, 240, 0.12);
    border-bottom: 1px solid rgba(220, 230, 240, 0.16);*/
    box-sizing: border-box;
}

.events-sidebar-tools__select {
    flex: 1 1 auto;
    height: 22px;
    min-height: 22px;
    padding: 1px 22px 1px 7px;
    border: 1px solid rgba(var(--text-rgb), 0.26);
    border-radius: 3px;
    background-color: var(--bg);
    color: var(--text);
    font-size: 11px;
    line-height: 18px;
    outline: none;
    cursor: pointer;
}

.events-sidebar-tools__select:focus {
    border-color: #FE7F45;
    box-shadow: 0 0 0 1px rgba(254, 127, 69, 0.35);
}

.events-sidebar-tools__select option {
    background: var(--bg-control);
    color: var(--text);
}

.events-sidebar-tools__sort {
    display: flex;
    align-items: center;
    gap: 3px;
    flex: 0 0 auto;
}

.events-sidebar-tools__btn {
    width: 22px;
    height: 22px;
    padding: 0;
    border: 1px solid rgba(var(--text-rgb), 0.28);
    border-radius: 3px;
    background: var(--bg-control);
    color: var(--text);
    font-size: 13px;
    line-height: 18px;
    font-weight: 600;
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}

.events-sidebar-tools__btn:hover {
    border-color: #FE7F45;
    color: #FE7F45;
}

.events-sidebar-tools__btn--active,
.events-sidebar-tools__btn--active:hover {
    border-color: #FE7F45;
    background: #FE7F45;
    color: #1d1d1d;
}

.events-sidebar-tools__date-toggle {
    display: flex;
    align-items: center;
    gap: 4px;
    height: 21px;
    min-height: 21px;
    padding: 0 6px;
    margin: 0;
    border: 1px solid rgba(var(--text-rgb), 0.26);
    border-radius: 3px;
    background: var(--bg-control);
    color: var(--text);
    font-size: 11px;
    line-height: 18px;
    font-weight: 500;
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
}

.events-sidebar-tools__date-toggle:hover {
    border-color: #FE7F45;
    color: #FE7F45;
}

.events-sidebar-tools__date-input {
    width: 12px;
    height: 12px;
    margin: 0;
    accent-color: #FE7F45;
    cursor: pointer;
}

.events-sidebar-tools__sort {
    display: flex;
    align-items: center;
    gap: 3px;
    flex: 0 0 auto;
}

@media (max-width: 510px) {
    .events-sidebar-tools {padding-right: 30px}
}

/*
 * 01-controls-base.css — часть разбитого map-ui.css (бывш. new_style27.css).
 * Контролы карты (zoom/bar/legend), .maplibre-top/left, базовый layout: #sidebar, .maplibre-container, #sidebarCollapse.
 * Порядок правил сохранён из исходника (строки 1–138).
 */
/* styles 14-07-23 segeywebwave@gmail.com */
/* Page styles */
.maplibre-start-button {
    background-image: url("assets/return-map-icon.c1ebdce8f288.svg");
    background-size: cover;
}

.maplibre-top.maplibre-left {
    top: 44%;
    transform: translateY(-50%);
    left: 10px;
}

.maplibre-bar a:last-child {
    border-bottom: 1px solid var(--line-strong);
}

.maplibre-top {
    z-index: 20;
}


.maplibre-top .maplibre-control {
    margin-top: 0;
    margin-right: 0;
}


#sidebar {
    background-color: var(--bg);
    position: relative !important;
    padding: 0;
    transition: all 0.2s !important;
    z-index: 50; /*new*/
    height: 100%;
}

.maplibre-container {
    background: var(--bg) !important;
}

.myactive {
    width: 480px !important;
    min-width: 480px !important;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    padding: 25px 0 25px 30px !important;
}

#sidebarCollapse {
    background-color: transparent !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 27px !important;
    height: 279px !important;
    left: initial !important;
    right: 480px !important;
    border: none !important;
    background-image: url("assets/slice-dark-icon.b83b7e772b2a.svg") !important;
    /*background-size: cover;*/
    background-repeat: no-repeat;
}

/* Плавающая иконка выбранного типа в режиме нанесения события/объекта: летит за курсором.
   pointer-events:none — не перехватывает клики по карте; z-index выше карты/панелей.
   Событие — SVG-пин (острие снизу, translate -50%/-100%), объект — центрированный PNG. */
.maplibre-create-cursor {
    position: fixed;
    z-index: 1200;
    width: 34px;
    transform: translate(-50%, -100%);
    pointer-events: none;
    display: none;
}

.maplibre-create-cursor svg {
    display: block;
    width: 34px;
    height: auto;
}

.maplibre-create-cursor--object {
    transform: translate(-50%, -50%);
}

.maplibre-create-cursor--object img {
    display: block;
    width: 32px;
    height: auto;
}

/*
 * 02-event-feed.css — часть разбитого map-ui.css (бывш. new_style27.css).
 * Лента событий: шапка (.event-feed*), поле поиска #eventSearch, карточки списка .event-item*.
 * Порядок правил сохранён из исходника (строки 139–453).
 */
.event-feed__light {
    display: flex;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    width: 55%;
}

.event-feed__light span {
    line-height: 0;
    height: 0;
    color: var(--text-faint);
}

.event-feed__right {
    position: relative;
    width: 45%;
}

#event-feed {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--text-muted);
    text-align: center;
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    column-gap: 15px;
    margin-bottom: 15px;
}

#event-feed .input-group {
    height: 20px;
    padding-left: 0;
    padding-right: 0;
    min-width: 110px;
}

#event-feed .input-group input {
    border-radius: 2px;
    border: 0.5px solid var(--line-strong);
    background: var(--bg-2);
    color: var(--text-muted);
    text-align: left;
    font-size: 12px;
    font-weight: 400;
    padding-left: 3px;
}

#event-feed .form-control {
    padding: 0;
}

#event-feed .mb-3 {
    margin-bottom: 0 !important;
}

.event-feed-title {
    color: var(--text-strong);
    font-size: 24px;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
    margin-bottom: 10px;
}

/* Поменял название id request на eventSearch*/
#eventSearch.form-control {
    border-radius: 2px;
    border: 0.5px solid var(--line-strong);
    background: var(--bg-2);
    color: var(--text-muted);
    text-align: left;
    font-size: 12px;
    font-weight: 400;
    padding: 0 10px 0 7px;
    height: 20px;
}

#eventSearch.form-control::placeholder {
    color: rgba(var(--muted-rgb), 0.50);
    font-size: 12px;
    font-weight: 400;
    line-height: normal;
    text-align: left;
}

#sidethirdrow {
    margin-top: 100px;
}

#sidebar .sidecontent {
    scrollbar-color: #FF6C3E var(--line-strong);
    scrollbar-width: thin;
    padding-right: 20px;
}

#sidebar .sidecontent::-webkit-scrollbar {
    width: 7px;
}

#sidebar .sidecontent::-webkit-scrollbar-track {
    background: var(--inverse-bg);
}

#sidebar .sidecontent::-webkit-scrollbar-thumb {
    background-color: #FF6C3E;
}

.event-item {
    border-radius: 2px;
    border: 0.5px solid var(--line-strong);
    background: var(--bg-2);
    margin-top: 10px;
    padding: 10px 10px 8px 17px;
}

.event-item-for-search {
    border-radius: 2px;
    border: 0.5px solid var(--line-strong);
    background: var(--bg-2);
    margin-top: 10px;
    padding: 10px 10px 8px 17px;
    color: var(--text);
    font-size: 12px;
}

.event-item:hover {
    filter: brightness(110%);
}

.event-item__top {
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: flex-start;

}

.event-item__bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--text);
    text-align: left;
    font-size: 11px;
    font-weight: 400;
    line-height: normal;
}

.event-item__bottom-left {
    display: flex;
    justify-content: space-between;
    align-items: center;
    column-gap: 10px;
}

.event-item__bottom-right {
    display: flex;
    justify-content: space-between;
    align-items: center;
    column-gap: 20px;
}

.event-item__icons {
    display: flex;
    justify-content: space-between;
    align-items: center;
    column-gap: 5px;
}

.event-item__bottom-img {
    width: 13px;
    height: 8px;
    background-image: url("assets/img-icon.d8601e8ec458.svg");
    background-size: cover;
    background-repeat: no-repeat;
    cursor: pointer;
}

.event-item__bottom-video {
    width: 13px;
    height: 8px;
    background-image: url("assets/video-icon.5aa18096f1ae.svg");
    background-size: cover;
    background-repeat: no-repeat;
    cursor: pointer;
}



.event-item__wrapper {
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    column-gap: 5px;
    width: max-content;
    padding-left: 0;
    padding-right: 0;
}

.event-item__flag {
    width: 13px;
    height: 8px;
    background-color: var(--inverse-bg);
}

.event-item__place {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    column-gap: 5px;
    width: 100%;
}

.event-item__place-flag {
    display: block;
    width: 13px;
    height: 8px;
    background-color: var(--inverse-bg);
}

.event-item__view-count {
    position: relative;
    padding-left: 15px;
}

.event-item__view-count::before {
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 1px;
    width: 11px;
    height: 6px;
    background-image: url("assets/eye-icon.3f6318a3355e.svg");
    background-size: cover;
    background-repeat: no-repeat;
}

/* Число комментариев — рядом с просмотрами (значок «облачко» из CSS, цвет текста). */
.event-item__comments {
    position: relative;
    padding-left: 15px;
}

.event-item__comments[hidden] {
    display: none;
}

.event-item__comments::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 1px;
    width: 10px;
    height: 8px;
    border: 1.5px solid currentColor;
    border-radius: 2px;
    opacity: 0.75;
    transform: translateY(-60%);
}

.event-item__comments::after {
    content: '';
    position: absolute;
    top: calc(50% + 3px);
    left: 3px;
    width: 4px;
    height: 4px;
    border-bottom: 1.5px solid currentColor;
    border-left: 1.5px solid currentColor;
    opacity: 0.75;
    transform: skewY(-35deg);
}

.event-item__text {
    position: relative;
    color: var(--text-strong);
    text-align: justify;
    font-size: 12px;
    font-weight: 700;
    line-height: normal;
    padding-left: 10px;
    /*height: 24px;*/
    word-wrap: break-word;
    overflow: hidden;
}


.event-item__text__for_empty {
    color: var(--text-strong);
    text-align: justify;
    font-size: 14px;
    font-weight: 500;
    line-height: normal;
    word-wrap: break-word;
    overflow: hidden;
}


/*Поменял стиль 29-07*/
.event-item__icon {
    min-width: 33px !important;
    margin-bottom: -10px;
    background-repeat: no-repeat;
    background-position: center;
    /*23 01 25 */
    background-size: 31px 33px;
    width: 31px;
    height: 33px;
}

#sidebarCollapse::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 15px;
    height: 15px;
    background-image: url("assets/white-arrow-icon.7773dc0460e3.svg") !important;
    background-size: 15px 15px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

#sidebarCollapse.opensidebar::after {
    transform: translate(-50%, -50%) rotate(180deg) !important;
}

#sidebarCollapse {
    right: initial !important;
    left: -25px !important;
}

/* Лента закрыта (#sidebar шириной 0 у правого края): язычок целиком левее края — при -25px
   он торчал за экран на 2 px и на телефоне расширял страницу (горизонтальная прокрутка). */
#sidebar:not(.myactive) #sidebarCollapse {
    left: -27px !important;
}


/*
 * 03-sidepanel-detail.css — часть разбитого map-ui.css (бывш. new_style27.css).
 * Панель детали события: #mySidepanel, #panel*, #eventCarousel, #sourceBlock, .linked-events*, кнопка поиска.
 * Порядок правил сохранён из исходника (строки 454–758).
 */
.eventsidepanel {
    background: var(--bg) !important;
}

#mySidepanel {
    position: relative !important;
    width: 472px !important;
    top: 0 !important;
    color: var(--text-strong) !important;
    scrollbar-color: #FF6C3E var(--line-strong);
    scrollbar-width: thin;
    opacity: .975;
}

#mySidepanel::-webkit-scrollbar {
    width: 7px;
}

#mySidepanel::-webkit-scrollbar-track {
    background: var(--inverse-bg);
}

#mySidepanel::-webkit-scrollbar-thumb {
    background-color: #FF6C3E;
}

.eventsidepanel {
    padding: 35px 45px 0 26px !important;
}

#panelTitle {
    padding-right: 20px;
    word-wrap: break-word;
}

#panelTitle h4 {
    margin-top: 0;
    color: var(--text-strong);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    padding-left: 0;
    padding-right: 0;
    line-height: normal;
}

.eventsidepanel-flex {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    width: 20px;
    height: 20px;
    line-height: 0.3;
    position: absolute;
    top: 48px;
    right: 43px;
    font-size: 32px;
    padding: 0 !important;
}

.eventsidepanel-flex .closebtn {
    display: block;
    position: static !important;
    width: 15px;
    height: 15px;
    color: var(--text-strong);
    margin-bottom: 5px;
}

.eventsidepanel-flex .linkbtn {
    display: block;
    min-width: 30px;
    min-height: 35px;
    background-image: url("assets/go-link-icon.9c5cd04049f3.svg") !important;
    background-size: 50px !important;
    background-repeat: no-repeat !important;
    background-position: -15px;
}

#panelAddInfo {
    margin-bottom: 6px;
}

#panelCoord {
    margin-bottom: 30px;
}

#panelAddInfo .event-item__place,
#panelAddInfo .event-item__view-count,
#panelAddInfo .event-item__public-date,
#panelCoord .event-item__place-name {
    width: max-content;
    color: var(--text);
    text-align: justify;
    font-size: 12px;
    font-weight: 400;
    line-height: normal;
}

#panelCoordinates, #panelDate {
    display: none !important;
}

#eventCarousel {
    padding: 6px;
    border: 1px solid #FF6C3E;
    border-radius: 5px;
    background: var(--bg);
    overflow: hidden;
    position: relative;
}

/* Кнопки перелистывания фото: bootstrap по умолчанию даёт полупрозрачные иконки без фона —
   на светлых снимках они теряются. Делаем круглую тёмную подложку с оранжевой рамкой (тема
   панели), иконку — крупнее и непрозрачной, чтобы стрелки было хорошо видно на любом фото. */
#eventCarousel .carousel-control-prev,
#eventCarousel .carousel-control-next {
    width: 38px;
    height: 38px;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(var(--bg-rgb), 0.75);
    border: 1px solid #FF6C3E;
    border-radius: 50%;
    opacity: 1;
}

#eventCarousel .carousel-control-prev {
    left: 8px;
}

#eventCarousel .carousel-control-next {
    right: 8px;
}

#eventCarousel .carousel-control-prev:hover,
#eventCarousel .carousel-control-next:hover {
    background: rgba(255, 108, 62, 0.85);
}

#eventCarousel .carousel-control-prev-icon,
#eventCarousel .carousel-control-next-icon {
    width: 20px;
    height: 20px;
}

#panelContent {
    /* В шаблоне это <div class="row"> (bootstrap flex). Из-за flex контент внутри становился
       flex-элементами: ссылки растягивались на всю ширину, а <br> между абзацами игнорировался.
       Возвращаем обычный блочный поток, чтобы текст/ссылки/переносы вели себя как обычный HTML. */
    display: block;
    margin-top: 20px;
    padding-left: 0;
    padding-right: 0;
    color: var(--text-strong);
    text-align: justify;
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    word-wrap: break-word;
}

#panelContent p {
    padding-left: 0;
    padding-right: 0;
    color: var(--text-strong);
    text-align: justify;
    font-size: 13.5px;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 12px;
}

/* Ссылки в описании: linkifyContent при показе оборачивает URL в <a class="source__link">.
   Наследуем размер текста (не крупнее абзаца), акцентный цвет + подчёркивание, перенос
   длинных URL по словам. display:inline + сброс padding — переопределяют правило
   `.eventsidepanel a` (display:block, padding 8px, font-size 25px — старый Leaflet-стиль
   навигации), из-за которого ссылки-подписи вставали каждая на своей строке и были крупными. */
#panelContent a,
#panelContent a.source__link {
    display: inline;
    padding: 0;
    color: #FF6C3E;
    font-size: inherit;
    text-decoration: underline;
    word-break: break-word;
}

.maplibre-searchbox-button, .maplibre-start-button {
    width: 30px !important;
    height: 30px !important;
    border-radius: 4px !important;
    background-color: var(--bg-control) !important;
    border: 1px solid #ccc !important;
}

.maplibre-control-container,
.maplibre-top .maplibre-left {
    width: max-content;
    height: max-content;
}

.maplibre-control-container {
    width: 70px;
    height: 100%;
    position: relative;
}

#sourceBlock .source-box {
    padding-left: 0;
    padding-right: 0;
    font-size: 14px;
    font-style: italic;
    font-weight: 400;
    line-height: normal;
}

#sourceBlock .source-box a {
    display: inline;
    color: #FE7F45;
    font-size: 14px;
    font-style: italic;
    font-weight: 400;
    line-height: normal;
    text-decoration-line: underline;
    padding: 0;
}

.source__name {
    margin-bottom: 2px;
}

#sourceBlock .source-box {
    margin-bottom: 15px;
}

.linked-events {
    width: 100%;
    background-color: var(--bg-2);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 0 23px 8px 23px;
    border-radius: 2px;
    border: 1px solid var(--line-strong);
    margin-top: 20px;
    margin-bottom: 28px;
    transition-duration: .15s;
}

.linked-events__title {
    position: relative;
    padding-top: 8px;
    width: 100%;
    height: 40px;
    color: var(--text-strong);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    display: flex;
    align-items: center;
    cursor: pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.linked-events__title::before {
    content: '';
    position: absolute;
    top: calc(50% + 4.5px);
    transform: translateY(-50%);
    right: 0;
    width: 11px;
    height: 6px;
    background-image: url("assets/up-arrow.8385820a76d9.svg");
    background-size: cover;
    background-repeat: no-repeat;
    transition-duration: .15s;
}

.linked-event {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    height: 0;
    border-bottom: none;
    overflow: hidden;
}

.linked-event__name {
    color: var(--text-strong);
    text-align: left;
    font-size: 10px;
    font-weight: 400;
    line-height: normal;
    padding-left: 15px;
}

.linked-event__icon {
    /*background-color: #fff;*/
    width: 26px;
    height: 24px;
}


.linked-event__date {
    color: var(--text-faint);
    text-align: right;
    font-size: 10px;
    font-style: italic;
    font-weight: 400;
    line-height: normal;
    margin-left: auto;
}


.linked-events__opened {
    padding: 0 23px 17px 23px;
}

.linked-events__opened .linked-event {
    height: 25px;
    border-bottom: 1px solid rgba(var(--muted-rgb), 0.25);
    overflow: visible;
    transition-duration: 0s;
}

.linked-events__opened .linked-events__title::before {
    top: calc(50% + 2px);
    transform: rotate(180deg);
}

.linked-events__opened .linked-events__title {
    margin-bottom: 5px;
}

.eventsidepanel a:hover {
    color: var(--text-muted);
}

.linked-events__opened .linked-event:last-child {
    border-bottom: none;
}


/*
 * 04-popup-welcome.css — часть разбитого map-ui.css (бывш. new_style27.css).
 * Приветственный попап .popup-welcome* и слайдер Swiper (.swiper*).
 * Порядок правил сохранён из исходника (строки 759–977).
 */
/* Popup welcome */
.popup-welcome {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 720px;
    min-width: 320px;
    height: auto;
    max-height: 100%;
    background-color: var(--bg);
    padding: 25px 45px 50px 45px;
    flex-direction: column;
    align-items: center;
    -webkit-box-shadow: 0 0 20px 4px rgba(0, 0, 0, .3); /*new*/
    box-shadow: 0 0 20px 4px rgba(0, 0, 0, .3);
    z-index: 550;
    overflow: auto;
    scrollbar-color: #737578 #dddddd;
    scrollbar-width: thin;
}

@media (max-width: 480px) {
    .popup-welcome {
        height: 75%;
    }
}

.popup-welcome::-webkit-scrollbar {
    width: 7px;
}

.popup-welcome::-webkit-scrollbar-track {
    background: #dddddd;
}

.popup-welcome::-webkit-scrollbar-thumb {
    background-color: #737578;
}

.popup-welcome__wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 100%;
    height: auto;
}

.popup-welcome__top-title {
    color: var(--text-strong);
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    line-height: normal;
    height: 40px;
}

.popup-welcome__logo {
    width: 207px;
    height: 42px;
    margin-bottom: 15px;
    background-image: url("assets/logo-white.e4a6b124f9e9.png");
    background-size: contain;
    background-repeat: no-repeat;
}

.popup-welcome__text {
    color: var(--text-strong);
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 20px;
}

.popup-welcome__slide {
    width: 592px;
    height: 368px;
    border-radius: 8px;
    border: 1px solid var(--text-muted);
    background: var(--bg-2);
    overflow: hidden;
}

.popup-welcome__slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.popup-welcome__swiper {
    width: 100%;
    height: 400px;
    margin-bottom: 15px;
    padding-bottom: 2px !important;
}

.popup-welcome .swiper-pagination {
    position: static;
}

.popup-welcome .swiper-pagination-bullet {
    width: 72px;
    height: 8px;
    border-radius: 8px;
    border: 1px solid var(--text-muted);
    background: var(--bg);
    opacity: 1;
}

.popup-welcome .swiper-pagination-bullet-active {
    border: 1px solid #FE7F45;
    background: #FE7F45;
}


.popup-welcome .swiper-button {
    background-color: var(--bg-2);
    border: 1px solid #ccc;
    border-radius: 3px;
    width: 32px;
    height: 32px;
    line-height: 26px;
    display: block;
    text-align: center;
    text-decoration: none;
    color: black;
    background-size: 15px 15px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.popup-welcome .swiper-button-prev {
    background-image: url("assets/white-arrow-icon.7773dc0460e3.svg") !important;
    top: 55%;
    transform: translateY(-50%) rotate(180deg);
    left: -15px;
}

.popup-welcome .swiper-button-next {
    background-image: url("assets/white-arrow-icon.7773dc0460e3.svg") !important;
    top: 55%;
    transform: translateY(-50%);
    right: -15px;
}

.popup-welcome .swiper-button-next::after,
.popup-welcome .swiper-button-prev::after {
    content: '';
}

.swiper {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1;
    display: block;
}

.swiper-button-prev, .swiper-rtl .swiper-button-next {
    /*left: var(--swiper-navigation-sides-offset,10px);*/
    right: auto;
}

.swiper-button-next, .swiper-rtl .swiper-button-prev {
    /*right: var(--swiper-navigation-sides-offset,10px);*/
    left: auto;
}

.swiper-button-next, .swiper-button-prev {
    position: absolute;
    top: 50%;
    width: calc(44px * 27);
    height: 44px;
    margin-top: calc(0px - (44px / 2));
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
    display: block;
}

.swiper-android .swiper-slide, .swiper-wrapper {
    transform: translate3d(0px, 0, 0);
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition:transform 0.5s ease;
    box-sizing: content-box;
}

.button-disabled {
  opacity: 0.7; /* Затемнение */
  pointer-events: none; /* Отключение взаимодействия */
  user-select: none; /* Отключение выделения текста */
}

/* End of popup welcome */


/*
 * 05-sidepanel-wrapper.css — часть разбитого map-ui.css (бывш. new_style27.css).
 * Обёртка панели .mySidepanel-wrapper, .card-title-side, .event-feed-btn, стилизация date-picker.
 * Порядок правил сохранён из исходника (строки 978–1069).
 */
.mySidepanel-wrapper {
    width: 480px;
    display: block;
    position: fixed;
    right: 0;
    top: 54px;
    z-index: 60; /*new*/
    transition: all 0.2s !important;
    transform: translateX(110%);
}

.mySidepanel-wrapper.mySidepanel-wrapper_opened {
    transform: translateX(1.7%);
    /* width: 480px; */
}


.card-title-side {
    background-color: transparent;
    position: absolute;
    top: 260px;
    transform: translateY(-50%);
    left: -30px;
    width: 30px;
    height: 310px;
    border: none;
    background-image: url("assets/card-slice-icon.d6150a275517.svg");
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 500;
    background-position: 0 10px;
    opacity: .97;
    filter: drop-shadow(0px 0px 60px rgba(254, 127, 69, 0.25)) drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
}


.event-feed-btn {
    background-color: transparent;
    position: absolute;
    top: 490px;
    transform: translateY(-50%);
    left: -33px;
    width: 29px;
    height: 307px;
    border: none;
    background-image: url("assets/event-feed-icon.c80e9ab1c695.svg");
    background-size: 96%;
    background-repeat: no-repeat;
}

input[type="date" i]::-webkit-calendar-picker-indicator {
    filter: invert(1) !important;
}

.eventsidepanel a:hover {
    color: #FE7F45 !important;
    opacity: .7;
}

#collapseExample {
    padding-left: 10px;
    padding-right: 10px;
}


/*
 * 06-search-slider.css — часть разбитого map-ui.css (бывш. new_style27.css).
 * Очистка поиска #clearSearch, слайдер диапазона дат (jQuery UI .ui-slider*), кнопки next/prev.
 * Порядок правил сохранён из исходника (строки 1070–1170).
 */
/* styles 26-07-23 segeywebwave@gmail.com */

#clearSearch {
    position: absolute;
    right: 2px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    z-index: 20;
    font-style: normal;
    font-size: 16px;
    line-height: 1;
    width: 16px;
    height: 16px;
}

#sliderContainer {
    background-color: var(--bg);
    border-radius: 3px;
    z-index: 5;
}

.slider-container__box {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
    justify-content: flex-start;
}

.linked-events--hidden {
    display: none;
}

.ui-state-default, .ui-widget-content .ui-state-default {
    background-color: #FE7F45;
}

.slider-button__wrapper {

    width: 50%;
    max-width: max-content;
    padding: 1px;
}

.slider-range__wrapper {
    display: flex;
    align-items: center;
    width: 50%;
    padding-left: 30px;
    padding-right: 10px;
    flex-grow: 1;
}

/*Поменял*/
.ui-slider-horizontal {
    height: 6px;
    border-radius: 0;
    /*border-radius: none;*/
}

#slider-range {
    width: 100%;
    margin: 0;
}

.ui-slider-horizontal .ui-slider-handle {
    top: -0.5em;
}

button#prev,
button#next {
    font-size: 14px;
    font-weight: 400;
    border: 1px solid var(--line-strong);
    border-radius: 2px;
    color: var(--text);
}

button#prev {
    border-right: none;
}

.slider-button__wrapper .btn-group {
    margin-left: 1px;
}

button#prev:hover,
button#next:hover {
    background-color: transparent;
    filter: brightness(130%);
}

button#prev:focus-visible,
button#next:focus-visible {
    background-color: transparent;
    border-color: var(--line-strong);
    outline: 0;
    box-shadow: none;
}

/*Поменял*/

/*
 * 07-navbar-modals.css — часть разбитого map-ui.css (бывш. new_style27.css).
 * Навбар (.navbar-text/toggler), модалки создания #CreateEvent/#CreateObject, .form-check, кнопки.
 * Порядок правил сохранён из исходника (строки 1171–1309).
 */
.navbar-text {
    display: flex;
    align-items: center;
    /*column-gap: 15px;*/
    width: max-content;
    column-gap: 10px;
}

.navbar-text__welcome {
    color: var(--text);
    font-size: 15px;
}

.navbar-toggler {
    border: none;
    margin-top: 2px;
    outline: none;
}

.navbar-toggler:focus {
    text-decoration: none;
    outline: 0;
    box-shadow: none;
}

#collapseMarkers {
    margin-top: 5px;
}

/*Поменял-закоментил 30-07 */
.form-check .form-check-label {
    line-height: 1;
    font-size: 14px;
    /*min-height: 28px;*/
    display: flex !important;
    align-items: center;
}


#CreateEvent .modal-content {
    background-color: var(--bg);
    color: var(--text-strong) !important;
}

.modal-content {
    background-color: var(--bg);
    color: var(--text-strong) !important;
}

@media (max-width: 700px) {
    .modal-dialog {
        max-width: 80%;
        margin: 0 auto;
    }
}

@media (max-width: 570px) {
    .modal-dialog {
        max-width: 100%;
        width: 100%;
    }
}

#closeUpperModalButtonObject,
#closeUpperModalButton {
    filter: invert(1);
}

#CreateObject {
    scrollbar-color: #FF6C3E var(--line-strong);
    scrollbar-width: thin;
}

#CreateObject::-webkit-scrollbar {
    width: 7px;
}

#CreateObject::-webkit-scrollbar-track {
    background: var(--inverse-bg);
}

#CreateObject::-webkit-scrollbar-thumb {
    background-color: #FF6C3E;
}

.form-check .form-check-label {
    padding-left: 7px;
}

#saveObjectModalButton,
#saveModalButton {
    background-color: #FF6C3E;
    color: #fff;
}

#saveObjectModalButton:hover,
#saveModalButton:hover {
    background-color: #c75431;
    color: #fff;
}

#eventObjImages > p:nth-child(1) {
    color: #1b2026;
}

.btn {
    border: none;
}

.slider-buttons-wrapper {
    position: relative;
    width: 100%;
    height: auto;
}

.popup-welcome-close {
    position: absolute;
    top: 12px;
    right: 15px;
    width: 18px;
    height: 18px;
    background: transparent url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27 fill=%27%23fff%27%3e%3cpath d=%27M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z%27/%3e%3c/svg%3e") center/1em auto no-repeat;
    background-size: cover;
    background-repeat: no-repeat;
    border: 0;
    outline: 0;
}

.sidebar__mobile-close { /*new*/
    display: none;
    background: none;
    border: 0;
}

.display-none {
    display: none !important;
}



/*
 * 08-responsive-a.css — часть разбитого map-ui.css (бывш. new_style27.css).
 * Адаптив панелей и ленты (media 768/510/850/480px).
 * Порядок правил сохранён из исходника (строки 1310–1558).
 */
@media (max-width: 768px) {

    .navbar > .container-fluid {
        background-color: var(--bg);
    }

    .popup-welcome {
        padding-left: 22px;
        padding-right: 22px;
        padding-top: 35px; /*new*/
        padding-bottom: 15px;
    }

}


@media (max-width: 510px) {
    #main_map {
        height: 100%;
        width: 100% !important;
        min-width: 100% !important;
        overflow: hidden;
    }

    #sidebar {
        background-color: var(--bg);
        top: 50px;
        right: 0;
        /* Высота 100% от top: 50px уходила на 50 px ниже экрана: страница прокручивалась,
           а низ ленты был недоступен. */
        height: calc(100% - 50px);
        position: absolute !important;
        padding: 0;
        transition: all 0.2s !important;
        z-index: 100;
    }

    .myactive {
        height: 100%;
        display: block;
        z-index: 900;
        width: 100% !important;
        min-width: 100% !important;
        padding: 25px 30px 25px 30px !important;
    }


    #mySidepanel {
        width: 100% !important;
        z-index: 1500;
    }

    #mySidepanel .eventsidepanel {
        padding: 35px 25px 0 25px !important;
    }

    .mySidepanel-wrapper {
        width: 100% !important;
        z-index: 2000;
    }

    .mySidepanel-wrapper.mySidepanel-wrapper_opened {
        transform: translateX(0);
    }

    #event-feed {
        margin-top: 20px;
        flex-direction: column;
        align-items: flex-start;
        row-gap: 12px;
    }

    .event-feed__light {
        width: 80%;
        min-width: 230px;
    }

    .event-feed__right {
        width: 80%;
        min-width: 230px;
    }

    #eventSearch.form-control {
        font-size: 16px;
        height: 30px;
    }

    #clearSearch {
        font-size: 20px;
        line-height: 0.8;
    }

    #event-feed .input-group {
        height: 25px;
    }

    #sidebar .sidecontent {
        padding-right: 0;
    }

    .myactive .sidebar__mobile-close {
        display: block;
        width: 15px;
        height: 15px;
        color: var(--text-strong);
        margin-bottom: 5px;
        font-size: 32px;
        padding: 0 !important;
        text-decoration: none;
        transition: 0.1s;
        position: absolute;
        top: 22px;
        right: 35px;
        cursor: pointer;
        line-height: 1;
        z-index: 10;
    }

    .eventsidepanel-flex {
        right: 28px;
    }

}

@media (min-width: 768px) and (max-width: 850px) {

    .navbar-text__welcome {
        font-size: 13px;
    }
}

@media (max-width: 480px) {

    .maplibre-control-container {
        display: none;
    }

    .popup-welcome {
        width: 80%;
        max-width: 720px;
        min-width: 320px;
    }

    .popup-welcome__swiper {
        height: 165px;
        margin-bottom: 0;
    }

    .slider-buttons-wrapper {
        margin-bottom: 25px;
    }

    .popup-welcome .swiper-button-next,
    .popup-welcome .swiper-button-prev {
        top: 60%;
    }

}


/*
 * 09-legend-draw-detail.css — часть разбитого map-ui.css (бывш. new_style27.css).
 * Легенда карты (.maplibre-legend*), #divselectpicker, #eventImages.
 * Порядок правил сохранён из исходника (строки 1559–1770).
 */
.form-check-input:focus {
    border-color: initial;
    box-shadow: none;
}

.collapse-form-check {
    margin-left: 10px;
}

.maplibre-legend-title {
    color: var(--text);
}

.maplibre-legend-contents .legend-label {
    color: var(--text);
}

.maplibre-legend.maplibre-control {
    background-color: #1b202684 !important;
}

.maplibre-legend.maplibre-bar.maplibre-control {
    width: 50px;
    height: 50px;
    margin-right: 0;
    border: 1px solid var(--line-strong) !important;
    border-radius: 5px;
    z-index: 0;
    cursor: pointer;
}

.maplibre-legend.maplibre-control.maplibre-legend-expanded {
    width: auto;
    height: auto;
    background-color: var(--bg) !important;
    border: 1px solid var(--bg) !important;
    z-index: 35;
}

.maplibre-legend-contents {
    padding: 10px;
    border-radius: 4px;
    background-color: var(--bg);
    user-select: none;
}

.maplibre-control {
    z-index: 10;
}

#eventImages {
    margin-top: 30px !important;
}

/*Поменял 01-08*/
.sidepanel-event-background {
    width: 140px;
    height: 140px;
    position: absolute;
    background-repeat: no-repeat;
    background-size: 130px;
    opacity: 0.20;
    left: -20px;
    top: -20px;
    z-index: -1;
}

.maplibre-control-cascadeButtons button {
    box-shadow: none;
}

.maplibre-control-cascadeButtons button {
    background-color: var(--bg-control);
    border-radius: 4px;
}

.maplibre-control-cascadeButtons.vertical.maplibre-control {
    box-shadow: none;
}

#closeUpperModalButtonPolygon {
    filter: invert(1);
}

.maplibre-legend-expanded .maplibre-legend-contents {
    display: block;
    padding: 6px 15px 6px 6px;
    position: absolute;
    bottom: -52px;
    left: 59px;
}

.maplibre-legend.maplibre-control.maplibre-legend-expanded {
    width: 50px;
    height: 50px;
    background-color: rgba(var(--bg-rgb), 0.66) !important;
    border: 1px solid var(--line-strong) !important;
    z-index: 35;
}

.maplibre-legend-column {
    margin-left: 0;
}

.maplibre-legend-contents {
    background-color: #1b2026e2;
}

.maplibre-legend-title {
    color: var(--text);
    padding-left: 5px;
    font-size: 16px;
    margin-bottom: 0;
}

#eventImages p {
    color: #000;
}

/*
 * Контейнер выпадающего списка выбора объекта (модалка «Создание события»).
 * Внутри лежит виджет Choices (.choices), заменивший старый bootstrap-select.
 * Раньше здесь стояло height:25px + display:flex/align-items:center под
 * инлайновый bootstrap-select. Choices — блочный виджет min-height 44px, и в
 * роли flex-item он сжимался по содержимому (в узкую полоску) и обрезался по
 * высоте 25px. Убираем flex и фиксированную высоту: пусть Choices занимает
 * всю ширину колонки и высоту по содержимому.
 */
#divselectpicker {
    margin-top: .25rem !important;
}

/* Виджет Choices растягиваем на всю ширину колонки. */
#divselectpicker .choices {
    width: 100%;
    margin-bottom: 0;
}

/* Текст виджета (выбранное значение + пункты выпадающего списка) — тёмный.
 * Без этого текст наследовал светлый цвет и был почти не виден на белом фоне модалки. */
#divselectpicker .choices__inner,
#divselectpicker .choices__list--single .choices__item,
#divselectpicker .choices__list--dropdown .choices__item {
    color: #333;
}

#panelAddInfo .event-item__place,
#panelCoord .event-item__place {
    padding-left: 5px;
}

/*
 * 10-responsive-b.css — часть разбитого map-ui.css (бывш. new_style27.css).
 * Адаптив каскад-кнопок и слайдеров (media 950/1000/600/510/480/…px).
 * Порядок правил сохранён из исходника (строки 1771–1979).
 */
@media (max-width: 950px) {

    .myactive {
        padding-right: 0 !important;
    }

    #pagButtons {
        padding-right: 30px;
    }

    #sidebar .sidecontent {
        height: calc(100% - 35px) !important;
    }

    .eventsidepanel {
        padding: 18px 45px 0 26px !important;
    }

    .eventsidepanel-flex {
        top: 30px;
    }

    #type-coord {
        display: none !important;
    }

   /* .maplibre-control-zoom.maplibre-bar.maplibre-control {
        display: none !important;
    }*/

    /*.maplibre-top.maplibre-left {
        position: fixed !important;
        top: 150px !important;
        left: 15px !important;
    }*/
}

/* 19-07-24 */


.maplibre-control-cascadeButtons .horizontal {
    width: calc(100vw - 540px);
    flex-wrap: wrap;
}

.maplibre-control-cascadeButtons button {
    min-width: 30px;
}


@media (max-width: 950px) {

    #type-coord {
        display: flex !important;
    }

    /*.maplibre-control-zoom.maplibre-bar.maplibre-control {
        display: block;
    }*/

    /*.maplibre-top.maplibre-left {
        top: 30% !important;
        left: 15px !important;
    }*/

    .maplibre-control-cascadeButtons .horizontal {
        width: calc(100vw - 140px);
    }

}

@media (max-width: 600px) {

    .maplibre-control-cascadeButtons .horizontal {
        width: calc(100vw - 50px);
        flex-wrap: wrap;
    }

}

@media (max-width: 510px) {
    .event-feed__light {
        width: 100%;
        padding-right: 30px;
    }

    .event-feed__right {
        width: 100%;
        padding-right: 30px;
    }
}

@media (max-width: 480px) {
    .maplibre-control-container {
        display: block;
    }
}

.maplibre-control-cascadeButtons.maplibre-control {
    pointer-events: none;
}

.maplibre-control-cascadeButtons .horizontal button {
    pointer-events: all;
}

#sliderContainer {
    min-width: 50%;
}

@media (max-width: 1100px) {

    #sliderContainer {
        min-width: 60%;
    }

}

@media (max-width: 850px) {

    #sliderContainer {
        min-width: 70%;
        max-width: initial;
    }
}

@media (max-width: 450px) {

    #sliderContainer {
        min-width: 65%;
    }
}

@media (max-width: 400px) {

    .slider-container__box {
        flex-direction: column;
    }

    .slider-range__wrapper {
        width: 100%;
        /*padding-top: 15px;
        padding-bottom: 15px;
        padding-right: 30px;*/
    }
}


@media (max-width: 325px) {

    #sliderContainer {
        min-width: 60%;
    }

}


/* new styles 03-10-24 */



/*
 * 11-overrides-misc.css — часть разбитого map-ui.css (бывш. new_style27.css).
 * Разное и поздние override: .jvectormap-tip, навбар-приветствие, комментарии, #toast-container, кнопки детали, пагинация, override зума.
 * Порядок правил сохранён из исходника (строки 1980–2248).
 */
.jvectormap-tip {
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    width: max-content;
}

.navbar-text__welcome a {
    /*color: #fff;*/
    text-transform: initial;
    display: inline;
    border: none;
    padding-left: 3px;
    padding-right: 0;
    color: #FF6C3E;
    font-weight: 700;
}

.navbar-text__welcome a:hover,
.navbar-text__welcome a:focus {
    color: #FF6C3E;
}

.navbar-text > a:nth-child(2) {
    margin-top: 0;
}

.navbar-text .navbar-text__welcome a::after {
    display: none;
}

@media (max-width: 335px) {
}


/* .modal-backdrop {
    z-index: 2000;
}

#CreateEvent {
    z-index: 2100;
}

#toast-container {
    z-index: 2200;
}

*/

/* nav#main_nav_bar {
    z-index: 1900;
} */

.popup-welcome {
    z-index: 2000;
}

#objectChooseEvent {
    flex-shrink: 0;
}

#formEvent .col-4.align-middle.mt-1 {
    min-width: 200px;
}

#saveCommentButton {
    min-width: 32px;
}

#buttonsgroupfordetail .btn {
    font-size: 15px;
    font-weight: 400;
    border: 1px solid var(--line-strong);
    border-radius: 2px;
    background: transparent;
    height: 38px;
}

#buttonsgroupfordetail .btn:hover {
    color: var(--text-muted);
}


#buttonsgroupfordetail .btn-danger {
    color: #FF6C3E;
    border: 1px solid #FF6C3E;
}

#buttonsgroupfordetail .btn-danger:hover {
    color: #1D2227;
    border: 1px solid #FF6C3E;
    background-color: #FF6C3E;
}

#eventPanelSource iframe {
    left: 20px;
}

.mySidepanel-wrapper {
    z-index: 1000;
}

.maplibre-start-button {
    background-image: url("data:image/svg+xml;utf8,<svg version=\"1.1\" id=\"_x32_\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"800px\" height=\"800px\" viewBox=\"0 0 512 512\" xml:space=\"preserve\"><g><path fill=\"%23fff\" d=\"M463.203,105.688c-3.047-4.25-6.234-8.406-9.609-12.484C406.641,36.313,335.531,0,256,0C176.484,0,105.359,36.313,58.406,93.203c-3.375,4.078-6.563,8.234-9.594,12.484C18.078,147.922,0,199.844,0,256c0,56.313,18.156,108.484,49.031,150.719c3.125,4.328,6.406,8.563,9.844,12.656C105.844,475.922,176.719,512,256,512c79.688,0,150.813-36.406,197.75-93.438c3.453-4.078,6.734-8.313,9.781-12.641C494.078,363.766,512,312,512,256C512,199.844,493.922,147.922,463.203,105.688z M471.688,247.969H385.75c-0.625-32.563-5.031-63.438-12.5-91.219c21.156-7.219,40.594-16.359,57.781-27.063C455.328,163.156,470.047,203.938,471.688,247.969z M263.984,41.906c37.375,5.188,70.438,46.109,89.297,104.281c-27.469,7.828-57.594,12.406-89.297,13.094V41.906z M247.984,41.906v117.375c-31.703-0.688-61.828-5.266-89.297-13.094C177.547,88.016,210.609,47.094,247.984,41.906z M247.984,175.266v72.703H142.219c0.625-30.766,4.891-60.094,11.984-86.516C183.094,169.75,214.703,174.594,247.984,175.266z M247.984,263.969v72.703c-33.234,0.797-64.828,5.734-93.703,14.094c-7.141-26.484-11.422-55.922-12.063-86.797H247.984z M247.984,352.656v117.375c-37.297-5.172-70.313-45.938-89.188-103.938C186.625,358.031,216.734,353.453,247.984,352.656z M263.984,470.031V352.625c31.703,0.563,61.859,5.094,89.359,12.875C334.5,423.813,301.406,464.844,263.984,470.031z M263.984,336.625v-72.656H369.75c-0.625,30.625-4.859,59.859-11.891,86.188C328.938,341.938,297.281,337.188,263.984,336.625z M263.984,247.969v-72.703c33.281-0.672,64.891-5.5,93.797-13.797c7.078,26.406,11.344,55.75,11.969,86.5H263.984z M421.281,117.203c-15.656,9.547-33.344,17.703-52.563,24.266c-13.219-40.938-33.266-74-57.406-94.219C354.906,58.797,393.156,83.609,421.281,117.203z M200.656,47.25c-24.141,20.234-44.188,53.281-57.406,94.203c-19.188-6.563-36.891-14.703-52.531-24.25C118.844,83.625,157.063,58.813,200.656,47.25z M80.969,129.688c17.188,10.703,36.609,19.828,57.75,27.063c-7.469,27.781-11.875,58.656-12.5,91.219H40.313C41.953,203.938,56.688,163.156,80.969,129.688z M40.313,263.969h85.906c0.625,32.688,5.063,63.688,12.594,91.563c-21.094,7.25-40.469,16.359-57.609,27.031C56.75,348.984,41.938,308.109,40.313,263.969z M91.125,395.203c15.875-9.703,33.484-17.797,52.281-24.297c13.219,40.781,33.25,73.703,57.344,93.844C157.344,453.25,119.219,428.594,91.125,395.203z M311.219,464.75c24.25-20.25,44.359-53.438,57.578-94.547c19.281,6.547,37.047,14.719,52.734,24.281C393.313,428.234,354.938,453.156,311.219,464.75z M431.359,381.922c-17.266-10.734-36.781-19.859-58.016-27.063c7.406-27.703,11.781-58.453,12.406-90.891h85.938C470.078,307.859,455.5,348.438,431.359,381.922z\"/></g></svg>");
    /*background-size: contain;*/
    background-size: 65%;
    background-repeat: no-repeat;
    background-position: center;
}

.event-item__bottom {
    flex-wrap: wrap;
    row-gap: 5px;
}

@media (max-width: 500px) {

    /*.maplibre-top.maplibre-left {
        transform: initial;
    }*/

   /* .maplibre-control-zoom.maplibre-bar.maplibre-control {
        position: fixed;
        right: 11px;
        top: 67px;
    }*/

}


#eventFeedIndex {
    min-width: 400px;
}

.pagination__list {
    margin-bottom: 0;
}

@media (max-width: 950px) {
    #sidebar .sidecontent {
        height: 100% !important;
    }
}

@media (max-width: 510px) {

    #listOfEvents {
        padding-right: 30px;
    }

    .event-item__bottom-left {
        padding-right: 7px;
    }

    #sidebar .sidecontent {
        height: calc(100% - 35px) !important;
    }

}


/* 07-10 styles */

.navbar-text:hover {
    filter: brightness(100%);
}

.navbar-text:active {
    transform: translateY(0);
}

#event-feed .input-group input {
    display: flex;
    justify-content: center;
    align-items: center;
}

#panelContent p span {
    color: var(--text-strong) !important;
}

#panelContent p span {
    color: var(--text-strong) !important;
}

#panelContent strong {
    color: var(--text-strong) !important;
}

#tmeSource #eventPanelSource iframe {
    min-width: 330px !important;
    padding-right: 0;
}

#sourceBlock {
    margin-top: 10px;
    word-wrap: break-word;
}

#panelAddInfo {
    flex-wrap: nowrap;
}

#panelAddInfo .event-item__place {
    padding-right: 0;
}

@media (max-width: 400px) {

    #sidebar .event-item__text {
        height: auto;
        text-align: left;
    }

    #sidebar .event-item__bottom-left {
        flex-wrap: wrap;
        row-gap: 5px;
    }

}

.maplibre-control-zoom .maplibre-control-zoom-in,
.maplibre-control-zoom .maplibre-control-zoom-out {
    display: flex !important;
    justify-content: center;
    align-items: center;
}

.maplibre-control-zoom .maplibre-control-zoom-in span,
.maplibre-control-zoom .maplibre-control-zoom-out span {
    height: max-content;
    width: max-content;
    line-height: 0;
}

.maplibre-control-zoom.maplibre-bar.maplibre-control {
    width: 32px;
}


/*
 * map-ui.css — ОГЛАВЛЕНИЕ.
 *
 * Исторически это был монолит на 2248 строк, в котором намешаны стили разных
 * частей интерфейса. Он разбит на тематические файлы в подпапке map-ui/,
 * а здесь остались только @import в ИСХОДНОМ ПОРЯДКЕ — порядок правил CSS важен
 * (каскад/специфичность), поэтому менять последовательность import нельзя.
 *
 * Точки подключения этого файла НЕ менялись: <link> на странице карты и
 * страницах сброса пароля, import в бандлах index и account.
 *
 * Карта тем (по порядку):
 *   01 controls-base      — базовые maplibre-контролы карты + layout сайдбара
 *   02 event-feed         — лента событий (шапка, поиск, карточки списка)
 *   03 sidepanel-detail   — панель детали события (#mySidepanel, источники, связанные)
 *   04 popup-welcome      — приветственный попап + слайдер Swiper
 *   05 sidepanel-wrapper  — обёртка панели, date-picker, .card-title-side
 *   06 search-slider      — очистка поиска + слайдер диапазона дат (jQuery UI)
 *   07 navbar-modals      — навбар + модалки создания события/объекта
 *   08 responsive-a       — адаптив панелей и ленты
 *   09 legend-draw-detail — легенда карты, кнопки рисования, tooltip полигонов
 *   10 responsive-b       — адаптив каскад-кнопок и слайдеров
 *   11 overrides-misc     — разное и поздние override (тосты, пагинация, зум)
 */

/*
 * Страницы восстановления пароля (map/registration/*.html): карточка в стиле входа/регистрации.
 * Цвета — из темы (common/theme/theme.css).
 */
body:has(.restore-wrapper) {
    background: var(--bg-2);
}

.restore-wrapper {
    width: calc(100% - 24px);
    max-width: 460px;
    margin: 48px auto;
    padding: 32px 28px;
    color: var(--text);
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 6px;
    box-shadow: 0 12px 32px var(--shadow);
}

.restore-wrapper h3 {
    margin-bottom: 20px;
    color: var(--text-strong);
    font-size: 24px;
    font-weight: 700;
}

.pass-form-reset label {
    display: none;
}

.pass-form-reset p,
.pass-form-conf p {
    margin: 0 0 14px;
}

.pass-form-reset input,
.pass-form-conf input {
    width: 100%;
    max-width: 100%;
    height: 42px;
    padding: 0 12px;
    color: var(--text);
    background-color: var(--bg-input);
    border: 1px solid var(--line);
    border-radius: 4px;
}

.pass-form-reset input:focus,
.pass-form-conf input:focus {
    border-color: #fe7f45;
    outline: none;
}

/* Капча: картинка и поле в строку. */
.pass-form-reset .captcha {
    margin-right: 8px;
    border-radius: 4px;
}

.pass-form-reset img.captcha + input,
.pass-form-reset input[name^="captcha"] {
    display: inline-block;
    width: calc(100% - 130px);
    vertical-align: middle;
}

.pass-form-reset button,
.pass-form-conf button,
.restore-wrapper .btn,
.restore-wrapper a.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 44px;
    margin-top: 6px;
    color: #fff;
    font-size: 16px;
    background-color: #fe7f45;
    border: 0;
    border-radius: 4px;
}

.pass-form-reset button:hover,
.pass-form-conf button:hover,
.restore-wrapper .btn:hover {
    color: #fff;
    background-color: #ff6c3e;
}

.restore-wrapper a:not(.btn) {
    color: #fe7f45;
}

.card {
    background: transparent !important;
    position: relative !important;
    left: 0;
}

.errorlist {
    margin: 4px 0 0;
    padding-left: 18px;
    color: #e5484d;
}