
/*#region GENERAL*/
:root {
    /*PALETTE — Οργανισμός Χρηματοδοτήσεως Στέγης (HFC)*/
    --primary: #7C0018;
    --bs-primary: #7C0018;
    --bs-primary-rgb: 124 0 24;
    --bs-primary-rgb-com: 124,0,24;
    --bs-active-rgb-com: 90,0,18;
    --secondary: #6B6A70;
    --active: #5A0012;
    --hover: rgba(var(--bs-primary-rgb-com), 0.75);
    --hoverlight: #333333;
    --hovericon: #D2D2D2;
    --hoverColor: var(--white);
    --disabled: var(--grey);
    --menuPanel: #ffffff;
    --sidePanel: #ffffff;
    --sidePanelButtons: var(--white);
    --backgroundPanel: var(--white);
    --page-background: #F7F4F5;
    --sidebarVersion: var(--hfcmaroon);
    --sidebarVersionAccent: var(--white);
    --dropdownAccent: var(--hfcmaroonlight);
    --shadowMain: var(--hfcmaroon);
    --shadowMainRGB: var(--bs-primary-rgb-com);
    --shadowSecondaryRGB: 200,180,185;
    --menuIcon: var(--hfcmaroon);
    --menuText: var(--secondary);
    --headerTitle: var(--primary);
    --button: var(--primary);
    --buttonContrast: var(--white);
    --hudButton: var(--primary);
    --hudContrast: var(--white);
    --bs-body-color: var(--black);
    /****Borders***/
    --pageBorder: var(--hfcmaroon);
    --sidebarBorder: var(--hfcmaroon);
    --cardBorder: #d2d2d2;
    --formControlBorder: var(--hfcmaroon);
    --tooltipBorder: var(--hfcmaroon);
    --tooltipText: var(--hfcmaroon);
    --tooltipShadow: var(--hfcmaroondark);
    --tooltipBackground: var(--white);
    --link: var(--primary);
    --linkhover: #333333;
    /*COLOURS*/
    --hfcmaroon: #7C0018;
    --hfcmaroondark: #5A0012;
    --hfcmaroonmid: #9A1A2E;
    --hfcmaroonlight: rgba(124,0,24,0.08);
    --hfcblack: #000000;
    --hfcgrey: #6B6A70;
    --hfcgreylight: #EDEAEB;
    --greygreen: #f7f4f5;
    --greenmunsell: #00A878;
    --greencrayola: #D8F1A0;
    --blacksmoky: #0B0500;
    --orangecrayola: #f3c178;
    --lightPink: #FFF2F9;
    --white: #ffffff;
    --ShadowGrey: #afafaf;
    --shadowGreyRGB: 175, 175, 175;
    --shadowGreyRGB-com: rgb(175, 175, 175);
    --purpleGrey: rgba(124,0,24, 0.1);
    --pinkWhite: rgba(244,0,127, 0.01);
    --greenWhite: rgba(125,195,128,0.01);
    --blueWhite: rgba(49,52,128,0.01);
    --purple: rgb(90,23,132);
    --blue: rgb(49,52,128);
    --blue-rgb: 49,52,128;
    --blueHex: #313480;
    --blueDark: #353A8C;
    --blueMid: #37448c;
    --blueLight: #2aa2b7;
    --blueVeryLight: #d1e3df;
    --orange: rgb(233,75,39);
    --pink: rgb(244,0,127);
    --green: rgb(125,195,130);
    --greenHex: #7dc382;
    --greenShadow: #019d48;
    --greenShadowRGB: 1,157,72;
    --greenDark: #0b9e40;
    --greenDarkRGB: 11,158,65;
    --greenMid: #7ABF7F;
    --greenMidRGB: 122, 191, 127;
    --greenGrey: 80, 142, 123;
    --greenLight: 209,227,223;
    --greenLightRGB: 209,227,223;
    --greenLightHex: #D1E3DF;
    --red: var(--hfcmaroon);
    --redHex: 7c0018;
    --redMid: #9A1A2E;
    --black: #030206;
    --grey: #f2f2f2;
    /*REASONS PALETTE*/
    --rp1: #7C0018;
    --rp2: #5A0012;
    --rp3: #9A1A2E;
    --rp4: #e2b46c;
    --rp5: #d9c85b;
    --rp6: #48b39a;
    --rp7: #3694bf;
    --rp8: #f46190;
    /*DEVEXPRESS*/
    --dx-calendar-header-hover-color: var(--active);
    --dx-calendar-table-selection-color: var(--purpleGrey);
    --dx-calendar-table-active-color: var(--white);
    --dx-calendar-table-hover-color: var(--white);
    --dx-grid-header-color: #f2f2f2;
    --dx-grid-selection-color: var(--active);
    --currentcolor: #ffffff;

    /*BOOTSTRAP*/
    --bs-body-font-size: 0.875rem;
    --bs-body-color: var(--black);
    --bs-table-bg: transparent;
    --bs-table-accent-bg: transparent;
    --bs-table-striped-color: var(--white);
    --bs-table-striped-bg: rgba(var(--bs-active-rgb-com), 0.05);
    --bs-table-active-color: var(--white);
    --bs-table-active-bg: rgba(var(--bs-active-rgb-com), 0.1);
    --bs-table-hover-color: var(--white);
    --bs-table-hover-bg: rgba(var(--bs-active-rgb-com), 0.075);
    --bs-gutter-y: 1.5rem;
    --bs-table-accent-bg: var(--active) !important;
    --table-grid-lines: var(--menuPanel);
    --table-header-text: #333333;
    --table-header-background: #f2f2f2;
    --loading-start: hsl(350,20%,82%);
    --loading-end: hsl(350,15%,97%);
    --sidebar-max-width: 280px;
}

