:root {
	--primary-color: #009C43;
	--primary-color60: #66c48e;
	--primary-bg-color: #e5f5ec; /* OLD: #f5fdf5 */
	--secondary-color: #3a3938;
	--secondary-color60: #898888;
	--secondary-color10: #ebebeb; /* OLD: #f2f2f2 */
	--secondary-color05: #f7f7f7;
	--tertiary-color: #0099F3;
	--error-color: #fd292f;
	--error-color60: #f6777a;
	--error-color10: #F9A7A9;
	--divider-color: rgba(183,183,183,0.7);

	/* --trial-color60: #f5bf78; */

	/* Project Status Colors */
	--ps-inactive-color: rgba(239, 66, 0, .8);
	--ps-active-color: var(--primary-color);
	--ps-trial-color: var(--secondary-color);
	--ps-stopped-color: var(--tertiary-color);
	--ps-done-color: var(--secondary-color60);

	--file-tile-hover-transition: 0.1s;
	--rounded: 5px;
	--user-size: 40px;
	--user-size-small: 30px;
	--user-size-big: 52px;
}

/*#region LOADING IMG */
#loading .loading-indicator {
	background: none !important;
}
/*#endregion */

/*#region DragNDrop (THEME OVERRIDE) */
.x-grid-drop-indicator {
	opacity: 0;	
}
.x-dd-drag-proxy {
	border-radius: var(--rounded);
	background-color: var(--secondary-color10);
	border: 1px solid var(--secondary-color60);
}
.x-dd-drop-ok .x-dd-drop-icon {
	color: var(--primary-color);
}
/*#endregion */

/*#region GENERAL */
a, a:visited {
	cursor: pointer;
	color: var(--primary-color) !important;
}
a:hover, a:visited:hover {
	color: var(--primary-color) !important;	
	text-decoration: underline;	
}
.hover-color-primary {
	cursor: pointer;
	color: var(--secondary-color) !important;
}
.hover-color-primary:hover {
	color: var(--primary-color) !important;
}
.hover-color-red {
	cursor: pointer;
	color: var(--secondary-color) !important;
}
.hover-color-red:hover {
	color: var(--error-color60) !important;
}
.app-link {
	cursor: pointer;
	color: var(--primary-color);	
}
.app-link:hover {
	text-decoration: underline;	
}
.info-box-label {
	border-radius: 50px;	
	border: 1px solid var(--secondary-color60);
	padding: 8px;
	margin-top: 2px;
	cursor: pointer;
	color: var(--secondary-color) !important;
}
.info-box-label:hover {
	background-color: var(--primary-bg-color);
	border: 1px solid var(--primary-color);
}
.info-box-label a {
	color: var(--secondary-color) !important;
}
.info-box-label:hover a {
	color: var(--secondary-color) !important;
	text-decoration: none !important;
}
.visible {
	opacity: 1 !important;
}
.invisible {
	opacity: 0;
}
.default-opacity .x-form-item-default.x-item-disabled {
	opacity: 0.6 !important;
}
.font-bold {
	font-weight: bold;
}
.very-low-opacity {
	opacity: 0.1;
}
.low-opacity {
	opacity: 0.3;
} 
.medium-opacity {
	opacity: 0.5;
}
.z-index-10000 {
	z-index: 10000;
}
.float-left {
	float: left;
} 
.float-right {
	float: right;
}
.overflow-auto {
	overflow: auto !important;
}
.no-border .x-form-trigger-wrap-default{
	border: 0px solid white;
}
.app-fit-text {
	word-wrap: break-word; 
	white-space: pre-line; 
	width: 100%;
}
.scale-x3 {
	scale: 3;
}
.scale-up-hover:hover {
	cursor: pointer;
	transform: scale(1.2, 1.2);
}
.width-transition {
	transition: width 1s;
}
.height-transition {
	transition: height 1s;
}
.no-padding {
	padding: 0px !important;
} 
.edge-form {
	border-radius: 0px !important;
}
.pnl-border {
	border: 1px solid #d3d3d3 !important;
}
.main-border-right {
	border-right: 10px solid var(--secondary-color10);
}
.main-border-left {
	border-left: 10px solid var(--secondary-color10);
}
.pnl-rounded {
	border-radius: var(--rounded);
}
.pnl-rounded-top {
	border-top-left-radius: var(--rounded);
	border-top-right-radius: var(--rounded);
}
.pnl-rounded-top-left {
	border-top-left-radius: var(--rounded);
}
.pnl-rounded-top-right {
	border-top-right-radius: var(--rounded);
}
.pnl-rounded-bottom {
	border-bottom-left-radius: var(--rounded);
	border-bottom-right-radius: var(--rounded);
}
.x-panel.pnl-rounded-bottom .x-panel-bodyWrap .x-panel-body {
	border-bottom-left-radius: var(--rounded);
	border-bottom-right-radius: var(--rounded);
}
.pnl-rounded-left {
	border-top-left-radius: var(--rounded);
	border-bottom-left-radius: var(--rounded);
}
.pnl-rounded-right {
	border-top-right-radius: var(--rounded);
	border-bottom-right-radius: var(--rounded);
}
.pnl-header-white .x-panel-header-default {
	background-color: #fff !important;
}
.box-border-light-grey {
	border: 2px solid var(--secondary-color05);
}
.mask-no-bg .x-mask {
	background-color: transparent !important;
}
.text-box {
	padding: 4px 10px;
	border-radius: var(--rounded) !important;
	text-align: center;
}
.no-pointer-events {
	pointer-events: none;
}
.default-cursor {
	cursor: default !important;
}


