/* ---  style.css  --- */

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');

/* ---  Переменные (цвета, размеры и т.д.) --- */
:root {
    --primary-color: #0020a2;
    --secondary-color: #e50019;
    --text-color: #ffffff;
    --background-color: #f8f9fa;
    --border-color: #e50019;
    /*  Добавьте другие переменные, если нужно */
}

/* ---  Общие стили --- */
body {
    font-family: 'Roboto', Arial, sans-serif; /*  Используем Roboto, если он подключен */
    background-color: var(--background-color);
    color: #333; /*  Основной цвет текста */
    font-weight: 400; /*  Нормальная толщина шрифта (убрали 700, если не нужен жирный везде) */
    padding-top: 70px; /*  Отступ сверху, чтобы контент не перекрывался навбаром (подберите значение) */
}

/* ---  Навбар --- */
.navbar {
    background-color: var(--primary-color);
    border-radius: 15px;
    padding: 15px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    border-bottom: 5px solid var(--secondary-color);
}

.logo-left { /*  Этот класс, кажется, не используется */
    color: white;
    font-weight: bold;
    font-size: 24px;
}

.navbar-brand, .nav-link {
    color: var(--text-color) !important;
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;  /*  Жирный шрифт для ссылок в навбаре */
}

.navbar-brand {
    letter-spacing: 1px;
}

.nav-link:hover {
    color: rgba(255, 255, 255, 0.8) !important;
}

/*  Активный пункт меню (добавили стили) */
.navbar-nav .nav-item .nav-link.active {
    color: var(--secondary-color) !important; /*  Или другой цвет */
    font-weight: bold;
    border-bottom: 3px solid var(--secondary-color); /*  Подчеркивание */
}

/*  Выпадающее меню */
.dropdown-menu {
    background-color: #f8f9fa;
    border-top: 3px solid var(--secondary-color);
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;
}

.dropdown-item:hover {
    background-color: #e9ecef;
    color: var(--primary-color);
}

.dropdown-menu .dropdown-item.active { /*  Добавили стили для активного пункта в dropdown */
    background-color: var(--primary-color) !important;
    color: white !important;
}

/* ---  Основной контейнер --- */
.container {
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0,0,0,.05);
    padding: 2rem;
    margin-top: 2rem;
    margin-bottom: 2rem; /*  Добавили отступ снизу */
}

/* ---  Кнопки --- */
.btn-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;
    transition: all 0.2s ease-in-out; /*  Плавный переход для hover */
}

.btn-primary:hover {
    background-color: #0020a2; /*  Немного темнее основного синего */
    border-color: #0020a2;
    transform: translateY(-2px); /*  Небольшой сдвиг вверх при наведении */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.btn-secondary {
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
    color: white;
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;
    transition: all 0.2s ease-in-out;
}

.btn-secondary:hover {
    background-color: #cc0015; /*  Немного темнее красного */
    border-color: #cc0015;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* ---  Футер --- */
footer {
    background-color: var(--primary-color);
    color: var(--text-color);
    border-top: 4px solid var(--secondary-color); /*  Красная полоса как на логотипе */
}

/* ---  Заголовки --- */
h1 { /*  Главный заголовок страницы (убрали h2, h3, h4, h5, h6) */
    color: var(--primary-color);
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;
    margin-bottom: 1.5rem; /*  Добавили отступ снизу */
}

h2 {
    margin-top: 2rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid #dee2e6;
    padding-bottom: 0.5rem;
    color: var(--primary-color);
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;
}

/* ---  Таблицы --- */
.table thead {
    background-color: var(--primary-color);
    color: white;
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;
}

/* ---  Карточки --- */
.card {
    border-color: #dee2e6;
    border-radius: 8px;
    overflow: hidden;
    transition: transform 0.2s;  /*  Добавили плавный переход */
}

.module-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
.fuel-tank-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.card-header {
    background-color: var(--primary-color);
    color: white;
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid rgba(0,0,0,.125);
    border-radius: 8px 8px 0 0;
}

/* ---  Элементы формы --- */
.form-label {
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;
    color: var(--primary-color);
}

/* ---  Бейджи --- */
.badge-primary {
    background-color: var(--primary-color);
}

.badge-secondary {
    background-color:var(--secondary-color);
}

/* ---  Навигационные вкладки --- */
.nav-tabs .nav-link.active {
    color: var(--primary-color);
    font-weight: 700;
    border-bottom: 3px solid var(--secondary-color);
}

.nav-tabs .nav-link:hover:not(.active) {
    border-bottom: 3px solid var(--secondary-color);
}

/* ---  Оповещения/алерты --- */
.alert-primary {
    background-color: rgba(0, 51, 160, 0.1);
    border-left: 4px solid var(--primary-color);
}

.alert-secondary {
    background-color: rgba(229, 0, 25, 0.1);
    border-left: 4px solid var(--secondary-color);
}

/* ---  Скроллбар --- */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: var(--primary-color);
}

::-webkit-scrollbar-thumb:hover {
    background: #f1f1f1;
}

/* ---  Адаптивность навбара --- */
@media (max-width: 991px) { /* breakpoint md */
    .navbar-nav {
        flex-wrap: wrap;
        justify-content: center;
    }
    .navbar-nav .nav-item {
        width: 100%;
        text-align: center;
    }
}