/* =========================================
   NEXDEN HOME 2.0
========================================= */

#nfDashboardPage,
.nf-home-page{

    display:flex;

    flex-direction:column;

    gap:22px;

    width:100%;

    max-width:100%;

    min-width:0;
}

#nfDashboardPage
#nfDashboardLoading,
#nfDashboardPage
#nfDashboardError{

    margin:0;

    font-size:14px;

    font-weight:600;

    color:#8b7355;

    font-family:'Inter',sans-serif;
}

#nfDashboardPage
#nfDashboardError{

    color:#a8543a;
}

#nfDashboardPage
#nfDashboardContent{

    display:flex;

    flex-direction:column;

    gap:22px;

    width:100%;

    min-width:0;
}

.nf-home-section-title{

    margin:0 0 14px;

    font-size:16px;

    font-weight:900;

    color:#211404;

    letter-spacing:-.02em;

    font-family:'Inter',sans-serif;
}

/* =========================================
   RESUMO — 4 cards
========================================= */

.nf-home-summary{

    display:grid;

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

    gap:14px;
}

.nf-home-summary-card{

    display:flex;

    flex-direction:column;

    gap:8px;

    min-height:168px;

    padding:18px 18px 16px;

    border-radius:18px;

    background:#fffdf8;

    border:1px solid
    rgba(139,94,0,.1);

    box-shadow:
    0 8px 22px
    rgba(18,11,2,.05);

    text-decoration:none;

    color:inherit;

    transition:
    transform .2s ease,
    box-shadow .2s ease,
    border-color .2s ease;

    font-family:'Inter',sans-serif;
}

.nf-home-summary-card.is-clickable{

    cursor:pointer;

    appearance:none;

    -webkit-appearance:none;

    text-align:left;

    width:100%;
}

.nf-home-summary-card.is-clickable:hover{

    transform:translateY(-2px);

    border-color:
    rgba(139,94,0,.2);

    box-shadow:
    0 12px 28px
    rgba(18,11,2,.08);
}

.nf-home-summary-card__label{

    font-size:11px;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.35px;

    color:#8b7355;
}

.nf-home-summary-card__period{

    font-size:13px;

    font-weight:700;

    color:#6b5840;
}

.nf-home-summary-card__value{

    font-size:20px;

    font-weight:900;

    color:#211404;

    line-height:1.15;

    letter-spacing:-.02em;
}

.nf-home-summary-card__value.is-gold{

    color:#8b5e00;
}

.nf-home-summary-card__meta{

    font-size:12px;

    font-weight:600;

    color:#8b7355;

    line-height:1.4;
}

.nf-home-summary-card__meta.is-highlight{

    color:#16a34a;

    font-weight:800;
}

.nf-home-summary-card.is-empty
.nf-home-summary-card__value{

    color:#9b8a75;
}

.nf-home-balance-rows{

    display:flex;

    flex-direction:column;

    gap:8px;

    margin-top:4px;
}

.nf-home-balance-row{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:10px;

    font-size:13px;

    font-weight:600;

    color:#6b5840;
}

.nf-home-balance-row strong{

    font-size:14px;

    font-weight:800;
}

.nf-home-balance-row
strong.is-income{

    color:#16a34a;
}

.nf-home-balance-row
strong.is-expense{

    color:#dc2626;
}

.nf-home-balance-row.is-result{

    margin-top:4px;

    padding-top:10px;

    border-top:1px solid
    rgba(139,94,0,.1);

    font-size:14px;
}

.nf-home-balance-row.is-result
strong{

    font-size:18px;
}

.nf-home-balance-row.is-result.is-positive
strong{

    color:#16a34a;
}

.nf-home-balance-row.is-result.is-negative
strong{

    color:#dc2626;
}

/* =========================================
   SITUAÇÃO FINANCEIRA
========================================= */

.nf-home-summary-card.is-patrimony
.nf-home-summary-card__value{

    color:#8b5e00;
}

.nf-home-patrimony{

    margin-bottom:20px;
}

.nf-home-patrimony-card{

    background:#fffaf0;

    border:1px solid #f0e4d0;

    border-radius:16px;

    padding:18px 20px;
}

.nf-home-patrimony-rows{

    display:flex;

    flex-direction:column;

    gap:10px;

    margin-top:12px;
}

