html, body {
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
}

#language-opt {
    width: 78px;
}

.userman-trial label {
    width: 100%;
}

.row:has([is-button-help="is-button-help"]) {
    margin-bottom: 0;
}
[not-visible] {
    display: none !important;
}
div[is-button-help="is-button-help"] .btn-primary {
    cursor: pointer;
    padding: 0.05rem 0.65rem;
    -webkit-box-shadow: 0 2px 5px rgba(0,0,0,.5) !important;
    box-shadow: 0 2px 5px rgba(0,0,0,.5) !important;
    border-radius: 50%;
    background-color: var(--main);
    border-color: var(--main);
    color: var(--background);
}

    div[is-button-help="is-button-help"] .btn-primary:hover,
    div[is-button-help="is-button-help"] .btn-primary:active {
        background-color: var(--main65) !important;
        border-color: var(--main65) !important;
    }

.tab-pane:has(.nav-tabs) div[is-button-help="is-button-help"] .btn-primary {
    background-color: var(--background);
    border-color: var(--background);
    color: var(--foreground);
}

div[is-button-help="is-button-help"] {
    position: absolute;
    width: auto;
    top: 10px;
    right: 11px;
}

.tab-pane:has(.nav-tabs) div[is-button-help="is-button-help"] {
    top: 7px;
    right: 12px;
}

    .tab-pane:has(.nav-tabs) div[is-button-help="is-button-help"] .btn-primary:hover,
    .tab-pane:has(.nav-tabs) div[is-button-help="is-button-help"] .btn-primary:active {
        background-color: var(--lightgrey) !important;
        border-color: var(--lightgrey) !important;
    }

html.theme-dark .tab-pane:has(.nav-tabs) div[is-button-help="is-button-help"] .btn-primary:hover,
html.theme-dark .tab-pane:has(.nav-tabs) div[is-button-help="is-button-help"] .btn-primary:active {
    background-color: var(--lightgrey2) !important;
    border-color: var(--lightgrey2) !important;
}

div[is-button-help="is-button-help"] .btn-label {
    font-weight: 900;
    font-size: 1.2rem;
}

.shortcut-box {
    display: flex;
    border-left: 1px solid var(--lightgrey);
    padding-left: 1rem;
}

    .shortcut-box .btn {
        padding: .1rem .4rem;
        font-size: 0.9rem;
        font-weight: 400;
        margin-right: 2.5rem;
        min-width: 6rem;
    }

