@import './modules/variables.css';
@import './modules/base.css';
@import './modules/buttons.css';
@import './modules/avatars.css';
@import './modules/rail.css';
@import './modules/inbox.css';
@import './modules/conversation.css';
@import './modules/messages.css';
@import './modules/composer.css';
@import './modules/info-panel.css';
@import './modules/modals.css';
@import './modules/animations.css';

/* ============================================================================
   АДАПТАЦИЯ ПОД МОБИЛЬНЫЕ УСТРОЙСТВА
   ============================================================================ */

@media (max-width: 768px) {
  /* Поле ввода всегда внизу, фиксированное */
  .composer-container {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: var(--bg-surface) !important;
    padding: 8px !important;
    z-index: 1000 !important;
    transform: none !important;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1) !important;
  }
  
  /* Отступ для сообщений, чтобы не прятались за полем */
  .messages-scroll {
    padding-bottom: 80px !important;
  }
  
  /* Увеличиваем кнопки */
  .composer-btn,
  .composer-send {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 12px !important;
  }
  
  /* Поле ввода побольше */
  .composer-input {
    font-size: 16px !important;
    padding: 12px !important;
    min-height: 44px !important;
  }
}
