body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    font-family: 'Montserrat', sans-serif;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-ThinItalic.ff9c45e92d16.ttf") format('truetype');
    font-weight: 100; /* Thin */
    font-style: italic;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-Thin.b3638b169042.ttf") format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-ExtraLight.a7fe50578d9a.ttf") format('truetype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-ExtraLightItalic.9c3e2f21cc8f.ttf") format('truetype');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-Light.94fbe93542f6.ttf") format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-LightItalic.c54486c33610.ttf") format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-Regular.5e077c15f6e1.ttf") format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-Italic.cc53ad8bb1c8.ttf") format('truetype');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-Medium.bdb7ba651b7b.ttf") format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-MediumItalic.2ed625fc9f03.ttf") format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-SemiBold.cc10461cb5e0.ttf") format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-SemiBoldItalic.75c4176c6461.ttf") format('truetype');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-Bold.ed86af2ed5bb.ttf") format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-BoldItalic.a49032b6a945.ttf") format('truetype');
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-ExtraBold.9e07cac927a9.ttf") format('truetype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-ExtraBoldItalic.8a4a6844448e.ttf") format('truetype');
    font-weight: 800;
    font-style: italic;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-Black.cce7ff8c1d79.ttf") format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url("/static/fonts/Montserrat-BlackItalic.a67f4df02f4d.ttf") format('truetype');
    font-weight: 900;
    font-style: italic;
}

footer {
    margin-top: auto;
}

/* Request List styles by Bard */

/*.card {*/
/*  border-radius: 0.25rem;*/
/*  box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.1);*/
/*}*/

.card-body {
    padding: 1.25rem;
}

.card-title {
    font-size: 1.5rem;
}

.card-subtitle {
    font-size: 0.875rem;
}

.card-text {
    font-size: 0.875rem;
}

.btn {
    font-size: 0.75rem;
}

/*END BARD*/


/* Если таблица выходит за границу родительского элемента, появляется горизонтальный скролл.
<div class="table-x-scroll">
  <table>...</table>
</div>
*/
.table-x-scroll {
    overflow-x: auto;
}

.accordion-button {
    padding: 0.5rem 0.85rem;
}

/* BEGIN ТОЛЬКО ДЛЯ ТОГО ЧТОБЫ МОЙ INPUT БЫЛ FIXED И СОХРАНЯЛ СВОЮ ШИРИНУ */

@media (min-width: 576px) {
    .fixed-input-container {
        max-width: 540px; /* Ширина контейнера sm */
    }
}

@media (min-width: 768px) {
    .fixed-input-container {
        max-width: 720px; /* Ширина контейнера md */
    }
}

@media (min-width: 992px) {
    .fixed-input-container {
        max-width: 960px; /* Ширина контейнера lg */
    }
}

@media (min-width: 1200px) {
    .fixed-input-container {
        max-width: 1140px; /* Ширина контейнера xl */
    }
}

@media (min-width: 1400px) {
    .fixed-input-container {
        max-width: 1320px; /* Ширина контейнера xxl */
    }
}

.fixed-input-container {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1030; /* Убедитесь, что input находится над другими элементами */
}

/* END ТОЛЬКО ДЛЯ ТОГО ЧТОБЫ МОЙ INPUT БЫЛ FIXED И СОХРАНЯЛ СВОЮ ШИРИНУ */

.text-light.bi.bi-qr-code-scan:hover {
    color: yellow !important; /* устанавливаем желтый цвет при наведении  на QR */
}

.hoverable-card:hover {
    background-color: #b3c4d9 !important;
}


/*.sticky-field {*/
/*    position: sticky;*/
/*    top: 0;*/
/*    z-index: 1020; !* Убедитесь, что элемент остается поверх других элементов *!*/
/*    background-color: white; !* Опционально: добавьте фон, чтобы скрыть прокручивающийся контент *!*/
/*    padding: 10px; !* Опционально: добавьте отступы для визуального отделения поля *!*/
/*}*/


.text-size-12 {
    font-size: 12px;
}

a {
    text-decoration: none;
}

/* Для выпадающего списка бюджета, что перекрыть поисковую панель */
.z-index-1031 {
    z-index: 1031; /* или любое другое высокое значение */
    position: relative; /* или absolute/fixed, если необходимо */
}

.z-index-1041 {
    z-index: 1041; /* или любое другое высокое значение */
    position: relative; /* или absolute/fixed, если необходимо */
}