.shortcut-box,
.working-box {
    margin-left: 35px;
}

    .working-box label,
    .default-deploy-box label{
        margin-bottom: unset;
        border-left: 1px solid var(--lightgrey);
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .working-box span,
    .default-deploy-box span{
        display: block;
    }

        .working-box span:first-child:not(:empty),
        .default-deploy-box span:first-child:not(:empty){
            font-size: 0.7rem;
            margin-bottom: 4px;
        }

[placeholder="simple-upload"] .custom-file {
    display: none;
}

/* Formula Node */
.formula-container {
    min-height: 100px;
    background-color: orange;
    width: auto;
    height: auto;
    border-radius: 20px;
    padding: 10px;
    display: inline-block;
}

.formula-content-label {
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    font-family: Arial;
    max-width: 500px;
    word-break: break-word;
}

    .formula-content-label:before {
        content: "\f1ec";
        font-family: "Font Awesome 5 Free" !important;
        font-weight: 900 !important;
        padding-right: 10px;
        font-size: 18px;
    }
/*Alert Node*/
.alert-container {
    min-height: 100px;
    background-color: #98caff;
    width: auto;
    height: auto;
    border-radius: 20px;
    padding: 10px;
    display: inline-block;
}
[class^='alert-content-label']:first-of-type:before {
    content: "\f4ad";
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    padding-right: 10px;
    font-size: 18px;
}
[class^='alert-content-label'] {
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    font-family: Arial;
    max-width: 500px;
    word-break: break-word;
    display: block;
    white-space: nowrap;
}
/*Row Managment*/
.add-row-container {
    min-height: 100px;
    background-color: #3aeb34;
    width: auto;
    height: auto;
    border-radius: 20px;
    padding: 10px;
    display: inline-block;
}

[class^='add-row-content-label']:first-of-type:before {
    content: "\f055";
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    padding-right: 10px;
    font-size: 18px;
}
add-row-content-label-1{
    font-weight:900;
}

[class^='add-row-content-label'] {
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    font-family: Arial;
    max-width: 500px;
    word-break: break-word;
    display: block;
    white-space: nowrap;
}
.remove-selected-row-container {
    min-height: 100px;
    background-color: #ebe134;
    width: auto;
    height: auto;
    border-radius: 20px;
    padding: 10px;
    display: inline-block;
}

[class^='remove-selected-row-content-label']:first-of-type:before {
    content: "\f146";
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    padding-right: 10px;
    font-size: 18px;
}

remove-selected-row-content-label-1 {
    font-weight: 900;
}

[class^='remove-selected-row-content-label'] {
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    font-family: Arial;
    max-width: 500px;
    word-break: break-word;
    display: block;
    white-space: nowrap;
}
.remove-all-row-container {
    min-height: 100px;
    background-color: #e65353f0;
    width: auto;
    height: auto;
    border-radius: 20px;
    padding: 10px;
    display: inline-block;
}

[class^='remove-all-row-content-label']:first-of-type:before {
    content: "\f2ed";
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    padding-right: 10px;
    font-size: 18px;
}

remove-all-row-content-label-1 {
    font-weight: 900;
}

[class^='remove-all-row-content-label'] {
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    font-family: Arial;
    max-width: 500px;
    word-break: break-word;
    display: block;
    white-space: nowrap;
}

/* Evidenzia alcune celle nelle grid ad es. Start Page */
.bb-cell-graywhite {
    background-color: var(--main80);
    color: var(--foreground);
}

/* Dynamic Grid */
.tabulator-cell[tabulator-field="sendclipboard"] i,
.tabulator-cell[tabulator-field="isgraphic"] i {
    font-size: 1.5rem !important;
}

/* workaround per quel casino di finestra di 'DiagramsFrameDefineValues' e 'FrameImportData' */
[bb-page-name="DiagramsFrameDefineValues"] > div.row {
    margin-bottom: 0;
}

[bb-page-name="DiagramsFrameDefineValues"] div.row:not(:last-child) > div[is-bb-control]:not([bb-is-not-visible]) {
    margin-bottom: 20px;
}
/* fine workaround per quel casino di finestra di 'DiagramsFrameDefineValues' e 'FrameImportData' */

[bb-element-name='DiagramsInfoNode'] textarea {
    height: 350px;
}

[bb-element-name='PageDataGrid'] .tabulator-col, [bb-element-name='PageDataGrid'] .tabulator-cell {
    max-width: 315px;
    white-space: pre-wrap !important;
}

[bb-element-name='ListDataDefinition'] .tabulator-col, [bb-element-name='ListDataDefinition'] .tabulator-cell {
    max-width: 30vw;
    white-space: pre-wrap !important;
}

[bb-element-name='PageDataGrid'] {
    max-width: 1620px !important;
}

[bb-element-name="PageDataControlInfo"] textarea.form-control {
    height: calc(1.5em + 0.75rem + 2px);
}

/* Diagrams*/
.e-diagram {
    font-size: 0.9rem;
    /*font-style: italic;*/
    font-weight: normal;
    color: black;
}

svg.e-grid-layer {
    opacity: 0.5;
}

.e-contextmenu-wrapper ul, .e-contextmenu-container ul {
    min-width: 13em;
    max-width: 26em;
    padding: .25em 0;
    margin: .3em;
    font-family: inherit;
    font-size: inherit;
    list-style-type: none;
    background: #fff;
    border: 1px solid #bebebe;
    border-radius: .2em;
    -webkit-box-shadow: 0 2px 5px rgba(0,0,0,.5) !important;
    box-shadow: 0 2px 5px rgba(0,0,0,.5) !important;
}

    .e-contextmenu-wrapper ul .e-menu-item, .e-contextmenu-container ul .e-menu-item {
        cursor: pointer;
        position: relative;
        height: 2rem;
        line-height: 2rem;
        padding: 0 16px;
    }

        .e-contextmenu-wrapper ul .e-menu-item .e-caret, .e-contextmenu-container ul .e-menu-item .e-caret {
            line-height: 1.95rem;
        }

[placeholder='diagram'] {
    min-height: 78vh;
    height: 78vh;
}
[page-name="DiagramsFrameDR"] .wrapper,
[page-name="DiagramsFrameVR"] .wrapper{
    padding: 0;
    overflow: hidden;
}
[page-name="DiagramsFrameDR"] .jconfirm-content-pane {
    max-height: unset !important;
}
    [placeholder='diagram'] .diagram-rulename {
        padding: 0.4rem 0.5rem 0.2rem 0.5rem;
        border: 1px solid var(--border);
        position: absolute;
        border-radius: 4px;
        top: 0.4rem;
        left: 0.4rem;
        background: var(--background);
        z-index: 10;
        box-shadow: 0 5px 5px -3px rgb(0 0 0 / 20%), 0 5px 5px 1px rgb(0 0 0 / 14%), 0 3px 14px 2px rgb(0 0 0 / 12%);
    }

    [placeholder="diagram"] > .e-control.e-diagram {
        border: 1px solid var(--border);
        border-radius: 0.25rem;
        width: 100% !important;
        height: 100% !important;
    }

    [placeholder="diagram"] > div > div {
        overflow: auto !important;
    }

[placeholder='diagramDoc'] {
    height: 500px;
}

[bb-element-name="BoxesList"] .tabulator,
[bb-element-name="BBWTreeStructure"] .tabulator,
[bb-element-name="LocalizationsGridLabels"] .tabulator {
    height: calc(100vh - 245px) !important;
}

[bb-page-name="BoxTree"] [bb-element-name="BBWTreeStructure"] .tabulator {
    height: 400px !important;
}

div[bb-page-name="BoxManagementSide"],
div[bb-page-name="ElementsPageSide"],
div[bb-page-name="MethodsPageSide"],
div[bb-page-name="PagesPageSide"],
div[bb-page-name="PageDataSide"],
div[bb-page-name="ValidityRulesPageSide"],
div[bb-page-name="DecisionRulesPageSide"],
div[bb-page-name="LocalizationsPageSide"] {
    margin-top: 2rem;
    display: flex;
    flex-direction: column;
    height: calc(100% - 2rem);
}

div[bb-page-name="DiagramsFrameVRSide"],
div[bb-page-name="DiagramsFrameDRSide"] {
    margin-top: -0.45rem;
    display: flex;
    flex-direction: column;
    height: 100%;
}

div[bb-page-name="BoxManagementSide"] .row:has(div[bb-label="Delete"]),
div[bb-page-name="BoxManagementSide"] .row:has(div[bb-label="Export<sp>(bbt)"]),
div[bb-page-name="BoxManagementSide"] .row:has(div[bb-label="Deploy"]) {
    flex-grow: 1;
}

    div[bb-page-name="PagesPageSide"] .row:has(div[bb-label="Design"]),
    div[bb-page-name="PagesPageSide"] .row:has(div[bb-label="Preview"]) {
        flex-grow: 1;
    }

    div[bb-page-name="MethodsPageSide"] .row:has(div[bb-label="Configure"]) {
        flex-grow: 1;
    }

    div[bb-page-name="ElementsPageSide"] .row:has(div[bb-label="New<sp>Message"]),
    div[bb-page-name="ElementsPageSide"] .row:has(div[bb-label="Extra<sp>Properties"]) {
        flex-grow: 1;
    }

    div[bb-page-name="PageDataSide"] .row:has(div[bb-label="Configure"]),
    div[bb-page-name="PageDataSide"] .row:has(div[bb-label="Clear<sp>Cell"]),
    div[bb-page-name="PageDataSide"] .row:has(div[bb-label="Preview<sp>Page"]) {
        flex-grow: 1;
    }

    div[bb-page-name="ValidityRulesPageSide"] .row:has(div[bb-label="Configure"]),
    div[bb-page-name="ValidityRulesPageSide"] .row:has(div[bb-label="Design"]),
    div[bb-page-name="DecisionRulesPageSide"] .row:has(div[bb-label="Configure"]),
    div[bb-page-name="DecisionRulesPageSide"] .row:has(div[bb-label="Design"]) {
        flex-grow: 1;
    }

    div[bb-page-name="DiagramsFrameVRSide"] .row:has([is-bb-control]) {
        flex-grow: 1;
    }

    div[bb-page-name="DiagramsFrameDRSide"] .row:has([is-bb-control]){
        flex-grow: 1;
    }

    /*div[bb-page-name="LocalizationsPageSide"] .row:has(div[bb-label="Paste<sp>From<sp>XLSX"]),
    div[bb-page-name="LocalizationsPageSide"] .row:has(div[bb-label="Export"]) {
        flex-grow: 1;
    }*/

.wrapper[bb-page-name="BoxMainPage"],
.wrapper[bb-page-name="ElementsMainPage"],
.wrapper[bb-page-name="MethodsMainPage"],
.wrapper[bb-page-name="PagesMainPage"],
.wrapper[bb-page-name="PageData"],
.wrapper[bb-page-name="ValidityRulesMainPage"],
.wrapper[bb-page-name="DiagramsFrameVR"],
.wrapper[bb-page-name="DiagramsFrameDR"],
.wrapper[bb-page-name="DecisionRulesMainPage"],
.wrapper[bb-page-name="LocalizationsMainPage"] {
    flex-direction: row-reverse;
}

    .wrapper[bb-page-name="BoxMainPage"] #sidebar,
    .wrapper[bb-page-name="ElementsMainPage"] #sidebar,
    .wrapper[bb-page-name="MethodsMainPage"] #sidebar,
    .wrapper[bb-page-name="PagesMainPage"] #sidebar,
    .wrapper[bb-page-name="PageData"] #sidebar,
    .wrapper[bb-page-name="ValidityRulesMainPage"] #sidebar,
    .wrapper[bb-page-name="DiagramsFrameVR"] #sidebar,
    .wrapper[bb-page-name="DiagramsFrameDR"] #sidebar,
    .wrapper[bb-page-name="DecisionRulesMainPage"] #sidebar,
    .wrapper[bb-page-name="LocalizationsMainPage"] #sidebar {
        border-right: unset;
        border-left: 1px solid var(--border);
        max-width: 12%;
        min-width: max(12%, 13rem);
        width: 12%;
    }

    .wrapper[bb-page-name="BoxMainPage"] #content,
    .wrapper[bb-page-name="ElementsMainPage"] #content,
    .wrapper[bb-page-name="MethodsMainPage"] #content,
    .wrapper[bb-page-name="PagesMainPage"] #content,
    .wrapper[bb-page-name="PageData"] #content,
    .wrapper[bb-page-name="ValidityRulesMainPage"] #content,
    .wrapper[bb-page-name="DiagramsFrameVR"] #content,
    .wrapper[bb-page-name="DiagramsFrameDR"] #content,
    .wrapper[bb-page-name="DecisionRulesMainPage"] #content,
    .wrapper[bb-page-name="LocalizationsMainPage"] #content {
        max-width: 88%;
        min-width: min(88%, calc(88% - 13rem));
        width: 88%;
    }

