:root {
        /* --brand-450: #E8621A !important; */
        --orange-200: rgba(232,98,26,0.2);
        --orange-300: rgba(232,98,26,0.3);
        --orange-400: rgba(232,98,26,0.4);
        --orange-600: rgba(232,98,26,0.6);
        --orange-800: rgba(232,98,26,0.8);
        --orange: rgba(232,98,26,1);
        --dark-100:rgba(0,0,0,0.1);
        --dark-200:rgba(0,0,0,0.2);
        --dark-400:rgba(0,0,0,0.4);
        --dark-600:rgba(0,0,0,0.6);
        --dark-800:rgba(0,0,0,0.8);
        --dark:rgba(0,0,0,1);
        --cream:rgba(254,240,227);
        --cream-200:rgba(254,240,227,0.2);
        --cream-400:rgba(254,240,227,0.4);
        --cream-600:rgba(254,240,227,0.6);
        --cream-800:rgba(254,240,227,0.8);
    }

#DIVNotification + nav .modernMenuSubOptionTitle{
    display:flex;
    align-items:center;
    gap:4px;
    padding:0;
    margin:0;
    font-weight:400;
    font-size:12px
}

.modernMenuAlignCenter .modernMenuOptionHover > .modernMenuTopOptionTitle {
    
    border-color: var(--orange-600);
}

#DIVNotification + nav .modernMenuTop {
    min-height:60px;
}

#DIVNotification + nav .modernMenuTopOption{
    font-size:14px;
    display:flex;
    align-items:center;
    font-weight:300
}

#DIVNotification + nav .modernMenuTopOptionTitle{
    padding:7px 0;
    margin:0;
}

#DIVNotification + nav .modernMenulogoContainer {
    display:flex;
    align-items:center;
    height:60px;
    position: relative;
    margin-top: 0px;
    margin-left: 0px;
    z-index: 1;
    width:200px;
    margin-left:5px;
}

#DIVNotification + nav .modernMenulogo{
    width:146px;
    height: 36px;
}

#DIVNotification + nav .modernMenu{
    padding:0;
}

#DIVNotification + nav .modernMenuSubOptions{
    top:60px
}

.modernMenuDocumentPage .modernMenu{
    padding:0;
    margin:0;   
}

.modernMenuDocumentPage .modernMenu .modernMenuTopOptionTitle{
    padding:0;
    margin:0;
    padding:7px 0px;
}

.modernMenuDocumentPage .modernMenuSubOptions {
    top:30px;
}

.cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOn_Empty_On_Empty, .cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOn_Empty_On_Off, .cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOn_Any_On_Empty, .cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOn_Any_On_Off,
.cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOn_Empty_On_Empty, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOn_Empty_On_Off, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOn_Any_On_Empty, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOn_Any_On_Off
{
    color: var(--base-white);
    background-color: var(--orange-800);
    border: 1px solid var(--orange-600);
    cursor: default;
    
}

.cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_Empty, .cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_On, .cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_Off, .cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_Empty, .cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_On, .cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_Off, .cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOff_Off_Off_Off,
.cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_Empty, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_On, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_Off, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_Empty, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_On, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_Off, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOff_Off_Off_Off{
        background-color: var(--base-white);
    border: 1px solid var(--orange);
    
}
a.NormalButton {
    border: 1px solid  var(--orange-800);
    box-shadow: 0px 0px 0px 0.5px  var(--cream-600);
    font-weight:350;
}
a.NormalButton:hover, .FileListHighLightRow, .SearchButton:hover, .modernMenuSubOption.modernMenuOptionHover{
    background-color: var(--cream-800) !important;
    border-color: var(--orange);
    color: var(--dark);
}
a.OrangeButton{
    
}
a.OrangeButton:hover{
    border-color:var(--orange);
    background-color:var(--orange-600);
    color: var (--white)!important;
}

a.NormalButton,
a.OrangeButton, .FileListHighLightRow,.dialogButtons div:hover, 
.cPOSButton:hover, .cEditDocumentDetailButton:hover { 
    transition: background-color 0.25s ease, color 0.25s ease; 
}

.cTabPanelLevel0 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_Empty, 
.cTabPanelLevel0 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_On, 
.cTabPanelLevel0 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_Off, 
.cTabPanelLevel0 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_Empty, 
.cTabPanelLevel0 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_On, 
.cTabPanelLevel0 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_Off, 
.cTabPanelLevel0 > table > tbody > tr > td > div > div > a.TabOff_Off_Off_Off {
    color: var(--base-neutral-400);
    
}

.cTabPanelLevel0 > table > tbody > tr > td > div > div > a .TabOff_Empty_Off_Empty:hover, 
.cTabPanelLevel0 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_On:hover, 
.cTabPanelLevel0 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_Off:hover, 
.cTabPanelLevel0 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_Empty:hover, 
.cTabPanelLevel0 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_On:hover, 
.cTabPanelLevel0 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_Off:hover, 
.cTabPanelLevel0 > table > tbody > tr > td > div > div > a.TabOff_Off_Off_Off:hover
 {
    background-color: transparent;
    border-bottom: 3px solid var(--orange-200) !important;
}

