:root {

    /* GENERALS */
    --primary-text-color: #000000;
    --primary-background-color: #e6e6e6;

	/* HOVER COLOR */
	--hover-color: #4338ca40;

    /* COLORS */
    --primary-color: #4F46E5;
    --secondary-color: #64748B;
    --info-color: #3B82F6;
    --success-color: #22C55E;
    --warning-color: #F59E0B;
    --danger-color: #EF4444;

    /* BUTTONS */
    --button-primary-color-hover: #4338CA;
    --button-secondary-color-hover: #475569;
    --button-info-color-hover: #2563EB;
    --button-success-color-hover: #16A34A;
    --button-warning-color-hover: #D97706;
    --button-danger-color-hover: #DC2626;

    /* TOASTS */
    --toast-box-shadow-color: #1f26875e;
    --toast-primary-background-color: #c1d3f0;
    --toast-secondary-background-color: #c1d3f0;
    --toast-info-background-color: #c1d3f0;
    --toast-success-background-color: #bbe3ca;
    --toast-warning-background-color: #efdab5;
    --toast-danger-background-color: #eec3c3;

    /* CHECKBOX */
    --cf-checkbox-check-border-color: #757575;
    --cf-checkbox-check-background-color: #FFFFFF;
    --cf-checkbox-check-icon-color: #FFFFFF;
	--cf-checkbox-label-color: #000000;

    --cf-checkbox-focused-label-color: #6366f1;

    --cf-checkbox-checked-check-border-color: #3F51B5;
    --cf-checkbox-checked-check-background-color: #3F51B5;
    --cf-checkbox-checked-check-icon-color: #FFFFFF;

    --cf-checkbox-disabled-check-background-color: #ACACAC;

    --cf-checkbox-readonly-background-color: #ededed;

	--cf-checkbox-border-color-focused: #4f46e5;

    /* FLOATING LABEL */
    --floating-label-color: #a7a7a7;
    --floating-label-float-color: #3f3f46;
    --floating-label-float-background-color: #ffffff;
    --floating-label-float-border-color: #d4d4d8;

    /* INPUT CONTAINER */
    --input-container-background-color: #ffffff;
    --input-container-border-color: #d4d4d8;
    --input-container-background-color-invalid: #ffb8b89c;
    --input-container-border-color-invalid: #f50000;
    --input-container-background-color-disabled: #dbdbdb;
    --input-container-border-color-disabled: #d4d4d8;
    --input-container-border-color-focused: #4f46e5;
    --input-color: #3f3f46;

    --input-prefix-color: #3f3f3f;
    --input-prefix-background-color: #e9e9e9;
    
    --input-suffix-color: #3f3f3f;
    --input-suffix-background-color: #e9e9e9;

    --input-clear-color: #f90000;
    --input-clear-background-color: none;

    --input-open-color: #3f3f3f;
    --input-open-background-color: none;

    --input-separator-color: #e3dcdc;

    /* MEDIA MANAGER */
    --media-manager-color: #3f3f46;
    --media-manager-dropzone-background-color: #74b9ff;
    --media-manager-dropzone-border-color: #0984e3;
    --media-manager-dropzone-text-color: #ffffff;
    --media-manager-info-background-color: #ffffffe6;
    --media-manager-free-space-border-color: #22C55E;
    --media-manager-free-space-line-background-color: #22c55e80;
    --media-manager-item-background-color: #3f3f461a;

    /* RADIO */
    --radio-border-color: #757575;
	--radio-label-text-color: var(--primary-text-color);
    --radio-background-color: #ffffff;
    --radio-checked-background-color: #3F51B5;
    --radio-checked-border-color: #3F51B5;
    --radio-checked-icon-color: #ffffff;
	--radio-border-color-focused: #4f46e5;

    /* DATETIMEPICKER */
    --datetimepicker-background-color: #ffffff;
    --datetimepicker-border-color: #d4d4d8;
    --datetimepicker-text-color: var(--primary-text-color);
    --datetimepicker-year-and-month-border-color: #d4d4d8;
    --datetimepicker-dates-background-color: #d4d4d8;
    --datetimepicker-date-background-color: #ffffff;
    --datetimepicker-date-hover-background-color: #24242420;
    --datetimepicker-date-hover-text-color: #ffffff;
    --datetimepicker-date-today-background-color: #24242450;
    --datetimepicker-date-today-text-color: #ffffff;
    --datetimepicker-date-othermonth-background-color: #f1f1f1;
    --datetimepicker-date-othermonth-text-color: #c1c1c1;
    --datetimepicker-date-selected-background-color: #6366f1;
    --datetimepicker-date-selected-text-color: #ffffff;

    /* SWITCH */
    --switch-background-color: #ffffff;
    --switch-border-color: #d4d4d8;
    --switch-dot-background-color: #d7d7d7;
    --switch-background-color-checked: #4F46E5;
    --switch-border-color-checked: #d4d4d8;
    --switch-dot-background-color-checked: #ffffff;
    --switch-label-color: var(--primary-text-color);

    --switch-background-color-invalid: #ffb8b89c;
    --switch-border-color-invalid: #f50000;
    --switch-dot-background-color-invalid: #f50000;

    --switch-background-color-disabled: #dbdbdb;
    --switch-border-color-disabled: #d4d4d8;
	--switch-border-color-focused: #4f46e5;
    --switch-dot-background-color-disabled: #dbdbdb;

    /* DIALOG */
    --dialog-container-background-color: #00000080;
    --dialog-background-color: #ffffff;
    --dialog-text-color: #000000;

	/* FIELDSET */
	--fieldset-border-color: #d4d4d8;
	--fieldset-title-color: var(--primary-text-color);

	/* TABVIEW */
	--tabview-header-background: var(--primary-background-color);
	--tabview-header-item-background: var(--primary-background-color);
	--tabview-header-item-text-color: #71717A;
	--tabview-header-item-disabled-text-color: #CDCDCD;
	--tabview-header-items-background: linear-gradient(to bottom, white 36px, #ccc 20px);

	/* TABPANEL */
	--tabpanel-disabled-background: var(--primary-background-color);
	--tabpanel-disabled-content-text-color: var(--primary-text-color);

	/* PROGRESSBAR */
	--progressbar-background: #e5e7eb;
	--progressbar-text-color: yellow;

	/* DROPDOWN */
	--dropdown-items-background: #ffffff;
	--dropdown-items-border-color: #d4d4d8;
	--dropdown-item-text-color: var(--primary-text-color);

	/* AUTOCOMPLETE */
	--autocomplete-items-background: #ffffff;
	--autocomplete-items-border-color: #d4d4d8;
	--autocomplete-item-text-color: var(--primary-text-color);

	/* TREE */
	--tree-label-text-color: var(--primary-text-color);
}


@media (prefers-color-scheme: dark) {

    :root {

		/* GENERALS */
		--primary-text-color: #ffffff;
		--primary-background-color: #2c2c2c;
	
		/* HOVER COLOR */
		--hover-color: #4338ca40;
	
		/* CHECKBOX */
		--cf-checkbox-check-border-color: #757575;
		--cf-checkbox-check-background-color: #FFFFFF;
		--cf-checkbox-check-icon-color: #FFFFFF;
		--cf-checkbox-label-color: #FFFFFF;
	
		--cf-checkbox-focused-label-color: #6366f1;
	
		--cf-checkbox-checked-check-border-color: #3F51B5;
		--cf-checkbox-checked-check-background-color: #3F51B5;
		--cf-checkbox-checked-check-icon-color: #FFFFFF;
	
		--cf-checkbox-disabled-check-background-color: #ACACAC;
	
		--cf-checkbox-readonly-background-color: #ededed;
	
		--cf-checkbox-border-color-focused: #4f46e5;
	
		/* FLOATING LABEL */
		--floating-label-color: #dfdfdf;
		--floating-label-float-color: #c3c3c3;
		--floating-label-float-background-color: #555555;
		--floating-label-float-border-color: #a1a1a1;
	
		/* INPUT CONTAINER */
		--input-container-background-color: #5353539c;
		--input-container-border-color: #232323;
		--input-container-background-color-invalid: #2d00009c;
		--input-container-border-color-invalid: #a74a4a;
		--input-container-background-color-disabled: #2929299c;
		--input-container-border-color-disabled: #3d3d3d;
		--input-container-border-color-focused: #4f46e5;
		--input-color: #dfdfdf;
	
		--input-prefix-color: #e7e7e7;
		--input-prefix-background-color: #6b6b6b;
		
		--input-suffix-color: #e7e7e7;
		--input-suffix-background-color: #6b6b6b;
	
		--input-clear-color: #ffffff;
		--input-clear-background-color: none;
	
		--input-open-color: #ffffff;
		--input-open-background-color: none;
	
		--input-separator-color: #393939;
	
		/* MEDIA MANAGER */
		--media-manager-color: #dfdfdf;
		--media-manager-dropzone-background-color: #74b9ff;
		--media-manager-dropzone-border-color: #0984e3;
		--media-manager-dropzone-text-color: #ffffff;
		--media-manager-info-background-color: #ffffffe6;
		--media-manager-free-space-border-color: #22C55E;
		--media-manager-free-space-line-background-color: #22c55e80;
		--media-manager-item-background-color: #c5c5c51a;
	
		/* RADIO */
		--radio-border-color: #757575;
		--radio-label-text-color: var(--primary-text-color);
		--radio-background-color: #ffffff;
		--radio-checked-background-color: #3F51B5;
		--radio-checked-border-color: #3F51B5;
		--radio-checked-icon-color: #ffffff;
		--radio-border-color-focused: #4f46e5;
	
		/* DATETIMEPICKER */
		--datetimepicker-background-color: #4d4d4d;
		--datetimepicker-border-color: #313131;
		--datetimepicker-text-color: var(--primary-text-color);
		--datetimepicker-year-and-month-border-color: #d4d4d8;
		--datetimepicker-dates-background-color: #d4d4d8;
		--datetimepicker-date-background-color: #696969;
		--datetimepicker-date-hover-background-color: #24242420;
		--datetimepicker-date-hover-text-color: #ffffff;
		--datetimepicker-date-today-background-color: #24242450;
		--datetimepicker-date-today-text-color: #ffffff;
		--datetimepicker-date-othermonth-background-color: #f1f1f1;
		--datetimepicker-date-othermonth-text-color: #c1c1c1;
		--datetimepicker-date-selected-background-color: #6366f1;
		--datetimepicker-date-selected-text-color: #ffffff;
	
		/* SWITCH */
		--switch-background-color: #4d4d4d;
		--switch-border-color: #313131;
		--switch-dot-background-color: #8b8b8b;
		--switch-background-color-checked: #6366f1;
		--switch-border-color-checked: #6366f1;
		--switch-border-color-focused: #4f46e5;
		--switch-dot-background-color-checked: #ffffff;
		--switch-label-color: var(--primary-text-color);
	
		--switch-background-color-invalid: #2d00009c;
		--switch-border-color-invalid: #a74a4a;
		--switch-dot-background-color-invalid: #f5000091;
	
		--switch-background-color-disabled: #2929299c;
		--switch-border-color-disabled: #232323;
		--switch-dot-background-color-disabled: #2929299c;
	
		/* DIALOG */
		--dialog-container-background-color: #5353539c;
		--dialog-background-color: #232323;
		--dialog-text-color: #ffffff;
	
		/* FIELDSET */
		--fieldset-border-color: #232323;
		--fieldset-title-color: var(--primary-text-color);
		
		/* TABVIEW */
		--tabview-header-background: var(--primary-background-color);
		--tabview-header-item-background: var(--primary-background-color);
		--tabview-header-item-text-color: var(--primary-text-color);
		--tabview-header-item-disabled-text-color: #8b8b8b;
		--tabview-header-items-background: linear-gradient(to bottom, var(--primary-background-color) 36px, #232323 20px);
	
		/* TABPANEL */
		--tabpanel-disabled-background: var(--primary-background-color);
		--tabpanel-disabled-content-text-color: var(--primary-text-color);
	
		/* PROGRESSBAR */
		--progressbar-background: #4d4d4d;
		--progressbar-text-color: #ffffff;
	
		/* DROPDOWN */
		--dropdown-items-background: #4d4d4d;
		--dropdown-items-border-color: #313131;
		--dropdown-item-text-color: var(--primary-text-color);
		
		/* AUTOCOMPLETE */
		--autocomplete-items-background: #4d4d4d;
		--autocomplete-items-border-color: #313131;
		--autocomplete-item-text-color: var(--primary-text-color);
	
		/* TREE */
		--tree-label-text-color: var(--primary-text-color);
    }

}