/* ======================================================================
   Linguataal Full Canvas Layout v96
   Layout-only pass: authenticated app occupies the full usable viewport.
   No color/theme ownership here.
   ====================================================================== */

:root {
    --lt-full-sidebar: 220px;
    --lt-full-gutter: clamp(14px, 1.25vw, 24px);
    --lt-full-mobile-gutter: 12px;
}

/* WordPress theme wrappers must not constrain authenticated app pages. */
body:has(.linguaai-sidebar) :is(
    .entry-content,
    .page-content,
    .wp-block-post-content,
    main.wp-block-group,
    main .wp-block-group.alignfull,
    .wp-site-blocks
) {
    max-width: none !important;
}

body:has(.linguaai-sidebar) :is(.entry-content,.page-content,.wp-block-post-content) {
    width: 100% !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
}

/* Desktop: sidebar + gutter + fluid content + gutter = 100vw. */
@media (min-width: 1025px) {
    body:has(.linguaai-sidebar) {
        overflow-x: hidden !important;
    }

    .linguaai-sidebar {
        width: var(--lt-full-sidebar) !important;
    }

    :is(
        #linguaai-app,
        #linguaai-vocab-v2,
        #linguaai-grammar,
        #linguaai-stories,
        #linguaai-podcasts,
        #linguaai-dialogues,
        #linguaai-chat,
        #linguaai-profile,
        #linguaai-sentence-practice,
        #linguaai-vocab,
        #linguaai-wordlist,
        #linguaai-praatcafe,
        #linguaai-knm-wrap,
        #linguaai-contact-page,
        #linguaai-blog-page,
        .linguaai-mentor-container,
        .linguaai-main-container,
        .lai-verbs-simple,
        .linguaai-topbar
    ) {
        box-sizing: border-box !important;
        width: calc(100vw - var(--lt-full-sidebar) - (2 * var(--lt-full-gutter))) !important;
        min-width: 0 !important;
        max-width: none !important;
        margin-inline-start: calc(var(--lt-full-sidebar) + var(--lt-full-gutter)) !important;
        margin-inline-end: var(--lt-full-gutter) !important;
    }

    /* Neutralize old nested max-width/auto-centering inside module roots. */
    :is(
        #linguaai-app,
        #linguaai-vocab-v2,
        #linguaai-grammar,
        #linguaai-stories,
        #linguaai-podcasts,
        #linguaai-dialogues,
        #linguaai-chat,
        #linguaai-profile,
        #linguaai-sentence-practice,
        #linguaai-vocab,
        #linguaai-wordlist,
        #linguaai-praatcafe,
        #linguaai-knm-wrap,
        #linguaai-contact-page,
        #linguaai-blog-page,
        .linguaai-mentor-container,
        .linguaai-main-container
    ) > :is(.container,.content-container,.page-container,.module-container) {
        width: 100% !important;
        max-width: none !important;
        margin-inline: 0 !important;
    }

    /* RTL mirrors the canvas without changing module internals. */
    body:has(.linguaai-sidebar[dir="rtl"]) :is(
        #linguaai-app,
        #linguaai-vocab-v2,
        #linguaai-grammar,
        #linguaai-stories,
        #linguaai-podcasts,
        #linguaai-dialogues,
        #linguaai-chat,
        #linguaai-profile,
        #linguaai-sentence-practice,
        #linguaai-vocab,
        #linguaai-wordlist,
        #linguaai-praatcafe,
        #linguaai-knm-wrap,
        #linguaai-contact-page,
        #linguaai-blog-page,
        .linguaai-mentor-container,
        .linguaai-main-container,
        .lai-verbs-simple,
        .linguaai-topbar
    ) {
        margin-inline-start: var(--lt-full-gutter) !important;
        margin-inline-end: calc(var(--lt-full-sidebar) + var(--lt-full-gutter)) !important;
    }
}

/* Tablet bridge: same full-canvas contract with a narrower rail. */
@media (min-width: 861px) and (max-width: 1024px) {
    :root {
        --lt-full-sidebar: 204px;
        --lt-full-gutter: 14px;
    }

    body:has(.linguaai-sidebar) { overflow-x: hidden !important; }
    .linguaai-sidebar { width: var(--lt-full-sidebar) !important; }

    :is(
        #linguaai-app,#linguaai-vocab-v2,#linguaai-grammar,#linguaai-stories,
        #linguaai-podcasts,#linguaai-dialogues,#linguaai-chat,#linguaai-profile,
        #linguaai-sentence-practice,#linguaai-vocab,#linguaai-wordlist,
        #linguaai-praatcafe,#linguaai-knm-wrap,#linguaai-contact-page,
        #linguaai-blog-page,.linguaai-mentor-container,.linguaai-main-container,
        .lai-verbs-simple,.linguaai-topbar
    ) {
        width: calc(100vw - var(--lt-full-sidebar) - (2 * var(--lt-full-gutter))) !important;
        min-width: 0 !important;
        max-width: none !important;
        margin-inline-start: calc(var(--lt-full-sidebar) + var(--lt-full-gutter)) !important;
        margin-inline-end: var(--lt-full-gutter) !important;
    }
}

/* Mobile: drawer sidebar is out of flow; content owns the full viewport. */
@media (max-width: 860px) {
    body:has(.linguaai-sidebar) :is(.entry-content,.page-content,.wp-block-post-content) {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    :is(
        #linguaai-app,#linguaai-vocab-v2,#linguaai-grammar,#linguaai-stories,
        #linguaai-podcasts,#linguaai-dialogues,#linguaai-chat,#linguaai-profile,
        #linguaai-sentence-practice,#linguaai-vocab,#linguaai-wordlist,
        #linguaai-praatcafe,#linguaai-knm-wrap,#linguaai-contact-page,
        #linguaai-blog-page,.linguaai-mentor-container,.linguaai-main-container,
        .lai-verbs-simple
    ) {
        box-sizing: border-box !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin-inline: 0 !important;
        padding-inline: var(--lt-full-mobile-gutter) !important;
    }

    .linguaai-topbar {
        box-sizing: border-box !important;
        width: calc(100% - (2 * var(--lt-full-mobile-gutter))) !important;
        max-width: none !important;
        margin-inline: var(--lt-full-mobile-gutter) !important;
    }
}

/* Wide screens should use the space rather than floating in a narrow column. */
@media (min-width: 1440px) {
    #linguaai-app.lai-dashboard-v2 .lai-dash-module-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}
