/*
* name: fab-no-shadow
* for:  BUTTONTYPE=fab/minifab
* description: disable shadow
*/

/*
* name: fab-no-circle
* for:  BUTTONTYPE=fab/minifab
* description: square
*/
.fab-no-circle button {
    border-radius: 0px;
}

/*
* name: btn-no-padding
* for: button
* description:
*/

/*
* name: tab-no-padding
* for: tab
* description:
*/

/*
* name: btn-disabled-white
* for:  button
* description:
*/
.btn-disabled-white button.mat-mdc-button-disabled {
    background-color: #ffffff1f !important;
    color: #ffffff42 !important;
}

/*
* name: btn-menuleft-rounded
* for:  button
* description: used for box button fusion
*/
.btn-menuleft-rounded-container {
    padding-left: 0;
}
.btn-menuleft-rounded button {
    border-radius: 0 50px 50px 0;
}

/*
* name: btn-menuright-rounded
* for:  button
* description: used for box button fusion
*/
.btn-menuright-rounded-container {
    padding-right: 0;
}
.btn-menuright-rounded button {
    border-radius: 50px 0 0 50px;
}

/*
* name: no-padding
* for:  controlset GROUPTYPE=ROW
        radiobuttons WITHBORDERS
* description: reset padding
*/
.no-padding-container.uitype_controlset {
    column-gap: 0;
}
.no-padding-container:not(.uitype_controlset) {
    padding: 0;
}
.uitype_controlset .no-padding {
    padding: 0;
}

/*
* name: no-margin
* for:  controlset
* description: reset margin top
*/
.no-margin-container.uitype_controlset .no-margin {
    margin-top: 0px !important;
}

/*
* name: dropdown-silent
* for:  dropdown (used also for dropdonw in calendar component)
* description: hides everything other than the dropdown value
               and aligns the value to the center
*/
.dropdown-silent {
    .ng-select {
        .ng-input,
        .ng-clear-wrapper,
        .ng-arrow-wrapper,
        .ng-select-container:after {
            display: none;
        }

        .ng-value-container {
            justify-content: center;
        }
    }
}

/*
* name: calendar-primary-color
* for:  calendar component
* description: primary color based
*/

.calendarMainBody.calendar-primary-color {
    .calendarActionBar {
        background-color: var(--primary-color-100) !important;
    }

    .mat-icon {
        color: var(--primary-color-contrast-100);
    }

    .rdwrCalendar {
        .rdwrCalendar_body {
            .cal-cell {
                &.cal-day-cell.cal-today {
                    background-color: var(--primary-color-100) !important;
                }
            }
        }
    }
}