#sidebar div[bb-control-type="Button"] {
    display: initial;
}

#sidebar .row:has([placeholder='simple-upload']) {
    margin-bottom: 0 !important;
}

div[bb-control-type="Button"] {
    justify-content: center;
    align-items: center;
    display: flex;
}

div[bb-label="Save"] .btn-primary,
div[bb-label="Cancel"] .btn-primary {
    width: 7rem;
}


[bb-element-name="MethodsPage"] .tabulator {
    height: 52vh !important;
}

/* page designer */
[bb-element-name="PageDataGrid"] .tabulator {
    height: 52vh !important;
}
[bb-element-name="PageDataGrid"] .tabulator-cell {
    height: auto !important;
}
.designer-main {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: nowrap;
    pointer-events: none;
}

.designer-control,
.designer-span,
.designer-element,
.designer-event {
    display: inline-flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}

    .designer-control i {
        font-size: 1.2rem;
        margin-right: 0.7rem;
    }

    .designer-control span {
        font-weight: normal;
        margin-right: 1.5rem;
        text-transform: uppercase;
    }

.designer-span i {
    margin-right: 0.2rem;
    font-size: 1rem;
    color: var(--main65);
}

.designer-span span {
    font-size: 1rem;
    font-weight: normal;
    color: var(--main65);
}

    .designer-element span:first-child,
    .designer-label span:first-child {
        margin-right: 0.7rem;
        font-weight: bold;
    }

