@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

:root {
    --main-bg-color: brown;
    /* Fonts */
    --fgt-default-font: 'Nunito Sans';
    --fgt-alternate-font: 'Helvetica';
    /* Default Colours */
    --fgt-black: #000000;
    --fgt-red: #B71F2C;
    --fgt-white: #FFFFFF;
    --fgt-white-filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(81deg) brightness(102%) contrast(102%);
    --fgt-dark-grey-1: #262626;
    --fgt-blue-grey-1: #2F4653;
    --fgt-blue-grey-2: #486D81;
    --fgt-blue-grey-3: #8A99A5;
    --fgt-blue-grey-4: #CBCED3;
    --fgt-blue-grey-5: #F2F2F2;
    --fgt-bright-blue-1: #0A5C95;
    --fgt-bright-blue-2: #538EB5;
    --fgt-red-0: #A11B27;
    --fgt-red-1: #B7202C;
    --fgt-red-1-filter: invert(14%) sepia(79%) saturate(4514%) hue-rotate(347deg) brightness(85%) contrast(86%);
    --fgt-red-2: #DC3844;
    --fgt-red-3: #E4626B;
    --fgt-red-4: #F7AFB4;
    --fgt-blue-0: #084D7D;
    --fgt-blue-1: #0A5C95;
    --fgt-blue-1-filter: invert(32%) sepia(15%) saturate(3746%) hue-rotate(170deg) brightness(91%) contrast(102%);
    --fgt-blue-2: #538EB5;
    --fgt-blue-3: #88B1CC;
    --fgt-blue-4: #CADBE8;
    --fgt-green-0: #8BAA43;
    --fgt-green-1: #A1C44E;
    --fgt-green-1-filter: invert(90%) sepia(5%) saturate(4302%) hue-rotate(25deg) brightness(83%) contrast(91%);
    --fgt-green-2: #AACA63;
    --fgt-green-3: #B3D077;
    --fgt-green-4: #BCD689;
    --fgt-orange-1: #FFA63B;
    --fgt-yellow-1: #FFD979;
    --fgt-yellow-1-filter: invert(99%) sepia(39%) saturate(5422%) hue-rotate(308deg) brightness(113%) contrast(101%);
    /* Text colors */
    --fgt-primary-text-1: #2F4653;
    --fgt-primary-text-2: #000000;
    --fgt-secondary-text-1: #486D81;
    --fgt-secondary-text-2: #8A99A5;
    --fgt-secondary-text-3: #FFFFFF;
    /* Visual colors */
    --fgt-primary-visual-1: var(--fgt-blue-1);
    --fgt-primary-visual-1-filter: var(--fgt-blue-1-filter);
    --fgt-primary-visual-1-l2: var(--fgt-blue-2);
    --fgt-primary-visual-2: var(--fgt-red-1);
    --fgt-primary-visual-2-filter: var(--fgt-red-1-filter);
    --fgt-primary-visual-3: #F2F2F2;
    --fgt-secondary-visual-1: #CBCED3;
    --fgt-secondary-visual-2: #538EB5;
    /* Tertiary colors */
    --fgt-tertiary-1: #86BC25;
    --fgt-tertiary-2: #ED8B00;
    --fgt-tertiary-3: #FFC000;
    /* Specific area colours */
    --fgt-page-top-row-color: var(--fgt-primary-visual-1);
    --fgt-menu-background-color: var(--fgt-blue-4);
    --fgt-tile-border-color: var(--fgt-red-1);
    --fgt-tile-border-color-alternative: var(--fgt-blue-1);
    --fgt-page-background-color: var(--fgt-blue-grey-5)
}

.fgt-red-ancor{

}

.fgt-red-ancor a {
    font-weight: bolder;
}

    .fgt-red-ancor a:hover, a:focus {
        color: var(--fgt-red-3);
        
    }

    .fgt-red-ancor a:active, a:visited, a:link {
        color: var(--fgt-red-2);
    }





.fgt-icon-color-primary-1 {
    filter: invert(15%) sepia(100%) saturate(3078%) hue-rotate(191deg) brightness(93%) contrast(92%);
}

.fgt_icon_reporting {
    background-image: url("../images/menu-item-type/6.svg");
    background-size: cover;
    filter: invert(15%) sepia(100%) saturate(3078%) hue-rotate(191deg) brightness(93%) contrast(92%);
}


