/* MUH-GPT Theme — Indigo 3.6 (flagship for update 3.6) */
/* Modern deep-indigo / violet palette on a near-black canvas. CSS only. */

:root {
    /* Primary Brand Colors → Indigo */
    --primary-red: #6366F1 !important;
    --primary-red-hover: #4F46E5 !important;
    --primary-red-light: #818CF8 !important;

    /* Background Colors */
    --dark-bg: #0B0D16 !important;
    --darker-bg: #070812 !important;
    --surface-dark: #171B29 !important;
    --surface-lighter: #232A3D !important;

    /* Text Colors */
    --text-primary: #F4F6FB !important;
    --text-secondary: #C7D2FE !important;
    --text-muted: #8B93AB !important;

    /* Border & Accent */
    --border-dark: #262C40 !important;
    --success: #10B981 !important;
    --warning: #F59E0B !important;
    --info: #6366F1 !important;

    /* Shadows — indigo glow */
    --shadow-sm: 0 2px 4px rgba(99, 102, 241, 0.15) !important;
    --shadow-md: 0 4px 12px rgba(99, 102, 241, 0.20) !important;
    --shadow-lg: 0 8px 24px rgba(99, 102, 241, 0.25) !important;
    --shadow-xl: 0 12px 32px rgba(99, 102, 241, 0.30) !important;

    /* Liquid glass tint */
    --glass-tint: 99, 102, 241;
    --glass-tint-opacity: 0.03;
    --glass-bg: rgba(99, 102, 241, 0.03) !important;
    --glass-border: rgba(255, 255, 255, 0.14) !important;
}

body {
    background: linear-gradient(160deg, #0B0D16 0%, #0A0A18 45%, #070812 100%) !important;
}

/* Brand / logo marks */
.logo-icon,
.logo-mark,
.chatgpt-logo .logo-mark {
    background: linear-gradient(135deg, #6366F1, #4F46E5) !important;
    box-shadow: 0 4px 14px rgba(99, 102, 241, 0.40) !important;
}

/* Welcome heading gradient (the big MUH-GPT title) */
.welcome-title,
.chatgpt-welcome-title {
    background: linear-gradient(135deg, #818CF8, #6366F1 45%, #A855F7) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* Send button */
.send-btn,
.chatgpt-send-btn {
    background: linear-gradient(135deg, #6366F1, #4F46E5) !important;
}
.send-btn:hover:not(:disabled),
.chatgpt-send-btn:hover:not(:disabled) {
    background: linear-gradient(135deg, #4F46E5, #4338CA) !important;
    box-shadow: 0 4px 14px rgba(99, 102, 241, 0.45) !important;
}

/* Header / toolbar buttons */
.header-btn { color: #C7D2FE !important; }
.header-btn:hover {
    background: rgba(99, 102, 241, 0.15) !important;
    color: #818CF8 !important;
}

/* Message bubbles — clean glass with indigo tint */
.message-bubble {
    background: rgba(99, 102, 241, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.11) !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}
.message.user .message-bubble {
    background: rgba(99, 102, 241, 0.07) !important;
    border: 1px solid rgba(99, 102, 241, 0.22) !important;
}
.message.bot .message-bubble {
    background: rgba(99, 102, 241, 0.02) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
}
.message-bubble:hover {
    border-color: rgba(99, 102, 241, 0.28) !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.34), 0 0 14px rgba(99, 102, 241, 0.10) !important;
}

/* Sidebar chat items */
.chat-item:hover,
.chats-list-container .chat-item:hover { background: rgba(99, 102, 241, 0.08) !important; }
.chat-item.active {
    background: rgba(99, 102, 241, 0.13) !important;
    border-left: 3px solid #6366F1 !important;
}

/* Sidebar active nav highlight */
.chatgpt-nav-item.active {
    background: rgba(99, 102, 241, 0.12) !important;
}

/* New-chat button */
.chatgpt-new-chat-btn:hover {
    border-color: rgba(99, 102, 241, 0.4) !important;
    background: rgba(99, 102, 241, 0.10) !important;
}

/* Inputs / focus rings */
.message-input:focus,
.chatgpt-textarea:focus,
textarea:focus {
    border-color: rgba(99, 102, 241, 0.45) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12) !important;
}

/* Primary buttons / upgrade CTA */
.btn-primary,
.chatgpt-login-cta:hover,
.upgrade-cta {
    background: linear-gradient(135deg, #6366F1, #4F46E5) !important;
}

/* Links */
a { color: #A5B4FC; }

/* Scrollbar */
::-webkit-scrollbar-thumb { background: rgba(99, 102, 241, 0.30) !important; }
::-webkit-scrollbar-thumb:hover { background: rgba(99, 102, 241, 0.50) !important; }

/* Selection */
::selection { background: rgba(99, 102, 241, 0.35); color: #fff; }

@media (max-width: 768px) {
    .message-bubble:hover { transform: none !important; }
}