/* ==========================================================================
   1. ГЛОБАЛЬНАЯ СЕТКА (GRID)
   ========================================================================== */
.atlas-view-wrapper { width: 100%; height: 100%; position: relative; }

.atlas-container {
  display: grid;
  /* ИЗМЕНЕНИЕ: Левая колонка 340px (было 280), разделитель 5px */
  grid-template-columns: 340px 1fr 5px 480px; 
  height: calc(100vh - 140px);
  min-height: 600px;
  width: 100%;
  overflow: hidden;
  border: 1px solid #ddd;
  background: #fff;
}
.atlas-settlement-label {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    font-weight: bold;
    color: #333;
    font-size: 11px;
    /* Эффект белой обводки текста для читаемости на карте */
    text-shadow: 
        -1px -1px 0 #fff,  
         1px -1px 0 #fff,
        -1px  1px 0 #fff,
         1px  1px 0 #fff; 
}
/* Убираем стрелочку у тултипа */
.leaflet-tooltip-top:before {
    display: none;
}
.layout-splitter { background: #e0e0e0; cursor: col-resize; z-index: 10; position: relative; }
body.is-resizing { user-select: none; cursor: col-resize; }

/* ==========================================================================
   2. ЛЕВАЯ КОЛОНКА: СБРОС "ВРЕДНЫХ" СТИЛЕЙ
   ========================================================================== */
.atlas-sidebar-left {
  background: #fff;
  border-right: 1px solid #e0e0e0;
  padding: 20px;
  /* Важно: Разрешаем клавиатуре вылезать за границы */
  overflow: visible !important; 
  z-index: 1100; 
  display: flex;
  flex-direction: column;
}

/* УБИВАЕМ FLOAT ОТ МОДУЛЯ BEF */
.atlas-sidebar-left .bef-exposed-form .form--inline > .form-item, 
.atlas-sidebar-left .bef-exposed-form .form--inline .js-form-wrapper > .form-item,
.atlas-sidebar-left .form--inline .form-item {
    float: none !important;
  /*  display: block !important; */
    width: 100% !important;
    margin-right: 0 !important;
    clear: both !important;
}

.atlas-sidebar-left label, .atlas-sidebar-left legend span {
  font-weight: 700; font-size: 13px; color: #333; text-transform: uppercase; margin-bottom: 5px; display: block;
}

/* Радиокнопки (Язык) */
.atlas-sidebar-left .form-radios .form-item {
  display: flex !important; align-items: center !important; margin-bottom: 8px !important;
}
.atlas-sidebar-left .form-radio { margin-right: 10px !important; float: none !important; }
.atlas-sidebar-left .form-item label { font-weight: 400; text-transform: none; cursor: pointer; margin: 0 !important; }

/* ==========================================================================
   3. ПОЛЕ ПОИСКА + КНОПКА (СТРОГАЯ СТРОКА)
   ========================================================================== */
/* Контейнер (создается через JS) */
.atlas-vk-group {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important; /* ЗАПРЕЩАЕМ ПЕРЕНОС */
  align-items: stretch !important;
  width: 100% !important;
  position: relative;
  margin-bottom: 15px;
}

/* Инпут поиска */
.atlas-vk-group input.form-text {
  flex: 1 1 auto !important; /* Растягиваем */
  width: 1% !important; /* Хак для ширины */
  min-width: 0 !important;
  height: 40px !important;
  border: 1px solid #ccc !important;
  border-right: none !important; /* Стык с кнопкой */
  border-radius: 4px 0 0 4px !important;
  padding: 8px 10px !important;
  margin: 0 !important;
  box-shadow: none !important;
}

/* Кнопка клавиатуры */
.vk-toggle-btn {
  flex: 0 0 40px !important; /* Фиксированная ширина */
  width: 40px !important;
  height: 40px !important;
  background: #f1f3f5 !important;
  border: 1px solid #ccc !important;
  border-radius: 0 4px 4px 0 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.vk-toggle-btn:hover, .vk-toggle-btn.active {
  background: #e9ecef !important;
}

/* ==========================================================================
   4. ВЫПАДАЮЩАЯ КЛАВИАТУРА
   ========================================================================== */
.atlas-virtual-keyboard {
  display: none;
  position: absolute;
  top: 0; 
  left: 100%; /* Справа от группы поиска */
  margin-left: 15px;
  width: 380px;
  background: #fff;
  border: 1px solid #ccc;
  box-shadow: 0 10px 40px rgba(0,0,0,0.3);
  padding: 10px;
  border-radius: 6px;
  z-index: 100000 !important; /* ПОВЕРХ КАРТЫ */
}
.atlas-virtual-keyboard.open { display: contents; }

/* Стрелочка */
.atlas-virtual-keyboard::before {
  content: ""; position: absolute; top: 14px; left: -16px;
  border: 8px solid transparent; border-right-color: #ccc;
}
.atlas-virtual-keyboard::after {
  content: ""; position: absolute; top: 15px; left: -14px;
  border: 7px solid transparent; border-right-color: #fff;
}

.vk-keys { display: grid; grid-template-columns: repeat(8, 1fr); gap: 5px; }
.vk-btn {
  background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 4px;
  height: 38px; display: flex; align-items: center; justify-content: center;
  font-weight: bold; cursor: pointer; user-select: none;
}
.vk-btn:hover { background: #007bff; color: #fff; border-color: #007bff; }

/* ==========================================================================
   5. КНОПКИ ДЕЙСТВИЙ (КОЛОНКА)
   ========================================================================== */
.atlas-sidebar-left .form-actions {
  margin-top: 25px !important;
  display: flex !important;
  flex-direction: column !important; /* Вертикально */
  width: 100% !important;
  gap: 10px !important;
  padding: 0 !important;
}

/* Стиль всех кнопок */
.atlas-sidebar-left .form-actions input, 
.atlas-sidebar-left .form-submit,
.btn-atlas {
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
  padding: 12px !important;
  border-radius: 4px !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  cursor: pointer !important;
  line-height: 1.2 !important;
  float: none !important;
}

/* Применить (Зеленый) */
#edit-submit-atlas-live {
  background-color: #28a745 !important;
  color: #fff !important;
  border: 1px solid #28a745 !important;
}
#edit-submit-atlas-live:hover { background-color: #218838 !important; }

/* Сбросить (Серый) */
#edit-reset-atlas-live {
  background-color: #f8f9fa !important;
  color: #495057 !important;
  border: 1px solid #ced4da !important;
}
#edit-reset-atlas-live:hover { background-color: #e2e6ea !important; }

/* Кнопка "Об атласе" */
.custom-buttons { margin-top: auto; padding-top: 20px; border-top: 1px solid #eee; }
.btn-atlas {
  background: #fff !important;
  color: #17a2b8 !important;
  border: 2px solid #17a2b8 !important;
}
.btn-atlas:hover { background: #17a2b8 !important; color: #fff !important; }

/* ==========================================================================
   6. ПРАВАЯ КОЛОНКА И КАРТА
   ========================================================================== */
.atlas-map-wrapper { background: #eee; z-index: 1; flex-direction: column; }
.atlas-map-wrapper .geolocation-map-wrapper,
.atlas-map-wrapper .leaflet-container { height: 100% !important; width: 100% !important; flex-grow: 1; }

.atlas-sidebar-right { background: #fff; border-left: 1px solid #ddd; z-index: 10; display: flex; flex-direction: column; overflow: hidden; }
.atlas-list-header { padding: 15px; background: #f8f9fa; border-bottom: 1px solid #ddd; font-weight: 700; }
.atlas-list-content { overflow-y: auto; padding: 0; flex-grow: 1; }
.atlas-list-content table { width: 100%; border-collapse: collapse; }
.atlas-list-content td { padding: 10px 15px; border-bottom: 1px solid #f1f1f1; font-size: 14px; }
.atlas-list-content tr:hover { background: #e8f4ff !important; }
tr.is-active { background-color: #fff3cd !important; }
.lang-marker { display: inline-flex; width: 24px; height: 24px; align-items: center; justify-content: center; border-radius: 50%; color: #fff; font-weight: bold; font-size: 12px; margin-right: 10px; }
.style-hanty { background: #007bff; } .style-mansi { background: #28a745; } .style-nenets { background: #dc3545; }
.hidden-coords, .hidden-id, .popup-hidden-id, .hidden-lang-id { display: none !important; }
ul.ui-autocomplete { z-index: 100002 !important; max-height: 300px; overflow-y: auto; background: #fff; border: 1px solid #ccc; }
.atlas-modal-overlay { position: fixed; top:0; left:0; right:0; bottom:0; background: rgba(0,0,0,0.5); z-index: 2000; display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; transition: opacity 0.3s; }
.atlas-modal-overlay.open { opacity: 1; pointer-events: auto; }
.atlas-modal { background: #fff; width: 600px; max-height: 85vh; border-radius: 8px; display: flex; flex-direction: column; position: relative; }
.modal-close { position: absolute; top: 15px; right: 20px; font-size: 28px; cursor: pointer; border: none; background: none; }
.modal-header { padding: 25px; border-bottom: 1px solid #eee; }
.modal-body { padding: 20px; overflow-y: auto; }
.atlas-tabs { display: flex; background: #f8f9fa; border-bottom: 1px solid #ddd; }
.tab-btn { padding: 15px 20px; border: none; background: none; cursor: pointer; border-bottom: 3px solid transparent; font-weight: 600; }
.tab-btn.active { color: #007bff; border-bottom-color: #007bff; background: #fff; }
.tab-content { display: none; padding: 20px; }
.tab-content.active { display: block; }

/* ==========================================================================
   7. ПЕЙДЖЕР (ПОСТРАНИЧНАЯ НАВИГАЦИЯ)
   ========================================================================== */

.atlas-list-pager {
    background: #f8f9fa;
    border-top: 1px solid #ddd;
    padding: 10px;
    flex-shrink: 0;
    z-index: 100;
}

/* Контейнер пейджера - фиксируем внизу правой колонки */
.atlas-sidebar-right .views-element-container > nav.pager, 
.atlas-sidebar-right .item-list .pager,
.atlas-list-pager nav.pager {
    background: #f8f9fa;
    border-top: 1px solid #ddd;
    padding: 10px;
    margin: 0;
    flex-shrink: 0; /* Запрещаем сжиматься */
    display: flex;
    justify-content: center; /* По центру */
    align-items: center;
}

/* Убираем стандартные маркеры списка */
.pager__items {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 5px; /* Расстояние между кнопками */
}

/* Стиль кнопок (Пред / След) */
.pager__item {
    display: inline-block;
}

.pager__item a, 
.pager__item button {
    display: inline-block;
    padding: 6px 12px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    color: #333;
    text-decoration: none;
    font-weight: bold;
    font-size: 13px;
    transition: all 0.2s;
}

.pager__item a:hover {
    background: #007bff;
    color: #fff;
    border-color: #007bff;
}

/* Активная страница (если выберете полный пейджер) */
.pager__item.is-active a {
    background: #007bff;
    color: #fff;
    border-color: #007bff;
    pointer-events: none;
}

/* Скрываем лишние надписи, если они есть (например "Go to page") */
.pager__item--next a::after, 
.pager__item--previous a::before {
    display: none; 
}