#mainform_1-body {
    background-color: var(--secondary-color10);
}
.hover-underline {
    cursor: pointer;
}
.hover-underline:hover {
    text-decoration: underline;
}
.center-content {
    display: flex; 
    align-items: center; 
    justify-content: center;
}
.bg-inherit {
    background-color: inherit;
}
.sub-title-green {
    color: var(--primary-color);
    font-size: 16px;
}
.grid-big-row-height .x-grid-row {
	height: 60px !important;
}
.delete-label-button {
    color: var(--error-color60);
    border-radius: var(--rounded);
    border: 1px solid var(--error-color60);
    padding: 5px;
}
.delete-label-button:hover {
    background-color: var(--error-color60);
    color: #fff;
}
.primary-label-button {
    color: var(--primary-color);
    border-radius: var(--rounded);
    border: 1px solid var(--primary-color);
    padding: 4px;
    cursor: pointer;
}
.primary-label-button:hover {
    background-color: var(--primary-color);
    color: #fff;
}
.secondary-label-button {
    color: var(--secondary-color);
    border-radius: var(--rounded);
    border: 1px solid var(--secondary-color);
    padding: 4px;
    cursor: pointer;
}
.secondary-label-button:hover {
    background-color: var(--secondary-color);
    color: #fff;
}
/* .cbx-border .x-form-trigger-wrap-default {
    border-radius: var(--rounded);
    border: 1px solid #d3d3d3 !important;
} */
.rounded-cbx .x-form-trigger-wrap-default {
	border-bottom-width: 0px !important;
}
.rounded-cbx .x-form-trigger-default {
	background: transparent !important;
}
.rounded-cbx .x-form-text-wrap {
	border-radius: var(--rounded);
}
.invisible-cbx {
    opacity: 0;
}
.border-search-edit {
    border: 1px solid var(--divider-color) !important;
	border-radius: var(--rounded);
}
.sg-no-select .x-grid-row .x-grid-cell-selected {
    background-color: transparent !important;
}
.grid-header-white .x-column-header,
.grid-header-white .x-column-header-over,
.grid-header-white .x-column-header.x-column-header-last,
.grid-header-white .x-column-header.x-column-header-focus,
.grid-header-white .x-keyboard-mode .x-column-header.x-column-header-focus {
    background-color: white !important;
    cursor: pointer;
}
/**/

.visible-on-hover {
    opacity: 0;
}
.toggle-visible-on-hover:hover .visible-on-hover {
    opacity: 1;
}
.toggle-visible-on-hover:hover .x-form-trigger-wrap-default{
    border-bottom-width: 1px;
    border-radius: 0px;  
}
@media (hover: none) and (pointer: coarse) {
    .visible-on-hover {
        opacity: 1 !important;
    }
}

.visible-on-row-hover {
    opacity: 0;
}
.toggle-visible-on-row-hover .x-grid-item:hover .visible-on-row-hover {
    opacity: 1;
}
.toggle-visible-on-hover:hover .x-form-text-default.x-form-textarea {
    border-radius: var(--rounded) !important;
    border: 1px solid #d3d3d3 !important;
}
/*#endregion */

/*#region BACKGROUND-COLORS */

.bg-grid-primary-bg tr td {
	background-color: var(--primary-bg-color) !important;
}
.bg-grid-white-bg tr td {
	background-color: #fff !important;
}
.bg-color-primary {
	background-color: var(--primary-color) !important;
}
.bg-color-primary-bg {
	background-color: var(--primary-bg-color) !important;
}
.bg-color-primary-bg-hover:hover {
	background-color: var(--primary-bg-color) !important;
}
.bg-color-secondary {
	background-color: var(--secondary-color) !important;
}
.bg-color-light-grey {
	background-color: var(--secondary-color10) !important;
}
.bg-color-thin-grey {
	background-color: var(--secondary-color05) !important;
}
.bg-color-light-green {
	background-color: var(--primary-bg-color) !important;
}
.bg-color-error {
	background-color: var(--error-color) !important;
}
.bg-color-light-error {
	background-color: var(--error-color10) !important;
}
.bg-color-white {
	background-color: #fff !important;
}
.bg-color-text-highlight {
	background-color: yellow !important;
}
.bg-transparent {
	background-color: transparent;	
}
.bg-transparent .x-form-field{
	background-color: transparent;	
}
.bg-color-pspdfkit {
	background-color: #f6f8fa !important;	
}
.bg-color-pspdfkit-memo .x-form-trigger-default {
	background-color: #f6f8fa !important;	
}
.bg-color-pspdfkit-memo .x-form-text-default {
	background-color: #f6f8fa !important;	
}
.bg-no-preview-img {
	cursor: pointer;
	background-image: var(--url_NoPreview);
	background-repeat: no-repeat;
	background-position: center;
}
.bg-loading-img {
	background-image: var(--url_loading);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100px 100px;
}
/*#endregion */

/*#region FONT-COLORS */
.x-item-disabled, .x-item-disabled {
	opacity: 0.6;
}
.font-white{
	color: #fff !important;
}
.font-primary{
	color: var(--primary-color) !important;
}
.font-secondary{
	color: var(--secondary-color);
}
.font-grey{
	/* color: var(--secondary-color60); */
}
.font-error{
	color: var(--error-color) !important;
}
.font-error60 {
	color: var(--error-color60) !important;
}
.font-pro {
	color: var(--error-color);
}
.font-empty-txt {
	color: #888;
}
.font-grid-title {
	color: #7b7b7b;
	font-weight: 500;
}
.font-color-text-highlight {
	color: yellow;
}
.font-panel-title {
	font-size: 16px;
	color: var(--primary-color);
}

.LocationLabel {
	color: var(--primary-color);
	font-weight: bold;
}
.grid-text-link,
.grid-text-link a,
.grid-text-link a:visited {
	color: #303030 !important;
	cursor: pointer;
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 1;
}
.grid-text-link:hover {
	color: #303030 !important;
	text-decoration: underline;
}

/*#endregion*/

/* #region Project Status */
.border-ps-inactive {
}
.border-ps-inactive .project-image {
	/* filter: saturate(20%); */
}
.border-ps-inactive .project-text-wrap {
	color: var(--ps-inactive-color);
}

.border-psf-inactive label {
	color: var(--ps-inactive-color);
} 
.border-psf-inactive .x-form-checkbox-default:before {
	color: var(--ps-inactive-color);
}

.border-ps-active {
}
.border-ps-active .project-text-wrap {
	color: var(--ps-active-color);
}
.border-psf-active label {
	color: var(--ps-active-color);
}
.border-psf-active .x-form-checkbox-default:before {
	color: var(--ps-active-color);
}

.border-ps-trial {
}
.border-ps-trial .project-text-wrap {
	color: var(--ps-trial-color);
}
.border-psf-trial label {
	color: var(--ps-trial-color);
}
.border-psf-trial .x-form-checkbox-default:before {
	color: var(--ps-trial-color);
}

.border-ps-stopped {
}
.border-ps-stopped .project-text-wrap {
	color: var(--ps-stopped-color);
}
.border-psf-stopped label {
	color: var(--ps-stopped-color);
}
.border-psf-stopped .x-form-checkbox-default:before {
	color: var(--ps-stopped-color);
}

