/* ════════════════════════════════════════════════════════════
   DESKTOP FULL WIDTH - NO borders, NO dark zones
   Load LAST to override everything
   ════════════════════════════════════════════════════════════ */

/* === DESKTOP ONLY (769px and above) === */
@media screen and (min-width: 769px) {

    /* ========== BASE RESET ========== */
    html, body {
        margin: 0 !important;
        padding: 0 !important;
        background: #0d1929 !important;
        overflow-x: hidden !important;
        width: 100% !important;
        min-height: 100vh !important;
    }

    /* ========== HIDE HAMBURGER ========== */
    .hamburger-menu,
    #hamburgerMenu,
    [class*="hamburger"] {
        display: none !important;
    }

    /* ========== APP CONTAINER - FLEX ROW ========== */
    .app-container,
    body .app-container,
    html body .app-container,
    div.app-container {
        display: flex !important;
        flex-direction: row !important;
        width: 100vw !important;
        height: 100vh !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #0d1929 !important;
        border: none !important;
        box-shadow: none !important;
        overflow: hidden !important;
    }

    /* ========== SIDEBAR - FIXED 300px ========== */
    .sidebar,
    body .sidebar,
    html body .sidebar,
    div.sidebar {
        position: fixed !important;
        left: 0 !important;
        top: 0 !important;
        width: 300px !important;
        min-width: 300px !important;
        max-width: 300px !important;
        height: 100vh !important;
        flex-shrink: 0 !important;
        z-index: 100 !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }

    /* ========== MAIN CONTENT - FILLS REMAINING SPACE ========== */
    .main-content,
    body .main-content,
    html body .main-content,
    body .app-container .main-content,
    html body .app-container .main-content,
    div.main-content,
    .app-container > .main-content {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        width: calc(100vw - 300px) !important;
        max-width: calc(100vw - 300px) !important;
        min-width: calc(100vw - 300px) !important;
        height: 100vh !important;
        margin: 0 0 0 300px !important;
        padding: 0 !important;
        background: #0d1929 !important;
        border: none !important;
        box-shadow: none !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
        transform: none !important;
        float: none !important;
    }

    /* ========== CHAT CONTAINER - FULL SIZE ========== */
    .chat-container,
    body .chat-container,
    body .main-content .chat-container,
    html body .main-content .chat-container,
    div.chat-container {
        width: 100% !important;
        max-width: none !important;
        height: 100% !important;
        flex: 1 !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #0d1929 !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        outline: none !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }

    /* ========== HEADER - FULL WIDTH ========== */
    .header,
    body .header,
    body .main-content .header,
    div.header {
        width: 100% !important;
        max-width: none !important;
        flex-shrink: 0 !important;
        padding: 16px 24px !important;
        margin: 0 !important;
        background: #0d1929 !important;
        border: none !important;
        border-bottom: none !important;
        box-sizing: border-box !important;
    }

    /* ========== MESSAGES - FULL WIDTH ========== */
    .messages,
    #messagesContainer,
    body .messages,
    body .chat-container .messages,
    div.messages {
        flex: 1 !important;
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 24px !important;
        margin: 0 !important;
        background: #0d1929 !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }

    /* ========== MESSAGE BUBBLES - READABLE WIDTH ========== */
    .message,
    body .message,
    .messages .message,
    div.message {
        max-width: 70% !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* ========== INPUT AREA - FULL WIDTH ========== */
    .input-area,
    body .input-area,
    body .chat-container .input-area,
    div.input-area {
        width: 100% !important;
        max-width: none !important;
        flex-shrink: 0 !important;
        padding: 16px 24px !important;
        margin: 0 !important;
        background: #0a1628 !important;
        border: none !important;
        border-top: 1px solid rgba(61, 90, 128, 0.3) !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
    }

    /* ========== REMOVE ALL PSEUDO-ELEMENTS ========== */
    .app-container::before,
    .app-container::after,
    .main-content::before,
    .main-content::after,
    .chat-container::before,
    .chat-container::after,
    .messages::before,
    .messages::after,
    .input-area::before,
    .input-area::after {
        display: none !important;
        content: none !important;
    }

    /* ========== REMOVE ANY WRAPPER BORDERS ========== */
    .chat-wrapper,
    .content-wrapper,
    .messages-wrapper,
    .chat-content,
    [class*="wrapper"],
    [class*="container"]:not(.app-container):not(.chat-container) {
        border: none !important;
        box-shadow: none !important;
        outline: none !important;
    }
}