:root {
    --color1: #1584b4;
    --color2: #c67921;
}

/* ЦВЕТ ФОНА ВСЕГО САЙТА*/
body {
    background-color: #efefef;
}/* --------------КОНЕЦ */

/* НАСТРОЙКИ ПАНЕЛИ НАВИГАЦИИ */
.nav-pills .nav-link {
    border-radius: 1000px; /* радиус скругления */
    color: #1e1e1e; /* цвет текста */
}
    /* активная кнопка */
.nav-pills .nav-item.show .nav-link,
.nav-pills .nav-link.active {
    background-color: #029bd2;  /* цвет фона */
    color: white;               /* цвет текста */
}
    /* Параметры при наведении*/
.nav-pills .nav-link:hover {
    background-color: #5dc4ea89;
}/* --------------КОНЕЦ */



/* Класс для главной кнопки */
.btn-main {
    background-color: #87c200;          /* цвет фона */
    color: #ffffff;                     /* цвет текста */
    transition: background-color 0.3s;    /* Плавный переход для цвета фона */
    border-radius: 8px;                   /* радиус скругления */
}
    /* Параметры при наведении */
.btn-main:hover {
    background-color: #658617;  /* цвет фона */
    color: #fafafa;             /* цвет текста */
}/* --------------КОНЕЦ */

/* кнопка SCROLLUP */
#ScrollUPid {
    display: none; /* Скрыта по умолчанию */
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 99;
    font-size: 22px;
    border: none;
    outline: none;
    background-color: #555;
    color: white;
    cursor: pointer;
    width: 40px;    /* Фиксированная ширина */
    height: 40px;   /* Фиксированная высота */
    border-radius: 50%; /* Делаем кнопку круглой */
    transition: background-color 0.3s;
}
#ScrollUPid:hover {
    background-color: #333;
}/* --------------КОНЕЦ SCROLLUP */


/* ПЕРЕНОС СТРОК в текстовом файле, когда он достигает конца контейнера */
.textwrap {
    white-space: pre-line; /* Используйте pre-line, если хотите сохранить одинарные пробелы */
}/* --------------КОНЕЦ */

/* Размер иконок */
/* .bi {
    font-size: 1.3rem;
  } */


/* СТИЛЬ ДЛЯ панели кнопок */
.top-panel {
    position: fixed; /* Фиксированное позиционирование относительно окна браузера */
    top: 0px; /* Отступ сверху */
    left: 0px; /* Отступ слева */
    width: 100%;
    z-index: 100; /* Указывает, что форма будет поверх других элементов */
    background: white; /* Фон, чтобы форма выделялась на фоне содержимого страницы */
    padding: 3px; /* Немного отступа внутри формы */
    border: 1px solid #ccc; /* Граница вокруг формы для лучшей видимости */
    box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.2); /* Тень для лучшей видимости */
    --bs-gutter-x: 0;
}/* --------------КОНЕЦ */

/* СТИЛЬ ДЛЯ ТАБЛИЦЫ ЗАЯВОК */
.fixed-table-header {
    position: sticky;
    /*top: 45px;  Это значение устанавливается динамически в JS */
    background: rgb(255, 255, 255);
    z-index: 99;
}


/* ВЫРАВНИВАНИЕ КНОПОК ФИЛЬТРОВ ПОВЕРХУ ПРИ РАСШИРЕНИИ ПАНЕЛИ */
.align-items-top-children > * {
    align-self: flex-start;
}

/* НАСТРОЙКИ РЕДАКТОРА БАЗЫ */
.editor-container {
    display: flex; /* Используйте flexbox для горизонтального расположения */
}
.editor-section {
    flex: 1; /* Каждый раздел будет занимать равную часть контейнера */
    padding: 1px; /* Добавьте немного отступов вокруг списков */
    margin-right: 10px; /* Отступ между разделами */
    /* max-width: 20%; Максимальная ширина каждого раздела */
    /* min-width: 260px; Минимальная ширина каждого раздела для удобства чтения */
}
.editor-list {
    max-height: 450px; /* Максимальная высота списка */
    overflow-y: auto; /* Включить прокрутку если список слишком длинный */
    width: 100%; /* Ширина списка равна ширине его контейнера */
    list-style-type: none; /* Убирает маркеры списка (точки) */
    padding-left: 0.5rem; /* Убирает внутренний отступ слева */
}

.selected-item {
    background-color: #f0f0f0; /* Серый фон для выделения */
    border: 1px solid #d0d0d0; /* Серая рамка */
    padding: 2px;
    margin: 2px;
}
/*конец НАСТРОЙКИ РЕДАКТОРА БАЗЫ */


/* Настройки карусели */
#carouselExampleIndicators .carousel-inner .carousel-item img {
    background-color: #d6d6d6; /* светло-серый фон */;
    max-width: 100%;
    max-height: 80vh; /* 80% от высоты видимой области экрана */
    object-fit: contain; /* Убедитесь, что изображение полностью помещается в контейнер, сохраняя пропорции */
}
.carousel.slide {
    overflow: hidden; /* Предотвращает выход содержимого за пределы карусели */
}
/* КОНЕЦ Настройки карусели */