.designer-event span {
    font-size: 0.8rem;
    color: var(--danger);
}

/* inizio icone e correlati */
[main-navbar] .nav-link::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
}

[main-navbar] .nav-link#BoxMainPage-tab::before {
    content: "\f466";
}

[main-navbar] .nav-link#ElementsMainPage-tab::before {
    content: "\f0ca";
}

[main-navbar] .nav-link#MethodsMainPage-tab::before {
    content: "\f12e";
}

[main-navbar] .nav-link#PagesMainPage-tab::before {
    content: "\f815";
}

[main-navbar] .nav-link#ValidityRulesMainPage-tab::before {
    content: "\f0ad";
}

[main-navbar] .nav-link#DecisionRulesMainPage-tab::before {
    content: "\f074";
}

[main-navbar] .nav-link#PluginsPage-tab::before {
    content: "\f1e6";
}

[main-navbar] .nav-link#LocalizationsMainPage-tab::before {
    content: "\f024";
}

/* tabulator menu icons */
li.context-menu-item::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
}

li.context-menu-item.context-menu-icon-localizationswhereused::before,
li.context-menu-item.context-menu-icon-searchwordintobox::before {
    content: "\f002";
}

li.context-menu-item.context-menu-icon-decisionruleaddrowdata:before,
li.context-menu-item.context-menu-icon-validityruleaddrowdata:before,
li.context-menu-item.context-menu-icon-addnewmethod::before,
li.context-menu-item.context-menu-icon-localizationsaddrowlabeladd::before,
li.context-menu-item.context-menu-icon-controladdmenuitem::before,
li.context-menu-item.context-menu-icon-addnewsheet::before {
    content: "\f067";
}

li.context-menu-item.context-menu-icon-controlactivateframefieldeditable::before,
li.context-menu-item.context-menu-icon-controlmodifycontent::before,
li.context-menu-item.context-menu-icon-controlmodifymenuitem::before {
    content: "\f044";
}

li.context-menu-item.context-menu-icon-listdataaddrow::before,
li.context-menu-item.context-menu-icon-editsheet::before {
    content: "\f044";
}

li.context-menu-item.context-menu-icon-pageactivatemethods::before {
    content: "\f12e";
}

li.context-menu-item.context-menu-icon-pagedatacopyfromselected::before {
    content: "\f0c5";
}

li.context-menu-item.context-menu-icon-pagedatapasteinselected::before {
    content: "\f0ea";
}

li.context-menu-item.context-menu-icon-pagedataaddrowgrid::before {
    content: "\f03c";
}

li.context-menu-item.context-menu-icon-decisionruleremoverowdata::before,
li.context-menu-item.context-menu-icon-validityruleremoverowdata::before,
li.context-menu-item.context-menu-icon-pagedataremoverow::before {
    content: "\f12d";
}

li.context-menu-item.context-menu-icon-createelementfrom::before {
    content: "\f0c5";
}

li.context-menu-item.context-menu-icon-listimportfromsql::before {
    content: "\f1c0";
}

li.context-menu-item.context-menu-icon-drpastefromxlsx::before,
li.context-menu-item.context-menu-icon-vrpastefromxlsx::before,
li.context-menu-item.context-menu-icon-listpastefromxlsx::before {
    content: "\f1c3";
}

li.context-menu-item.context-menu-icon-exportdatainclipboard::before {
    content: "\f328";
}

li.context-menu-item.context-menu-icon-editdataofelement::before {
    content: "\f0ad";
}

li.context-menu-item.context-menu-icon-renameelement::before,
li.context-menu-item.context-menu-icon-renamesheet::before {
    content: "\f246";
}

li.context-menu-item.context-menu-icon-methodremoveparam:before,
li.context-menu-item.context-menu-icon-removeelement::before,
li.context-menu-item.context-menu-icon-listdataremoverow::before,
li.context-menu-item.context-menu-icon-listremovecolumn::before,
li.context-menu-item.context-menu-icon-controlremovemenuitem:before,
li.context-menu-item.context-menu-icon-localizationsremovelabeladd::before,
li.context-menu-item.context-menu-icon-extrapropertyremoverow::before {
    content: "\f2ed";
}

li.context-menu-item.context-menu-icon-whereusedelement::before,
li.context-menu-item.context-menu-icon-extrapropertywhereused::before {
    content: "\f128";
}

li.context-menu-item.context-menu-icon-clearfieldinedit::before {
    content: "\f51a";
}

/* ej2 menu icons */
.e-menu-item::before {
    color: black !important;
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    margin-right: 10px;
}

.e-menu-item#DefElement::before {
    content: "\f217";
}

.e-menu-item#ChangeElement::before {
    content: "\f303";
}

.e-menu-item#ChangeValues::before {
    content: "\f303";
}

.e-menu-item#AddValue::before {
    content: "\f0fe";
}

.e-menu-item#AddOtherwise::before {
    content: "\f055";
}

.e-menu-item#RemoveBranch::before {
    content: "\f2ed";
}

.e-menu-item#CopyNode::before {
    content: "\f0c5";
}

.e-menu-item#CopySingleNode::before {
    content: "\f0c5";
}

.e-menu-item#AddFormula::before {
    content: "\f1ec";
}

