/* ============================================
   STYLE.CSS - Главный файл стилей
   Импортирует все модули в правильном порядке
   ============================================ */

/* 1. Базовые переменные и сброс */
@import url('base.css');

/* 2. Компоненты (карточки, кнопки, формы) */
@import url('components.css');

/* 3. Макеты (хедер, футер, навигация) */
@import url('layout.css');

/* 4. Стили страниц */
@import url('pages.css');

/* 5. Чат-виджет */
@import url('chat.css');

/* 5. Чат-виджет */
@import url('about.css');

/* 5. Чат-виджет */
@import url('components.css');

/* 5. Чат-виджет */
@import url('corporate.css');

/* 5. Чат-виджет */
@import url('individual.css');

/* 5. Чат-виджет */
@import url('group.css');

/* 5. Чат-виджет */
@import url('certificates.css');

/* 5. Чат-виджет */
@import url('cases.css');

/* ===== ДОПОЛНИТЕЛЬНЫЕ ГЛОБАЛЬНЫЕ СТИЛИ ===== */

/* Анимация для загруженных изображений */
img.loaded {
    animation: fadeIn var(--transition-base) ease-in;
}

/* Мобильные улучшения */
@media (max-width: 768px) {
    .mobile-view .container {
        padding: 0 var(--spacing-sm);
    }

    .mobile-view .hero h1 {
        font-size: var(--font-size-3xl);
    }

    .mobile-view .stats-grid {
        gap: var(--spacing-sm);
    }
}

/* Уведомления */
.notification {
    position: fixed;
    bottom: 100px;
    right: 20px;
    background: var(--color-brown-dark);
    color: var(--color-white);
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-sm);
    animation: slideInRight var(--transition-base) ease-out;
    z-index: 1050;
}

@media (max-width: 768px) {
    .notification {
        top: auto;
        bottom: 20px;
        right: 20px;
        left: 20px;
        max-width: calc(100% - 40px);
        text-align: center;
    }
}

/* Скрытие элементов */
.hidden {
    display: none !important;
}

.visible {
    display: block !important;
}

/* Доступность */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}