.border-ps-done {
}
.border-ps-done .project-text-wrap {
	color: var(--ps-done-color);
}
.border-psf-done label {
	color: var(--ps-done-color);
}
.border-psf-done .x-form-checkbox-default:before {
	color: var(--ps-done-color);
}

.color-ps-inactive {
	color: var(--ps-inactive-color);
}
.color-ps-active {
	color: var(--ps-active-color);
}
.color-ps-trial {
	color: var(--ps-trial-color);
}
.color-ps-stopped {
	color: var(--ps-stopped-color);
}
.color-ps-done {
	color: var(--ps-done-color);
}
/*#endregion*/

/*#region TOOLTIPS */

.overflow-grid .x-box-inner {
	overflow: visible;
}
.x-column-header {
	overflow: visible;
}
.x-column-header-inner {
	overflow: visible;
}
.x-column-header-text {
	overflow: visible;
}
.x-panel-default {
	overflow: visible;
}
.x-grid-header-ct {
	overflow: visible !important;
}
/*#endregion */

/*#region DIVIDER */
.app-divider-bottom-big {
	border-bottom: 5px solid var(--secondary-color10) !important;
}
.app-divider-bottom {
   	border-bottom: 1px solid var(--divider-color) !important;
}
.app-divider-top {
	border-top: 1px solid var(--divider-color) !important;
}
.app-divider-left {
   	border-left: 1px solid var(--divider-color) !important;
}
.app-divider-right {
   	border-right: 1px solid var(--divider-color) !important;
}
.app-divider-right-white {
	border-right: 1px solid #fff !important;
}
.app-divider-left-white {
	border-left: 1px solid #fff !important;
}
.divider-border {
	border: 1px solid var(--divider-color);
}
.primary-border {
	border: 1px solid var(--primary-color) !important;
}
/*#endregion */

/*#region SIDE-PANEL */
.side-panel {
	/*border-left: 1px solid var(--secondary-color);*/
	/*
	box-shadow: -29px -29px 49px -26px rgba(0,0,0,0.76);
	-webkit-box-shadow: -29px -29px 49px -26px rgba(0,0,0,0.76);
	-moz-box-shadow: -29px -29px 49px -26px rgba(0,0,0,0.76);
	*/
	box-shadow: -10px -10px 49px -26px rgba(0,0,0,0.76);
	-webkit-box-shadow: -10px -10px 49px -26px rgba(0,0,0,0.76);
	-moz-box-shadow: -10px -10px 49px -26px rgba(0,0,0,0.76);
}
.side-drop-grid {
	z-index: 1;
	opacity: 0;
}
.side-drop-grid .x-unselectable {
	cursor: pointer;
}
.x-fit-item {
	position: absolute !important;
}
.side-icon {
	position: absolute;
	height: 25px  !important;
	width: 30px !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.side-panel-hoverbox:hover {
	/*border-left: 2px dashed var(--primary-color);
	border-right: 2px dashed var(--primary-color);*/
	background-color: var(--primary-bg-color) !important;
}
.side-panel-hoverbox:hover .side-icon-color {
	color: var(--primary-color) !important;
}
.side-panel-divider {
	border-top: 2px dashed var(--divider-color);
	/*border-left: 1px dashed var(--secondary-color);
	border-right: 1px dashed var(--secondary-color);*/
}
/*#endregion */

/*#region UPLOAD */
.app-hoverbox-dash {
	border: 1px dashed var(--secondary-color60);
	border-radius: var(--rounded);
	transition: width 1s;
}
.app-hoverbox-dash:hover,
.app-hoverbox-dash.hover {
	border: 1px dashed var(--primary-color) !important;
	background: rgba(0, 156, 67, .05) !important;
}
.app-hoverbox-dash:hover .upload-icon,
.app-hoverbox-dash.hover .upload-icon{
	color: var(--primary-color);
}
.app-hoverbox-dash .app-hoverimage {
	background-image: var(--url-upload) !important;
	background-repeat: no-repeat !important;
}
.app-hoverbox-dash:hover .app-hoverimage,
.app-hoverbox-dash.hover .app-hoverimage {
	background-image: var(--url-upload_hover) !important;
	background-repeat: no-repeat !important;
}
.upload-icon {
	color: var(--secondary-color60);	
}
.upload-grid .x-panel-bodyWrap {
	background-color: var(--secondary-color10);
}
.project-image-overview {
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%);	
}
.project-image-overview-box {
	cursor: pointer !important;
}
.project-image-overview-hover-box:hover .project-image {
	opacity: 0.5;
}
.project-image-change-hover {
	cursor: pointer;
	top: 70% !important;
	left: 40% !important;
	transform: translate(-50%, -50%);
}
.project-image-change-hover:hover {
	color: var(--primary-color);
}
.project-image-delete-hover {
	cursor: pointer;
	top: 70% !important;
	left: 60% !important;
	transform: translate(-50%, -50%);
}
.project-image-delete-hover:hover {
	color: var(--error-color60);
}

/*#endregion */

/* NO PREVIEW IMG */
.no-preview-bg {
	cursor: pointer;
	background-image: var(--url_NoPreview);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20vw 40vh;
}

/*#region ICONS */ 
.app-icon {
	color: var(--secondary-color);
	font-size: 14px;
	font-weight: 480;
	padding: 10px;
}
.app-icon:hover {
	color: var(--primary-color);
	cursor: pointer;
}
.app-main-menu-icon {
	padding: 6px !important;
	margin-top: -1px !important;
}
.navigation-folder-icon {
	/* windows yellow color: color: #F8D775;*/
	color: var(--primary-color);
	font-size: 20px;
	margin-top: 2px;
	margin-left: 12px;
}
/*#endregion */

/*#region USER ICONS */
/* PJ Support Border */
.app-no-user-border {
	border: 1px solid white;
}
.app-pj-user-border {
	border: 2px solid var(--primary-color) !important;
}
/* User Image */
.app-user-image-box {
	width: var(--user-size);
	height: var(--user-size);
	display:inline-block;
	outline:0px;
	cursor: pointer;
	margin-right: 5px;
	vertical-align: middle;
}
.app-user-image {
	background-color:transparent;
	background-size:cover;
	background-position: center;
	background-repeat: no-repeat;
	width: var(--user-size);
	height: var(--user-size);
	display:flex;
	border-radius:50%;
	border: 1px solid var(--secondary-color);
	cursor: pointer;
}
.app-user-image-small {
	width: var(--user-size-small);
	height: var(--user-size-small);
}
.app-user-image-box-small {
	width: var(--user-size-small);
	height: var(--user-size-small);
	margin-bottom: 2px;
}
.app-user-image-big {
	width: var(--user-size-big);
	height: var(--user-size-big);
}
.app-user-image-box-big {
	width: var(--user-size-big);
	height: var(--user-size-big);
	margin-right: 10px;
	margin-bottom: 5px;
}

