.dashboard-page{
    /*background:#f4f1ec;*/
    min-height:100vh;
    max-width:1120px;
    margin:0 auto;
    padding-top:20px;
}

/* TOP AREA - cards se thoda bahar */
.dashboard-top{
    display:flex;
    justify-content:space-between;
    align-items:center;

    margin-bottom:38px;

    margin-left:-20px;   /* left side bahar */
    margin-right:-20px;  /* right side bahar */
}

/* LEFT BUTTONS */

.tabs{
    display:flex;
    gap:12px;
}

.tab-btn{
    width:84px;
    height:38px;

    border:1px solid #0d6efd;
    border-radius:4px;

    background:#fff;
    color:#0d6efd;

    font-size:16px;
    cursor:pointer;
}

.tab-btn.active{
    background:#0d6efd;
    color:#fff;
    font-weight:600;
}

/* RIGHT FILTERS */

.filters{
    display:flex;
    gap:10px;
}

.filters select{
    width:140px;
    height:36px;

    border:1px solid #d4d4d4;
    border-radius:4px;

    background:#fff;

    padding:0 12px;
    font-size:14px;
    outline:none;
}

/* CARDS GRID */

.dashboard-grid{
    display:grid;

    grid-template-columns:
        repeat(3, 332px);

    justify-content:space-between;

    row-gap:24px;
}

/* CARD */

.card{
    height:118px;

    /* background:#ececec; */

    border:1px solid #d7d7d7;
    border-radius:8px;

    box-shadow:0 2px 8px rgba(0,0,0,.08);

    padding:16px;

    position:relative;
}

.card .title{
    font-size:15px;
    color:#4a4a4a;
}

.card h2{
    position:absolute;

    left:50%;
    top:55%;

    transform:translate(-50%,-50%);

    font-size:22px;
    font-weight:700;

    color:#0d6efd;
}