html, body {
    font-family: 'Noto Sans';
    background-color: var(--backgroundPanel);
}

/*#endregion*/



/*#region SIDEBAR*/




/*#region SIDEBAR FOOTER*/

/*#endregion*/

/*#region Nav Menu Hover*/


/*#endregion*/
/*#endregion */


/*#region HEADER*/
.logo-full {
    height: 2.6rem;
    width: auto;
}
/*#endregion*/

/*#region DESKTOP LAYOUT*/

/*#endregion*/


/*#region DEVEXPRESS*/

.dxbl-btn-primary {
}


/*#region SCHEDULER*/

/*#endregion*/

/*#endregion*/

/*#region RIGHT DRAWER*/

/*#endregion*/

/*#region HUD*/

/*#endregion*/


/*#region POPUPS*/

/*#endregion*/

/*#region TOOLTIPS*/

/*#endregion*/


/*#region SKELETON LOADER*/


/*#endregion*/


/*#region PAGER*/

/*#endregion*/


/*#region SPINNER*/
.loading-container {
    background: linear-gradient(135deg, var(--menuPanel) 0%, var(--hfcmaroonlight) 5%, var(--primary) 50%, var(--primary) 150%);
    will-change: background-position;
    backface-visibility: hidden
}

.loading-container .spinner-content,
.loading-container .spinner-container h5,
.loading-container .spinner-message-container * {
    color: white !important;
}

/*#endregion*/

/*#region FILE UPLOAD*/

/*#endregion*/

/*#region ClockTransactions*/



/*#endregion*/


/*#region EVALUATION SUBMISSION*/


/*#endregion*/

/*#region CALENDAR*/

/*#endregion*/

/*#region RESPONSIVENESS*/
@media (max-width: 1200px) {

}

@media (max-width: 1024px) {

}

@media (max-width: 768px) {
    .logo-full {
        height: 2.2rem;
    }
}



/*#endregion*/

/*#region ANIMATIONS*/


/*#endregion*/

.dxbl-grid .dxbl-grid-empty-data > span,
.dxbl-grid .dxbl-grid-empty-data .dxbl-image,
.dxbl-grid .dxbl-grid-empty-data-area .dxbl-image,
.dxbl-grid span.dxbl-grid-empty-data-not-found,
.component-not-found .no-data-found h3,
.empty-state .no-data-found a {
    color: var(--primary);
}
