@import url("../../variables/_colors.css");

.norma--new__light-theme {
    background-color: var(--norma__bg-light);
}

    .norma--new__light-theme .norma--input {
        background-color: var(--norma__input--bg-light);
        color: var(--norma__tx-light);
        border: 0.5px solid var(--norma__input--border-light);
    }

        .norma--new__light-theme .norma--input.norma--error {
            border: 0.5px solid var(--norma--danger);
        }

            .norma--new__light-theme .norma--input.norma--error ~ .norma--error-msg {
                color: var(--norma--danger);
            }

        .norma--new__light-theme .norma--input:focus {
            border: 0.5px solid var(--norma-secondary--1);
        }

        .norma--new__light-theme .norma--input::placeholder {
            color: var(--norma__placeholder-light);
        }

        .norma--new__light-theme .norma--input:disabled {
            border: 0.5px solid var(--norma__input-disabled--border-light);
            background-color: var(--norma__input-disabled--bg-light);
            color: var(--norma__tx-disabled-light);
        }

            .norma--new__light-theme .norma--input:disabled::placeholder {
                color: var(--norma__placeholder-disabled-light);
            }

    .norma--new__light-theme .norma--floating-input > label {
        background-color: var(--norma__input--bg-light);
        color: var(--norma__lbl-light);
    }

    .norma--new__light-theme .norma--input:disabled ~ label {
        background-color: var(--norma__input-disabled--bg-light);
        color: var(--norma__lbl-disabled-light);
    }

    .norma--new__light-theme .rz-timepicker .rz-spinner-button {
        background-color: var(--norma-secondary--1) !important;
    }

    .norma--new__light-theme .rz-datepicker-calendar th {
        background-color: var(--norma__neutral--light-blue);
    }

    .norma--new__light-theme .norma--input > div > .rz-calendar > .rz-calendar-button > .rz-button-icon-left::before {
        background-color: var(--norma__input--bg-light) !important;
    }

    .norma--new__light-theme .rz-datepicker-calendar td .rz-state-active:hover {
        background-color: var(--norma__input--bg-dark) !important;
    }

    .norma--new__light-theme .rz-datepicker-calendar td .rz-state-default:hover {
        background-color: var(--norma__input--bg-dark) !important;
    }

    .norma--new__light-theme.rz-datepicker-calendar td .rz-state-active {
        background-color: var(--norma-secondary--1) !important;
    }

.norma--action-chip {
    background-color: var(--norma__neutral--light);
    border: none;
}

.norma_dropdown .norma--action-chip {
    background-color: white;
    border-color: var(--norma__neutral--light);
}

    .norma_dropdown .norma--action-chip.transparent--drop {
        background-color: transparent;
    }

.norma_dropdown .dropdown-item {
    color: #465978 !important;
    font-weight: var(--norma--fw-light);
}

    .norma_dropdown .dropdown-item.panel_show {
        background-color: transparent;
    }

    .norma_dropdown .dropdown-item.panel_hidden {
        background-color: var(--norma__neutral--grey-3);
    }

.norma_dropdown .dropdown-menu {
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 3px;
}

.norma--action-chip.normaa--chip__active .norma--action-chip-icon img {
    filter: invert(64%) sepia(20%) saturate(1283%) hue-rotate(89deg) brightness(89%) contrast(93%);
}

.norma--action-chip:hover {
    background-color: var(--norma__neutral--grey-3);
}

.norma_dropdown .dropdown-item:hover, .norma_dropdown .dropdown-item.active, .norma_dropdown .dropdown-item:active {
    background-color: var(--norma-secondary--5);
}


/*    .norma--action-chip:not(.normaa--chip__clicked):hover .norma--action-chip-icon img, .norma_dropdown .dropdown-item:hover img {
        filter: invert(64%) sepia(20%) saturate(1283%) hue-rotate(89deg) brightness(89%) contrast(93%);
    }*/

.norma_dropdown.no-filter-img .dropdown-item:hover img {
    filter: none;
}

.norma--action-chip.normaa--chip__clicked {
    background-color: var(--norma-primary--2);
}

    .norma--action-chip.normaa--chip__clicked .norma--action-chip-icon img {
/*        filter: invert(64%) sepia(20%) saturate(1283%) hue-rotate(89deg) brightness(89%) contrast(93%);
*/    }

.norma--action-chip .norma--action-chip-text > p {
    color: var(--norma__neutral--grey-1);
}

.norma--action-chip-number {
    background-color: var(--norma__neutral--grey-3);
}

.norma--special-action-chip .norma--action-chip-text > p {
    color: var(--norma__neutral--grey-3);
}

