/* =============================================================
   AethCore — mobile.css
   Responsive overrides for screens <= 768px.
   ============================================================= */

@media (max-width: 768px) {

    /* --- Viewport / images --- */
    img { max-width: 100%; height: auto; }

    /* --- Navigation: two rows + hamburger for auth --- */
    #header-inner {
        flex-wrap: wrap;
        height: auto;
        padding: 6px 10px;
    }

    #logo {
        margin-right: auto;
    }

    #nav-hamburger {
        display: block;
        position: relative;
        order: 1;
        background: none;
        border: none;
        color: #bbb;
        font-size: 22px;
        padding: 0 4px;
        line-height: 36px;
        cursor: pointer;
    }

    #nav-hamburger:hover { color: #fff; }

    #nav-hamburger .notif-badge {
        top: 2px;
        right: -6px;
    }

    #nav-auth {
        display: none;
        order: 3;
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        margin-left: 0;
        background: #1a1a1a;
        padding: 4px 0;
    }

    #nav-auth.open { display: flex; }

    #nav-auth li a,
    #nav-auth .nav-link-btn {
        line-height: 36px;
        padding: 0 14px;
        text-align: left;
    }

    #nav-links {
        order: 2;
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
    }

    #nav-links li a {
        line-height: 36px;
        padding: 0 10px;
    }

    /* --- Layout: hide sidebar, single column --- */
    #wrap {
        flex-direction: column;
        padding: 0 8px;
        margin: 8px auto;
        gap: 0;
    }

    #sidebar { display: none; }

    /* --- Form inputs: prevent iOS zoom --- */
    .field input[type="text"],
    .field input[type="number"],
    .field input[type="url"],
    .field input[type="email"],
    .field input[type="password"],
    .field textarea,
    textarea {
        font-size: 16px;
    }

    /* --- Forum posts: stack author above body --- */
    .forum-post { flex-direction: column; }

    .forum-post-author {
        flex-direction: row;
        align-items: center;
        width: 100%;
        padding: 8px 10px;
        gap: 8px;
        border-right: none;
        border-bottom: 1px solid #d0d0d0;
    }

    .forum-post-avatar,
    .forum-post-no-avatar {
        width: 36px;
        height: 36px;
    }

    .forum-post-author-actions {
        margin-top: 0;
        padding-top: 0;
        border-top: none;
        width: auto;
        margin-left: auto;
    }

    .forum-post-body { padding: 10px; }

    /* --- Thread mod actions --- */
    .thread-mod-actions {
        float: none;
        flex-wrap: wrap;
        margin-top: 4px;
    }

    /* --- Profile: stack columns --- */
    .profile-body { flex-direction: column; }
    .profile-left { width: 100%; }

    .profile-edit-btn {
        margin-left: 0;
        margin-top: 8px;
    }

    /* --- Game detail: stack cover above info --- */
    .game-detail-layout { flex-direction: column; }

    /* --- Carousel: show 2 slides, hide arrows --- */
    .carousel-slide { flex: 0 0 calc(50% - 4px); }
    .carousel-btn { display: none; }

    /* --- Data tables: horizontal scroll --- */
    .data-table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* --- Admin stats: wrap cards --- */
    .admin-stats { flex-wrap: wrap; }
    .stat-card { flex: 1 1 45%; }

    /* --- Chat: hide user sidebar, prevent zoom --- */
    #chat-users { display: none; }
    #chat-topbar { padding: 0 10px; }
    #chat-inputbar { padding: 6px 8px; }
    #chat-input { font-size: 16px; }
}