.cAgentAI{
    top:20px
}
.cTDNotification{
    top:18px;
    
}
.cAgentAI svg{
    height:20px;
    width:20px;
}

.cTDNotification svg{
    height:20px;
    width:20px;
}

a.SearchButton:hover span::after {
    filter: brightness(0);
}

.FileListSelectedRow {
    background-color: var(--cream-800);
}

input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus {
    box-shadow: 0px 0px 0px 3px  var(--cream-600);
}

.BUTTONFILTER, .dialogButtonsIFrames div, .BUTTONKEYBOARD, .cPOSButton, .cEditDocumentDetailButtonm, .BUTTONNONE, .BUTTONOTHER, .BUTTONDELETE, .BUTTONCANCEL, .BUTTONBACK, .BUTTONNO, .BUTTONYES, .BUTTONCUSTOM1, .BUTTONCUSTOM2, .BUTTONCUSTOM3, .BUTTONCLEAR, .BUTTONTIMER, .BUTTONCREATE, .BUTTONLIST, .cPOSButton, .abModalKeypadCenterOK, .BUTTONLIST, #abModalKeypadCancel, #abModalKeyboardCancel {
    background-color: var(--white) !important;
    color: var(--black) !important;
    border: 1px solid var(--orange-800) !important;
    box-shadow: 0px 0px 0px 3px  var(--cream-600);
    font-weight:350;
}

input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus {
    box-shadow: 0px 0px 0px 3px  var(--cream-600);
    border-color:  var(--orange) !important;
}

.modernMenuSubOption.modernMenuOptionSelected {
    background-color: var(--cream);
} 

.cTabPanelLevel1 > table > tbody > tr > td > div > div > a .TabOff_Empty_Off_Empty:hover, 
.cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_On:hover, 
.cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_Off:hover, 
.cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_Empty:hover, 
.cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_On:hover, 
.cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_Off:hover, 
.cTabPanelLevel1 > table > tbody > tr > td > div > div > a.TabOff_Off_Off_Off:hover,
.cTabPanelLevel2 > table > tbody > tr > td > div > div > a .TabOff_Empty_Off_Empty:hover, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_On:hover, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOff_Empty_Off_Off:hover, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_Empty:hover, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_On:hover, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOff_Any_Off_Off:hover, .cTabPanelLevel2 > table > tbody > tr > td > div > div > a.TabOff_Off_Off_Off:hover {
    background-color:var(--cream)!important;
    border-color:var(--orange)!important;
    color: var(--dark-600)
}

/* POS */

.cPOSButton, .BUTTONFILTER, .BUTTONKEYBOARD, .cPOSButtonBlack, .BUTTONFILTER  {
    background-color: var(--cream-800) !important;
    color: var(--black) !important;
    border: 1px solid var(--orange-800) !important;
    box-shadow: 0px 0px 0px 3px  var(--cream-600);

}



#KeypadEnter{
    background-color:var(--orange)!important;
}

.BUTTONOK {
    background-color: var(--orange) !important;
    color: var(--white) !important;
    border: 2px solid var(--orange-600) !important;
}

.cExtraGridScroll TD {
    border-top: none !important;
    border-bottom: solid 1px var(--cream-800) !important;
}

.cArticleEditMiscPanelOtherCodes tr td input{
    margin-bottom:2px!important;
}

.cArticleEditMiscPanelOtherCodes{
    box-shadow: 0px 0px 0px 3px  var(--cream-600);
    padding:2px 0px 0px 0px!important;
    
}
.PanelTotalInside {
    background-color: var(--orange);
}

.SystemButton img, .SystemSubButton img {
    filter: brightness(0) saturate(100%) invert(45%) sepia(72%)
          saturate(2200%) hue-rotate(354deg) brightness(95%) contrast(92%);
}

#abModalKeypadOK, #abModalKeyboardOK {
    background-color: var(--orange) !important;
    color: var(--white) !important;
}

#PanelDocument {
    background-image: url(Images/POS/DocumentTopIcon.png?a=1);
}

#PanelEntity {
    background-image: url(Images/POS/EntityTopIcon.png?a=1);
}

#abModalKeypadOK:active, #abModalKeyboardOK:active,    
.BUTTONOK:active {
    background-color: var(--orange-800) !important;
    border: 2px solid var(--orange-800) !important;
    color: var(--white)!important;
}


#TableArticleStockHeader TD,
#TableEntitiesList th, #TableDocumentsOnHold th,
#TableListSalesPerson th,
#TableListWithStock th , #TableImportDocuments th, 
#TableClosedDocuments th, #TableClosedDocumentsFB th, 
#TableReturnOfGoods th, .FileListHeaderRow {
    color: var(--brand-450) !important;
    background-color: var(--brand-350) !important;
    border-bottom: solid 0px var(--orange) !important;
}


