:root {
    --bkBrown: rgb(111,60,47);
    --bkYellow: rgb(247, 168, 0);

    --skin_color: var(--bkYellow);
    --szurke: #808285;

    --mainHeaderBGColor: var(--skin_color);
    --mainBorderColor: var(--skin_color);
    --mainHover: hsl(from var(--mainHeaderBGColor) h s l / 0.95);

    /* Ha különböző színeket akarunk az eltérő elemeknek */
    --btnPrimaryBgColor: var(--mainHeaderBGColor);
    --btnPrimaryBorderColor: var(--mainBorderColor);
    --btnPrimaryHover: var(--mainHover);
    --panelHeaderBgColor: var(--mainHeaderBGColor);
    --panelHeaderBorder: var(--mainHeaderBGColor);
    --tabHeaderBgColor: var(--mainHeaderBGColor);
    --tabHeaderColor: var(--mainHeaderBGColor);
    --functionRowColor: var(--szurke);
    --functionRowBgColor: var(--mainHeaderBGColor);
    --functionRowBorderColor: var(--mainBorderColor);
    --functionRowHoverColor: var(--mainHover);

    /* Betűszín */
    --bodyFontColor: #4d4d4d;
    /* Filter gombok */
    --activeFilterButtonBackgroundColor: var(--skin_color);
    --activeFilterButtonBorderColor: var(--skin_color);
    /* Multiselect */
    --multiSelectSelectedItemBgColor: var(--skin_color);
    --multiSelectSelectedItemBorderColor: var(--skin_color);
    /* Gombok */
    --btnInfoBgColor: var(--szurke);
    --btnInfoStateBgColor: hsl(from var(--btnInfoBgColor) h s l / 0.8);
    --btnDangerBgColor: #dc0032;
    --btnDangerStateBgColor: hsl(from var(--btnDangerBgColor) h s l / 0.8);
    --btnSuccessBgColor: var(--szurke);
    --btnSuccessStateBgColor: hsl(from var(--btnSuccessBgColor) h s l / 0.9);
    --btnPrimaryDisabledBgColor: hsl(from var(--btnPrimaryBgColor) h s l / 0.8);
    --btnPrimaryDisabledBorderColor: hsl(from var(--btnPrimaryBorderColor) h s l / 0.8);
    /* Toggle switch */
    --toggleSwitchOnBackgroundColor: var(--skin_color);
    --toggleSwitchOffBgColor: var(--szurke);
    /* Komment háttér */
    --commentSentBgColor: var(--PantoneCoolGrey6C);
    --commentReceivedBgColor: var(--szurke);
    /* Colorok */
    --bgEvRedBgColor: var(--skin_color);
    --bgBlueBgColor: var(--szurke);
    /* Headerek */
    --accordionHeaderBgColor: var(--skin_color);
    --accordionHeaderTextColor: #fff;
    --modalHeaderBgColor: var(--szurke);
    /* Footer */
    --siteFooterBgColor: var(--szurke);
    /* Pagination */
    --paginationActiveItemBgColor: var(--skin_color);
    --paginationActiveItemBorderColor: var(--skin_color);
    /* Chosen */
    --chosenHighlightedBgColor: var(--szurke);
    /* Sidebar */
    --sidebarToggleBoxBgColor: var(--szurke);
    /* Részletes kereső */
    --advancedSearchGreyButtonBgColor: var(--szurke);
    /* Kötelező csillag */
    --redStarColor: #dc0032;
    /* Top-nav */
    --topNavBgColor: var(--PantoneCoolGrey6C);
    --topNavHoverBgColor: hsl(from var(--topNavBgColor) h s l / 0.9);
    /* Szervezeti egységek */
    --ccpElementActiveBgColor: var(--skin_color);
    --orgChartCardBodyBgColor: var(--szurke);
    --orgChartCardContainerHoverBgColor: hsl(from var(--orgChartCardBodyBgColor) h s l / 0.8);
    --companyChartCardBodyBgColor: var(--skin_color);
    --companyChartCardContainerHoverBgColor: hsl(from var(--companyChartCardBodyBgColor) h s l / 0.8);
    /* evolution-btn-group */
    --evBtnGroupBgColor: var(--skin_color);
    --evBtnGroupHoverBgColor: hsl(from var(--evBtnGroupBgColor) h s l / 0.9);
    --evBtnGroupDropdownHoverBgColor: var(--chosenHighlightedBgColor);
    --evBtnGroupBorderColor: var(--evBtnGroupBgColor);
    --evBtnGroupHoverBorderColor: var(--evBtnGroupHoverBgColor);
    /* sp-box__header */
    --spBoxHeaderActiveBgColor: var(--skin_color);
    /* Character count */
    --characterCountErrorBgColor: var(--skin_color);
    --characterCountOkBgColor: var(--szurke);
    /* Jogviszony státusz színek */
    --activeRelationshipStatusBgColor: var(--Pantone346C);
    --inactiveRelationshipStatusBgColor: var(--PantoneCoolGrey9C);
    --closedRelationshipStatusBgColor: var(--PantoneWarmRedC100);
    --plannedRelationshipStatusBgColor: var(--Pantone660C);
    /* bg-main */
    --mainColor: var(--mainHeaderBGColor);
    /* Login ablak */
    --loginPanelHeaderSeparatorColor: var(--PantoneCoolGrey6C);

    --uiSelectActiveItemBgColor: var(--szurke);
    --scrollTopBtnBgColor: var(--skin_color);

    --commentModalActiveListItemBgColor: var(--skin_color);
    --commentModalOtherCommentBgColor: var(--szurke);
    --commentModalMyCommentBgColor: var(--PantoneCoolGrey6C);

    --slItemInnerSelectedBgColor: var(--szurke);

    --errorModalHeaderBgColor: #dc0032;
    --errorModalHeaderTextColor: #fff;

    --alertModalHeaderBgColor: var(--PantoneCoolGrey1C);
    --alertModalHeaderTextColor: var(--szurke);

    --countIndicatorCounterBgColor: var(--skin_color);
    --countIndicatorCounterTextColor: #fff;

    --changeViewBtnDefaultBgColor: var(--PantoneCoolGrey1C);
    --changeViewBtnDefaultTextColor: #fff;

    --changeViewBtnActiveBgColor: var(--szurke);
    --changeViewBtnActiveTextColor: #fff;

    --allowanceButtonGroupPipeBgColor: var(--skin_color);
    --allowanceButtonGroupPipeTextColor: #fff;

    --allowanceButtonGroupCrossBgColor: var(--szurke);
    --allowanceButtonGroupCrossTextColor: #fff;
    --accountPanelFallbackBgColor: var(--bkYellow);
    --accountPanelHeadingColor: var(--bkBrown);
    --accountPanelFontFamily: 'Roboto';
    --accountPanelDescriptionColor: white;
    --accountPanelDescriptionFontWeight: 700;
    --loginSeparatorColor: var(--bkYellow);
    --accountPanelHeadingTitlePaddingBottom: 0;
    --accountPanelHeadingTitleMarginBottom: 0;
    --accountPanelInputBorderRadius: 50px;
    --accountPanelLoginBtnWidth: 279px;
    --accountPanelTextAlign: center;
    --loginBtnBgColor: var(--bkBrown);
    --loginBtnBorderColor: var(--loginBtnBgColor);
    --loginBtnHoverBgColor: var(--bkBrown);
    --loginBtnHoverBorderColor: var(--loginBtnHoverBgColor);
    --accountPanelLoginBtnBorderRadius: 50px;
    --loginPanelInputsBgColor: var(--bkYellow);
    --loginSeparatorMargin: 10px 0;

    --starColor: #ffd800;
}