:root {

    --body-background: #f6f8fb;

    /* Start Brand Color */
    --brand-main-color: #0054a6;
    --brand-main-text-color: #ffffff;
    /*2a51c8*/
    --brand-second-color: #2e85dc;
    --brand-third-color: #182433;

    /* Start Colors */
    --white: #fff;
    --green: #65B741;

    /* Start Text Colors */
    --text-white: #fff;
    --text-black: #161616;
    --text-gray: #888888;

    /* Start Background Color */
    --bg-white: #fff;
    --bg-black: #161616;
    --bg-gray: #888888;
    /* Theme BG */
    --bg-main: var(--brand-main-color);
    --bg-second: #f6f8fb;
    --bg-third: #e9f0f9;



    /* Start Borders */
    --border-color: #0420451a;
    --border-radius: 3px;
    --border-radius-md: 8px;
    /* End Borders */





    /* Start Cards & Boxs Style */

    --card-shadow: 0px;
    --card-shadow-hover: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 20px 20px -30px;
    --card-bg: #fff;
    --card-border: solid 1px var(--border-color);
    --card-radius: var(--border-radius);
    --card-padding: 20px;
    --card-margin-bottom: 30px;
    /* End Cards & Boxs Style */
















    /* Start Buttons */
    --btn-main-color: #fff;
    --btn-main-bg: var(--brand-main-color);
    --btn-main-border-radius: var(--border-radius-md);
    --btn-main-soft-bg: #0053a624;
    --btn-main-soft-color: var(--brand-main-color);
    /**/
    --btn-second-color: #fff;
    --btn-second-bg: var(--brand-second-color);
    --btn-second-border-radius: var(--border-radius);
    --btn-second-soft-bg: #0053a624;
    --btn-second-soft-color: var(--brand-main-color);
    /* End Buttons */




    /* Start Inputs */
    --input-text-color: #5d5d5d;
    --input-main-bg: #f8f8f8;
    --input-border-color: #efefef;
    --input-border-radius: var(--border-radius);
    --input-height: 48px;
    /* On Foucs */
    --input-text-color-on-foucs: #212121;
    --input-main-bg-on-foucs: #ffffff;
    --input-border-on-foucs: var(--brand-second-color);



    /* End Inputs */


    /* Start Navbar */
    --navbar-bg: #ffffff;
    --navbar-text-color: #1f1f1f;
    --navbar-height: 80px;
    /* End Navbar */





    /* Start footer */
    --footer-bg: var(--brand-main-color);
    /* End footer */

}