.norma--special-action-chip {
    background-color: var(--norma-secondary--1) !important;
}

    .norma--special-action-chip:hover {
        background-color: var(--norma-secondary--1) !important;
    }

    .norma--special-action-chip .norma--action-chip-icon img {
        filter: invert(63%) sepia(24%) saturate(42%) hue-rotate(279deg) brightness(247%) contrast(75%);
    }

    .norma--special-action-chip:hover .norma--action-chip-icon img {
        filter: invert(63%) sepia(24%) saturate(42%) hue-rotate(279deg) brightness(247%) contrast(75%);
    }

.norma_panel_controlicon:hover {
    background: var(--norma__neutral--grey-3);
}

.norma--radzen-custom-dp .rz-dropdown, .norma--radzen-custom-dp .rz-dropdown:hover {
    border: 0.5px solid var(--norma__neutral--light-blue) !important;
    box-shadow: none !important;
}

.norma--radzen-custom-dp .rz-multiselect-label-container, .rz-dropdown-label {
    color: var(--norma__neutral--light-blue) !important;
}

.rz-multiselect-panel, .rz-dropdown-panel {
    background-color: rgb(242, 241, 241);
    color: rgb(1, 1, 1);
    z-index: 20000000000000000000 !important;
}

.norma--radzen-custom-dp .rz-dropdown-chips .rz-chip {
    background: var(--norma-primary--2);
}

.rz-dropdown-item.rz-state-highlight, .rz-state-highlight.rz-menuitem, .rz-state-highlight.rz-autocomplete-list-item, .rz-state-highlight.rz-multiselect-item, .rz-dropdown-items li.rz-state-highlight, .rz-autocomplete-items li.rz-state-highlight, .rz-multiselect-items li.rz-state-highlight, .rz-dropdown-item:hover, .rz-menuitem:hover, .rz-autocomplete-list-item:hover, .rz-multiselect-item:hover, .rz-dropdown-items li:hover, .rz-autocomplete-items li:hover, .rz-multiselect-items li:hover, .rz-dropdown-item.rz-state-highlight:hover, .rz-state-highlight.rz-menuitem:hover, .rz-state-highlight.rz-autocomplete-list-item:hover, .rz-state-highlight.rz-multiselect-item:hover, .rz-dropdown-items li.rz-state-highlight:hover, .rz-autocomplete-items li.rz-state-highlight:hover, .rz-multiselect-items li.rz-state-highlight:hover {
    background-color: var( --norma-secondary--5);
    color: rgb(1, 1, 1);
}

.rz-chkbox-box.rz-state-active {
    background-color: var(--norma__neutral--light-blue);
    border: 1px solid var(--norma__neutral--grey-7);
}

.rz-chkbox-box {
    border: 1px solid var(--norma__neutral--grey-7);
}

.norma--number-control-wrap {
    background: var( --norma__neutral--light);
    border: 1px solid var(--norma__neutral--light-blue);
}

    .norma--number-control-wrap .right-minus-control-border {
        border-inline-end: 1px solid var(--norma__neutral--light-blue);
    }

.norma--input-select-element {
    background-color: var( --norma__neutral--light);
}

    .norma--input-select-element:focus + .norma--input-select-label, .norma--input-select-element:invalid + .norma--input-select-label, .norma--input-select-element.norma--selected + .norma--input-select-label {
        color: var(--norma__neutral--light-blue);
        background: var(--norma__neutral--light);
    }

.norma--cutom-range-date {
    border: 0.5px solid var(--norma__neutral--light-blue) !important;
}

    .norma--cutom-range-date input {
        color: var(--norma__neutral--light-blue) !important;
    }

        .norma--cutom-range-date input[type="date"]::-webkit-calendar-picker-indicator {
            background: transparent;
            color: transparent;
        }

.norma--tooltip {
    background-color: var(--norma__neutral--light);
    box-shadow: 0px 3px 6px var(--norma-shadow--grey-1);
    color: var(--norma__neutral--grey-1);
}

[data-title]::after {
    background-color: var(--norma__neutral--light);
    box-shadow: 0px 3px 6px var(--norma-shadow--grey-1);
    color: var(--norma__neutral--grey-1);
}

body div.modal ::-webkit-scrollbar-thumb, div.rz-multiselect-panel::-webkit-scrollbar-thumb, div.rz-dropdown-panel.rz-popup::-webkit-scrollbar-thumb, div.rz-multiselect-items-wrapper::-webkit-scrollbar-thumb, div.rz-dropdown-items-wrapper::-webkit-scrollbar-thumb, div.rz-multiselect-items-wrapper::-webkit-scrollbar-thumb {
    background: var(--norma__neutral--light-blue) !important;
}