.select2 {
    width: 100% !important;
}


/* Элементы во множественном выборе переносить на новые строки, а не выходить за границы экрана */
.select2-container .select2-selection--multiple {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}

.select2-container .select2-selection__choice {
    white-space: normal;
    margin-right: 0.25em;
    margin-bottom: 0.25em;
}

.select2-container .select2-selection__rendered {
    max-width: 100%;
}

.select2-container .select2-search--inline {
    flex: 1 1 auto;
    width: auto !important;
}

/*Изменение фона всех элементов при наведении*/
/*.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--highlighted {*/
/*    color: #000;*/
/*    background-color: #ffe0e0;*/
/*}*/

/* Стиль для выбранного элемента */
.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--selected,
.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option[aria-selected=true]:not(.select2-results__option--highlighted) {
    color: #fff; /* Цвет текста */
    background-color: #0d6efd; /* Цвет фона для выбранного элемента */
}

/* Убираем изменение фона при наведении на выбранный элемент */
/*.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--selected:hover {*/
/*    background-color: #0d6efd; !* Устанавливаем тот же цвет фона *!*/
/*    color: #fff; !* Устанавливаем тот же цвет текста *!*/
/*}*/

/* HOVER BG */

/* Красит строки таблиц при наведении в другой цвет */
.custom-hoverable-table tr:hover {
    background-color: #d4ddff; /* Светлый серый цвет фона при наведении */
    /*cursor: pointer; !* Изменение курсора при наведении *!*/
}

.certificate-date-bg:hover {
    background-color: #d9f1f8 !important;
}

.hover-blue-bg:hover {
    /*background-color: #ecebeb !important;*/
    background-color: #cdd4f1 !important;
    color: #0c0c0c !important;
}

.hover-text-green:hover {
    /*background-color: #ecebeb !important;*/
    color: #279100 !important;
}

.hover-yellow-bg:hover {
    /*background-color: #ecebeb !important;*/
    background-color: #fdf4d2 !important;
    color: #0c0c0c !important;
}

.hover-light-blue-bg:hover {
    background-color: #d9f1f8 !important;
}

.home-card-bg:hover {
    /*background-color: #ecebeb !important;*/
    background-color: #ffde99 !important;
    color: #0c0c0c !important;
}

/* BG WITHOUT HOVER */

.contract-added-today {
    background-color: #e8f6e8;
}

.bg-ndpp-color {
    /*background-color: #ecebeb !important;*/
    background-color: #ffde99 !important;
    color: #0c0c0c !important;
}

.light-green-bg {
    background-color: #f2faf2;
}

.light-red-bg {
    background-color: rgba(224, 0, 0, 0.1);
}

.bg-light-blue {
    background-color: #e7e5f1;
}

.bg-natural-blue {
    background-color: #f0f8ff;
}

.gray-bg {
    background-color: #ededed;
}

.light-info-bg {
    background-color: rgba(0, 183, 250, 0.09);
}

.pointer-cursor {
    cursor: pointer;
}

/* Выключить перещелкиватели в input number */
.no-spinner::-webkit-inner-spin-button,
.no-spinner::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.no-spinner {
    -moz-appearance: textfield;
}


/* Чтобы пагинация не выходила за рамки экрана */
.pagination-sm {
    flex-wrap: wrap;
    justify-content: center;
}


/* Select2 bug fix */
/*.select2-search__field {*/
/*    width: auto !important;*/
/*}*/


body.dragging {
    user-select: none; /* Отключаем выделение текста */
}


/* Индикатор прочитано/не прочитано */
.unread-indicator-navbar {
    position: absolute;
    top: 5px;
    right: 10px;
    width: 8px;
    height: 8px;
    background-color: #ffc107;
    border-radius: 50%;
    box-shadow: 0 0 4px rgba(255, 193, 7, 0.6);
}


.hover-effect {
    transition: color 0.2s ease;
}

.hover-effect:hover {
    color: var(--bs-success) !important;
}

.hover-button-effect {
    transition: color 0.2s ease;
}

.hover-button-effect:hover {
    color: #ffffff;
    background-color: #788faf !important;
}


.hover-button-status-effect {
    transition: color 0.2s ease;
}

.hover-button-status-effect:hover {
    color: #ffffff;
    background-color: #e0e9f8 !important;
}