.e-menu-item#AddElaborateString::before {
    content: "\f1dd";
}

.e-menu-item#PasteNode::before {
    content: "\f0ea";
}

.e-menu-item#AddMethod::before {
    content: "\f079";
}

.e-menu-item#AddAssignment::before {
    content: "\f52c";
}

.e-menu-item#AddMultiAssignment::before {
    content: "\f52c";
}

.e-menu-item#AddClear::before {
    content: "\f12d";
}

.e-menu-item#RemoveNode::before {
    content: "\f2ed";
}

.e-menu-item#InfoNode::before {
    content: "\f05a";
}
.e-menu-item#AddNotes::before {
    content: "\f249";
}
.notes-infos::before {
    color: white !important;
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    padding: 4px;
    content: "\f249";
    border: 1px solid var(--main);
    background-color: var(--main);
    border-radius: 10px;
}
.notes-infos {
    transform: none !important;
}

.e-menu-item#ChangeTF::before {
    content: "\f303";
}

.e-menu-item#Compare::before {
    content: "\f24e";
}

.e-menu-item#AddRule::before {
    content: "\f085";
}

.e-menu-item#AddLabel::before {
    content: "\f02c";
}
.e-menu-item#AddAlert::before {
    content: "\f4ad";
}
.e-menu-item#DiagramsAddRow::before {
    content: "\2b";
}
.e-menu-item#DiagramsRemoveSelectedRow::before {
    content: "\f146";
}
.e-menu-item#DiagramsRemoveAllRow::before {
    content: "\f2ed";
}

.e-menu-item#ChangeGoTo::before {
    content: "\f0fb";
}

.e-menu-item#ChangeEnd::before {
    content: "\f051";
}

.e-menu-item#ViewDiagram::before {
    content: "\f53f";
}

/* icone pulsanti */

.uppy-FileInput-btn:before,
[bb-method] button::before,
[bb-rule] button::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    margin-right: 10px;
}

.uppy-FileInput-btn:before {
    content: "\f574";
}

[bb-method*="create"] button::before,
[bb-method*="Create"] button::before,
[bb-rule*="create"] button::before,
[bb-rule*="Create"] button::before,
[bb-method*="save"] button::before,
[bb-method*="Save"] button::before,
[bb-rule*="save"] button::before,
[bb-rule*="Save"] button::before {
    content: "\f0c7";
}

[bb-method*="refresh"] button::before,
[bb-method*="Refresh"] button::before,
[bb-method*="Update"] button::before,
[bb-method*="update"] button::before {
    content: "\f2f1";
}

[bb-method*="confirm"] button::before,
[bb-method*="Confirm"] button::before,
[bb-rule*="confirm"] button::before,
[bb-rule*="Confirm"] button::before {
    content: "\f00c";
}

[bb-method="BoxClean"] button::before,
[bb-method*="Clear"] button::before,
[bb-method*="clear"] button::before {
    content: "\f51a";
}

[bb-method="DecisionRuleAddColumn"] button::before,
[bb-method="ValidityRuleAddColumn"] button::before,
[bb-method^="AddNew"] button::before,
[bb-method="AddMethodParam"] button::before,
[bb-method="ListAddColumn"] button::before,
[bb-method="ExtraPropertyAddRow"] button::before,
[bb-method="BoxNew"] button::before {
    content: "\f067";
}

[bb-method="ControlModifyContent"] button::before,
[bb-method="EditDataOfElement"] button::before,
[bb-method="BoxOpenExtra"] button::before {
    content: "\f0ad";
}
[bb-method="BoxUnlock"] button::before,
.unlock-btn::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    margin-right: 10px;
    content: "\f13e";
}
.unlock-btn.locked-by-user::after{
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    margin-left: 10px;
    content: "\f502";
}
.lock-btn::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    margin-right: 10px;
    content: "\f023";
}
[role="columnheader"][tabulator-field="html"]{
    visibility:hidden;
}
.unlock-btn,
.lock-btn{
    position: relative;
    /*right: 3vw;
    top: 5px;*/
}
.unlock-btn.hide{
    display:none !important;
}

    [bb-label="Design"] button::before {
        content: "\f53f" !important;
    }

[bb-method="PreviewPage"] button::before,
[bb-method="PreviewFromBox"] button::before {
    content: "\f002";
}

[bb-method="ListCreaScriptSql"] button::before {
    content: "\f70e";
}

[bb-method="AddExtraPropertiesToElement"] button::before {
    content: "\f249";
}

[bb-method="AddDataToElement"] button::before {
    content: "\f0ca";
}

[bb-method="BoxNewRevision"] button::before {
    content: "\f126";
}

[bb-method="RemoveElement"] button::before,
[bb-method="BoxRemove"] button::before {
    content: "\f2ed";
}

[bb-method="LocalizationsExportaInXLSX"] button::before,
[bb-method="Export"] button::before,
[bb-method="CreateXlsxFromBox"] button::before,
[bb-method="CreateEncodedFromBox"] button::before {
    content: "\f019";
}
[bb-method="Deploy"] button::before{
    content: "\f56e";
}
[bb-method="LocalizationsPasteFromXLSX"] button::before {
    content: "\f0ea";
}

[bb-method="LocalizationsAddNewLabels"] button::before {
    content: "\f044";
}

[bb-method="ImportInAppending"] button::before,
[bb-rule="ImportFullModel"] button::before,
[bb-rule="AppendToModel"] button::before {
    content: "\f56f";
}

[bb-rule="HelpCreateMethodsPage"] button::before {
    content: "\f059";
}

