/* Todos os aplicativos compartilham a mesma viewport, logo abaixo do header. */
body.app-open #desktop { overflow: hidden !important; }

body.app-open #windows {
    position: fixed !important;
    inset: 68px 0 0 !important;
    width: min(1180px, calc(100% - 40px)) !important;
    height: calc(100dvh - 68px) !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 18px 0 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

body.app-open #windows > .window:not(.dashboard-view-hidden) {
    position: absolute !important;
    inset: 18px 0 28px !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
    gap: 14px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.app-open #windows > .window:not(.dashboard-view-hidden) > .dashboard-app-header {
    flex: 0 0 70px !important;
    min-height: 70px !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 1px solid rgba(var(--theme-rgb), .22) !important;
    border-radius: 18px !important;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .18) !important;
}

body.app-open #windows > .window:not(.dashboard-view-hidden) > .dashboard-app-header {
    padding-inline: 18px !important;
}

body.app-open #windows > .window:not(.dashboard-view-hidden) > .dashboard-app-header .dashboard-app-identity {
    gap: 16px !important;
}

body.app-open #windows > .window:not(.dashboard-view-hidden) > .dashboard-app-header .dashboard-app-icon {
    width: 54px !important;
    height: 54px !important;
    flex: 0 0 54px !important;
    padding: 10px !important;
    margin: 0 !important;
    object-fit: contain !important;
    box-sizing: border-box !important;
}

body.app-open #windows > .window:not(.dashboard-view-hidden) > .window-content {
    width: 100% !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
    overflow: hidden !important;
    border: 1px solid rgba(var(--theme-rgb), .16) !important;
    border-radius: 18px !important;
    box-sizing: border-box !important;
    background-clip: padding-box !important;
    box-shadow: 0 18px 50px rgba(0, 0, 0, .2) !important;
}

/* Vence as alturas de 100% específicas de cada app sem ultrapassar o bottom. */
body.app-open #windows > :is(
    #musicsWindow,
    #youtubeWindow,
    #personalizarWindow,
    #rankWindow,
    #schedulerWindow,
    #historyWindow,
    #webhooksWindow,
    #spineventWindow,
    #forumWindow,
    #componentsWindow,
    #discordWindow
):not(.dashboard-view-hidden) {
    height: calc(100dvh - 114px) !important;
    min-height: 0 !important;
    max-height: none !important;
    inset: 18px 0 28px !important;
}

/* Agenda, Histórico e Webhooks seguem exatamente o mesmo limite externo. */
body.app-open #windows > :is(
    #schedulerWindow.scheduler-standalone-app,
    #historyWindow.scheduler-standalone-app,
    #webhooksWindow.scheduler-standalone-app
):not(.dashboard-view-hidden) {
    position: absolute !important;
    inset: 18px 0 28px !important;
    height: calc(100dvh - 114px) !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    border-radius: 0 !important;
}

body.app-open #windows > :is(
    #schedulerWindow,
    #historyWindow,
    #webhooksWindow
) > .dashboard-app-header {
    padding: 10px 18px !important;
}

body.app-open #windows > :is(
    #schedulerWindow,
    #historyWindow,
    #webhooksWindow
) > .dashboard-app-header .dashboard-app-identity {
    gap: 16px !important;
}

body.app-open #windows > :is(
    #schedulerWindow,
    #historyWindow,
    #webhooksWindow
) > .dashboard-app-header .dashboard-app-icon {
    width: 54px !important;
    height: 54px !important;
    flex: 0 0 54px !important;
    margin-left: 2px !important;
    padding: 11px !important;
    object-fit: contain !important;
    box-sizing: border-box !important;
}

body.app-open #windows > :is(
    #schedulerWindow,
    #historyWindow,
    #webhooksWindow
) > .window-content {
    height: auto !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
    overflow: hidden !important;
}

body.app-open #windows > :is(
    #schedulerWindow,
    #historyWindow,
    #webhooksWindow
) .scheduler,
body.app-open #windows > :is(
    #schedulerWindow,
    #historyWindow,
    #webhooksWindow
) .sch-right {
    height: 100% !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
    overflow: hidden !important;
}

body.app-open #historyWindow .sch-history-section,
body.app-open #webhooksWindow .sch-webhook-section {
    height: 100% !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

/* Agenda igual ao Fórum: shell travado e somente a raiz do app rola. */
body.app-open #windows > #schedulerWindow > .window-content {
    height: auto !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
    overflow: hidden !important;
}

body.app-open #windows > #schedulerWindow > .window-content > .scheduler {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    -webkit-overflow-scrolling: touch;
}

body.app-open #windows > #schedulerWindow > .window-content > .scheduler > .sch-right {
    height: auto !important;
    min-height: min-content !important;
    overflow: visible !important;
}

