/* ============================================================
   DASHBOARD FINANCEIRO - STATUS EM TEMPO REAL
   ============================================================ */

.ga-fin-live-status {

    margin:
        0 0 18px;

    padding:
        15px;

    border:
        1px solid rgba(255,255,255,.07);

    border-radius:
        14px;

    background:
        rgba(255,255,255,.018);
}


.ga-fin-live-status-head {

    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        15px;

    margin-bottom:
        12px;
}


.ga-fin-live-status-head > div {

    display:
        flex;

    flex-direction:
        column;

    gap:
        3px;
}


.ga-fin-live-status-head span {

    color:
        #7e8b95;

    font-size:
        9px;

    font-weight:
        850;

    letter-spacing:
        .13em;
}


.ga-fin-live-status-head strong {

    color:
        #eef2f4;

    font-size:
        14px;
}


.ga-fin-live-status-head small {

    color:
        #68747e;

    font-size:
        10px;
}


.ga-fin-live-status-grid {

    display:
        grid;

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

    gap:
        9px;
}


.ga-live-status-card {

    min-width:
        0;

    padding:
        12px;

    border-radius:
        11px;

    border:
        1px solid rgba(255,255,255,.06);

    background:
        rgba(255,255,255,.022);
}


.ga-live-status-card span {

    display:
        block;

    margin-bottom:
        7px;

    color:
        #7d8993;

    font-size:
        9px;

    font-weight:
        850;

    letter-spacing:
        .08em;
}


.ga-live-status-card strong {

    display:
        block;

    color:
        #edf1f3;

    font-size:
        16px;

    line-height:
        1.2;

    white-space:
        nowrap;
}


.ga-live-status-card small {

    display:
        block;

    margin-top:
        6px;

    color:
        #66727b;

    font-size:
        9px;
}


.ga-live-status-card.receivable {

    border-color:
        rgba(56,195,142,.17);
}


.ga-live-status-card.receivable strong {

    color:
        #6ddcaf;
}


.ga-live-status-card.overdue-in {

    border-color:
        rgba(230,171,60,.18);
}


.ga-live-status-card.overdue-in strong {

    color:
        #e1b760;
}


.ga-live-status-card.payable {

    border-color:
        rgba(224,92,92,.15);
}


.ga-live-status-card.payable strong {

    color:
        #e98c8c;
}


.ga-live-status-card.overdue-out {

    border-color:
        rgba(230,171,60,.18);
}


.ga-live-status-card.overdue-out strong {

    color:
        #e1b760;
}


/* CLEAN */

html[data-ga-theme="clean"]
.ga-fin-live-status {

    background:
        #ffffff;

    border-color:
        #dfe6ea;
}


html[data-ga-theme="clean"]
.ga-fin-live-status-head strong {

    color:
        #26343c;
}


html[data-ga-theme="clean"]
.ga-fin-live-status-head span,
html[data-ga-theme="clean"]
.ga-fin-live-status-head small {

    color:
        #71808a;
}


html[data-ga-theme="clean"]
.ga-live-status-card {

    background:
        #f8fafb;

    border-color:
        #dfe6ea;
}


html[data-ga-theme="clean"]
.ga-live-status-card span,
html[data-ga-theme="clean"]
.ga-live-status-card small {

    color:
        #687781;
}


/* CELULAR */

@media (max-width: 900px) {

    .ga-fin-live-status-grid {

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


@media (max-width: 540px) {

    .ga-fin-live-status-grid {

        grid-template-columns:
            1fr;
    }


    .ga-fin-live-status-head {

        align-items:
            flex-start;

        flex-direction:
            column;
    }
}