/* Главный файл стилей, который импортирует все модульные CSS файлы */

/* Базовые стили */
@import 'base/variables.css';
@import 'base/reset.css';

/* Макет */
@import 'layout/header.css';
@import 'layout/navigation.css';
@import 'layout/main-content.css';
@import 'layout/footer.css';

/* Компоненты */
@import 'components/user-profile.css';
@import 'components/mobile-menus.css';
@import 'components/buttons.css';
@import 'components/tables.css';
@import 'components/forms.css';
@import 'components/modals.css';
@import 'components/cards.css';
@import 'components/alerts.css';
@import 'components/animations.css';
@import 'components/orders-table.css';
@import 'components/devices-table.css';

/* По умолчанию страницы не загружаются в main.css */
/* Вместо этого каждая страница подключает нужные ей дополнительные стили */
/* Например, для страницы логина: <link rel="stylesheet" href="styles/pages/login.css"> */

/* Стиль для выделенной суммы */
.highlighted-amount {
    color: #6e56f7;
    font-weight: 700;
    font-size: 1.1em;
    background-color: rgba(110, 86, 247, 0.08);
    padding: 2px 6px;
    border-radius: 4px;
    margin: 0 2px;
    display: inline-block;
    box-shadow: 0 0 0 1px rgba(110, 86, 247, 0.2);
    transition: all 0.3s ease;
}

.highlighted-amount:hover {
    background-color: rgba(110, 86, 247, 0.12);
}