/* ============================================
   АДАПТИВНОСТЬ ЧАТА И ЛОГА
   Responsive design for different screen sizes
   ============================================ */

/* Базовые размеры (по умолчанию 276px) уже установлены в ui.css */

/* ============================================
   БОЛЬШИЕ МОНИТОРЫ (1920px и больше)
   ============================================ */
@media screen and (min-width: 1920px) {
    .chat-container,
    .logs-container {
        width: 380px !important;
    }
    
    .chat-input {
        width: 300px !important;
    }
    
    .popup-logs {
        margin-left: 400px;
    }
}

/* ============================================
   СРЕДНИЕ МОНИТОРЫ (1440px - 1919px)
   ============================================ */
@media screen and (min-width: 1440px) and (max-width: 1919px) {
    .chat-container,
    .logs-container {
        width: 320px !important;
    }
    
    .chat-input {
        width: 240px !important;
    }
    
    .popup-logs {
        margin-left: 340px;
    }
}

/* ============================================
   СТАНДАРТНЫЕ МОНИТОРЫ (1280px - 1439px)
   ============================================ */
@media screen and (min-width: 1280px) and (max-width: 1439px) {
    .chat-container,
    .logs-container {
        width: 290px !important;
    }
    
    .chat-input {
        width: 210px !important;
    }
    
    .popup-logs {
        margin-left: 310px;
    }
}

/* ============================================
   МАЛЕНЬКИЕ ЭКРАНЫ (до 1279px)
   ============================================ */
/* Используются стандартные 276px из ui.css */

/* ============================================
   ПЛАНШЕТЫ (768px - 1024px)
   ============================================ */
@media screen and (min-width: 768px) and (max-width: 1024px) {
    .chat-container,
    .logs-container {
        width: 240px !important;
    }
    
    .chat-input {
        width: 160px !important;
    }
    
    .popup-logs {
        margin-left: 260px;
    }
}

/* ============================================
   МОБИЛЬНЫЕ (до 767px)
   ============================================ */
@media screen and (max-width: 767px) {
    .chat-container,
    .logs-container {
        width: 200px !important;
    }
    
    .chat-input {
        width: 120px !important;
    }
    
    .popup-logs {
        margin-left: 220px;
    }
}

/* ============================================
   ОЧЕНЬ БОЛЬШИЕ МОНИТОРЫ (2560px и больше)
   ============================================ */
@media screen and (min-width: 2560px) {
    .chat-container,
    .logs-container {
        width: 450px !important;
    }
    
    .chat-input {
        width: 370px !important;
    }
    
    .popup-logs {
        margin-left: 470px;
    }
    
    /* Увеличиваем высоту для больших экранов */
    .chat-container-game {
        max-height: 150px !important;
    }
    
    .chat-container-full {
        max-height: 220px !important;
    }
    
    .logs-container-game {
        max-height: 140px !important;
    }
    
    .logs-container-full {
        max-height: 200px !important;
    }
}

/* ============================================
   УЛЬТРА-ШИРОКИЕ МОНИТОРЫ (3440px и больше)
   ============================================ */
@media screen and (min-width: 3440px) {
    .chat-container,
    .logs-container {
        width: 550px !important;
    }
    
    .chat-input {
        width: 470px !important;
    }
    
    .popup-logs {
        margin-left: 570px;
    }
    
    /* Еще больше высоты */
    .chat-container-game {
        max-height: 180px !important;
    }
    
    .chat-container-full {
        max-height: 260px !important;
    }
    
    .logs-container-game {
        max-height: 160px !important;
    }
    
    .logs-container-full {
        max-height: 240px !important;
    }
    
    /* Увеличиваем шрифт для читаемости */
    .chat-message,
    .log-message,
    .log-haz-message,
    .log-death-message,
    .log-skill-message {
        font-size: 15px !important;
    }
}

/* ============================================
   ВЫСОТА ЭКРАНА
   ============================================ */

/* Высокие экраны (больше 1080px) */
@media screen and (min-height: 1080px) {
    .chat-container-game {
        max-height: 140px;
    }
    
    .chat-container-full {
        max-height: 200px;
    }
    
    .logs-container-game {
        max-height: 90px;
    }
    
    .logs-container-full {
        max-height: 160px;
    }
}

/* Очень высокие экраны (больше 1440px) */
@media screen and (min-height: 1440px) {
    .chat-container-game {
        max-height: 180px;
    }
    
    .chat-container-full {
        max-height: 250px;
    }
    
    .logs-container-game {
        max-height: 110px;
    }
    
    .logs-container-full {
        max-height: 200px;
    }
}

/* ============================================
   СООТНОШЕНИЕ СТОРОН
   ============================================ */

/* Ультра-широкие экраны (21:9) */
@media screen and (min-aspect-ratio: 21/9) {
    .chat-container,
    .logs-container {
        width: 400px !important;
    }
    
    .popup-logs {
        margin-left: 420px;
    }
}


/* ============================================
   АДАПТИВНОСТЬ КНОПКИ ГЛОБАЛЬНОГО ЧАТА
   ============================================ */

/* Базовая позиция (250px) установлена в chat.css */

/* Большие мониторы (1920px и больше) */
@media screen and (min-width: 1920px) {
    .global-chat-btn {
        left: 350px !important;
    }
}

/* Средние мониторы (1440px - 1919px) */
@media screen and (min-width: 1440px) and (max-width: 1919px) {
    .global-chat-btn {
        left: 290px !important;
    }
}

/* Стандартные мониторы (1280px - 1439px) */
@media screen and (min-width: 1280px) and (max-width: 1439px) {
    .global-chat-btn {
        left: 260px !important;
    }
}

/* Планшеты (768px - 1024px) */
@media screen and (min-width: 768px) and (max-width: 1024px) {
    .global-chat-btn {
        left: 210px !important;
    }
}

/* Мобильные (до 767px) */
@media screen and (max-width: 767px) {
    .global-chat-btn {
        left: 170px !important;
    }
}

/* Очень большие мониторы (2560px и больше) */
@media screen and (min-width: 2560px) {
    .global-chat-btn {
        left: 420px !important;
    }
}

/* Ультра-широкие мониторы (3440px и больше) */
@media screen and (min-width: 3440px) {
    .global-chat-btn {
        left: 520px !important;
    }
}

/* Ультра-широкие экраны (21:9) */
@media screen and (min-aspect-ratio: 21/9) {
    .global-chat-btn {
        left: 370px !important;
    }
}