@import url('https://fonts.googleapis.com/css2?family=Livvic:wght@200;300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Assistant:wght@200;300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=McLaren:wght@200;300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Metrophobic:wght@200;300;400;500;600;700;800&display=swap');


:root {
    --font-family: 'Livvic', sans-serif;
    --font-family-footer-link: 'Livvic', sans-serif;
    --font-family-banner-name: 'McLaren', sans-serif;
    --font-family-banner-caption: 'Metrophobic', sans-serif;
  
    --gradient-text: linear-gradient(89.97deg, #AE67FA 1.84%, #F49867 102.67%);
    --gradient-bar: linear-gradient(103.22deg, #AE67FA -13.86%, #F49867 99.55%);
    
    --color-bg: #ececec;
    --main-bg: #fdfdfd;
    --color-footer : #031B34;
    --color-blog: #042c54;
    --color-text: #9DDBFE;
    --color-subtext: #FF8A71;

    /**
     * Charts
     */
     --chart-hlc-border-red: #b9b9b9;
     --chart-hlc-line-red: #bf1717;
     --chart-hlc-border-green: #b9b9b9; /*0bd934*/
     --chart-hlc-line-green: #11962b;
     --chart-hlc-border-orange: #b9b9b9;
     --chart-hlc-line-orange: #ffb300;
     --chart-value-font-family: 'Assistant', sans-serif;
     --chart-value-textcolor: #444444;
     --chart-label-font-family: 'Assistant', sans-serif;
     --chart-label-textcolor: #444444;

     --chart-hdc-border-color: #444444;
     --chart-hdc-color-0: #2fa2ee;
     --chart-hdc-color-1: #f88315;
     --chart-hdc-color-2: #07b635;
     --chart-hdc-color-3: #0a61e2;
     --chart-hdc-color-4: #ac12ce;
     --chart-hdc-color-5: #14f0bc;
     --chart-hdc-color-6: #58ab27;
     --chart-hdc-color-7: #d5380d;
     --chart-hdc-color-8: #a9550c;
     --chart-hdc-color-9: #126c57;
     --chart-hdc-color-10: #70d0ba;
     --chart-hdc-color-11: #ec57c9;
     --chart-hdc-color-12: #c0ff74;
     --chart-hdc-color-13: #ffee7f;
     --chart-hdc-color-14: #dd00ff;
     --chart-hdc-color-15: #fb4949;

     --chart-vbc-bar-color: #12aaf6;

    /** 
     * Static Layouts
     */

    --static-bg: #333333;
    --static-header-textcolor: #f2bb2e;

    /**
     * Sign in 
     */ 
    --sign-in-bg: #333333;
    --sign-in-header: #ffffff;
    --sign-in-header-caption: #f2bb2e;
    --sign-in-textbox-bg: #444444;
    --sign-in-textbox-bg-focus: #5f5f5f;
    --sign-in-textbox-bordercolor: #4e4e4e;
    --sign-in-textbox-bordercolor-focus: #a3a3a3;
    --sign-in-textbox-textcolor: #ffffff;
    --sign-in-group-bg: #292929;
    --sign-in-group-bordercolor: #585858;

    --sign-up-bg: #333333;
  
    /**
     * Footer
     */
    --footer-bg: var(--color-bg);
    --footer-bottom-bg: linear-gradient(150deg, #000000 35%, #4b4b4b 60%);  
    /**--footer-bottom-bg: #151515;**/
    --footer-link-textcolor: rgb(70, 70, 70);
    --footer-link-textcolor-hover:  #000000; 
    /*--footer-copyright-textcolor: rgb(80, 80, 80);*/
    --footer-copyright-textcolor: #818181;
    --footer-bordercolor: #dddddd;

    /**
     * Dashboard
     */
    --dashboard-panel-bgcolor: #f9f9f9;
    --dashboard-panel-block-bgcolor: #f6f6f6;
    --dashboard-panel-bordercolor: #dddddd;
    --dashboard-panel-title-font-family: var(--navbar-font-family);
    --dashboard-panel-title-textcolor: #1a1a1a;
    --dashboard-panel-error-textcolor: #b92222;
    --dashboard-panel-error-bgcolor: #e8e8e8;
    --dashboard-panel-error-bordercolor: #a1a1a1;

    --dashboard-panel-exaggr-daily-btn-bgcolor: #e8f3ff;
    --dashboard-panel-exaggr-daily-btn-bordercolor: #b5c2d1;
    --dashboard-panel-exaggr-daily-btn-textcolor: #555555;
    --dashboard-panel-exaggr-daily-btn-bgcolor-active: #469dff;
    --dashboard-panel-exaggr-daily-btn-bordercolor-active: #1984ff;
    --dashboard-panel-exaggr-daily-btn-textcolor-active: #ffffff;

    /*
     * Forms 
     */
  
    /* Fonts */ 
    --form-font-family: 'Assistant', sans-serif;
    --form-title-font-family: var(--form-font-family);
    --form-title-font-family: var(--form-font-family);
    --form-textbox-font-family: var(--form-font-family);
    --form-fieldlabel-font-family: var(--form-font-family);
    --form-groupheader-font-family: var(--form-font-family);
    --form-button-font-family: var(--form-font-family);
    --form-error-font-family: var(--form-font-family);
    --form-cardtitle-font-family: var(--form-font-family);
    --form-cardlabel-font-family: var(--form-font-family);
  
    /* Colors */
      
    --form-color-bg:  var(--main-bg);
    --form-shadow: #252525;
    --form-title-bg: #fdfdfd /* #179fb8 */ /* #142c97*/;
    --form-title-textcolor: #505050; 
    --form-title-bordercolor: #9e9e9e; /*linear-gradient(90.87deg, #092A9F 7.46%, #092a9f13 81.46%);  */
    --form-buttons-bg: #fdfdfd;
    --form-footer-textcolor: #525252;
    --form-groupheader-textcolor: #575757;
    --form-fieldlabel-textcolor: #444444;
    --form-fieldvalue-textcolor: #2c2c2c;
    --form-textbox-textcolor: #2c2c2c;
    --form-textbox-bordercolor: #9c9c9c;
    --form-button-bg: #303030 /* #20a4bb */;
    --form-button-bordercolor: #d3d3d3 /* #118094 */;
    --form-button-textcolor: #ffffff;
    --form-button-textcolor-hover: #ffffff /*#f2bb2e*/;
    --form-button-bordercolor-hover: #d3d3d3;
    --form-button-bg-hover: #727272 /*#21beda*/;
    --form-card-bg-hover: none /* #00d9ff10 */ /* #f0f0f08e*/;
    --form-card-bg-hover-shadow: #747b7c71;
    --form-card-bordercolor: transparent;
    --form-card-bordercolor-mobile:  #d3d3d3;;
    --form-card-bordercolor-hover: transparent /* #00d9ff27 */ /*  #cccccc*/;
    --form-error-textcolor:  #ff0000; 
  
    /* Theme - Gold
    --form-color-bg:  #f7eebc;
    --form-shadow: #252525;
    --form-title-bg: #f7d883;
    --form-title-textcolor: #80641f; 
    --form-footer-textcolor: #2c2c2c;
    --form-groupheader-textcolor: #80641f;
    --form-fieldlabel-textcolor: #3a3a3a;
    --form-textbox-textcolor: #2c2c2c;
    --form-textbox-bordercolor: #9c9c9c;
    --form-button-bg: #ffcb48;
    --form-button-bordercolor: #ecaf2a;
    --form-button-textcolor: #292929;
    --form-button-bordercolor-hover: #b98411;
    --form-button-bg-hover: #ffcb48;
    --form-card-bg-hover:  #f7e996a4;
    --form-error-textcolor:  #ff0000; */
  
    /**
     * Header
     */
    --header-bg: linear-gradient(150deg, #000000 15%, #4b4b4b 40%);  
    --header-shadow: #64646486;
    --header-menu-shadow: #2e2e2ead;
  
    /**
     * Navbar
     */
     --navbar-font-family: 'Assistant', sans-serif;
     --navbar-title-font-family: var(--navbar-font-family);
     --navbar-item-font-family: var(--navbar-font-family);

     --navbar-bg: #f7f7f7;  
     --navbar-title-textcolor: #1a1a1a;
     --navbar-item-textcolor: #2e2e2e;
     --navbar-item-bg-hover: #333333;
     --navbar-item-textcolor-hover: #ffffff;
     --navbar-item-separatorcolor: #e7e7e7;
     --navbar-bordercolor: #ebebeb;

     --navbar-user-textcolor: var(--navbar-title-textcolor);
     --navbar-home-textcolor: var(--navbar-title-textcolor);

    /**
     * Filterbar
     */
     --filterbar-font-family: 'Assistant', sans-serif;
     --filterbar-title-font-family: var(--filterbar-font-family);
     --filterbar-item-font-family: var(--filterbar-font-family);

     --filterbar-bg: #f7f7f7;  
     --filterbar-title-textcolor: #ffffff;
     --filterbar-title-bgcolor: #363636;
     --filterbar-item-textcolor: #2e2e2e;
     --filterbar-item-bg-hover: #333333;
     --filterbar-item-textcolor-hover: #ffffff;
     --filterbar-item-separatorcolor: #e7e7e7;
     --filterbar-bordercolor: #cacaca;

     --filterbar-user-textcolor: var(--filterbar-title-textcolor);
     --filterbar-home-textcolor: var(--filterbar-title-textcolor);
     
    /**
     * Signed-in user
     */
    --user-font-family: 'Metrophobic', 'Assistant', sans-serif;
    --user-textcolor: #ffffff;
    --user-home-font-family: 'Metrophobic', 'Assistant', sans-serif;
    --user-home-textcolor: #ffffff;
    
    --user-dropdown-menu-bg: #292929;
    --user-dropdown-menu-bordercolor: #8b8b8b;
    --user-dropdown-menu-textcolor: #fbfbfb;
    --user-dropdown-menu-item-hover: #727272;

    /**
     * MsgBox
     */
    --msgbox-title-font-family: 'Assistant', sans-serif;
    --msgbox-message-font-family: 'Assistant', sans-serif;
    --msgbox-button-font-family: 'Assistant', sans-serif;

    --msgbox-bg: #eaf7ff;
    --msgbox-shadow: #5f5f5fad;
    --msgbox-bordercolor: #182352;
    
    --msgbox-title-bg: #182352;
    --msgbox-title-textcolor: #fbfbfb;
    
    --msgbox-message-textcolor: #3a3a3a;

    --msgbox-button-bg: #1e53c5;
    --msgbox-button-bordercolor: #1c1483;
    --msgbox-button-textcolor: #ffffff;

    --msgbox-button-bg-hover: #346adf;
    --msgbox-button-bordercolor-hover: #1c1483;

    --color-pallete: #058625;

    /**
     * Report
     */
     --report-header-font-family: 'Assistant', sans-serif;
     --report-header-bordercolor:  #3a3a3a;
     --report-header-textcolor: #2e2e2e;

     --report-body-font-family: 'Assistant', sans-serif;
     --report-body-textcolor: #2e2e2e;
     --report-body-bordercolor:  #e7e7e7;
     --report-body-bgcolor: var(--main-bg);

    /**
     * Budget
     */
     --budget-subhead-panel-bg: #fafafa;
     --budget-subhead-panel-bordercolor: #d2d2d2;
  }