Modern ChatGPT Glass Theme by mason20121981

/* ==UserStyle==
@name         Modern ChatGPT Glass Theme
@version      20240307.01.00
@namespace    userstyles.world/user/mason20121981
@description  A sleek glassmorphism theme for ChatGPT with dark mode and smooth UI.
@author       mason20121981
@license      No License
==/UserStyle== */

@-moz-document domain("chatgpt.com") {
    /* Global styles */
    body {
        background: #121212 !important;
        color: #e0e0e0 !important;
        font-family: 'Inter', sans-serif !important;
    }

    /* Header */
    header {
        background: rgba(25, 25, 25, 0.7) !important;
        backdrop-filter: blur(10px) !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    }

    /* Sidebar */
    nav {
        background: rgba(20, 20, 20, 0.8) !important;
        backdrop-filter: blur(12px) !important;
        border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
    }

    /* Chat Area */
    .chat-container {
        background: #181818 !important;
    }

    /* Chat Bubbles */
    .chat-bubble {
        background: rgba(40, 40, 40, 0.6) !important;
        backdrop-filter: blur(8px) !important;
        border-radius: 12px !important;
        padding: 15px !important;
        margin-bottom: 10px !important;
        transition: all 0.3s ease-in-out;
    }

    .chat-bubble:hover {
        background: rgba(50, 50, 50, 0.8) !important;
    }

    /* User Messages */
    .user-message {
        background: rgba(100, 100, 100, 0.7) !important;
        color: #ffffff !important;
    }

    /* Input Box */
    .chat-input {
        background: rgba(25, 25, 25, 0.7) !important;
        backdrop-filter: blur(10px) !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
        border-radius: 10px !important;
    }

    /* Buttons */
    button {
        background: linear-gradient(135deg, #6e48aa, #9d50bb) !important;
        color: #fff !important;
        border-radius: 8px !important;
        transition: all 0.3s ease-in-out;
    }

    button:hover {
        background: linear-gradient(135deg, #9d50bb, #6e48aa) !important;
    }

    /* Scrollbar */
    ::-webkit-scrollbar {
        width: 8px;
    }

    ::-webkit-scrollbar-thumb {
        background: rgba(255, 255, 255, 0.3) !important;
        border-radius: 10px;
    }

    ::-webkit-scrollbar-track {
        background: rgba(255, 255, 255, 0.1) !important;
    }
}