/*
============================================================
NOYTRIX PROFILE V106
ACCOUNT + REAL SETTINGS
============================================================
*/


/* ============================================================
   HIDE TOP RIGHT CONTROLS ONLY ON PROFILE
   ============================================================ */

body.p56-profile-open
.language-switcher,

body.p56-profile-open
#headerAccountButton,

body.nx106-profile-active
.language-switcher,

body.nx106-profile-active
#headerAccountButton {

    display:
        none !important;
}


/* ============================================================
   MOVE PROFILE CONTENT UP
   ============================================================ */

body.p56-profile-open
.workspace,

body.nx106-profile-active
.workspace {

    padding-top:
        0 !important;
}


#screen-profile-v56[data-nx-profile-settings-only="105"],

.p56-screen[data-nx-profile-settings-only="105"] {

    padding-top:
        12px !important;
}


/* ============================================================
   PROFILE
   ============================================================ */

.nx106-profile {

    width:
        100%;

    margin:
        0 0 26px;

    padding:
        0;

    box-sizing:
        border-box;
}


.nx106-head {

    margin:
        0 0 18px;

    padding:
        0;
}


.nx106-eyebrow {

    display:
        block;

    margin-bottom:
        6px;

    color:
        #ffbd24;

    font-size:
        11px;

    font-weight:
        850;

    letter-spacing:
        .11em;

    line-height:
        1;
}


.nx106-head h1 {

    margin:
        0;

    color:
        #f4f7ff;

    font-size:
        38px;

    font-weight:
        820;

    letter-spacing:
        -.04em;

    line-height:
        1.05;
}


.nx106-head p {

    margin:
        7px 0 0;

    color:
        #8ba2bd;

    font-size:
        13px;

    font-weight:
        580;

    line-height:
        1.4;
}


/* ============================================================
   TWO PERFECTLY EQUAL CARDS
   ============================================================ */

.nx106-grid {

    display:
        grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap:
        12px;

    width:
        100%;
}


.nx106-card {

    width:
        100%;

    height:
        118px;

    min-height:
        118px;

    max-height:
        118px;

    display:
        flex;

    align-items:
        center;

    gap:
        16px;

    padding:
        18px 20px;

    border:
        1px solid #204a72;

    border-radius:
        12px;

    background:
        linear-gradient(
            145deg,
            #081d37,
            #071a31
        );

    box-sizing:
        border-box;

    overflow:
        hidden;
}


.nx106-avatar {

    width:
        58px;

    height:
        58px;

    min-width:
        58px;

    display:
        grid;

    place-items:
        center;

    color:
        #f6f9ff;

    font-size:
        18px;

    font-weight:
        850;

    border:
        2px solid #ffbd24;

    border-radius:
        50%;

    background:
        #09213d;
}


.nx106-copy,

.nx106-plan-copy {

    min-width:
        0;

    flex:
        1 1 auto;
}


.nx106-copy > span,

.nx106-plan-copy > span {

    display:
        block;

    margin-bottom:
        5px;

    color:
        #ffbd24;

    font-size:
        10px;

    font-weight:
        850;

    letter-spacing:
        .08em;
}


.nx106-copy > strong,

.nx106-plan-copy > strong {

    display:
        block;

    overflow:
        hidden;

    color:
        #f2f6fc;

    font-size:
        18px;

    font-weight:
        790;

    line-height:
        1.2;

    white-space:
        nowrap;

    text-overflow:
        ellipsis;
}


.nx106-copy > small,

.nx106-plan-copy > small {

    display:
        block;

    overflow:
        hidden;

    margin-top:
        5px;

    color:
        #8aa1ba;

    font-size:
        11px;

    font-weight:
        580;

    line-height:
        1.3;

    white-space:
        nowrap;

    text-overflow:
        ellipsis;
}


.nx106-plan-status {

    color:
        #43de97 !important;

    font-weight:
        700 !important;
}


/* ============================================================
   BUTTONS
   ============================================================ */

.nx106-manage,

.nx106-logout {

    flex:
        0 0 auto;

    min-width:
        128px;

    height:
        40px;

    padding:
        0 16px;

    font-family:
        inherit;

    font-size:
        12px;

    font-weight:
        760;

    border-radius:
        8px;

    cursor:
        pointer;
}


.nx106-manage {

    color:
        #07101a;

    border:
        1px solid #ffbd24;

    background:
        #ffbd2e;
}


.nx106-manage:hover {

    filter:
        brightness(1.05);
}


.nx106-logout {

    color:
        #dce8f5;

    border:
        1px solid #315675;

    background:
        #0a213b;
}


.nx106-logout:hover {

    border-color:
        #4c789c;

    background:
        #0d2948;
}


/* ============================================================
   SETTINGS DIRECTLY BELOW PROFILE
   ============================================================ */

#screen-profile-v56
#screen-settings.nx105-real-settings,

.p56-screen
#screen-settings.nx105-real-settings {

    margin-top:
        0 !important;
}


#screen-profile-v56
#screen-settings
.settings-page-header,

.p56-screen
#screen-settings
.settings-page-header {

    margin-top:
        0 !important;

    padding-top:
        0 !important;
}


/*
 * The account/help sentence is now redundant because
 * Profile + plan management are directly above Settings.
 *
 * Save / Reset remain untouched.
 */

#screen-profile-v56
#settingsFooterText,

.p56-screen
#settingsFooterText {

    display:
        none !important;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 900px) {

    .nx106-grid {

        grid-template-columns:
            1fr;
    }


    .nx106-card {

        max-height:
            none;

        height:
            auto;

        min-height:
            110px;
    }


    .nx106-manage,

    .nx106-logout {

        min-width:
            110px;
    }

}