.nf-home-patrimony-row{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:12px;

    font-size:14px;

    font-weight:600;

    color:#6b5840;
}

.nf-home-patrimony-row strong{

    font-size:15px;

    font-weight:800;

    color:#211404;
}

.nf-home-patrimony-row strong.is-gold{

    color:#8b5e00;
}

.nf-home-patrimony-row.is-total{

    margin-top:6px;

    padding-top:10px;

    border-top:1px solid #eadfce;

    font-size:15px;
}

.nf-home-patrimony-actions{

    display:flex;

    flex-wrap:wrap;

    gap:10px;

    margin-top:16px;
}

/* =========================================
   INSIGHTS PATRIMONIAIS
========================================= */

.nf-home-insights-grid{

    display:grid;

    grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr);

    gap:14px;
}

.nf-home-chart-card,
.nf-home-distribution-card,
.nf-home-financial-summary{

    min-width:0;

    padding:18px 20px;

    border-radius:18px;

    background:#fffdf8;

    border:1px solid
    rgba(139,94,0,.1);

    box-shadow:
    0 8px 22px
    rgba(18,11,2,.05);

    overflow:hidden;
}

.nf-home-chart-legend{

    display:flex;

    flex-wrap:wrap;

    gap:10px;

    margin-bottom:14px;
}

.nf-home-chart-legend span{

    display:inline-flex;

    align-items:center;

    gap:6px;

    font-size:12px;

    font-weight:800;

    color:#6b5840;
}

.nf-home-chart-legend span::before{

    content:'';

    width:10px;

    height:10px;

    border-radius:999px;

    background:#9b8a75;
}

.nf-home-chart-legend .is-income::before{

    background:#16a34a;
}

.nf-home-chart-legend .is-expense::before{

    background:#dc2626;
}

.nf-home-chart-legend .is-result::before{

    background:#8b5e00;
}

.nf-home-cashflow-chart{

    display:grid;

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

    gap:10px;

    min-width:0;
}

.nf-home-cashflow-month{

    min-width:0;

    display:flex;

    flex-direction:column;

    gap:6px;

    align-items:center;
}

.nf-home-cashflow-bars{

    width:100%;

    height:150px;

    display:flex;

    align-items:flex-end;

    justify-content:center;

    gap:4px;

    padding:8px 4px;

    border-radius:14px;

    background:#faf4ea;

    overflow:hidden;
}

.nf-home-cashflow-bar{

    width:18%;

    max-width:18px;

    min-height:4px;

    border-radius:999px 999px 4px 4px;

    transition:height .2s ease;
}

.nf-home-cashflow-bar.is-income{

    background:#16a34a;
}

.nf-home-cashflow-bar.is-expense{

    background:#dc2626;
}

.nf-home-cashflow-bar.is-result.is-positive{

    background:#8b5e00;
}

.nf-home-cashflow-bar.is-result.is-negative{

    background:#f59e0b;
}

.nf-home-cashflow-month strong{

    font-size:12px;

    font-weight:900;

    color:#211404;
}

.nf-home-cashflow-month small{

    max-width:100%;

    font-size:11px;

    font-weight:700;

    color:#8b7355;

    white-space:nowrap;

    overflow:hidden;

    text-overflow:ellipsis;
}

.nf-home-distribution-stack{

    display:flex;

    width:100%;

    height:14px;

    margin:6px 0 16px;

    border-radius:999px;

    background:#f3eadb;

    overflow:hidden;
}

.nf-home-distribution-stack span{

    min-width:0;

    height:100%;
}

.nf-home-distribution-stack .is-accounts{

    background:#211404;
}

.nf-home-distribution-stack .is-goals{

    background:#8b5e00;
}

.nf-home-distribution-list{

    display:flex;

    flex-direction:column;

    gap:10px;
}

.nf-home-distribution-row{

    display:grid;

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

    gap:4px 10px;

    align-items:center;

    padding:10px 0;

    border-bottom:1px solid
    rgba(139,94,0,.08);
}

.nf-home-distribution-row:last-child{

    border-bottom:none;
}

.nf-home-distribution-row span{

    font-size:13px;

    font-weight:800;

    color:#211404;
}

.nf-home-distribution-row strong{

    font-size:18px;

    font-weight:900;

    color:#8b5e00;
}

