.expenses-main__grid{
    display: grid;
    grid-template-columns: 1fr 3fr;
    gap: 3rem;
}
.expenses-main__grid--1{
   grid-row: 1;
   grid-column: 1 / -1;

}
.expenses-main__grid--2{
    grid-column: 1;
    grid-row: 2;
    padding: 1.6rem 3rem;
    box-shadow: 0px 0px 20px 0px #0000001A;
}
.expenses-main__grid--3{
    grid-column: 2;
}

.expenses-main__grid-content__header {
    min-height: 27.3rem;
    background:linear-gradient(86.48deg, #D4E8F7 0.91%, #F0FBFF 25.54%, #FAF3FF 62.36%, #F8F5D3 99.42%);
    position: relative;
    padding: 3rem;
    display: flex;
    justify-content: flex-end;
}
.expenses-main__grid-content__header::before{
    content: url('../images/expenses/expense-dashboard-hero.png');
    position: absolute;
    top: 1rem;
    left: 0;
    height: 100%;
    overflow: hidden;
}
.expenses-main__grid-content__header-top .row1{
   display: flex;
   justify-content: space-between;
   align-items: center;
}
.expenses-main__grid-content__header-top .row1 h2{
    height: fit-content;
}
.expenses-main__grid-content__header-top > :not(:last-child){
    margin-bottom: 1.2rem;
}
.expenses-main__grid-content__header-cont{
    width: 75%;
}
.expenses-main__grid-content__header-bottom{
    display: flex;
    gap: 2rem;
}
.split-1-of-3{
    flex: 1;
    min-height: 12rem;
    position: relative;
    display: flex;
    justify-content: space-between;
}

.split-1-of-3:nth-child(1){
    background-image: url('../images/expenses/expe1.png');
    border-image-source: linear-gradient(269.84deg, rgba(215, 184, 202, 0) 12.56%, #D7B8CA 52.45%, rgba(215, 184, 202, 0) 90.65%);
    background-repeat: no-repeat;
    background-size: cover;
}
.split-1-of-3:nth-child(2){
    background: url('../images/expenses/expe2.png');
    border: 0.43px solid;
    border-image-source: linear-gradient(269.84deg, rgba(215, 184, 202, 0) 12.56%, #D7B8CA 52.45%, rgba(215, 184, 202, 0) 90.65%);
    background-repeat: no-repeat;
    background-size: cover;

}
.split-1-of-3:nth-child(3){
    background: url('../images/expenses/expe3.png');
    border: 0.43px solid;
    border-image-source: linear-gradient(269.84deg, rgba(215, 184, 202, 0) 12.56%, #D7B8CA 52.45%, rgba(215, 184, 202, 0) 90.65%);
    background-repeat: no-repeat;
    background-size: cover;
}

.left__header-h3-sec{
    height: 2.3rem;
    aspect-ratio: 1;
    background: #ffffff;
    color: #BC94F8;
    padding: 0.2rem 0.4rem;
}
.left__header-h3-sec.blue{
    color: #6A9EFA;
}
.left__header-h3-sec.orange{
    color: #F7735D;
}
.expenses-main__grid-content__header-bottom .split-1-of-3 .left{
    display: flex;
    height: 100%;
    flex-direction: column;
    justify-content: space-between;
     padding: 1.2rem 0 1.2rem 1.2rem;
}
.expense_title_wrpr p{
    margin-top: 1.2rem;
}
.add_expence_input::placeholder{
    font-weight:var(--font_weight300);
    color: var(--primary_light);
}
.invoice_textbox textarea.expence_textarea{
    font-size: var(--font16);
    font-weight:var(--font_weight400);
    color:#2D2D2D ;
}
.invoice_textbox textarea.expence_textarea::placeholder{
    font-weight:var(--font_weight300);
    color: var(--primary_light);
}
@media(min-width:1025px) and (max-width:1450px) {
    .expenses-main__grid {
        grid-template-columns:1fr  !important;
    }
    .expenses-main__grid--2{
        grid-column: 1;
        grid-row: 2;
        grid-column: 1 / -1;
    }
    .expenses-main__grid--3 {
        grid-column: 2;
        grid-column: 1 / -1;
    }
    .middle-grap-section{
        max-width: 40rem;
        margin: 0px auto;
    }

}
@media screen and (max-width:1023px){
    .expenses-main__grid--2{
        grid-column: 1 / -1;
        display:flex;
        flex-wrap: wrap;
    }
    .graph-or-chart-heading-gs{
        flex: 0 0 100%;
    }
    .middle-grap-section,.bottom_legend_section{
        flex:1;
    }
    .expenses-main__grid--3 {
        grid-column: 1 / -1;
        display: flex;
        width: 100%;
    }
    .expenses-main__grid--3 .recent_trans_tables {
        height: 100%;
        width: 100%;
    }
    .expenses-main__grid {
        height: 100%;
        overflow: hidden auto;
    }
}

@media screen and (max-width:767px){
    .middle-grap-section, .bottom_legend_section{
        flex: 0 0 100%;
    }
    .expenses-main__grid-content__header-bottom{
            flex-wrap: wrap;
    }
    .split-1-of-3:nth-child(1) {
        flex: 0 0 100%;
    }
    .expenses-main__grid-content__header{
        padding: 1.2rem;
    }
    .split-1-of-3{
        padding: 1rem;
        flex-direction: column;
    }
    .split-1-of-3 .right{
        text-align: right;
    }
    .split-1-of-3 .right img{
        width: 60px;
        height: 60px;
        margin-left: auto;
    }
    .split-1-of-3:nth-child(1) .right img{
        width: 100px;
        height:100px;
        margin-left: auto;
    }
}