:root{
    --top-header-color: #f0f0ed;
    --body-color: #eff3f4;
    --bg-color: #fff;
    --text-color: #000;
    --bg-color: #fff;
    /*----- section color ----*/
    --dropdown-bg: #fff;
    --middle-header-color: #fff;
    --navbar-bg-color: #F0F0F1;
    --border-color: #ccc;
    --date-color: #666;
}


.dark-theme{
    --top-header-color: #424242;
    --body-color: #2d2d2d;
    --bg-color: #424242;
    --text-color: #fff;
    /*----- section color ----*/
    --dropdown-bg: #262626;
    --middle-header-color: #2d2d2d;
    --navbar-bg-color: #626262;
    --border-color: #2d2d2d;
    --date-color: #fff;
}