#TableEntitiesList,
#TableDocumentsOnHold,
#TableListSalesPerson,
#TableListWithStock,
#TableImportDocuments,
#TableClosedDocuments,
#TableClosedDocumentsFB,
#TableReturnOfGoods,
#TABLEArticleStockList {
    border-right: 1px solid var(--orange);
    border-bottom: 1px solid var(--orange);

}

#TableArticleStockHeader td{
    border-right: 1px solid var(--orange);
}

#TableClosedDocumentsFB td, #TableClosedDocumentsFB th, 
#TableClosedDocuments td, #TableClosedDocuments th, 
#TableImportDocuments td, #TableImportDocuments th, 
#TableDocumentsOnHold td, #TableDocumentsOnHold th,

#TableArticleStockHeader td, #TableArticleStockHeader th,
#TableEntitiesList td, #TableEntitiesList th,
#TableDocumentsOnHold td, #TableDocumentsOnHold th,
#TableListSalesPerson td, #TableListSalesPerson th,
#TableListWithStock td, #TableListWithStock th,


#TableReturnOfGoods td, #TableReturnOfGoods th,
#TABLEArticleStockList td, #TABLEArticleStockList th  {
    border-top: 1px solid var(--orange);
    border-left: 1px solid  var(--orange);
    
}

#PanelPaymentTotalText, #TableImportDocuments th, #TableClosedDocuments th, #TableClosedDocumentsFB th, #TableReturnOfGoods th.FileListDiv a {
    color: var(--brand-450);
}

.CheckBoxFormDivCheckbox input:checked, .largerCheckboxForm input:checked {
    background-color: var(--orange);
    color: var(--white);
}

.cPOSImageButton img {
      filter: brightness(0) saturate(100%) invert(45%) sepia(72%)
          saturate(0%) hue-rotate(354deg) brightness(95%) contrast(92%);
}

.BUTTONDELETE:active, .BUTTONCANCEL:active, .BUTTONBACK:active, .BUTTONNO:active, .BUTTONYES:active, .BUTTONCUSTOM1:active, .BUTTONCUSTOM2:active, .BUTTONCUSTOM3:active, .BUTTONCLEAR:active, .BUTTONTIMER:active, .BUTTONCREATE:active, .BUTTONLIST:active, .cPOSButton:active, .abModalKeypadCenterOK:active, .BUTTONLIST:active, #abModalKeypadCancel:active, #abModalKeyboardCancel:active {
    background-color: var(--orange) !important;
    color: var(--white) !important;
}

#TableClosedDocumentsFB td, #TableClosedDocumentsFB th,  
#TableImportDocuments td, #TableImportDocuments th, #TableDocumentsOnHold td, #TableDocumentsOnHold th {
    border-top: 1px solid var(--orange-400);
    border-left: 1px solid var(--orange-400);
}



.abModalTextboxDate:focus {
        border: 1px solid var(--orange) !important;
        background-color: var(--white)
    }

    .abModalTextboxDate:not(:focus), .abModalTextboxPrice:not(:focus) {
        border: 1px solid var(--orange) !important;
        background-color: var(--white)
    }

.abModalTextbox:not(:focus) {
    border: 1px solid var(--orange-600) !important;
    background-color: var(--white);
}

.abModalTextbox:focus {
    border: 1px solid var(--orange-400) !important;
}

.abModalDropDown:not(:focus) {
    border: 1px solid var(--orange) !important;
    background-color: var(--white);
}

/*.dialog, .dialogTabs div, .mainbody*/

#fullscreen {
    background-color: var(--cream) !important;
}

.SystemButton, .PanelSystemButtons, .PanelSystemButtonsInside, #ReportsSubMenu{ 
    background-color: var(--cream)  !important;
}

.abModalOverlay {
    background-color: var(--cream)  !important;
}

.RedirectPrinterListButton {  background-color: var(--orange-200) !important; }
.RedirectPrinterListButtonClicked {  background-color: var(--orange-800) !important; }


.SystemButton:active, .SystemSubButton:active {
    background-color: var(--orange-400) !important;
}


input[type="text"].abModalTextboxDate:focus,
input[type="text"].abModalTextbox:focus,
input[type="select"].abModalDropDown:focus,
.abModalDropDown:focus,
.abModalKeypadLCDTextbox:focus,
.abModalKeyboardLCDTextbox:focus, .abModalKeyboardLCDTextArea:focus, #PanelLCDInside:focus {
    border: 1px solid var(--brand450) !important;
    outline:none;
    box-shadow: 0px 0px 0px 1px  var(--brand450);
}

#maindiv {
    &::before {
        background: var(--base-white);
    }
}