.nf-home-distribution-row small{

    grid-column:1 / -1;

    font-size:12px;

    font-weight:700;

    color:#8b7355;
}

.nf-home-financial-summary-grid{

    display:grid;

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

    gap:10px;
}

.nf-home-financial-summary-item{

    min-width:0;

    padding:14px;

    border-radius:14px;

    background:#faf4ea;

    border:1px solid
    rgba(139,94,0,.08);
}

.nf-home-financial-summary-item span{

    display:block;

    margin-bottom:8px;

    font-size:11px;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.25px;

    color:#8b7355;
}

.nf-home-financial-summary-item strong{

    display:block;

    font-size:16px;

    font-weight:900;

    color:#211404;

    overflow-wrap:anywhere;
}

.nf-home-financial-summary-item strong.is-income{

    color:#16a34a;
}

.nf-home-financial-summary-item strong.is-expense{

    color:#dc2626;
}

.nf-home-financial-summary-item strong.is-gold{

    color:#8b5e00;
}

.nf-home-situation-card{

    display:flex;

    align-items:flex-start;

    gap:12px;

    padding:16px 18px;

    border-radius:16px;

    border:1px solid
    rgba(139,94,0,.12);

    background:#fffdf8;
}

.nf-home-situation-card.is-success{

    background:#f3fbf5;

    border-color:
    rgba(22,163,74,.18);
}

.nf-home-situation-card.is-warning{

    background:#fff8f3;

    border-color:
    rgba(220,38,38,.16);
}

.nf-home-situation-card__icon{

    flex-shrink:0;

    width:28px;

    height:28px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    border-radius:999px;

    font-size:14px;

    font-weight:900;
}

.nf-home-situation-card.is-success
.nf-home-situation-card__icon{

    background:rgba(22,163,74,.12);

    color:#16a34a;
}

.nf-home-situation-card.is-warning
.nf-home-situation-card__icon{

    background:rgba(220,38,38,.1);

    color:#dc2626;
}

.nf-home-situation-card p{

    margin:2px 0 0;

    font-size:14px;

    font-weight:700;

    color:#211404;

    line-height:1.45;
}

/* =========================================
   AÇÕES RÁPIDAS
========================================= */

.nf-home-actions-grid{

    display:grid;

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

    gap:14px;
}

.nf-home-action-card{

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    gap:10px;

    min-height:132px;

    padding:20px 16px;

    border:none;

    border-radius:20px;

    cursor:pointer;

    transition:
    transform .2s ease,
    box-shadow .2s ease;

    font-family:'Inter',sans-serif;

    box-shadow:
    0 10px 24px
    rgba(18,11,2,.08);
}

.nf-home-action-card:hover{

    transform:translateY(-3px);

    box-shadow:
    0 16px 32px
    rgba(18,11,2,.12);
}

.nf-home-action-card__icon{

    width:44px;

    height:44px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    border-radius:14px;

    background:rgba(255,255,255,.22);

    font-size:22px;

    font-weight:900;

    line-height:1;
}

.nf-home-action-card__label{

    font-size:15px;

    font-weight:900;

    letter-spacing:-.01em;
}

.nf-home-action-card.is-income{

    background:linear-gradient(
        180deg,
        #22c55e 0%,
        #16a34a 100%
    );

    color:#f0fdf4;
}

.nf-home-action-card.is-expense{

    background:linear-gradient(
        180deg,
        #f87171 0%,
        #dc2626 100%
    );

    color:#fff5f5;
}

.nf-home-action-card.is-card{

    background:linear-gradient(
        180deg,
        #4b5563 0%,
        #211404 100%
    );

    color:#f3d38a;
}

.nf-home-action-card.is-deposit{

    background:linear-gradient(
        180deg,
        #d4a94a 0%,
        #8b5e00 100%
    );

    color:#fffdf8;
}

/* =========================================
   AVISOS
========================================= */

.nf-home-alerts-list{

    display:flex;

    flex-direction:column;

    gap:10px;
}

.nf-home-alert{

    display:flex;

    align-items:flex-start;

    gap:12px;

    padding:14px 16px;

    border-radius:14px;

    border:1px solid
    rgba(139,94,0,.1);

    background:#fffdf8;
}

.nf-home-alert.is-warning{

    background:#fff8f3;

    border-color:
    rgba(220,38,38,.14);
}

