﻿/* Global or common theme shared for public facing web pages and back office theming loaded in initialization HTML index page or host page*/

:root {
    --application-font: Roboto, Verdana, Serif, Arial;
    --application-font-size: 16px;
    --application-line-height: 1.25;
    --application-minimum-width: 320px;
    --application-heading-font: Orbitron, Verdana, Serif, Arial;
    --application-footer-font: Orbitron, Verdana, Serif, Arial;
    --size-1: 0.5rem;
    --size-10: 5rem;
    --size-11: 5.5rem;
    --size-12: 6em;
    --size-13: 6.5rem;
    --size-14: 7rem;
    --size-15: 7.5rem;
    --size-16: 8rem;
    --size-17: 8.5rem;
    --size-18: 9rem;
    --size-19: 9.5rem;
    --size-2: 1rem;
    --size-20: 10rem;
    --size-3: 1.5rem;
    --size-4: 2rem;
    --size-5: 2.5rem;
    --size-6: 3rem;
    --size-7: 3.5rem;
    --size-8: 4rem;
    --size-9: 4.5rem;
    --color-button-function-background: #fff0;
    --color-button-function-icon: invert(91%) sepia(15%) saturate(1018%) hue-rotate(324deg) brightness(103%) contrast(101%); /* #ffe0af */
    --color-button-function-background-hover: #deb874;
    --color-button-function-icon-hover: invert(81%) sepia(48%) saturate(533%) hue-rotate(323deg) brightness(107%) contrast(101%); /* #ffd28b */
    --color-button-function-background-focus: #e6d8b2;
    --color-button-function-icon-focus: invert(98%) sepia(72%) saturate(4830%) hue-rotate(307deg) brightness(106%) contrast(94%); /* #f8c575 */
    --color-button-function-background-active: #e6d8b2;
    --color-button-function-icon-active: invert(98%) sepia(72%) saturate(4830%) hue-rotate(307deg) brightness(106%) contrast(94%); /* #f8c575 */
    --color-button-function-background-disabled: #fff0;
    --color-button-function-icon-disabled: invert(60%) sepia(8%) saturate(781%) hue-rotate(359deg) brightness(97%) contrast(89%); /* #e69f2d; */

    --color-button-action-background-active: #ffae6a;
    --color-button-action-background-default: #ffde9b;
    --color-button-action-background-focus: #ffe9bd;
    --color-button-action-background-hover: #fff1d7;
    --color-button-action-border: #a84800;
    --color-button-action-filter-active: invert(65%) sepia(87%) saturate(5477%) hue-rotate(16deg) brightness(95%) contrast(104%);
    --color-button-action-filter-focus: invert(65%) sepia(87%) saturate(5477%) hue-rotate(16deg) brightness(95%) contrast(104%);
    --color-button-action-filter-hover: invert(71%) sepia(79%) saturate(3898%) hue-rotate(360deg) brightness(104%) contrast(105%);
    --color-text: #fff;
    --color-background: #000;
    --color-header-text: #9ecee6;
    --color-header-background: #ffffff00;
    --border-application-header-menu-divider: #292f38 2px solid;
    --color-anchor-no-show-text: #9ecee6;
    --color-anchor-no-show-background: #ffffff00;
    --color-input-text: #fff;
    --color-input-background: #000;
    --color-input-caret: #fff;
    --color-select-selection-background: #ffe0af;
    --color-select-selection-shadow: #a87d18;
    --color-button-menu-main-background: #000;
    --color-button-menu-main-icon: invert(99%) sepia(3%) saturate(80%) hue-rotate(195deg) brightness(114%) contrast(83%) drop-shadow(0px 0px 4px #d4d4d4); /* #e9e9e9 */
    --color-button-menu-main-background-hover-light: #fff;
    --color-button-menu-main-background-hover-dark: #74c8de;
    --color-button-menu-main-icon-hover: invert(88%) sepia(9%) saturate(1297%) hue-rotate(189deg) brightness(107%) contrast(105%); /* #74c8de */
    --color-button-menu-main-background-focus: #99e6f1;
    --color-button-menu-main-icon-focus: invert(88%) sepia(22%) saturate(337%) hue-rotate(154deg) brightness(94%) contrast(92%); /* #b2dbe6 */
    --color-button-menu-main-background-active: #b2dbe6;
    --color-button-menu-main-icon-active: invert(58%) sepia(5%) saturate(2020%) hue-rotate(161deg) brightness(88%) contrast(87%); /* #68899f */
    --color-button-menu-main-background-disabled: #000;
    --color-button-menu-main-icon-disabled: invert(34%) sepia(0%) saturate(629%) hue-rotate(138deg) brightness(94%) contrast(95%); /* #535353; */

    --footer-copyright-color: #dafaff;
    --footer-copyright-background-color: #ffffff00;
    --color-body-text: #dff9ff;
    --color-body-background: #ffffff00;
    --border-body-menu-top-divider: #e1e1e1;
}

