/* Общие стили для html и body */
@font-face {
    font-family: 'Roboto';
    src: url('fonts/Roboto-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
}
body {
    min-width: 320px;
    font-size: 16px;
    position: relative;
    line-height: 1.65;
    font-family: "Roboto", sans-serif;
    overflow-x: hidden;
    color: #1a1a1a;
    background-image: url('factory.jpeg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-attachment: fixed;
}
/* Блок-обертка */
.b-wrap {
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

/* Основное содержимое */
.b-content {
    margin-bottom: 0;
    flex: 1;
}

/* Красный блок */
.bag {
    background-color: red;
}

/* Заголовок блока */
.b-header .container,
.container {
    background-color: rgba(225, 230, 230, 0.95);
    box-shadow: 0 0 50px rgba(50, 50, 50, 0.5);
    padding: 20px;
}

.container-header,
.container-footer {
    background-color: rgba(225, 230, 230, 0.97);
    box-shadow: 0 0 50px rgba(50, 50, 50, 0.5);
    padding: 15px 20px !important;
}

.card {
    background-color: rgba(255, 255, 255, 0.9);
    box-shadow: 0 0 12px rgba(50, 50, 50, 0.5);
    padding: 7px;
    border-radius: 10px;
}
.card-body {
    padding: 10px;
}
.category-name {
    font-weight: bold;
    color: #333; /* Измените на нужный цвет */
    display: inline-block;
}
.category-description {
    font-size: 0.875rem; /* Размер шрифта изменен на меньший */
    margin-top: 0.1rem;
    margin-bottom: 0.1rem;
}
.form-check {
    margin-bottom: 0.1rem;
}


.b-header .container {
    border-radius: 0 0 15px 15px;
}

.container,
.container-header {
    border-radius: 15px;
}

.container-header {
    border-radius: 0 0 15px 15px;
}

.container-footer {
    border-radius: 15px 15px 0 0;
}

/* Языковой флаг */
.lang_flag {
    font-size: 1,0em;
    padding: 0px 0px;
    margin-right: 3px;
    margin-top: 0px; /* Добавляем больший отступ сверху */
    /* border: 1px solid #00516e; */ /* Закомментируйте или удалите эту строку */
    text-decoration: none;
    color: #333;
    transition: background-color 0.1s ease;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}


.lang_flag_list {
    margin-top: auto;
    margin-bottom: auto;
}



.warning-text-bold {
    font-size: 1.1em;
    font-weight: bold;
}
.warning-text {
    font-size: 0.9em;
}

.category-item {
    display: block;
    margin-top: 0px;
    margin-bottom: 0px;
}




/* Секция контента */
.content-section {
    background-color: rgba(245, 245, 245, 0.5);
}

/* Заголовки статей */
.article-content h4 {
    border-bottom: 2px solid #333;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.article-content h6 {
    border-top: 2px solid #333;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

/* Контейнеры */
.b-content .container {
    margin-bottom: 40px;
}

/* Аккордеон */
.accordion-item {
    margin-bottom: 20px;
}

.accordion-header {
    margin-bottom: 0;
}

/* Футер */
.b-footer .container {
    margin-top: 0;
    max-height: 75px;
}

/* Округленные иконки */
.rounded-icon {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px; /* Расстояние между иконкой и текстом */
}


#violationDateTime {
    border-radius: 0.5rem;
}


.form-container {
    margin-left: 10px; /* Вы можете изменить значение для нужного вам отступа */
    margin-right: 10px; /* Вы можете изменить значение для нужного вам отступа */
    margin-bottom: 10px; /* Вы можете изменить значение для нужного вам отступа */
}

.btn-choose-file {
    background-color: #6c757d; /* Цвет фона (secondary) */
    color: white; /* Цвет текста */
    border-color: #6c757d; /* Цвет границы (secondary) */
    border-radius: 0.25rem; /* Скругление углов */
    transition: background-color 0.3s ease; /* Плавное изменение цвета фона */
    height: 85%;
}

.btn-choose-file:hover {
    background-color: #5a6268; /* Цвет фона при наведении (darkened secondary) */
    color: white; /* Цвет текста при наведении */
    border-color: #5a6268; /* Цвет границы при наведении (darkened secondary) */
}

/* Применение шрифта Roboto к кнопкам и формам */
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.btn {
    font-family: 'Roboto', sans-serif; /* Используем Roboto и, если он недоступен, системный шрифт sans-serif */
}

.social-icons {
    margin-right: 10px; /* Вы можете изменить значение отступа по вашему усмотрению */
}

#result_list .field-display_attachments {
    line-height: 1.2; /* Задайте нужную вам высоту строки */
}

#result_list .field-display_attachments a {
    display: inline; /* Изменяем на инлайновый блок */
    max-width: 200px;  /* Задайте нужную вам максимальную ширину */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-right: 10px; /* Добавляем небольшой отступ между ссылками */
}


.header-logo {
    height: 40px; /* Фиксированная высота */
}

.header-logo img {
    max-height: 100px; /* Максимальная высота */
    max-width: 140px; /* Максимальная ширина */
    object-fit: contain;
    display: block; /* Убирает внутренние отступы */
}

.logo-img {
    max-height: 100px; /* Максимальная высота для логотипа */
    width: auto;
    object-fit: contain;
}

@media (max-width: 576px) { /* Extra small devices (phones) */

    #liveToastBtn {
        font-size: 0.75em; /* Уменьшаем размер шрифта кнопки на маленьких экранах */
    }

    #liveToastBtn {
        width: 100%; /* Устанавливаем ширину кнопки на 100% для маленьких экранов */
    }

    .form-group label,
    .form-control {
        font-size: 0.9em; /* Уменьшение размера шрифта для мобильных устройств */
    }

    .col-3,
    .col-9 {
        width: 100%;
    }

    .btn {
        width: 100%;
        margin-bottom: 10px;
    }

    .header-logo {
        height: 40px; /* Уменьшаем высоту логотипа для мобильных устройств */
    }

    .logo-img {
        max-height: 50px; /* Уменьшаем высоту логотипа для мобильных устройств */
    }

    #backButton {
        width: 100%; /* Увеличиваем ширину кнопки до 100% для маленьких экранов */
        font-size: 0.7em; /* Уменьшаем размер шрифта в кнопке для маленьких экранов */
        margin-bottom: 0px;
    }
    .w-25 {
    width: 50% !important;
}

    .lang_flag_list {
        font-size: 0.8em; /* Уменьшаем размер шрифта для кнопок "RU" и "EN" на маленьких экранах */
    }
}


.margin-left-right {
margin-left: 10px;
margin-right: 10px;
}



@media (min-width: 577px) and (max-width: 991px) { /* Small to medium devices (tablets) */
    .form-group label,
    .form-control {
        font-size: 1em; /* Немного увеличиваем размер шрифта для планшетов */
    }

    .header-logo {
        height: 45px; /* Немного увеличиваем высоту логотипа для планшетов */
    }

    .logo-img {
        max-height: 55px; /* Немного увеличиваем высоту логотипа для планшетов */
    }
}
.error{
    color: #ff0000; /* Красный цвет текста для сообщений об ошибках */
    font-size: 14px; /* Размер шрифта сообщений об ошибках */
    margin-top: 5px; /* Отступ сверху для сообщений об ошибках */
}


.footer_saneg {
    height: 25px;
    width: 250px;
}