@import url("fontawesome-all.min.css");
@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,700italic|Open+Sans+Condensed:700");

/*
	TXT by HTML5 UP
	html5up.net | @ajlkn
	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/

/********************************************
 * HAFABRA DATA — DESIGN SYSTEM
 ********************************************/

/* -----------------------------------------
   COLOR VARIABLES
   The complete color palette. Every color
   on the site comes from these tokens.
   See color-palette.html for a visual reference.
----------------------------------------- */
:root {

    /* -------------------------------------- */
    /*  GREEN  (Brand Primary)                */
    /* -------------------------------------- */
    --green-darker:       #1B5E20;
    --green-dark:         #388E3C;
    --green:              #4CAF50;
    --green-light:        #7ECF82;
    --green-ultralight:   #e9f5e9;

    /* -------------------------------------- */
    /*  GOLD  (Brand Secondary)               */
    /* -------------------------------------- */
    --gold-darker:        #5A3E00;
    --gold-dark:          #8B6914;
    --gold:               #B8952A;
    --gold-light:         #D4BA6E;
    --gold-ultralight:    #F9F4DE;

    /* -------------------------------------- */
    /*  BLUE  (Info & Chart Series 1)         */
    /* -------------------------------------- */
    --blue-darker:        #002D72;
    --blue-dark:          #1565C0;
    --blue:               #3f82d2;
    --blue-light:         #90CAF9;
    --blue-ultralight:    #E3F2FD;

    /* -------------------------------------- */
    /*  RED  (Error & Chart Series 2)         */
    /* -------------------------------------- */
    --red-darker:         #7F0000;
    --red-dark:           #C62828;
    --red:                #D64545;
    --red-light:          #EF9A9A;
    --red-ultralight:     #FCE4E4;

    /* Admin accent */
    --admin-accent:       #0077cc;
    --admin-accent-dark:  #005fa3;

    /* -------------------------------------- */
    /*  NEUTRALS (GRAYS)                      */
    /* -------------------------------------- */
    --gray-900: #1A1A1A;
    --gray-800: #2E2E2E;
    --gray-700: #4B4B4B;
    --gray-600: #6D6D6D;
    --gray-500: #9A9A9A;
    --gray-400: #C7C7C7;
    --gray-300: #E0E0E0;
    --gray-200: #EFEFEF;
    --gray-100: #F7F7F7;
    --white: #FFFFFF;

    /* -------------------------------------- */
    /*  UI ELEMENT COLORS                     */
    /* -------------------------------------- */

    /* Links */
    --link-color: var(--green-dark);
    --link-hover: var(--green);

    /* Borders & lines */
    --border:         #E5E9E7;
    --border-input:   var(--gray-300);
    --border-hover:   var(--green);

    /* Shadows */
    --shadow-soft:   0 2px 6px rgba(0,0,0,0.08);
    --shadow-medium: 0 4px 12px rgba(0,0,0,0.12);
    --shadow-dark:   0 6px 16px rgba(0,0,0,0.16);

    /* Backgrounds */
    --bg-main:        #F8FAF9;
    --bg-white:       #FFFFFF;
    --bg-card:        #FFFFFF;
    --bg-alt:         #C1CAC5;
    --bg-gray:        #8b9790;
    --bg-dark:        #6B7770;
    --bg-ultradark:   #353c37;

    /* Typography */
    --text-heading:   var(--gray-700);
    --text-main:      var(--gray-800);
    --text-secondary: var(--gray-600);
    --text-soft:      #6B7280;
    --text-muted:     var(--gray-500);
    --text-white:     var(--white);

    /* Radii */
    --radius-sm:      6px;
    --radius-md:      12px;
    --radius-lg:      18px;

    /* Spacing scale (8px baseline) */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;

    /* Title bar in mobile */
    --titlebar-height: 56px;
    --titlebar-logoheight: 48px;
    --navbar-itemheight: 44px;
}