/* User Avatar */
.app-avatar {
	border-radius: 50%;
	height: var(--user-size);
	text-align: center;
	width: var(--user-size);
	cursor: pointer;
	margin-right: 5px;
	display: inline-block;
	vertical-align: middle;
}
.app-avatar-initials {
	font-size: calc(var(--user-size) / 2.5); 
	top: calc(var(--user-size) / 3.2); 	
	line-height: 1;
	position: relative;
	cursor: pointer;
}
.app-avatar-small {
	height: var(--user-size-small);
	width: var(--user-size-small);
}
.app-avatar-initials-small {
	font-size: calc(var(--user-size-small) / 2.5); 
	top: calc(var(--user-size-small) / 6); 	
}
.app-avatar-initials-small-cbx {
	top: 0 !important;
}
.app-avatar-big {
	height: var(--user-size-big);
	width: var(--user-size-big);
	margin-right: 10px;
	margin-bottom: 5px;
}
.app-avatar-initials-big {
	font-size: calc(var(--user-size-big) / 2.5); 
	top: calc(var(--user-size-big) / 3.2); 	
}

.app-user-delete-div {
	position: fixed;
	width: 16px;
	height: 16px;
	margin-top: -44px;
	border-radius: 50%;
	background-color: var(--secondary-color60);
	cursor: pointer;
	padding-left: 4px;
}
.app-user-delete-div:hover {
	background-color: var(--error-color60);
}

/*#endregion */

/*#region MAIN-HEADER */
.app-project-title {
	font-size: 20px !important;
	font-weight: 400; 
	color: var(--primary-color);	
} 
.app-header-shadow {
   	border: none;
   	-webkit-box-shadow: 1px 1px 1px 1px rgba(85,85,85,0.75);
   	-moz-box-shadow: 1px 1px 1px 1px rgba(85,85,85,0.75);
   	box-shadow: 1px 1px 1px 1px rgba(85,85,85,0.75);
   	z-index: 3;
}
.app-logo {
	background-repeat: no-repeat;
	background-size: contain;
	background-position-y: center;
	margin-left: 15px !important;
}
.app-logo-default {
	background-image: var(--url-plcLogo_black_default) !important;
}
.app-logo-basic {
	background-image: var(--url-plcLogo_black_basic) !important;
}
.app-logo-pro {
	background-image: var(--url-plcLogo_black_pro) !important;
}
.app-logo-ultimate {
	background-image: var(--url-plcLogo_black_ulti) !important;
}
/*#endregion */

/*#region MAIN-TABS */
.tab-label {
	font-size: 16px !important;
	cursor: pointer;
	background-color: transparent;
}
.tab-label:hover {
	transform: scale(1.03);
	color: var(--primary-color) !important;
}
.tab-label-active {
	color: var(--primary-color);
	font-weight: bold;
}
.tab-label-disabled {
	font-size: 16px !important;
	background-color: transparent;
	opacity: 0.4;
	cursor: default;
}
.tab-label-disabled:hover .tab-label-soon {
	opacity: 1 !important;
}
.tab-label-soon {
	transition: 1ms all;
	opacity: 0;
	position: fixed;
	font-size: 10px;
	padding: 2px;
	background-color: var(--error-color60);
	border-radius: 8px;
	color: white;
	margin-left: -54px;
	margin-top: -6px;
}
/*#endregion*/

/*#region DASHBOARD */
.dashbord-border-bottom {
	border-bottom: 3px solid var(--secondary-color10);
}
.dashbord-font {
	color: var(--secondary-color);
	font-size: 14px; 
	font-family: Roboto;
}
.dashbord-font .x-form-item-label-text {
	color: var(--secondary-color);
	font-size: 14px;
	font-family: Roboto;	
}
.dashbord-font .x-form-field {
	color: var(--secondary-color);
	font-size: 14px !important;
	font-family: Roboto;
}
.dashbord-font-title {
	color: var(--secondary-color);
	font-size: 16px !important;	
	font-family: Roboto;
}
.dashbord-font-display .x-form-trigger-wrap {
	border-bottom-width: 0;
}
.dashbord-more-font {
	color: var(--secondary-color);
	font-size: 16px;
	cursor: pointer;
	text-decoration: underline;
}
.dashbord-more-font:hover {
	color: var(--primary-color);
}
.dashbord-icon-svg {
	display:block;
	width: 36px;
	height: 36px;
}
.donut_single_chart {
	height: 100%;
	width: 100%;
}
#map {
	overflow: visible;   
    width: 100%;
    height: 100%;
}
/*#endregion */

/*#region PROJECTS */
.project-header-font {
	font-weight: 480;
	font-size: 15px;
	color: var(--primary-color);
}
.project-image-box {
	width:150px;
	height:250px;
	display:inline-block;
	position:relative;
}
.project-image-box-small {
	width: 80px !important;
	height: 133px !important;
}
.project-image {
	background-color: transparent;
	background-size:cover;
	background-position: center;
	background-repeat: no-repeat;
	width:150px;
	height:250px;
	display:flex;
	border: 2px solid var(--secondary-color);
	border-radius: 3px !important;
}
.project-image-small {
	width: 80px !important;
	height: 133px !important;
}

