/* mysite/chat/static/chat/css/themes/default.css */
:root {
    /* ===================== */
    /* 🎨 ОСНОВНАЯ СИСТЕМА */
    /* ===================== */
    --bg: #cfcfcfd8;
    --chat-bg: #ffffff;
    --text-color: #1a1a1a;
    --text-muted: #666666;
    --accent-color: #4caf50;

    /* ===================== */
    /* 🧾 INPUT */
    /* ===================== */
    --input-bg: #ffffff;
    --input-border: #cccccc;
    --input-focus: rgba(76, 175, 80, 0.25);
    --input-text: #1a1a1a;

    /* ===================== */
    /* 🎛 ICONS */
    /* ===================== */
    --icon-color: #888888;
    --icon-hover: #4caf50;

    /* ===================== */
    /* 🪟 HOVER / UI STATES */
    /* ===================== */
    --hover-bg: #f0f0f0;

    /* ===================== */
    /* 📋 MENU / DROPDOWN */
    /* ===================== */
    --menu-bg: #ffffff;
    --menu-text: #1a1a1a;
    --menu-hover: #f0f0f0;
    --dropdown-bg: #ffffff;

    /* ===================== */
    /* 🧭 HEADER */
    /* ===================== */
    --header-bg: #e8e8e8;
    --header-text: #1a1a1a;
    --header-border: #cccccc;

    /* ===================== */
    /* 💬 MESSAGES */
    /* ===================== */
    --msg-user-bg: #4caf50;
    --msg-user-text: #ffffff;
    --msg-bot-bg: #f0f0f0;
    --msg-bot-text: #1a1a1a;

    /* ===================== */
    /* 🔘 BUTTONS */
    /* ===================== */
    --chat-btn-bg: #e8e8e8;
    --chat-btn-text: #333333;

    /* ===================== */
    /* ⬇ SCROLL BUTTON */
    /* ===================== */
    --scroll-btn-bg: #e8e8e8;
    --scroll-btn-text: #333333;

    /* ===================== */
    /* 🏷 BADGE / COUNTER */
    /* ===================== */
    --val-btn-bg: #4caf50;

    /* ===================== */
    /* 😊 REACTIONS */
    /* ===================== */
    --reaction-btn-bg: rgba(76, 175, 80, 0.15);
    --reaction-btn-hover: rgba(76, 175, 80, 0.25);
    --reaction-btn-color: #333333;
    --reaction-bg: rgba(0, 0, 0, 0.08);

    /* ===================== */
    /* 🔗 LINKS */
    /* ===================== */
    --link-color: #4caf50;

    /* ===================== */
    /* 👤 AVATAR */
    /* ===================== */
    --avatar-bg: #4caf50;
    --avatar-text: #ffffff;

    /* ===================== */
    /* 🌫 SHADOW */
    /* ===================== */
    --shadow-color: rgba(0, 0, 0, 0.15);

    /* ===================== */
    /* 📜 SCROLLBAR */
    /* ===================== */
    --scrollbar-thumb: rgba(0, 0, 0, 0.2);
    --scrollbar-thumb-hover: rgba(0, 0, 0, 0.35);

    /* ===================== */
    /* 📦 INPUT BAR */
    /* ===================== */
    --input-bar-bg: #f5f5f5;

    /* ===================== */
    /* 🧭 ДОП. ПЕРЕМЕННЫЕ */
    /* ===================== */
    --header-height: 44px;
    --input-height: 58px;
    --header-btn-size: 2.3rem;
    --theme-button-bg: rgba(76, 175, 80, 0.12);
    --theme-button-hover-bg: rgba(76, 175, 80, 0.25);
    --theme-button-color: #4caf50;


    /* ФОН */
    --chat-bg-image: url('/static/chat/css/themes/BG/bg_tg_3.jpg');
    --chat-bg-overlay: rgba(0, 0, 0, 0.377); /* 40% затемнение */

}