@media (max-width: 768px) {
    body.app-open #windows {
        inset: 62px 0 0 !important;
        width: calc(100% - 16px) !important;
        height: calc(100dvh - 62px) !important;
        padding: 0 !important;
    }

    body.app-open #windows > .window:not(.dashboard-view-hidden) {
        inset: 8px 0 14px !important;
        gap: 7px !important;
        border-radius: 15px !important;
    }

    body.app-open #windows > .window:not(.dashboard-view-hidden) > .dashboard-app-header {
        flex-basis: 54px !important;
        min-height: 54px !important;
        border-radius: 15px !important;
    }

    body.app-open #windows > .window:not(.dashboard-view-hidden) > .dashboard-app-header {
        padding-inline: 12px !important;
    }

    body.app-open #windows > .window:not(.dashboard-view-hidden) > .dashboard-app-header .dashboard-app-icon {
        width: 42px !important;
        height: 42px !important;
        flex-basis: 42px !important;
        padding: 8px !important;
    }

    body.app-open #windows > .window:not(.dashboard-view-hidden) > .window-content {
        border-radius: 15px !important;
    }

    body.app-open #windows > :is(
        #musicsWindow,
        #youtubeWindow,
        #personalizarWindow,
        #rankWindow,
        #schedulerWindow,
        #historyWindow,
        #webhooksWindow,
        #spineventWindow,
        #forumWindow,
        #componentsWindow,
        #discordWindow
    ):not(.dashboard-view-hidden) {
        height: calc(100dvh - 84px) !important;
        inset: 8px 0 14px !important;
    }

    body.app-open #windows > :is(
        #schedulerWindow.scheduler-standalone-app,
        #historyWindow.scheduler-standalone-app,
        #webhooksWindow.scheduler-standalone-app
    ):not(.dashboard-view-hidden) {
        inset: 8px 0 14px !important;
        height: calc(100dvh - 84px) !important;
        border-radius: 15px !important;
    }

    body.app-open #windows > :is(
        #schedulerWindow,
        #historyWindow,
        #webhooksWindow
    ) > .dashboard-app-header {
        padding: 7px 12px !important;
    }

    body.app-open #windows > :is(
        #schedulerWindow,
        #historyWindow,
        #webhooksWindow
    ) > .dashboard-app-header .dashboard-app-icon {
        width: 42px !important;
        height: 42px !important;
        flex-basis: 42px !important;
        padding: 8px !important;
    }
}

/* Remapeamento clean: superfícies planas e uma única leitura de borda. */
body.app-open #windows {
    --app-clean-border: rgba(var(--theme-rgb), .22);
    --app-clean-border-soft: rgba(var(--theme-rgb), .14);
    --app-clean-surface: rgba(15, 28, 34, .96);
}

body.app-open #windows > .window:not(.dashboard-view-hidden) > .dashboard-app-header,
body.app-open #windows > .window:not(.dashboard-view-hidden) > .window-content {
    filter: none !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

body.app-open #windows > .window:not(.dashboard-view-hidden) > .dashboard-app-header {
    border: 1px solid var(--app-clean-border) !important;
    background: linear-gradient(100deg, #15252d, #163633) !important;
}

body.app-open #windows > .window:not(.dashboard-view-hidden) > .window-content {
    border: 1px solid var(--app-clean-border-soft) !important;
    padding: 12px !important;
    background: var(--app-clean-surface) !important;
}

body.app-open #windows > .window:not(.dashboard-view-hidden) > .window-content > :first-child:not(style),
body.app-open #windows > .window:not(.dashboard-view-hidden) > .window-content > style + * {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Remove sombras estruturais internas; menus, pop-ups e modais não entram aqui. */
body.app-open #windows :is(
    .tabs-container,
    .main-container,
    .player-main,
    .queue-panel,
    .rank-sidebar,
    .rank-content,
    .win-side,
    .win-body,
    .scheduler,
    .sch-form,
    .sch-schedules-section,
    .sch-history-section,
    .sch-webhook-section,
    .forum-browser,
    .forum-conversation
) {
    filter: none !important;
    box-shadow: none !important;
}

body.app-open #windows :is(
    .tabs-container,
    .main-container,
    .player-main,
    .queue-panel,
    .rank-sidebar,
    .rank-content,
    .scheduler,
    .forum-browser,
    .forum-conversation
) {
    border-color: var(--app-clean-border-soft) !important;
}

body.app-open #windows .window-content::before,
body.app-open #windows .window-content::after {
    box-shadow: none !important;
    filter: none !important;
}

/* MintTube: seletor segmentado compacto no lugar da barra antiga. */
body.app-open #youtubeWindow .yt-app {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