[bb-method="DiagramsCheckVR"] button::before,
[bb-method="FormuleVerifyFormula"] button::before {
    content: "\f560";
}

[bb-method="FormuleTestFormula"] button::before {
    content: "\f1ec";
}

[bb-method="DiagramsPrepareDocNodes"] button::before {
    content: "\f1c2";
}

[bb-method="DiagramsExitFromVRG"] button::before,
[bb-method="DiagramsExitFromDRG"] button::before {
    content: "\f52b";
}

[bb-method="DiagramsCopyVRGfrom"] button::before,
[bb-method="DiagramsCopyDRGfrom"] button::before {
    content: "\f0c5";
}

[bb-method="DiagramsNewObject"] button::before {
    content: "\f0fe";
}

[listview] .tabulator-col-title-holder {
    display: none;
}
.e-tooltip-wrap.e-popup {
    background-color: var(--main);
    border: 1px solid var(--main40) !important;
}
.e-tooltip-wrap .e-arrow-tip-outer.e-tip-bottom {
    border-top: 8px solid var(--main40) !important;
}
.e-arrow-tip-inner.e-tip-bottom {
    color: var(--main40) !important;
}
.e-tooltip-wrap .e-tooltip-close {
    color: var(--main);
    border-color: var(--main40) !important;
}
[bb-element-name="WhereUsedString"] textarea {
    min-height: 40vh;
    font-size: 16px;
}
[bb-element-name="WhereUsedString"] label {
    font-size: 16px;
    font-weight: 500;
    text-decoration: underline;
}.fa-circle-question:before {
    content: '\f059';
}
 [placeholder="localization-excel"]{
     min-height:70vh !important;
 }
 [placeholder="localization-excel"] .e-sheet-panel{
     height:70vh !important;
 }


 .info-button-on-element {
    position: relative !important;
    top: 0px !important;
    right: 0px !important;
}
 div[is-button-help="is-button-help"].info-button-on-element .btn-label {
    font-weight: 900;
    font-size: 0.8rem !important;
}
 
 .loader-text {
    position: fixed;
    top: calc(50% + 55px); /* Posiziona il testo sotto il loader */
    left: 50%;
    transform: translateX(-50%);
    font-size: 16px;
    color: var(--main);
    z-index: 999999999;
    background-color:white;
    opacity:1;
    padding:5px;
    max-width:40%;
}

 /*Revisione grafica regole*/
.dr-node {
    position: relative;
    display: inline-block; /* Adattamento al contenuto */
    background-color: #ADD8E6; /* Azzurro chiaro */
    border: 4px solid #000; /* Bordo nero evidente */
    border-radius: 20px; /* Bordi arrotondati */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4); /* Ombreggiatura più pronunciata */
    padding: 15px; /* Ridotto il padding */
    overflow: hidden; /* Evita traboccamenti */
    white-space: nowrap; /* Evita che il testo vada a capo */
}

.dr-node label {
    display: flex;
    align-items: center;
    font-size: 2rem; /* Dimensione più grande in rem */
    background-color: #5F9EA0; /* Azzurro più scuro per la label */
    color: #fff; /* Colore del testo della label */
    padding: 10px; /* Aumentato il padding */
    border-radius: 15px; /* Bordi arrotondati per la label */
}

.dr-node label i {
    margin-right: 15px; /* Spazio tra l'icona e il testo */
}
.dr-node label i.expand-collapse-btn{
    margin-left: 25px; /* Spazio tra l'icona e il testo */
}

.dr-node .node-content {
    font-size: 1.5rem; /* Dimensione del contenuto più grande in rem */
    color: #000;
    white-space: nowrap; /* Evita che il testo vada a capo */
    display: none; /* Inizia collassato */
    margin-top: 15px;
}

.dr-node.end-node {
    background-color: #FA8072; /* Rosso salmon */
    border-radius: 50%; /* Forma tonda */
    display: flex; /* Utilizza flexbox */
    align-items: center; /* Centra verticalmente */
    justify-content: center; /* Centra orizzontalmente */
    color: white; /* Colore del testo */
    text-align: center;
    min-width: 100px; /* Larghezza minima */
    min-height: 100px; /* Altezza minima */
    line-height: 1; /* Line-height per centrare il testo */
    padding: 0; /* Rimuove il padding */
    margin: 0; /* Rimuove i margini */
}

.dr-node.end-node label {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem; /* Mantiene la dimensione del testo */
    background-color: transparent; /* Sfondo trasparente per la label */
    padding: 0; /* Rimuove il padding */
    border-radius: 50%; /* Mantiene la forma tonda */
    width: 100%; /* Larghezza al 100% del contenitore */
    height: 100%; /* Altezza al 100% del contenitore */
    line-height: normal; /* Line-height normale */
}
.dr-node.end-node.end-true {
    background-color: #45ad45;
}
.dr-node.end-node.end-true label:before {
    content: "\f00c";
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    padding-right: 5px;
    padding-left: 5px;
}
.dr-node.end-node.end-false {
    background-color: red;
}
.dr-node.end-node.end-false label:before {
    content: "\f00d";
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    padding-right: 5px;
    padding-left: 5px;
}

.dr-node.label-node {
    background-color: #98FB98; /* Verde chiaro */
    /*border: 4px solid #006400;*/ /* Bordo verde scuro */
    border-radius: 20px; /* Bordi arrotondati */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4); /* Ombreggiatura più pronunciata */
    padding: 15px; /* Ridotto il padding */
    overflow: hidden; /* Evita traboccamenti */
    white-space: nowrap; /* Evita che il testo vada a capo */
    display: inline-block; /* Adattamento al contenuto */
}

