/**
 * Status messages before and after authentication
 *
 * created 03.10.2023 NOMI PPM-258 MFA Phase 2 - WSL Authentication
 */

body, html {
    margin: 4px;
    padding: 0;
}

.containerInfo {
    display: grid;
    grid-template-rows: 60px auto 24px; /* They should sum up to 540px */
    width: 970px;
    height: 630px; /* Total height of containerInfo */
}

.headerInfo, .bodyInfo, .footerInfo {
    /*border: 1px solid black;*/
    box-sizing: border-box;
}

.bodyInfo left {
    margin-left: 8px;
}

.headerInfo, .footerInfo {
    grid-template-columns: 1fr 1fr; /* Equal width columns for headerInfo and footerInfo */
}

.footerInfo {
    border-top: 1px solid darkgray;
    padding-top: 4px;
}

.bodyInfo {
    grid-template-columns: 3fr 1fr; /* 3/2 width columns for bodyInfo */
}

.headerInfo.left, .footerInfo.left {
    text-align: left;
    grid-column: 1 / 3;
}

.headerInfo.right, .footerInfo.right {
    text-align: right;
    grid-column: 3 / 5;
}

.bodyInfo.left {
    grid-column: 1 / 4; /* Adjusted grid-column values to respect 3/2 ratio */
}

.bodyInfo.right {
    grid-column: 4 / 5; /* Adjusted grid-column values to respect 3/2 ratio */
}

.headerInfo.left, .headerInfo.right {
    grid-row: 1 / 2;
}

.bodyInfo.left, .bodyInfo.right {
    grid-row: 2 / 3;
}

.footerInfo.left, .footerInfo.right {
    grid-row: 3 / 4;
}