/* datepicker */
.p-datepicker-panel {
    background: var(--input-background) !important;
    border: 1px solid var(--input-border-color) !important;
    z-index: 2147483642 !important;
}

.p-datepicker-calendar-container button {
    padding: 0 !important;
}

.p-datepicker-header {
    background: var(--input-background) !important;
    border: none !important;
}

.p-datepicker-title {
    font-size: 1.2rem !important;
    font-weight: 600 !important;
}

.p-datepicker-title button {
    padding: 0 !important;
    color: var(--input-text-color) !important;
}

.p-select-dropdown .p-icon,
.p-multiselect-dropdown .p-icon,
.p-datepicker-calendar .p-icon {
    width: 12px !important;
    height: 12px !important;
}

.p-datepicker-weekday {
    color: var(--text) !important;
}

.p-datepicker-day {
    color: var(--input-text-color) !important;
    width: 25px !important;
    height: 25px !important;
    border-radius: 6px !important;
    background: transparent !important;
}

.p-datepicker-day-selected {
    background: var(--primary) !important;
    color: var(--primary-text) !important;
}

.p-datepicker-day-selected-range {
    color: var(--primary) !important;
    background: var(--secondary-background) !important;
}

.p-datepicker-day-cell{
    padding: 3px !important;
}

.p-datepicker-title,
.p-datepicker-year,
.p-datepicker-month {
    color: var(--input-text-color) !important;
}

.input-group-wrapper {
    position: relative;
    align-items: center;
}

.input-group-wrapper .p-select {
    width: 130px;
}

.input-group-wrapper .p-select.code {
    width: 110px !important;
    flex-shrink: 0;
}

@media screen and (max-width: 376px) { 
    .input-group-wrapper .p-select.code {
        width: 90px !important;
    }
}

.input-group-wrapper .p-select.code img {
    width: var(--icon-width);
    height:  var(--icon-height);
}

.input-group-wrapper .p-component.input-right {
    border-top-right-radius: var(--input-border-radius);
    border-bottom-right-radius: var(--input-border-radius);
}

.input-addon {
    position: relative;
}

.input-addon i,
.input-addon .icon-image {
    position: absolute;
    transform: translateY(-50%);
	top: 50%;
    left: 12px;
    z-index: 10;
}

.input-addon .p-inputtext {
    padding-left: 36px;
}

.input-addon.right i {
    left: unset;
    right: 12px;
}

.input-addon.right .p-inputtext {
    padding-left: 12px;
    padding-right: 36px;
}

.input-addon.left-right i.left {
    left: 12px;
    right: unset;
}

.input-addon.left-right i.right {
    left: unset;
    right: 12px;
}

.input-addon.left-right .p-inputtext {
    padding-left: 36px;
    padding-right: 36px;
}

.input-addon .loader-holder {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    display: flex;
}

.input-addon .loader-holder i {
    transform: unset;
    position: unset;

}

i.loader.no-bg {
    background: unset;
    z-index: 10;
}

/* select language */
.select-language .p-select-label{
    padding: 6px 0px 6px 8px;
}

.select-language .p-select-dropdown {
    width: 22px;
}

.p-multiselect-label {
    flex-wrap: wrap;
}

.p-chip-label {
    font-size: 0.75rem;
}

/* checkbox */
.p-checkbox-checked .p-checkbox-box {
    border: none;
}

.p-checkbox-checked .p-checkbox-icon {
    color: var(--primary-text);
}

.p-toggleswitch:not(.p-disabled):has(.p-toggleswitch-input:hover).p-toggleswitch-checked .p-toggleswitch-slider {
    background-color: var(--primary);
}

/* radio */
.p-radiobutton-checked .p-radiobutton-box {
    border: none;
}

.p-radiobutton-checked .p-radiobutton-box .p-radiobutton-icon {
    background: var(--primary-text);
}