.dr-node.label-node label {
    display: flex;
    align-items: center;
    font-size: 2rem; /* Dimensione più grande in rem */
    background-color: #2E8B57; /* Verde più scuro per la label */
    color: #fff; /* Colore del testo della label */
    padding: 10px; /* Aumentato il padding */
    border-radius: 15px; /* Bordi arrotondati per la label */
}

.dr-node.method-node {
    background-color: #FFD700; /* Giallo scuro */
    border-radius: 20px; /* Bordi arrotondati */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4); /* Ombreggiatura pronunciata */
    padding: 15px; /* Ridotto il padding */
    overflow: hidden; /* Evita traboccamenti */
    white-space: nowrap; /* Evita che il testo vada a capo */
    display: inline-block; /* Adattamento al contenuto */
}

.dr-node.method-node label {
    display: flex;
    align-items: center;
    font-size: 2rem; /* Dimensione più grande in rem */
    background-color: #FFA500; /* Arancione scuro per la label */
    color: #fff; /* Colore del testo della label */
    padding: 10px; /* Aumentato il padding */
    border-radius: 15px; /* Bordi arrotondati per la label */
}

.dr-node.rule-node {
    background-color: #9370DB; /* Viola medio */
    border-radius: 20px; /* Bordi arrotondati */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4); /* Ombreggiatura pronunciata */
    padding: 15px; /* Ridotto il padding */
    overflow: hidden; /* Evita traboccamenti */
    white-space: nowrap; /* Evita che il testo vada a capo */
    display: inline-block; /* Adattamento al contenuto */
}

.dr-node.rule-node label {
    display: flex;
    align-items: center;
    font-size: 2rem; /* Dimensione più grande in rem */
    background-color: #6A5ACD; /* Viola scuro per la label */
    color: #fff; /* Colore del testo della label */
    padding: 10px; /* Aumentato il padding */
    border-radius: 15px; /* Bordi arrotondati per la label */
}
.dr-node.elaborate-string-node {
    background-color: #F8BBD0; /* Rosa chiaro */
    border-radius: 20px; /* Bordi arrotondati */
    box-shadow: 0 10px 20px rgba(240, 98, 146, 0.4); /* Ombreggiatura rosa */
    padding: 15px; /* Ridotto il padding */
    overflow: hidden; /* Evita traboccamenti */
    white-space: nowrap; /* Evita che il testo vada a capo */
    display: inline-block; /* Adattamento al contenuto */
}

.dr-node.elaborate-string-node label {
    display: flex;
    align-items: center;
    font-size: 2rem; /* Dimensione più grande in rem */
    background-color: #EC407A; /* Rosa acceso per la label */
    color: #fff; /* Colore del testo della label */
    padding: 10px; /* Aumentato il padding */
    border-radius: 15px; /* Bordi arrotondati per la label */
}
.dr-node.alert-node.alert-success {
    background-color: #98FB98; /* Verde chiaro */
}

.dr-node.alert-node.alert-info {
    background-color: #B0E0E6; /* Azzurro chiaro */
}

.dr-node.alert-node.alert-warning {
    background-color: #FFD700; /* Giallo chiaro */
}

.dr-node.alert-node.alert-error {
    background-color: #FF6347; /* Rosso chiaro */
}

.dr-node.alert-node {
    border-radius: 20px; /* Bordi arrotondati */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4); /* Ombreggiatura pronunciata */
    padding: 15px; /* Ridotto il padding */
    overflow: hidden; /* Evita traboccamenti */
    white-space: nowrap; /* Evita che il testo vada a capo */
    display: inline-block; /* Adattamento al contenuto */
}

.dr-node.alert-node.alert-success label {
    background-color: #228B22; /* Verde scuro per la label */
    color: #fff; /* Colore del testo della label */
}

.dr-node.alert-node.alert-info label {
    background-color: #4682B4; /* Azzurro scuro per la label */
    color: #fff; /* Colore del testo della label */
}

.dr-node.alert-node.alert-warning label {
    background-color: #FFA500; /* Arancione scuro per la label */
    color: #fff; /* Colore del testo della label */
}

.dr-node.alert-node.alert-error label {
    background-color: #B22222; /* Rosso scuro per la label */
    color: #fff; /* Colore del testo della label */
}

.dr-node.alert-node label {
    display: flex;
    align-items: center;
    font-size: 2rem; /* Dimensione più grande in rem */
    padding: 10px; /* Aumentato il padding */
    border-radius: 15px; /* Bordi arrotondati per la label */
}

.dr-node.goto-node {
    background-color: #FFB6C1; /* Rosa chiaro */
    /*border: 4px solid #8B0000;*/ /* Bordo rosso scuro */
    border-radius: 20px; /* Bordi arrotondati */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4); /* Ombreggiatura più pronunciata */
    padding: 15px; /* Ridotto il padding */
    overflow: hidden; /* Evita traboccamenti */
    white-space: nowrap; /* Evita che il testo vada a capo */
    display: inline-block; /* Adattamento al contenuto */
}