.nf-home-alert.is-danger{

    background:#fff5f5;

    border-color:
    rgba(220,38,38,.2);
}

.nf-home-alert.is-success{

    background:#f3fbf5;

    border-color:
    rgba(22,163,74,.16);
}

.nf-home-alert__icon{

    flex-shrink:0;

    font-size:14px;

    font-weight:900;

    line-height:1.4;
}

.nf-home-alert p{

    margin:0;

    font-size:13px;

    font-weight:700;

    color:#211404;

    line-height:1.45;
}

/* =========================================
   MOVIMENTAÇÕES
========================================= */

.nf-home-movements__head{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:12px;

    margin-bottom:14px;
}

.nf-home-movements__head
.nf-home-section-title{

    margin:0;
}

.nf-home-link-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    min-height:38px;

    padding:0 14px;

    border-radius:12px;

    border:1px solid
    rgba(139,94,0,.16);

    background:#fffdf8;

    color:#211404;

    font-size:13px;

    font-weight:800;

    text-decoration:none;

    white-space:nowrap;

    transition:
    background .2s ease,
    border-color .2s ease,
    transform .2s ease;

    font-family:'Inter',sans-serif;
}

.nf-home-link-btn:hover{

    background:#f5efe3;

    border-color:
    rgba(139,94,0,.28);

    color:#211404;

    transform:translateY(-1px);
}

.nf-home-movements-list{

    display:flex;

    flex-direction:column;

    gap:10px;
}

.nf-home-movement-item{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:14px;

    padding:16px 18px;

    border-radius:16px;

    background:#fffdf8;

    border:1px solid
    rgba(139,94,0,.1);

    transition:
    background .15s ease,
    border-color .15s ease,
    transform .15s ease;
}

.nf-home-movement-item:hover{

    background:#fff6e8;

    border-color:
    rgba(139,94,0,.18);

    transform:translateY(-1px);
}

.nf-home-movement-item__main{

    display:flex;

    flex-direction:column;

    gap:4px;

    min-width:0;
}

.nf-home-movement-item__desc{

    font-size:14px;

    font-weight:800;

    color:#211404;

    line-height:1.25;
}

.nf-home-movement-item__cat{

    font-size:12px;

    font-weight:600;

    color:#8b7355;
}

.nf-home-movement-item__side{

    display:flex;

    flex-direction:column;

    align-items:flex-end;

    gap:4px;

    flex-shrink:0;
}

.nf-home-movement-item__amount{

    font-size:15px;

    font-weight:900;

    letter-spacing:-.01em;
}

.nf-home-movement-item__amount.is-income{

    color:#16a34a;
}

.nf-home-movement-item__amount.is-expense{

    color:#dc2626;
}

.nf-home-movement-item__amount.is-gold{

    color:#8b5e00;
}

.nf-home-movement-item__amount.is-neutral{

    color:#211404;
}

.nf-home-movement-item__date{

    font-size:11px;

    font-weight:700;

    color:#9b8a75;

    text-transform:uppercase;

    letter-spacing:.3px;
}

.nf-home-empty{

    margin:0;

    padding:18px 0 6px;

    font-size:13px;

    font-weight:600;

    color:#9b8a75;

    text-align:center;
}

/* =========================================
   RESPONSIVO
========================================= */

@media(max-width:1100px){

    .nf-home-summary{

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

    .nf-home-insights-grid{

        grid-template-columns:1fr;
    }

    .nf-home-financial-summary-grid{

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

    .nf-home-actions-grid{

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

@media(max-width:640px){

    .nf-home-summary{

        grid-template-columns:1fr;
    }

    .nf-home-chart-card,
    .nf-home-distribution-card,
    .nf-home-financial-summary{

        padding:16px;
    }

    .nf-home-cashflow-chart{

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

    .nf-home-cashflow-bars{

        height:120px;
    }

    .nf-home-financial-summary-grid{

        grid-template-columns:1fr;
    }

    .nf-home-actions-grid{

        grid-template-columns:1fr 1fr;
    }

    .nf-home-movements__head{

        flex-direction:column;

        align-items:stretch;
    }

    .nf-home-link-btn{

        width:100%;
    }

    .nf-home-movement-item{

        flex-direction:column;

        align-items:stretch;
    }

    .nf-home-movement-item__side{

        align-items:flex-start;
    }
}