.project-text-wrap {
	height: 43px;
	margin-top: 5px;
	margin-bottom: 5px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.project-new-wrap {
	z-index: 10;
	position: absolute;
	background-color: var(--primary-color);
	border-radius: 8px;
	height: 24px;
	width: 54px;
	font-size: 14px;
	color: white;
	left: 0;
	right: 0;
	margin-inline: auto;
	margin-top: -10px;
	align-content: center;
}

.project-icons-wrap {
	display: flex;
	height: 30px;
	margin-top: 5px;
}

.project-icon-wrap {
	/* flex: 1; */
	height: 100%;
	width: 80px;
}

.PSI.True {
	visibility: visible;
}

.PSI.False {
	
}

.box {
	margin: 20px;
	margin-bottom: 12px;
	padding-bottom: 5px;
	cursor: pointer;
	text-align: center;
	font-weight: bold;
	font-size: 15px;
	color: var(--secondary-color);
	transition: all 0.3s ease-in-out;
}
.box::after {
	content: '';
	z-index: -1;
	opacity: 0;
  	width: 100%;
  	height: 100%;
	transition: opacity 0.1s ease-in-out;
  	border-radius: 10px !important;
}
.box:hover {
	transform: scale(1.07, 1.07);
}
.box:hover::after {
	opacity: 1;
}	
/*#endregion */

/*#region NOTIFICATIONS */
.popup-form {
	border-radius: var(--rounded);
}

.notification-row {
	padding-top:10px;
	padding-bottom:10px;	
}
.notification-grid .x-grid-td {
	vertical-align: top;
}
.notification-grid .x-grid-item-selected {
	background-color: transparent;
}

.notification-icon {
	color: var(--primary-color);
	font-size: 19px;
	margin-bottom: -5px;
}
.notification-file-icon {
	display: inline !important;
	margin-bottom: -7px;
	margin-top: 7px;
}
/*#endregion*/

/*#region LABEL-BUTTON */
.label-no-padding {
	padding: 0px !important;
}
.app-label-button {
	font-size: 14px !important;
	color: var(--secondary-color);
	padding: 5px;
	cursor: pointer;
}
.app-label-button:hover {
	color: var(--primary-color);
}
.app-label-button .x-item-disabled {
	border-radius: 1px;
	padding: 5px;
	color: #BABABA;
}
/*#endregion */

/*#region CHECKBOXES */

/* Toggle Button */
.switch {
	position: relative;
	display: inline-block;
	width: 48px;
	height: 28px;
}
.switch input { 
	opacity: 0;
	width: 0;
	height: 0;
}
.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
}
.slider:before {
	position: absolute;
	content: "";
	height: 20px;
	width: 20px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
}
input + .slider {
	background-color: var(--error-color60);
}
input:checked + .slider {
	background-color: var(--primary-color);
}
input:focus + .slider {
	box-shadow: 0 0 1px var(--primary-color);
}
input:checked + .slider:before {
	-webkit-transform: translateX(20px);
	-ms-transform: translateX(20px);
	transform: translateX(20px);
}
.slider.round {
	border-radius: 28px;
  }
  
.slider.round:before {
	border-radius: 50%;
}


/* Component Checkbox */
.x-form-checkbox-default:before,
.x-form-cb-checked .x-form-checkbox-default:before {
	display: inline-block;
	font: 20px/1 ExtJS !important;
}
.app-checkbox-changed input[type="checkbox"]:checked+label::before{
	border: 3px solid var(--error-color60) !important;
}
.app-checkbox-changed input[type="checkbox"]+label::before {
	border: 3px solid var(--error-color60) !important;
} 
.app-checkbox-changed-checked input[type="checkbox"]:checked+label::before {
	content: "\e991";
    color: var(--error-color60) !important;
} 
.app-checkbox-grey input[type="checkbox"]:checked+label::before {
	content: "\e991";
    color: var(--primary-color) !important;
}
.app-checkbox-light-grey input[type="checkbox"]+label::before {
	color: #959595 !important;
}
.app-checkbox-light-grey input[type="checkbox"]:checked+label::before {
    color: var(--primary-color) !important;
}
.app-checkbox input[type="checkbox"] {
	display: none;
}
.app-checkbox input[type="checkbox"]+label {
    display: inline-block;
	font: 20px/1 ExtJS !important;
	margin-top: 4px;
}
.app-checkbox input[type="checkbox"]+label::before {
    content: "\e990";
	color: var(--secondary-color);
}
.app-checkbox input[type="checkbox"]:checked+label::before {
	content: "\e991";
    color: var(--primary-color);
}
.app-checkbox-disabled input[type="checkbox"] {
	display: none;
}
.app-checkbox-disabled input[type="checkbox"]+label {
    display: inline-block;
	font: 20px/1 ExtJS !important;
	margin-top: 4px;
}
.app-checkbox-disabled input[type="checkbox"]+label::before {
    content: "\e990";
	color: var(--secondary-color);
    opacity: 0.4;
}
.app-checkbox-disabled input[type="checkbox"]:checked+label::before {
	content: "\e991";
    color: var(--primary-color);
}
/*#endregion */

/*#region SEARCH */
.border-search-edit {
    border: 1px solid transparent !important;
	border-radius: var(--rounded);
}
.input-title-search {
	height: 25px;
	border: none;
	border-radius: var(--rounded);
	margin: 0px 20px;
}
/*#endregion */

/*#region ACTIONS */
.header-icon {
	margin-right: 5px;
	font-size: 18px !important;
}
.header-icon-active {
	color: var(--primary-color) !important;
}
.header-action {
	font-size: 14px;
	color: var(--secondary-color);
	padding: 10px;
	white-space: nowrap;
}
.header-action:hover {
	color: var(--primary-color);
}
.header-action-icon {
	font-size: 18px !important;
}
/*#endregion*/

/*#region DIRECTORY-TREE */
/* TREE MARGINS */
.app-file-tree-view .x-tree-icon {
	margin-left: 12px;
}
.app-file-tree-view  .x-grid-item {
	background-color: var(--secondary-color10);
}
.app-file-tree-view-bg-white .x-grid-item {
	background-color: #fff !important;
}

.app-file-tree-view .x-tree-elbow-img {
	width: 0;
	margin-right: 6px;
}
.app-file-tree-view-simple table:nth-child(1) tr td {
	color: #303030 !important;
  font-weight: normal !important;
}
.app-file-tree-view .x-grid-item-selected {
	font-weight: bold;	
}
.app-file-tree-view table:nth-child(1) tr td {
	font-weight: bold;
	color: var(--primary-color);
}
.app-file-tree-view .x-grid-item-selected .file-tree-count {
	opacity: 1;
}
.app-file-tree-view .x-grid-item-focused .x-grid-cell-inner:before {
	border: none;
}
.app-file-tree-view .x-grid-item-selected .file-tree-icon-visibility {
	opacity: 1;
	pointer-events: all;
}
.app-file-tree-view .x-grid-row:hover .file-tree-count {
	opacity: 1;	
}
.file-tree-icon-visibility {
	display: inline-table !important;	
	opacity: 0;
	pointer-events: none;
}
.file-tree-icon {
	margin: auto;
	margin-left: 5px;
	cursor: pointer;
	font-size: 14px !important;
	font-weight: bold;
	color: #7b7b7b !important;
}
.file-tree-icon:hover {
	color: var(--primary-color) !important;
}
.file-tree-count {
	position: absolute;
	right: 0px;
/* float: right;
color: var(--secondary-color60);
font-size: 12px;
transition: 0.1s ease-in;
opacity: 1; */
} 
/*#endregion */