.fgt_icon_data_processing {
    background-image: url("../images/menu-item-type/1.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}
.fgt_icon_data_application {
    background-image: url("../images/menu-item-type/2.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}
.fgt_icon_report {
    background-image: url("../images/menu-item-type/3.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}
.fgt_icon_configuration {
    background-image: url("../images/menu-item-type/4.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}
.fgt_icon_page_navigation {
    background-image: url("../images/menu-item-type/5.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}
.fgt_icon_landing_page {
    background-image: url("../images/menu-item-type/6.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}


.fgt_icon_registration {
    background-image: url("../images/menu-item-type/7.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}

.fgt_icon_home {
    background-image: url("../images/menu-item-type/8.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}


.fgt_icon_support {
    background-image: url("../images/general/support.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
    background-position:center;
}

.fgt_logo_text_container {
    grid-column: 1;
    grid-row: 1;
    display: grid;
    grid-template-columns: 4em auto min-content;
    height: 100%;
    width: auto;
    align-items: center;
}

.fgt_cs_logo_css {
    grid-column: 1;
    background-image: url("../images/logos/CS Logo Thick.svg");
    background-size: cover;
    /*filter: var(--fgt-primary-visual-2-filter);*/
    filter: var(--fgt-white-filter);
    background-position: center;
    stroke: var(--fgt-primary-visual-2-filter);
    /*animation: slideBackground 2s linear infinite;*/
    height: 2.5em;
    width: 2.5em;
    margin-left: 0.5em;
}

.fgt_logo {
    grid-column: 1;
    background-image: url("../images/logos/FGT_Logo.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-2-filter);*/
   background-position: center;
    stroke: var(--fgt-primary-visual-2-filter);
    /*animation: slideBackground 2s linear infinite;*/
    height: 2.5em;
    width: 2.5em;
    margin-left: 0.5em;
}

.fgt_logo_text{
    grid-column: 2;
    text-align:left;
    font-size:1.25em;
    width: 200px;
    font-weight:bolder;
    color: var(--fgt-white)
}

.fgt_logo_portal_version {
    grid-column: 3;
    text-align: left;
    font-size: 0.5em;
    width: auto;
    font-weight: bolder;
    color: var(--fgt-white)
}

.client_logo_text {
    grid-column: 1 / 3;
    text-align: left;
    font-size: 1.25em;
    width: 100%;
    font-weight: bolder;
    color: var(--fgt-white)
}

.fgt-side-menu{
    min-width:200px;
    background-color: var(--fgt-white);
    height:100%;
    max-height:100%;
    min-height:60vh;
}
.fgt_menu_collapse {
    background-image: url("../images/menu-item-type/collapse.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}
.fgt_menu_expand {
    background-image: url("../images/menu-item-type/expand.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}
.fgt_menu_noleafe {
    background-image: url("../images/menu-item-type/no_leafe.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}
.fgt_menu_userin {
    background-image: url("../images/menu-item-type/user_in.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}
.fgt_menu_userout {
    background-image: url("../images/menu-item-type/user_out.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}
.fgt_menu_login {
    background-image: url("../images/menu-item-type/log_in.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}
.fgt_menu_logout {
    background-image: url("../images/menu-item-type/log_out.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}
.fgt_menu_register {
    background-image: url("../images/menu-item-type/register.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}


.company-name-block-1 {
    display: flex;
    background-color: var(--fgt-blue-grey-4);
    height: 3em;
    align-items: center;
    justify-content: flex-start;
    padding-left: 1em;
}

body {
    background-color: var(--fgt-blue-grey-5);
}


.fgt_header_text {
    /*display: inline-block;*/
    color: var(--fgt-white);
    justify-content:center;
    height:100%;
}


.fgt-tile-border {
    border-radius: 10px;
    border-left-color: var(--fgt-tile-border-color);
    border-left-style: solid;
    border-left-width: 10px;
    background-color: var(--fgt-white);
    padding: 10px;
    height: 100%;
    width: 100%;
}

.fgt-tile-border-alterative {
    border-radius: 10px;
    border-left-color: var(--fgt-tile-border-color-alternative);
    border-left-style: solid;
    border-left-width: 10px;
    background-color: var(--fgt-white);
    padding: 10px;
    height: 100%;
    width: 100%;
}

.fgt-tile-border-none {
    border-radius: 10px;
    
    border-left-width: 10px;
    background-color: var(--fgt-white);
    padding: 10px;
    height: 100%;
    width: 100%;
}


.fgt-top-row {
    display: flex;
    background-color: var(--fgt-page-top-row-color);
    border-bottom: 1px solid #d6d5d5;
    height: 3.5em;
    align-items: center;
    padding-right: 1em;
}

.fgt-top-row-left {
    flex-grow: 1;
}

.fgt-top-row-right {
    flex-grow: 2;
}


.fgt_login_container {
    display: grid;
    grid-template-columns: 1fr auto auto;
    width: 100%;
    height: 100%;
    align-items: center;
    color: var(--fgt-white);
}

.fgt_login_company {
    grid-column: 1;
    width: auto;
    padding-left:1em;
}

.fgt_login_user {
    grid-column: 2;
    width: auto;
}

.fgt_login_action {
    grid-column: 3;
    width: auto;
}


.fgt_loader {
    border-top: 6px solid var(--fgt-primary-visual-1);
    border-right: 6px solid var(--fgt-primary-visual-2);
    border-bottom: 6px solid var(--fgt-primary-visual-1);
    border-left: 6px solid var(--fgt-primary-visual-2);
    border-radius: 50%;
    width: 100%;
    height: 100%;
    animation: spin 2s linear infinite;
}

.fgt_loader_v1 {
    
    background-image: url("../images/logos/CS Logo Thick.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-2-filter);
    background-position: center;
    stroke: var(--fgt-primary-visual-2-filter);
    /*animation: slideBackground 2s linear infinite;*/
    height: 2.75em;
    width: 2.75em;
    margin-left: 0.5em;
    animation: spin 2s linear infinite;
}




@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.menu-icon {
    width: 1rem;
    height: 1rem;
    min-width: 1rem;
    min-height: 1rem;
    background-size: contain;
    /*mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;*/
    background-position: center center;
    /*background-color: currentColor;*/
    opacity: 0.7;
}

.menu-icon-home {
   /* mask-image: url("../images/menu-item-type/home.svg");
    -webkit-mask-image: url("../images/menu-item-type/home.svg");*/
    background-image: url("../images/menu-item-type/home.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}

.menu-icon-support {
    /*mask-image: url('images/menu-item-type/support.svg');
    -webkit-mask-image: url('images/menu-item-type/support.svg');*/
    background-image: url("../images/menu-item-type/support.svg");
    background-size: cover;
    filter: var(--fgt-primary-visual-1-filter);
}


.fgt_tile-border-left {
    border-radius: 10px;
    border-left-style: solid;
    border-left-width: 10px;
    background-color: var(--fgt-white);
    padding: 0.25em;
    height: 100%;
    width: 100%;
}

/*Overwrite border*/
.fgt_tile-border {
    border-radius: 10px;
    border-left-style: solid;
    border-left-width: 10px;
    border-left-color: var(--fgt-white);
    background-color: var(--fgt-white);
    padding: 0.5em;
    height: 100%;
    width: 100%;
    /*    border-radius: 10px;
    border-left-style: solid;
    border-left-width: 5px;*/
    /*    border-bottom-style: solid;
    border-bottom-width: 5px;
    border-bottom-color: var(--fgt-white);*/
    background-color: var(--fgt-white);
}

.fgt_tile-small-border {
    border-radius: 5px;
    border-left-style: solid;
    border-left-width: 5px;
    background-color: var(--fgt-white);
    margin-left:0px;
    padding: 0.0em;
    padding-top:0.5em;
    padding-left: 0.5em;
    height: 100%;
    width: 100%;
}

.fgt_tile-medium-border {
    border-radius: 5px;
    border-left-style: solid;
    border-left-width: 8px;
    background-color: var(--fgt-white);
    margin-left: 0px;
    padding: 0.0em;
    padding-top: 0.5em;
    padding-left: 0.5em;
    height: 100%;
    width: 100%;
}

/*Overwrite border*/
/*.fgt_tile-small-border {
    border-radius: 10px;
    border-left-style: solid;
    border-bottom-style: solid;
    border-left-width: 1px;
    border-bottom-width: 5px;*/
}

.fgt_tile-border-total {
    border-left-color: var(--fgt-white);
}
.fgt_tile-border-running {
    border-left-color: var(--fgt-yellow-1);
}
.fgt_tile-border-grey {
    border-left-color: var(--fgt-blue-grey-4);
}

.fgt_tile-border-successful {
    border-left-color: var(--fgt-green-3);
}

.fgt_tile-border-completedwithissues {
    border-left-color: var(--fgt-blue-2);
}

.fgt_tile-border-failedjobs {
    border-left-color: var(--fgt-red-2);
}

.fgt_tile-border-missedorcancelled {
    border-left-color: var(--fgt-orange-1);
}

/*Overwrite border location*/
/*.fgt_tile-border-total {
    border-left-color: var(--fgt-white);
    border-bottom-color: var(--fgt-yellow-1);
}

.fgt_tile-border-successful {
    border-left-color: var(--fgt-white);
    border-bottom-color: var(--fgt-green-1);
}

.fgt_tile-border-completedwithissues {
    border-left-color: var(--fgt-white);
    border-bottom-color: var(--fgt-blue-3);
}

.fgt_tile-border-failedjobs {
    border-left-color: var(--fgt-white);
    border-bottom-color: var(--fgt-red-3);
}

.fgt_tile-border-missedorcancelled {
    border-left-color: var(--fgt-white);
    border-bottom-color: var(--fgt-orange-1);
}*/

.content{
    padding-top:0.25em;
}


.fgt_fail_icon {
    background-image: url("../images/icons/error.svg");
    background-size: cover;
    filter: var(--fgt-red-1-filter);
    background-position: center;
}

.fgt_success_icon {
    background-image: url("../images/icons/success.svg");
    background-size: cover;
    filter: var(--fgt-green-1-filter);
    background-position: center;
}

.fgt_success_with_issues_icon {
    background-image: url("../images/icons/success_issues.svg");
    background-size: cover;
    filter: var(--fgt-blue-1-filter);
    background-position: center;
}

.fgt_success_executing_icon {
    background-image: url("../images/icons/executing.svg");
    background-size: cover;
    filter: var(--fgt-yellow-1-filter);
    background-position: center;
}

/*
    Toast Message CSS
*/

.fgt_toast_info {
    --dxbl-toast-background-color: var(--fgt-yellow-1, var(--fgt-yellow-1)) !important;
    --dxbl-toast-accent-line-color: var(--fgt-primary-visual-1, var(--fgt-primary-visual-1)) !important;
    --dxbl-toast-front-color: #495057 !important;
    --dxbl-toast-header-font-color: var(--dxbl-toast-front-color) !important;
    --dxbl-toast-text-font-color: var(--dxbl-toast-header-font-color) !important;
    --dxbl-toast-icon-color: var(--fgt-primary-visual-1, var(--fgt-primary-visual-1)) !important;
    --dxbl-toast-close-button-color: var(--dxbl-toast-front-color) !important;
    --dxbl-toast-close-button-hover-color: #495057 !important;
    --dxbl-toast-close-button-hover-bg: #ced4da !important;
}

.fgt_toast_danger {
    --dxbl-toast-background-color: var(--fgt-red-4, var(--fgt-red-4)) !important;
    --dxbl-toast-accent-line-color: var(--fgt-primary-visual-1, var(--fgt-primary-visual-1)) !important;
    --dxbl-toast-front-color: #495057 !important;
    --dxbl-toast-header-font-color: var(--dxbl-toast-front-color) !important;
    --dxbl-toast-text-font-color: var(--dxbl-toast-header-font-color) !important;
    --dxbl-toast-icon-color: var(--fgt-primary-visual-1, var(--fgt-primary-visual-1)) !important;
    --dxbl-toast-close-button-color: var(--dxbl-toast-front-color) !important;
    --dxbl-toast-close-button-hover-color: #495057 !important;
    --dxbl-toast-close-button-hover-bg: #ced4da !important;
}

.fgt_toast_primary {
    --dxbl-toast-background-color: var(--fgt-white, var(--fgt-white)) !important;
    --dxbl-toast-accent-line-color: var(--fgt-primary-visual-1, var(--fgt-primary-visual-1)) !important;
    --dxbl-toast-front-color: #495057 !important;
    --dxbl-toast-header-font-color: var(--dxbl-toast-front-color) !important;
    --dxbl-toast-text-font-color: var(--dxbl-toast-header-font-color) !important;
    --dxbl-toast-icon-color: var(--fgt-primary-visual-1, var(--fgt-primary-visual-1)) !important;
    --dxbl-toast-close-button-color: var(--dxbl-toast-front-color) !important;
    --dxbl-toast-close-button-hover-color: #495057 !important;
    --dxbl-toast-close-button-hover-bg: #ced4da !important;
}

.fgt_toast_success {
    --dxbl-toast-background-color: var(--fgt-green-2, var(--fgt-green-2)) !important;
    --dxbl-toast-accent-line-color: var(--fgt-primary-visual-1, var(--fgt-primary-visual-1)) !important;
    --dxbl-toast-front-color: #495057 !important;
    --dxbl-toast-header-font-color: var(--dxbl-toast-front-color) !important;
    --dxbl-toast-text-font-color: var(--dxbl-toast-header-font-color) !important;
    --dxbl-toast-icon-color: var(--fgt-primary-visual-1, var(--fgt-primary-visual-1)) !important;
    --dxbl-toast-close-button-color: var(--dxbl-toast-front-color) !important;
    --dxbl-toast-close-button-hover-color: #495057 !important;
    --dxbl-toast-close-button-hover-bg: #ced4da !important;
}

/*
    End Toast Message CSS
*/