/* --------------------  Import */
@import url("../css/AssignClasses.css");

/* --------------------  Scheme Logo */
body .navbar-brand,
body .LoginLogo {
    background-image: url("Logo.png");
}

body.DarkMode .navbar-brand,
body.DarkMode .LoginLogo {
    background-image: url("Logo.png");
}

/* -------------------- Background Image */
body {
    background-image: url("Background.jpg");
}
    body.DarkMode {
        background-image: url("BackgroundDark.jpg");
    }

:root {
    /* -------------------- System Colours */
    --SystemRed: #eb4b4b;
    --SystemRedDarkMode: #faaaaa;
    --SystemGreen: #198754;
    --SystemGreenDarkMode: #43bd84;
    /* -------------------- Greys */
    --Grey5: #f8f8f8;
    --Grey10: #eeeeee;
    --Grey15: #e2e2e2;
    --Grey20: #dbdbdb;
    --Grey25: #d0d0d0;
    --Grey30: #c3c3c3;
    --Grey35: #b6b6b6;
    --Grey40: #a8a8a8;
    --Grey45: #9b9b9b;
    --Grey50: #8c8c8c;
    --Grey55: #7e7e7e;
    --Grey60: #707070;
    --Grey65: #636363;
    --Grey70: #555555;
    --Grey75: #444444;
    --Grey80: #3c3c3c;
    --Grey85: #303030;
    --Grey90: #272727;
    --Grey95: #1f1f1f;
    /* -------------------- Client Colours */
    --PirelliLightGrey: #5a5a5a;
    --PirelliRed: #e6312a;
    --PirelliYellow: #ffdd00;
    --PirelliWhiteWithTransparency: #edededf7;
    --PirelliGreyWithTransparency: #3a3a3ae4;
    --PirelliDarkGreyWithTransparency: #1b1b1be4;
    --PirelliBlackWithTransparency: #000000f5;
    /* -------------------- Scheme Logo */
    /* Margins */
    --LogoTopBottomMargin: 5px;
    --LogoTopBottomMarginMobile: 10px;
    /* Desktop */
    --LogoWidthDesktop: 200px;
    --LogoHeightDesktop: 61px;
    /* Tablet */
    --LogoWidthTablet: 200px;
    --LogoHeightTablet: 34px;
    /* Mobile */
    --LogoWidthMobile: 200px;
    --LogoHeightMobile: 61px;
    /* -------------------- Fonts */
    /* Global */
    --FontFamily: BodyFont;
    --FontSize: 16px;
    --FontSizeMobile: 16px;
    --FontLineHeight: 1.4em;
    /* Menu */
    --MenuFontSize: 1.1rem;
    --MenuFontFamily: MenuFont;
    --MenuFontWeight: 400;
    --MenuFontCase: uppercase;
    /* Headers */
    --HeaderFontFamily: HeaderFont;
    --HeaderFontCase: uppercase;
    --HeaderFontWeight: 400;
    /* Button */
    --ButtonFontSize: 1.2rem;
    --ButtonFontSizeSmall: 1.2rem;
    --ButtonFontFamily: HeaderFont;
    --ButtonFontWeight: 400;
    --ButtonFontCase: capitalize;
    --ButtonBorderWidth: 2px;
    --ButtonBorderRadius: 6px;
    --ButtonPadding: 8px 20px 6px 20px;
    --ButtonSmallPadding: 4px 6px;
    --ButtonMinimumWidth: 120px;
    --ButtonLetterSpacing: unset;
    /* -------------------- Tiles */
    --DashboardTileBorderWidth: 0px;
    --DashboardTileBorderRadius: 0px;
    /* -------------------- Content Panel */
    --ContentPanelBorderWidth: 0px;
    --ContentPanelBorderRadius: 3px;
    /* -------------------- Form Elements */
    /* Form */
    --InputBorderRadius: 6px;
    /* Quick Links */
    --QuickLinkPadding: 11px 18px 11px 18px;
    /* Accessibility */
    --AccessibilityOutlineStyle: solid;
    /* -------------------------------------------------------- Default Mode */
    /* -------------------- Font */
    --HeadingFontColor: var(--Grey90);
    --BodyFontColor: var(--Grey90);
    /* -------------------- Links */
    --LinkColor: var(--PirelliRed);
    --LinkHoverColor: var(--PirelliRed);
    --LinkFocusColor: var(--PirelliRed);
    --LinkActiveColor: var(--PirelliRed);
    /* -------------------- Global Header */
    --HeaderIconColor: white;
    --HeaderBackgroundColor: black;
    /* -------------------- Global Footer */
    --FooterTextColor: white;
    --FooterBackgroundColor: var(--PirelliGreyWithTransparency);
    --FooterOrionAppGroupBackgroundColor: var(--Grey20);
    /* -------------------- Carousel */
    --CarouselBackgroundColor: var(--PirelliWhiteWithTransparency);
    --CarouselButtonColor: var(--Grey90);
    --CarouselButtonBackgroundColor: white;
    /* -------------------- Global Message */
    --GlobalMessageBackgroundColor: var(--PirelliWhiteWithTransparency);
    /* -------------------- Main Menu */
    /* Main */
    --MainMenuItemColor: white;
    --MainMenuItemHoverColor: white;
    --MainMenuBackgroundColor: var(--PirelliGreyWithTransparency);
    /* Dropdown */
    --MainMenuDropdownBackgroundColor: var(--Grey90);
    --MainMenuDropdownItemColor: white;
    --MainMenuDropdownItemHoverColor: var(--PirelliRed);
    --MainMenuDropdownItemBackgroundHoverColor: var(--PirelliYellow);
    /* Mobile Menu Toggle */
    --MainMenuToggle: var(--Grey10);
    /* -------------------- Content Panel */
    --ContentPanelBorderColor: var(--PirelliWhiteWithTransparency);
    --ContentPanelBackgroundColor: var(--PirelliWhiteWithTransparency);
    --ContentPanelBoxShadow: 0 0 0 0 transparent;
    /* -------------------- Dashboard Tile */
    /* Default */
    --DashboardTileBorderColor: transparent;
    --DashboardTileIconColor: #000;
    --DashboardTileBoxShadow: 0 0 0 0 transparent;
    /* Hover, Active */
    --DashboardTileBorderHoverColor: transparent;
    --DashboardTileIconHoverColor: var(--PirelliRed);
    /* -------------------- Primary Button */
    /* Default */
    --PrimaryButtonColor: var(--Grey90);
    --PrimaryButtonBackgroundColor: var(--PirelliYellow);
    --PrimaryButtonBorderColor: var(--PirelliYellow);
    /* Hover */
    --PrimaryButtonHoverColor: var(--PirelliRed);
    --PrimaryButtonBackgroundHoverColor: var(--PirelliYellow);
    --PrimaryButtonBorderHoverColor: var(--PirelliYellow);
    --PrimaryButtonHoverBoxShadow: 0 0 0 0px transparent;
    /* Focus */
    --PrimaryButtonFocusColor: var(--PirelliRed);
    --PrimaryButtonBackgroundFocusColor: var(--PirelliYellow);
    --PrimaryButtonBorderFocusColor: var(--PirelliYellow);
    --PrimaryButtonFocusBoxShadow: 0 0 0 0px transparent;
    /* -------------------- Secondary Button */
    /* Default */
    --SecondaryButtonColor: var(--Grey90);
    --SecondaryButtonBackgroundColor: white;
    --SecondaryButtonBorderColor: white;
    /* Hover */
    --SecondaryButtonHoverColor: var(--PirelliRed);
    --SecondaryButtonBackgroundHoverColor: var(--PirelliYellow);
    --SecondaryButtonBorderHoverColor: var(--PirelliYellow);
    --SecondaryButtonHoverBoxShadow: 0 0 0 0px transparent;
    /* Focus */
    --SecondaryButtonFocusColor: var(--PirelliRed);
    --SecondaryButtonBackgroundFocusColor: var(--PirelliYellow);
    --SecondaryButtonBorderFocusColor: var(--PirelliYellow);
    --SecondaryButtonFocusBoxShadow: 0 0 0 0px transparent;
    /* -------------------- Case Tracking */
    --CaseTrackerPendingColor: var(--Grey50);
    --CaseTrackerDoneColor: black;
    --CaseTrackerActiveColor: var(--PirelliRed);
    /* -------------------- Forms */
    /* Inputs */
    --FormInputBackgroundColor: var(--Grey5);
    --FormInputBorderColor: var(--Grey40);
    --FormInputFocusBackgroundColor: white;
    --FormInputFocusBorderColor: var(--PirelliYellow);
    /* -------------------- Form Validation and Alerts */
    /* Validated */
    --ValidatedColor: var(--SystemGreen);
    /* Alert */
    --AlertColor: var(--SystemRed);
    /* Boxed Alert Background Color */
    --BoxedAlertColor: white;
    --BoxedAlertBackgroundColor: var(--SystemRed);
    /* -------------------- Data Tables */
    /* Navigation */
    --DataTableNavigationIconColor: var(--Grey85);
    --DataTableNavigationIconHoverColor: var(--PirelliYellow);
    /* -------------------- Quick Links */
    /* Default */
    --QuickLinkColor: var(--Grey90);
    --QuickLinkBackgroundColor: var(--PirelliWhiteWithTransparency);
    --QuickLinkBorderColor: var(--PirelliWhiteWithTransparency);
    /* Hover */
    --QuickLinkHoverColor: var(--PirelliRed);
    --QuickLinkBackgroundHoverColor: var(--PirelliYellow);
    --QuickLinkBorderHoverColor: var(--PirelliYellow);
    /* -------------------- Accessibility Focus */
    --AccessibilityHeaderOutlineColor: var(--PirelliYellow);
    --AccessibilityMenuOutlineColor: var(--PirelliYellow);
    --AccessibilityFooterOutlineColor: var(--PirelliYellow);
    --AccessibilityOutlineColor: var(--PirelliRed);
    /* -------------------------------------------------------- Dark Mode */
    /* -------------------- Font */
    --HeadingFontColorDarkMode: var(--Grey15);
    --BodyFontColorDarkMode: var(--Grey15);
    /* Links */
    --LinkColorDarkMode: var(--PirelliYellow);
    --LinkHoverColorDarkMode: var(--PirelliRed);
    --LinkFocusColorDarkMode: var(--PirelliRed);
    --LinkActiveColorDarkMode: var(--PirelliRed);
    /* -------------------- Global Header */
    --HeaderIconColorDarkMode: white;
    --HeaderBackgroundColorDarkMode: black;
    /* -------------------- Global Footer */
    --FooterTextColorDarkMode: white;
    --FooterBackgroundColorDarkMode: var(--PirelliGreyWithTransparency);
    --FooterOrionAppGroupBackgroundColorDarkMode: var(--Grey10);
    /* -------------------- Carousel */
    --CarouselBackgroundColorDarkMode: var(--PirelliBlackWithTransparency);
    --CarouselButtonColorDarkMode: var(--Grey90);
    --CarouselButtonBackgroundColorDarkMode: var(--Grey15);
    /* -------------------- Global Message */
    --GlobalMessageBackgroundColorDarkMode: var(--PirelliDarkGreyWithTransparency);
    /* -------------------- Main Menu */
    /* Main */
    --MainMenuItemColorDarkMode: white;
    --MainMenuItemHoverColorDarkMode: white;
    --MainMenuBackgroundColorDarkMode: var(--PirelliGreyWithTransparency);
    /* Dropdown */
    --MainMenuDropdownBackgroundColorDarkMode: var(--Grey90);
    --MainMenuDropdownItemColorDarkMode: var(--Grey10);
    --MainMenuDropdownItemBackgroundHoverColorDarkMode: var(--PirelliYellow);
    --MainMenuDropdownItemHoverColorDarkMode: var(--PirelliRed);
    /* Mobile Menu Toggle */
    --MainMenuToggleDarkMode: var(--Grey15);
    /* -------------------- Content Panel */
    --ContentPanelBorderColorDarkMode: var(--PirelliBlackWithTransparency);
    --ContentPanelBackgroundColorDarkMode: var(--PirelliBlackWithTransparency);
    --ContentPanelBoxShadowDarkMode: 0 0 0 0 transparent;
    /* -------------------- Dashboard Tile */
    /* Default */
    --DashboardTileBorderColorDarkMode: transparent;
    --DashboardTileIconColorDarkMode: var(--Grey30);
    --DashboardTileBoxShadowDarkMode: 0 0 0 0 transparent;
    /* Hover, Active */
    --DashboardTileBorderHoverColorDarkMode: transparent;
    --DashboardTileIconHoverColorDarkMode: var(--Grey10);
    /* -------------------- Primary Button */
    /* Default */
    --PrimaryButtonColorDarkMode: var(--Grey90);
    --PrimaryButtonBackgroundColorDarkMode: var(--PirelliYellow);
    --PrimaryButtonBorderColorDarkMode: var(--PirelliYellow);
    /* Hover */
    --PrimaryButtonHoverColorDarkMode: var(--PirelliRed);
    --PrimaryButtonBackgroundHoverColorDarkMode: var(--PirelliYellow);
    --PrimaryButtonBorderHoverColorDarkMode: var(--PirelliYellow);
    --PrimaryButtonHoverBoxShadowDarkMode: 0 0 0 0 transparent;
    /* Focus */
    --PrimaryButtonFocusColorDarkMode: var(--PirelliRed);
    --PrimaryButtonBackgroundFocusColorDarkMode: var(--PirelliYellow);
    --PrimaryButtonBorderFocusColorDarkMode: var(--PirelliYellow);
    --PrimaryButtonFocusBoxShadowDarkMode: 0 0 0 0 transparent;
    /* -------------------- Secondary Button */
    /* Default */
    --SecondaryButtonColorDarkMode: var(--Grey90);
    --SecondaryButtonBackgroundColorDarkMode: white;
    --SecondaryButtonBorderColorDarkMode: white;
    /* Hover */
    --SecondaryButtonHoverColorDarkMode: var(--PirelliRed);
    --SecondaryButtonBackgroundHoverColorDarkMode: var(--PirelliYellow);
    --SecondaryButtonBorderHoverColorDarkMode: var(--PirelliYellow);
    --SecondaryButtonHoverBoxShadowDarkMode: 0 0 0 0px transparent;
    /* Focus */
    --SecondaryButtonFocusColorDarkMode: var(--PirelliRed);
    --SecondaryButtonBackgroundFocusColorDarkMode: var(--PirelliYellow);
    --SecondaryButtonBorderFocusColorDarkMode: var(--PirelliYellow);
    --SecondaryButtonFocusBoxShadowDarkMode: 0 0 0 0px transparent;
    /* -------------------- Case Tracking */
    --CaseTrackerPendingColorDarkMode: var(--Grey60);
    --CaseTrackerDoneColorDarkMode: var(--PirelliYellow);
    --CaseTrackerActiveColorDarkMode: var(--PirelliRed);
    /* -------------------- Forms */
    /* Inputs */
    --FormInputBackgroundColorDarkMode: var(--Grey80);
    --FormInputBorderColorDarkMode: var(--Grey40);
    --FormInputFocusBackgroundColorDarkMode: var(--Grey90);
    --FormInputFocusBorderColorDarkMode: var(--PirelliYellow);
    /* -------------------- Form Validation and Alerts */
    /* Validated */
    --ValidatedColorDarkMode: var(--SystemGreenDarkMode);
    /* Alert */
    --AlertColorDarkMode: var(--SystemRedDarkMode);
    /* Boxed Alert Background Color */
    --BoxedAlertColorDarkMode: white;
    --BoxedAlertBackgroundColorDarkMode: var(--SystemRed);
    /* -------------------- Data Tables */
    /* Navigation */
    --DataTableNavigationIconColorDarkMode: var(--Grey15);
    --DataTableNavigationIconHoverColorDarkMode: var(--PirelliYellow);
    /* -------------------- Quick Links */
    /* Default */
    --QuickLinkColorDarkMode: var(--Grey15);
    --QuickLinkBackgroundColorDarkMode: var(--PirelliBlackWithTransparency);
    --QuickLinkBorderColorDarkMode: var(--PirelliBlackWithTransparency);
    /* Hover */
    --QuickLinkHoverColorDarkMode: var(--PirelliRed);
    --QuickLinkBackgroundHoverColorDarkMode: var(--PirelliYellow);
    --QuickLinkBorderHoverColorDarkMode: var(--PirelliYellow);
    /* -------------------- Accessibility Focus */
    --AccessibilityHeaderOutlineColorDarkMode: var(--PirelliYellow);
    --AccessibilityMenuOutlineColorDarkMode: var(--PirelliYellow);
    --AccessibilityFooterOutlineColorDarkMode: var(--PirelliYellow);
    --AccessibilityOutlineColorDarkMode: var(--PirelliRed);
    /* ----------------------------------------------------------------------------------------- Custom Images */
    /* -------------------- Tile Images */
}