/*#region Upload DIRECTORY-TREE */
.upload-tree-action {
	float: right;
	margin: auto;
	margin-left: 5px;
	cursor: pointer;
	font-size: 14px !important;
	font-weight: bold;
	color: var(--secondary-color) !important;
	position: absolute;
	right: 0px;
}
/*#endregion */


/*#region GRID */
.grid-no-cell-highlight .x-grid-row, 
.grid-no-cell-highlight .x-grid-cell-selected {
	background-color: transparent !important;
}
.grid-light-grey table td,
.grid-light-grey .x-grid-empty {
	background-color: var(--secondary-color05);	
}
.grid-container-custom {
	background-color: var(--primary-color);
}
.grid-overflow-ellipsis .x-grid-cell-inner {
	text-overflow: ellipsis !important;
}
.grid-no-select .x-grid-item-selected {
	background-color: white;
}
.grid-rounded .x-grid-body {
	border-radius: var(--rounded);
}
.sgrid-rounded .x-panel-bodyWrap {
	border-radius: var(--rounded);
}
.grid-small-row-height .x-grid-row {
	height: 38px !important;
}
.grid-default-row-height .x-grid-row {
	height: 44px !important;
}
.file-view-grid table td:nth-child(1) {
	border: 0px solid black;
}
.file-view-grid table td:nth-child(2) {
	border: 0px solid black;
}
.file-view-grid .x-box-inner {
	background-color: transparent;
}
.file-view-grid .x-grid-header-ct {
	background-color: var(--secondary-color10);
}
.file-view-grid .x-grid-item-selected {
	background-color: var(--primary-bg-color) !important;
}
.file-view-grid .x-grid-rowbody {
	padding: 0px;
}
.border-grid .x-grid-view {
	border: 1px solid var(--divider-color);
	border-radius: var(--rounded);
}
.border-grid .x-grid-body {
	border-radius: var(--rounded);
}
.grid-no-overflow-x .x-grid-view {
	overflow-x: hidden !important;
}
.grid-no-overflow-y .x-grid-view {
	overflow-y: hidden !important;
}
.grid-rounded-top .x-grid-view {
	border-top-left-radius: var(--rounded);
	border-top-right-radius: var(--rounded);
	border-bottom-right-radius: 0px !important;
	border-bottom-left-radius: 0px !important;
}
.grid-rounded-top .x-grid-body {
	border-top-left-radius: var(--rounded);
	border-top-right-radius: var(--rounded);
	border-bottom-left-radius: 0px !important;
	border-bottom-right-radius: 0px !important;
}
.borderless-grid .x-grid-view {
	border: 0px solid var(--divider-color) !important;
}
.grid-header-white .x-column-header,
.grid-header-white .x-column-header-over,
.grid-header-white .x-column-header.x-column-header-last,
.grid-header-white .x-column-header.x-column-header-focus,
.grid-header-white .x-keyboard-mode .x-column-header.x-column-header-focus {
    background-color: white !important;
    cursor: pointer;
}
.file-comments-grid .x-grid-cell-inner {
	text-overflow: clip !important;
}
.file-type-folder {
	width: 25px !important;
	margin-left: 7px !important;
	margin-top: -3px; 
}
.file-type-img {
	cursor:pointer;
	display:block;
	width: 28px;
	height: 28px;
	margin-right: 5px;
	margin-left: 5px;
	transition: all 0.15s ease-in-out;
}
.file-type-img::after {
	content: '';
	z-index: -1;
	opacity: 0;
  	width: 100%;
  	height: 100%;
	transition: opacity 0.1s ease-in-out;
}
.file-type-img:hover {
	transform: scale(1.13, 1.13);
}
.file-type-img:hover::after {
	opacity: 1;
}	
.file-type-img-no-hover:hover {
	cursor: default;
	transform: scale(1, 1);
}
.file-versionCount-link-textDecoration {
	text-decoration: underline;
}
/*#endregion */

/*#region FILE-TILE */
.file-tile-table {
	transition: height 1s;
}
.file-tile-main-active {
	border-radius: var(--rounded);
	transition: var(--file-tile-hover-transition) ease-in;
	background: var(--primary-bg-color) !important;
	border: 1px solid var(--primary-color);
}
.file-tile-checkbox-active {
	opacity: 0.9;
}
.file-tile-main {
	border-radius: var(--rounded);
	transition: var(--file-tile-hover-transition) ease-in;
}
.file-tile-main:hover{
	background: var(--primary-bg-color) !important;		
}
.file-tile-main:hover .file-tile-checkbox {
	opacity: 0.9;			
}
.file-tile-checkbox {
	transition: var(--file-tile-hover-transition) ease-in;
	opacity: 0;
}
.file-tile-img {
	transition: var(--file-tile-hover-transition) ease-in;
	opacity: 1;
}
.file-tile-main:hover .file-tile-img {
	opacity: 0.1;
}
.file-tile-main:hover .file-tile-overlay {
	opacity: 1;	
}
.file-tile-overlay {
	transition: var(--file-tile-hover-transition) ease-in;
	transition: height 1s;
	opacity: 0;
}
/*#endregion */

/*#region FILE-DETAILS */

/*#region FILE-COMMENTS */
.panel-file-details-commentary {
	background-color: var(--secondary-color10);
	border-top-left-radius:3px;
	border-top-right-radius:3px;
	border: 5px solid var(--secondary-color10);
}
.commentary-grid .x-grid-item {
	border: none !important;	
}
.commentary-edit .x-form-field {
	border-radius: var(--rounded);	
}
.commentary-edit .x-form-text-default.x-form-textarea {
	min-height: 45px;
}
.commentary-btn-save  {
	background-color: transparent !important;
	border: none;
	border-radius: 3px;
	transition: background-color 0.5s ease;
}
.commentary-btn-save:hover {
	background-color: var(--primary-bg-color) !important;
	box-shadow: 0 1px 5px 0 rgb(32 33 36 / 12%);
}
.commentary-grid-mention-tag {
	padding: 0px 5px;
	margin-top: -2px;
	background-color: var(--primary-bg-color);
	border: 1px solid var(--primary-color);
	border-radius: var(--rounded);
	display: inline-block;
	vertical-align: top;
	cursor: default;
}
.mention-tag-text {
	color: #555;
	font: 400 14px/18px Roboto;
}
/*#endregion */

