/*
 * Tela de projeto — informações técnicas à esquerda e conversa à direita.
 * Proporção útil: 61% / 39%, além de 20px de respiro entre as colunas.
 */
@media (min-width: 992px) {
    /*
     * Regra estrutural principal. O Support Genix coloca a conversa (Content)
     * e os dados técnicos (Sider) como filhos diretos deste Layout.
     * Assim o layout funciona mesmo antes de o JavaScript acrescentar classes.
     */
    #support-genix .sgenix-ant-layout-has-sider:has(> .sgenix-ant-layout-sider) {
        display: grid !important;
        grid-template-columns: minmax(0, 61fr) minmax(0, 39fr) !important;
        align-items: flex-start !important;
        column-gap: 20px !important;
        width: 100% !important;
    }

    #support-genix .sgenix-ant-layout-has-sider:has(> .sgenix-ant-layout-sider) > .sgenix-ant-layout-sider {
        grid-column: 1 !important;
        grid-row: 1 !important;
        order: 1 !important;
        flex: none !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        padding: 0 !important;
        border-inline-start: 0 !important;
    }

    #support-genix .sgenix-ant-layout-has-sider:has(> .sgenix-ant-layout-sider) > .sgenix-ant-layout-content {
        grid-column: 2 !important;
        grid-row: 1 !important;
        order: 2 !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        padding: 0 !important;
    }

    /* Reforço aplicado após a identificação do painel pelo JavaScript. */
    #support-genix .serai-ticket-layout {
        display: grid !important;
        grid-template-columns: minmax(0, 61fr) minmax(0, 39fr) !important;
        align-items: flex-start !important;
        gap: 20px !important;
        width: 100% !important;
    }

    #support-genix .serai-ticket-technical {
        order: 1 !important;
        flex: 61 1 0 !important;
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        padding: 0 !important;
        border-inline-start: 0 !important;
    }

    #support-genix .serai-ticket-conversation {
        order: 2 !important;
        flex: 39 1 0 !important;
        grid-column: 2 !important;
        grid-row: 1 !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        padding: 0 !important;
    }

    /*
     * Esta regra só vale quando o Sider está dentro de um invólucro técnico.
     * No Support Genix atual, o próprio Sider é a coluna de 61%; por isso não
     * podemos substituir o flex dele por 100% novamente.
     */
    #support-genix .serai-ticket-technical > .serai-ticket-technical-sider {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        flex: 1 1 auto !important;
        padding: 0 !important;
        border-inline-start: 0 !important;
    }
}