/* select */
.p-select-option.p-select-option-selected.p-focus {
    color: var(--primary);
    background: var(--primary-light);
}

.p-multiselect-overlay,
.p-select-overlay {
    border: 1px solid var(--line) !important;
    background: var(--select-overlay) !important;
}

.p-select-option,
.p-select-option:not(.p-select-option-selected):not(.p-disabled).p-focus,
.p-multiselect-option,
.p-multiselect-option:not(.p-multiselect-option-selected):not(.p-disabled).p-focus {
    color: var(--select-option-text) !important;
}

.p-datepicker-select-month:enabled:hover,
.p-datepicker-select-year:enabled:hover,
.p-datepicker-month:not(.p-disabled):not(.p-datepicker-month-selected):hover,
.p-datepicker-year:not(.p-disabled):not(.p-datepicker-year-selected):hover,
.p-select-option:not(.p-select-option-selected):not(.p-disabled).p-focus,
.p-select-option.p-select-option-selected.p-focus,
.p-multiselect-option:not(.p-multiselect-option-selected):not(.p-disabled).p-focus,
.p-multiselect-option.p-select-option-selected.p-focus {
    background: var(--select-option-selected-background) !important;
}

.p-select-option:not(.p-select-option-selected):not(.p-disabled).p-focus i,
.p-select-option.p-select-option-selected.p-focus i {
    background-image: var(--nav-item-icon-hover) !important;
}

.p-multiselect-empty-message,
.p-select-empty-message {
    color: var(--select-option-text);
}

.category-select .selected-label {
    color: var(--select-option-text);
}

.category-select .selected-label .selected {
    color: var(--primary);
}

/* toggle switch */
.p-toggleswitch-slider {
    border: 1px solid #c1c1c4;
    background: #c1c1c4;
}

.p-toggleswitch.p-toggleswitch-checked .p-toggleswitch-handle {
    background: var(--primary-background);
}

.p-toggleswitch:not(.p-disabled):has(.p-toggleswitch-input:hover).p-toggleswitch-checked .p-toggleswitch-slider {
    background-color: #9d9d9d;
}

/* upload */
.p-fileupload-advanced {
    background-color: var(--input-background);
    border-color: var(--line);
    color: var(--text);
}

/* handle for after disabled layer */
.p-inputtext {
    font-family: inherit;
    font-feature-settings: inherit;
    font-size: 1rem;
    color: var(--p-inputtext-color);
    background: var(--p-inputtext-background);
    padding-block: var(--p-inputtext-padding-y);
    padding-inline: var(--p-inputtext-padding-x);
    border: 1px solid var(--p-inputtext-border-color);
    transition: background var(--p-inputtext-transition-duration), color var(--p-inputtext-transition-duration), border-color var(--p-inputtext-transition-duration), outline-color var(--p-inputtext-transition-duration), box-shadow var(--p-inputtext-transition-duration);
    appearance: none;
    border-radius: var(--p-inputtext-border-radius);
    outline-color: transparent;
    box-shadow: var(--p-inputtext-shadow);
}

.p-inputtext.p-variant-filled {
    background: var(--input-background) !important;
    color: var(--input-text-color) !important;
}

.p-select {
    display: inline-flex;
    cursor: pointer;
    position: relative;
    user-select: none;
    background: var(--p-select-background);
    border: 1px solid var(--p-select-border-color);
    transition: background var(--p-select-transition-duration), color var(--p-select-transition-duration), border-color var(--p-select-transition-duration), outline-color var(--p-select-transition-duration), box-shadow var(--p-select-transition-duration);
    border-radius: var(--p-select-border-radius);
    outline-color: transparent;
    box-shadow: var(--p-select-shadow);
}

.p-checkbox-input {
    cursor: pointer;
    appearance: none;
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    opacity: 0;
    z-index: 1;
    outline: 0 none;
    border: 1px solid transparent;
    border-radius: var(--p-checkbox-border-radius);
}