/*#region TAGS */
.tag-field .x-form-trigger {
	vertical-align: top !important;
}
.tag-field .x-form-text-default .x-tagfield-item {
	background-color: var(--primary-bg-color);
	border: 1px solid var(--primary-color);	
	line-height: 20px;
	color: #555;
}
.x-form-text-default .x-tagfield-item {
	border-radius: var(--rounded);
}
.tag-field-bg-light-grey {
	background: var(--secondary-color10);
}
.tag-field-bg-light-grey .x-form-trigger {
	vertical-align: top !important;
	background: var(--secondary-color10);
}
.tag-field-bg-light-grey .x-tagfield .x-tagfield-list {
	background: var(--secondary-color10);
}
.tag-add-box .x-form-trigger-wrap-default {
	border-width: 0px;
}
.tag-add-box .x-form-field {
	border-radius: var(--rounded);	
}
.tag-add-box .x-form-trigger {
	display: none;
}
/*#endregion */

/* Tool images BEGIN*/
.x-tool-expand-bottom:before {
    content: "\f078";
}
.x-tool-collapse-bottom:before {
    content: "\f078";
}
.x-tool-expand-top:before {
    content: "\f077";
}
.x-tool-collapse-top:before {
    content: "\f077";
}
.x-tool-expand-left:before {
    content: "\f053";
}
.x-tool-collapse-left:before {
    content: "\f053";
}
.x-tool-expand-right:before {
    content: "\f054";
}
.x-tool-collapse-right:before {
    content: "\f054";
}
/* Tool images END*/

/*#region SETTINGS */
.settings-nav-active {
	font-weight: bold;
}
.settings-nav:hover {
	background-color: var(--primary-bg-color);
}
.settings-nav-delete:hover {
	background-color: var(--error-color10);
}
.input-error .x-form-trigger-wrap {
	border-color: var(--error-color);
}
.input-error input {
	background-color: rgba(239, 68, 0, 0.250);
}
.x-table-layout td {
	vertical-align : top;	
}

.field-label {
	vertical-align: middle;
	display: table-cell;
	position: relative !important;
	color: #7b7b7b;
}

.groups--outerbox__action__remove-all {
	right: 10px;
	left: auto;
	right: 10px;
}

.group-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px; /* Optional: Adds space between the divs */
}

.group-list__add-item {
	width: 30px;
	height: 30px;
	background-color: var(--secondary-color60);
	background: var(--secondary-color60);
	border-radius: 30px;
	line-height: 30px;
	text-align: center;
	color: var(--secondary-color05);
	cursor: pointer;
	font-size: 18px;
}

.group__box {
    width: auto;
    height: 30px;
    text-align: center;
    padding: 0 10px 0 10px;
    line-height: 30px; /* Center the text vertically */
    position: relative;
    border-radius: 5px;
    color: var(--secondary-color05);
	transition: width 0.2s, height 0.2s;
}


.group__box--editable {
	cursor: pointer;
}

.group__box__action {
    width: 15px;
    height: 15px;
    position: absolute;
    top: -6px;
    right: -6px;
    background-color: var(--secondary-color60);
    text-align: center;
    align-content: center;
    border-radius: 15px;
    color: var(--secondary-color05);
    cursor: pointer;
    font-size: 8px;
    line-height: 15px;
    /* transition: width 2s, height 2s, background-color 2s; */
    transition: transform 0.2s;
}
.group__box__action:hover {
	/* width: 17px;
	height: 17px;
	top: -7px;
	right: -7px; */
	transform: scale(1.2);
	background-color: var(--error-color);
}
/*#endregion */

/*#region CAD-Viewer */
.cad-viewer-loading {
	position:absolute;
	height:100px;
	width:100px;
	top:50%;
	left:50%;
	margin-top: -50px;
	margin-left: -50px;
}
.cad-action-label {
	cursor: pointer;
	margin-left: -6px !important;
}
.cad-action-panel {
	cursor: pointer;
}
.cad-action-panel:hover {
	background-color: var(--primary-color) !important;
}
.cad-action-panel:hover .cad-action-label {
	color: #fff;
}
/*#endregion */

/*#region Protocol */
.protocol-icon-margin {
	margin-left: 5px;
	margin-right: 5px;
}
.no-border-edit .x-form-trigger-wrap-default {
    border: none;
}
.bg-transparent-edit .x-form-text-default {
    background-color: transparent;
}
.hover-visible {
	opacity: 0;
}
.hover-visible-toggle:hover .hover-visible {
	opacity: 1;
}
/*#endregion */

/*#region FILE-PREVIEW-CELLS (NOT USED) */
.file-preview-div {
	width:40px;
	height:40px;
	cursor:pointer;
	display: flex;
}
.file-preview-div:hover {
	background-color: var(--primary-bg-color); 
}
.file-preview-img {
	width: 24px; 
	margin-left: 6px;
	margin-top: 2px;
}
.file-preview-close-icon {
	font-size:10px;
	margin-left:2px; 
}
.file-preview-close-icon:hover {
	color: var(--error-color); 
}
.header-close-div {
	width:20px;
	height:40px;
	cursor: pointer;
}
.header-close-div:hover {
	background-color: var(--error-color);
}
/*#endregion */


.cm_icon_onedrive {
	background-image: var(--url-oneDrive-logo) !important;
	background-repeat: no-repeat;
	background-size: 70%;
	background-position: center;
}

.cm_icon_dropbox {
	background-image: var(--url-dropbox-logo) !important;
	background-repeat: no-repeat;
	background-size: 70%;
	background-position: center;
}

.video {
	aspect-ratio: 16 / 9;
	height: 100%;
}
.QRCodeBackground {
	background-image: var(--url-plcQR-Background) !important;
	background-repeat: no-repeat;
	background-size: cover;
	border: solid 1px var(--secondary-color60);
	border-radius: 3px;
}

.task-title {
	cursor: pointer;
	margin: 18px;
}
.task-title:hover {
	text-decoration: underline;
}