body.app-open #youtubeWindow .tabs-container {
    width: max-content !important;
    min-height: 0 !important;
    align-self: center !important;
    justify-content: center !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 5px !important;
    border: 1px solid rgba(var(--theme-rgb), .16) !important;
    border-radius: 14px !important;
    background: rgba(8, 18, 23, .72) !important;
    box-shadow: none !important;
}

body.app-open #youtubeWindow .tab-btn {
    min-width: 190px !important;
    min-height: 42px !important;
    padding: 0 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    border: 1px solid transparent !important;
    border-radius: 10px !important;
    color: #91a4ad !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    letter-spacing: -.01em !important;
    transform: none !important;
}

body.app-open #youtubeWindow .tab-btn:hover:not(.active) {
    color: #d9e8e4 !important;
    background: rgba(255, 255, 255, .05) !important;
    border-color: rgba(255, 255, 255, .06) !important;
}

body.app-open #youtubeWindow .tab-btn.active {
    color: #082019 !important;
    border-color: rgba(139, 255, 226, .45) !important;
    background: linear-gradient(135deg, #73efd0, #4bd8b6) !important;
    box-shadow: none !important;
}

body.app-open #youtubeWindow .main-container {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    border-radius: 18px !important;
}

/* Music: player e fila deixam de encostar nas paredes e entre si. */
body.app-open #musicsWindow .spotify-player {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    gap: 12px !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    background: transparent !important;
}

body.app-open #musicsWindow :is(.player-main, .queue-panel) {
    min-width: 0 !important;
    border: 1px solid var(--app-clean-border-soft) !important;
    border-radius: 15px !important;
    box-sizing: border-box !important;
}

@media (max-width: 560px) {
    body.app-open #windows > .window:not(.dashboard-view-hidden) > .window-content {
        padding: 7px !important;
    }

    body.app-open #youtubeWindow .tabs-container {
        width: calc(100% - 16px) !important;
        box-sizing: border-box !important;
    }

    body.app-open #youtubeWindow .tab-btn {
        min-width: 0 !important;
        flex: 1 1 50% !important;
        min-height: 38px !important;
        padding: 0 8px !important;
        font-size: 10px !important;
    }
}

/* MintTube standalone: vence o layout compacto dos apps e usa o shell do Fórum. */
body.app-open.minttube-fullscreen-open #youtubeWindow.minttube-standalone-shell{
    inset: var(--minttube-site-header-height) 0 0 !important;
    width: 100vw !important;
    height: calc(100dvh - var(--minttube-site-header-height)) !important;
    max-width: none !important;
    margin: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #0d171d !important;
}

body.app-open.minttube-fullscreen-open #youtubeWindow > .window-content{
    width: 100vw !important;
    height: 100% !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #0d171d !important;
    box-shadow: none !important;
}

body.app-open.minttube-fullscreen-open #youtubeWindow .yt-app{
    width: 100vw !important;
    height: 100% !important;
    min-height: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    background: #0d171d !important;
}

body.app-open.minttube-fullscreen-open #youtubeWindow .yt-header{
    display: flex !important;
    width: 100% !important;
    flex: 0 0 58px !important;
    margin: 0 !important;
    padding: 9px clamp(16px, 2vw, 28px) !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(130, 174, 166, .12) !important;
    border-radius: 0 !important;
    background: #14242b !important;
}

body.app-open.minttube-fullscreen-open #youtubeWindow .tabs-container{
    width: 100% !important;
    min-height: 54px !important;
    flex: 0 0 54px !important;
    align-self: stretch !important;
    justify-content: center !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 7px clamp(14px, 2vw, 28px) !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(130, 174, 166, .11) !important;
    border-radius: 0 !important;
    background: #101e24 !important;
}

body.app-open.minttube-fullscreen-open #youtubeWindow .tab-btn{
    width: auto !important;
    min-width: 180px !important;
    min-height: 40px !important;
}

body.app-open.minttube-fullscreen-open #youtubeWindow .main-container{
    width: 100% !important;
    max-width: none !important;
    height: calc(100% - 112px) !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #0d171d !important;
    box-shadow: none !important;
}

body.app-open.minttube-fullscreen-open #youtubeWindow .tab-content,
body.app-open.minttube-fullscreen-open #youtubeWindow .minttube-queue-app{
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

@media (max-width: 700px) {
    body.app-open.minttube-fullscreen-open #youtubeWindow .yt-header{flex-basis:50px!important}
    body.app-open.minttube-fullscreen-open #youtubeWindow .tabs-container{min-height:49px!important;flex-basis:49px!important;width:100%!important}
    body.app-open.minttube-fullscreen-open #youtubeWindow .tab-btn{min-width:0!important;flex:1 1 0!important;padding-inline:4px!important}
    body.app-open.minttube-fullscreen-open #youtubeWindow .main-container{height:calc(100% - 99px)!important}
}