.dr-node.goto-node label {
    display: flex;
    align-items: center;
    font-size: 2rem; /* Dimensione più grande in rem */
    background-color: #CD5C5C; /* Rosso più scuro per la label */
    color: #fff; /* Colore del testo della label */
    padding: 10px; /* Aumentato il padding */
    border-radius: 15px; /* Bordi arrotondati per la label */
}
.dr-node.element-nodexx {
    background-color: #87CEEB; /* Azzurro cielo */
    /*border: 4px solid #4682B4;*/ /* Bordo blu acciaio */
    border-radius: 20px; /* Bordi arrotondati */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4); /* Ombreggiatura più pronunciata */
    padding: 15px 30px; /* Aumentato il padding laterale */
    overflow: hidden; /* Evita traboccamenti */
    white-space: nowrap; /* Evita che il testo vada a capo */
    display: flex; /* Utilizza flexbox */
    justify-content: center; /* Centra orizzontalmente */
    align-items: center; /* Centra verticalmente */
    transform: rotate(45deg); /* Rotazione di 45 gradi */
    width: 160px; /* Larghezza del nodo */
    height: 160px; /* Altezza del nodo */
    position: absolute; /* Posizionamento assoluto */
    left: 50%; /* Centra orizzontalmente */
    top: 50%; /* Centra verticalmente */
    transform: translate(-50%, -50%) rotate(45deg); /* Centra e ruota */
}

.dr-node.element-nodexx label {
    display: flex;
    align-items: center;
    font-size: 2rem; /* Dimensione più grande in rem */
    background-color: #4682B4; /* Blu acciaio */
    color: #fff; /* Colore del testo della label */
    padding: 10px; /* Aumentato il padding */
    border-radius: 15px; /* Bordi arrotondati per la label */
    transform: rotate(-45deg); /* Rotazione inversa per il contenuto */
}
.dr-node.element-node {
    background-color: #87CEEB; /* Azzurro cielo */
    /*border: 4px solid #4682B4;*/ /* Bordo blu acciaio */
    border-radius: 20px; /* Bordi arrotondati */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4); /* Ombreggiatura più pronunciata */
    padding: 15px 30px; /* Aumentato il padding laterale */
    overflow: hidden; /* Evita traboccamenti */
    white-space: nowrap; /* Evita che il testo vada a capo */
    display: inline-block; /* Utilizza flexbox */    
}

.dr-node.element-node label {
    display: flex;
    align-items: center;
    font-size: 2rem; /* Dimensione più grande in rem */
    background-color: #4682B4; /* Blu acciaio */
    color: #fff; /* Colore del testo della label */
    padding: 10px; /* Aumentato il padding */
    border-radius: 15px; /* Bordi arrotondati per la label */
}

.dr-node.value-node {
    background-color: #87CEEB; /* Azzurro cielo */
    /*border: 4px solid #4682B4;*/ /* Bordo blu acciaio */
    border-radius: 20px; /* Bordi arrotondati */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4); /* Ombreggiatura più pronunciata */
    padding: 15px; /* Ridotto il padding */
    overflow: hidden; /* Evita traboccamenti */
    white-space: nowrap; /* Evita che il testo vada a capo */
    display: inline-block; /* Adattamento al contenuto */
}

.dr-node.value-node ul {
    list-style-type: none; /* Rimuove i punti elenco */
    padding: 0; /* Rimuove il padding */
    margin: 0; /* Rimuove il margine */
}

.dr-node.value-node li {
    font-size: 2rem; /* Dimensione del testo */
    background-color: #4682B4; /* Blu acciaio */
    color: #fff; /* Colore del testo */
    padding: 10px; /* Padding per gli elementi della lista */
    border-radius: 10px; /* Bordi arrotondati per gli elementi della lista */
    margin-bottom: 5px; /* Spazio tra gli elementi della lista */
}

.dr-node.value-node.otherwise-node li:before {
    content: "\f03a";
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    padding-right: 5px;
    padding-left: 5px;
}

.dr-node.formula-node {
    background-color: #FFA07A; /* Arancione chiaro */
    border-radius: 20px; /* Bordi arrotondati */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.4); /* Ombreggiatura pronunciata */
    padding: 15px; /* Ridotto il padding */
    overflow: hidden; /* Evita traboccamenti */
    white-space: nowrap; /* Evita che il testo vada a capo */
    display: inline-block; /* Adattamento al contenuto */
}

.dr-node.formula-node label {
    display: flex;
    align-items: center;
    font-size: 2rem; /* Dimensione più grande in rem */
    background-color: #FF4500; /* Arancione scuro per la label */
    color: #fff; /* Colore del testo della label */
    padding: 10px; /* Aumentato il padding */
    border-radius: 15px; /* Bordi arrotondati per la label */
}

.expand-collapse-btn {
    margin-left: auto;
    cursor: pointer;
    font-size: 1.5rem; /* Dimensione del bottone */
    color: #fff;
}

.dr-node br {
    display: block;
}

.tabulator-data-tree-control{
    width: 15px !important;
    height: 15px !important;
    border: 1px solid black !important;
}
.tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-expand {
    background-color: black;
}
.tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-expand:after {
    background-color: black;
}
.tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-collapse:after {
    background-color: black;
}
[bb-element-name="DiagramsObjectsForAssign"] .bb-grid,
[bb-element-name="FormuleListNumerics"] .bb-grid,
[bb-element-name="FormuleOperands"] .bb-grid,
[bb-element-name="FormuleFunctions"] .bb-grid{
    height: 20vw !important;
    max-height: unset !important;    
}
[bb-element-name="FormuleOperands"] .tabulator-tableholder,
[bb-element-name="FormuleFunctions"] .tabulator-tableholder {
    overflow-x:hidden;
}
[bb-element-name="FormuleResult"] textarea {
    min-height: 20vh;
}

.dropdown-item {
    font-family: Roboto, sans-serif !important;
    font-weight: 400 !important;
}
.tabulator-edit-list-item {
    min-height: 21px;
}