.x-splitter {
	cursor: ew-resize !important;
}
.x-splitter:hover {
	background-color: var(--primary-bg-color);
}
.x-layout-split-left, .x-layout-split-right {
	display: none !important;
}
.x-tool-collapse-left, .x-tool-collapse-right {
   	color: var(--secondary-color60);
}


/*#region experiment */


.app-file-upload-tree-view .x-grid-cell-inner.x-grid-cell-inner-treecolumn {
	display: flex;
}

.app-file-upload-tree-view .app-file-tree-view .x-tree-elbow-img {
    width: 0px;
    margin-right: 6px;
}


.app-file-upload-tree-view .x-tree-node-text:has(>.tablecell-container-lvl1) {
    display: grid;
}

.tablecell-container-lvl1{
	overflow: hidden;
	text-overflow: ellipsis;
	padding-right: 10px;
	display: flow;
}
.tablecell-container-lvl2{
	/* width: 5%; */
	position: absolute;
	right: 0;
}

.app-file-upload-tree-view.x-autowidth-table .x-grid-item {
	width: 0 !important;
    table-layout: fixed;
}


.app-file-tree-view .x-grid-cell-inner.x-grid-cell-inner-treecolumn {
	display: flex;
}

.app-file-tree-view .x-tree-elbow-img {
    width: 0px;
    margin-right: 6px;
}

.x-tree-node-text:has(>.app-file-tree-view_tablecell-container-lvl1) {
    display: grid;
    grid-template-columns: auto 25px;
    padding-right: 25px;
}

.app-file-tree-view_tablecell-container-lvl1{
	overflow: hidden;
	text-overflow: ellipsis;
	/* padding-right: 10px; */
	/* display: flow; */
	/* grid-row: inherit; */
	/* width: calc(100% - 60px); */
}

.app-file-tree-view_tablecell-container-lvl3{
	/* width: 5%; */
	position: absolute;
	right: 0;
	padding-right: 8px;
}

.app-file-tree-view.x-autowidth-table .x-grid-item {
	width: 0 !important;
    table-layout: fixed;
}

.app-file-tree-view-indicator {
    position: absolute;
    right: 0;
    top: 3px;
    display: none;
}

.svg-error60 svg {
	fill: var(--error-color60);
}
.file-tree-count.svg-error60 svg {
	display: block;
}

[role=button] {
	cursor: pointer;
}
/*#endregion */

/*#region OVERLAY*/
#overlay {
	position: fixed; /* Sit on top of the page content */
	display: none; /* Hidden by default */
	width: 100%; /* Full width (cover the whole page) */
	height: 100%; /* Full height (cover the whole page) */
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: white; /* Black background with opacity */
	z-index: 1000000000000000000; /* Specify a stack order in case you're using a different order for other elements */
	cursor: pointer; /* Add a pointer on hover */
  }

#overlay-logo{
	position: absolute;
	top: 3px;
	left: 9px;
	width: 300px;
	height: 60px;
}

#overlay-text{
	position: absolute;
	top: 50%;
	left: 50%;
	font-size: 23px;
	color: black;
	transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
}


/*#region ANIMATION */
@keyframes slideIn {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

#mainform_1-body {
	overflow-x: hidden;
	overflow-y: hidden;
}

@media only screen and (max-width: 810px) {
	#mainform_1-body
	{
		overflow-x: scroll;
		overflow-y: hidden;
	}
}
.tab-slide-in {
    /* animation: slideIn 0.5s ease-in; */
} 
/*#endregion */



.align-right {
    left: auto !important;
    right: 10px !important;
}

/*#region TREEVIEW EXPAND/COLLAPSE ICON*/
tr[aria-expanded="true"] .x-tree-elbow-plus.x-tree-expander {
	margin-left: -4px !important;
	padding-right: 4px !important;
}
/*#endregion*/

/*#region FRAME LOADING ANIMATION */
.iframe-loading-background {
    position: relative !important;
    background: var(--url_loading) center center no-repeat !important;
	background-size: 4% !important;
	/* --bg-loading-text: "TestText" */


}

.iframe-loading-background::before {
  	content: "Module is loading...";
  	position: absolute;
	margin-top: 40px;
  	top: 50%;
  	left: 50%;
  	transform: translate(-50%);
  	font-size: 1.6rem;
  	color: var(--primary-color);
  	pointer-events: none;
}
/* #endregion */

/*#region CHATBOT BUTTON */
.chatbot-panel {
    border-radius: 50px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    width: 80px !important;
    height: 80px !important;
    z-index: 1000; 
    background-color: #66c48e !important;
	padding: 40px !important;
}

/*#endregion*/

/* #region CHATBOT BUTTON TOP*/

.floating-button-lbl {
	/* background-color: var(--primary-color) !important;	 */
	background-color: rgba(102, 196, 142, 0.85) !important;
	/* background-color: #66c48e !important;	 */
	color: white !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-size: 20px !important;
}

.floating-button-bc {
    left: 50% !important;
    top: 50% !important;
    cursor: pointer;
    position: absolute;
    transform: translate(-50%, -50%);
}

.floating-button {
    /* background-color: var(--primary-color) !important; */
	background-color: rgba(102, 196, 142, 0.85) !important;
    /* background-color: #66c48e !important; */
    border-radius: 50% !important;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2) !important;
	position: fixed !important;
	top: auto !important;
	left: auto !important;
	right: 40px !important;
	bottom: 65px !important;
    z-index: 1000 !important;
    transition: all 0.3s ease !important;
    width: 70px !important;
    height: 70px !important;
}

.floating-button:hover {
    box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.3) !important;
    transform: translateY(-3px) !important;
}


/*-----------------------------------------------------*/

.chatbox-send-btn {
    border-radius: 50% !important;
    background-color: var(--primary-color) !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.chatbox-send-btn-lbl {
    font-size: 15px !important;
	background-color: var(--secondary-color) !important;
    color: white !important;
    line-height: normal !important;
    margin: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
}

.suggestion-card {
    background-color: white !important;
    border: 1px solid #d3d3d3 !important;
    border-radius: 10px !important;
    padding: 15px !important;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1) !important;
    font-size: 14px !important;
    color: #333 !important;
    line-height: 1.5 !important;
    max-width: 300px !important;
    margin: 10px auto !important; 
    text-align: left !important;
}

.suggestion-card:hover {
    box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.2) !important;
    transform: translateY(-2px) !important;
    transition: all 0.3s ease !important;
}

.signature-status-box {
	border-radius: var(--rounded);
	padding: 5px 10px;
	color: white;
}


/* #endregion */