/* input(19997,1): run-time error CSS1035: Expected colon, found '}'
input(20000,99): run-time error CSS1030: Expected identifier, found ' '
input(20000,129): run-time error CSS1030: Expected identifier, found ' ' */
/*! jQuery UI - v1.11.4 - 2015-05-28
* http://jqueryui.com
* Includes: core.css, draggable.css, resizable.css, selectable.css, sortable.css, accordion.css, autocomplete.css, button.css, datepicker.css, dialog.css, menu.css, progressbar.css, selectmenu.css, slider.css, spinner.css, tabs.css, tooltip.css
* Copyright 2015 jQuery Foundation and other contributors; Licensed MIT */

/* Layout helpers
----------------------------------*/
.ui-helper-hidden {
	display: none;
}
.ui-helper-hidden-accessible {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}
.ui-helper-reset {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	line-height: 1.3;
	text-decoration: none;
	font-size: 100%;
	list-style: none;
}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
	content: "";
	display: table;
	border-collapse: collapse;
}
.ui-helper-clearfix:after {
	clear: both;
}
.ui-helper-clearfix {
	min-height: 0; /* support: IE7 */
}
.ui-helper-zfix {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	opacity: 0;
	filter:Alpha(Opacity=0); /* support: IE8 */
}

.ui-front {
	z-index: 100;
}


/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
	cursor: default !important;
}


/* Icons
----------------------------------*/

/* states and images */
.ui-icon {
	display: block;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: no-repeat;
}


/* Misc visuals
----------------------------------*/

/* Overlays */
.ui-widget-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.ui-draggable-handle {
	-ms-touch-action: none;
	touch-action: none;
}
.ui-resizable {
	position: relative;
}
.ui-resizable-handle {
	position: absolute;
	font-size: 0.1px;
	display: block;
	-ms-touch-action: none;
	touch-action: none;
}
.ui-resizable-disabled .ui-resizable-handle,
.ui-resizable-autohide .ui-resizable-handle {
	display: none;
}
.ui-resizable-n {
	cursor: n-resize;
	height: 7px;
	width: 100%;
	top: -5px;
	left: 0;
}
.ui-resizable-s {
	cursor: s-resize;
	height: 7px;
	width: 100%;
	bottom: -5px;
	left: 0;
}
.ui-resizable-e {
	cursor: e-resize;
	width: 7px;
	right: -5px;
	top: 0;
	height: 100%;
}
.ui-resizable-w {
	cursor: w-resize;
	width: 7px;
	left: -5px;
	top: 0;
	height: 100%;
}
.ui-resizable-se {
	cursor: se-resize;
	width: 12px;
	height: 12px;
	right: 1px;
	bottom: 1px;
}
.ui-resizable-sw {
	cursor: sw-resize;
	width: 9px;
	height: 9px;
	left: -5px;
	bottom: -5px;
}
.ui-resizable-nw {
	cursor: nw-resize;
	width: 9px;
	height: 9px;
	left: -5px;
	top: -5px;
}
.ui-resizable-ne {
	cursor: ne-resize;
	width: 9px;
	height: 9px;
	right: -5px;
	top: -5px;
}
.ui-selectable {
	-ms-touch-action: none;
	touch-action: none;
}
.ui-selectable-helper {
	position: absolute;
	z-index: 100;
	border: 1px dotted black;
}
.ui-sortable-handle {
	-ms-touch-action: none;
	touch-action: none;
}
.ui-accordion .ui-accordion-header {
	display: block;
	cursor: pointer;
	position: relative;
	margin: 2px 0 0 0;
	padding: .5em .5em .5em .7em;
	min-height: 0; /* support: IE7 */
	font-size: 100%;
}
.ui-accordion .ui-accordion-icons {
	padding-left: 2.2em;
}
.ui-accordion .ui-accordion-icons .ui-accordion-icons {
	padding-left: 2.2em;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
	position: absolute;
	left: .5em;
	top: 50%;
	margin-top: -8px;
}
.ui-accordion .ui-accordion-content {
	border-top: 0;
	overflow: auto;
}
.ui-autocomplete {
	position: absolute;
	top: 0;
	left: 0;
	cursor: default;
}
.ui-button {
	display: inline-block;
	position: relative;
	padding: 0;
	line-height: normal;
	margin-right: .1em;
	cursor: pointer;
	vertical-align: middle;
	text-align: center;
	overflow: visible; /* removes extra width in IE */
}
.ui-button,
.ui-button:link,
.ui-button:visited,
.ui-button:hover,
.ui-button:active {
	text-decoration: none;
}
/* to make room for the icon, a width needs to be set here */
.ui-button-icon-only {
	width: 2.2em;
}
/* button elements seem to need a little more width */
button.ui-button-icon-only {
	width: 2.4em;
}
.ui-button-icons-only {
	width: 3.4em;
}
button.ui-button-icons-only {
	width: 3.7em;
}

/* button text element */
.ui-button .ui-button-text {
	display: block;
	line-height: normal;
}
.ui-button-text-only .ui-button-text {
	padding: .4em 1em;
}
.ui-button-icon-only .ui-button-text,
.ui-button-icons-only .ui-button-text {
	padding: .4em;
	text-indent: -9999999px;
}
.ui-button-text-icon-primary .ui-button-text,
.ui-button-text-icons .ui-button-text {
	padding: .4em 1em .4em 2.1em;
}
.ui-button-text-icon-secondary .ui-button-text,
.ui-button-text-icons .ui-button-text {
	padding: .4em 2.1em .4em 1em;
}
.ui-button-text-icons .ui-button-text {
	padding-left: 2.1em;
	padding-right: 2.1em;
}
/* no icon support for input elements, provide padding by default */
input.ui-button {
	padding: .4em 1em;
}

/* button icon element(s) */
.ui-button-icon-only .ui-icon,
.ui-button-text-icon-primary .ui-icon,
.ui-button-text-icon-secondary .ui-icon,
.ui-button-text-icons .ui-icon,
.ui-button-icons-only .ui-icon {
	position: absolute;
	top: 50%;
	margin-top: -8px;
}
.ui-button-icon-only .ui-icon {
	left: 50%;
	margin-left: -8px;
}
.ui-button-text-icon-primary .ui-button-icon-primary,
.ui-button-text-icons .ui-button-icon-primary,
.ui-button-icons-only .ui-button-icon-primary {
	left: .5em;
}
.ui-button-text-icon-secondary .ui-button-icon-secondary,
.ui-button-text-icons .ui-button-icon-secondary,
.ui-button-icons-only .ui-button-icon-secondary {
	right: .5em;
}

/* button sets */
.ui-buttonset {
	margin-right: 7px;
}
.ui-buttonset .ui-button {
	margin-left: 0;
	margin-right: -.3em;
}

/* workarounds */
/* reset extra padding in Firefox, see h5bp.com/l */
input.ui-button::-moz-focus-inner,
button.ui-button::-moz-focus-inner {
	border: 0;
	padding: 0;
}
.ui-datepicker {
	width: fit-content;
	/*padding: .2em .2em 0;*/
	display: none;
}
.ui-datepicker .ui-datepicker-header {
	position: relative;
	padding: .2em 0;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	position: absolute;
	top: 2px;
	width: 1.8em;
	height: 1.8em;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
	top: 1px;
}
.ui-datepicker .ui-datepicker-prev {
	left: 2px;
}
.ui-datepicker .ui-datepicker-next {
	right: 2px;
}
.ui-datepicker .ui-datepicker-prev-hover {
	left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
	right: 1px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	display: block;
	position: absolute;
	left: 50%;
	margin-left: -8px;
	top: 50%;
	margin-top: -8px;
}
.ui-datepicker .ui-datepicker-title {
	margin: 0 2.3em;
	line-height: 1.8em;
	text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
	font-size: 0.9em;
	margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	width: 46%;
}
.ui-datepicker table {
	width: 100%;
	font-size: .9em;
	border-collapse: collapse;
	margin: 0 0 .4em;
}
.ui-datepicker th {
	padding: .7em .3em;
	text-align: center;
	font-weight: bold;
	border: 0;
}
.ui-datepicker td {
	border: 0;
	padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
	display: block;
	padding: .2em;
	text-align: right;
	text-decoration: none;
}
.ui-datepicker .ui-datepicker-buttonpane {
	background-image: none;
	margin: .7em 0 0 0;
	padding: 0 .2em;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
	float: right;
	margin: .5em .2em .4em;
	cursor: pointer;
	padding: .2em .6em .3em .6em;
	width: auto;
	overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
	float: left;
}

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
	width: fit-content !important;
}
.ui-datepicker-multi .ui-datepicker-group {
	float: left;
}
	.ui-datepicker-multi .ui-datepicker-group table {
		/*width: 95%;*/
		margin: 0px;
	}
.ui-datepicker-multi-2 .ui-datepicker-group {
	width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
	/*width: 33.3%;*/
	padding-right: 3px;
}
.ui-datepicker-group-last{
	padding-right:0px !important;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
	width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
	border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
	clear: left;
}
.ui-datepicker-row-break {
	clear: both;
	width: 100%;
	font-size: 0;
}

/* RTL support */
.ui-datepicker-rtl {
	direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
	right: 2px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
	left: 2px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
	right: 1px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
	left: 1px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
	clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
	float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
	float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
	border-right-width: 0;
	border-left-width: 1px;
}
.ui-dialog {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	padding: .2em;
	outline: 0;
}
.ui-dialog .ui-dialog-titlebar {
	padding: .6em 1em;
	position: relative;
}
.ui-dialog .ui-dialog-title {
	margin: .1em 0;
	white-space: nowrap;
	width: 90%;
	overflow: hidden;
	text-overflow: ellipsis;
}
.ui-dialog .ui-dialog-titlebar-close {
	position: absolute;
	right: .3em;
	top: 50%;
	width: 20px;
	margin: -10px 0 0 0;
	padding: 1px;
	height: 20px;
}
.ui-dialog .ui-dialog-content {
	border: 0;
	padding: .5em 1em;
	background: none;
	overflow: auto;
}
	.ui-dialog .ui-dialog-buttonpane {
		text-align: left;
		border-width: 1px 0 0 0;
		background-image: none;
		/*margin-top: .5em;*/
		padding: .3em 1em .5em .4em;
	}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	float: right;
}
.ui-dialog .ui-dialog-buttonpane button {
	margin: .5em .4em .5em 0;
	cursor: pointer;
}
.ui-dialog .ui-resizable-se {
	width: 12px;
	height: 12px;
	right: -5px;
	bottom: -5px;
	background-position: 16px 16px;
}
.ui-draggable .ui-dialog-titlebar {
	cursor: move;
}
.ui-menu {
	list-style: none;
	padding: 0;
	margin: 0;
	display: block;
	outline: none;
}
.ui-menu .ui-menu {
	position: absolute;
}
.ui-menu .ui-menu-item {
	position: relative;
	margin: 0;
	padding: 3px 1em 3px .4em;
	cursor: pointer;
	min-height: 0; /* support: IE7 */
	/* support: IE10, see #8844 */
	list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
}
.ui-menu .ui-menu-divider {
	margin: 5px 0;
	height: 0;
	font-size: 0;
	line-height: 0;
	border-width: 1px 0 0 0;
}
.ui-menu .ui-state-focus,
.ui-menu .ui-state-active {
	margin: -1px;
}

/* icon support */
.ui-menu-icons {
	position: relative;
}
.ui-menu-icons .ui-menu-item {
	padding-left: 2em;
}

/* left-aligned */
.ui-menu .ui-icon {
	position: absolute;
	top: 0;
	bottom: 0;
	left: .2em;
	margin: auto 0;
}

/* right-aligned */
.ui-menu .ui-menu-icon {
	left: auto;
	right: 0;
}
.ui-progressbar {
	height: 2em;
	text-align: left;
	overflow: hidden;
}
.ui-progressbar .ui-progressbar-value {
	margin: -1px;
	height: 100%;
}
.ui-progressbar .ui-progressbar-overlay {
	background: url("data:image/gif;base64,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");
	height: 100%;
	filter: alpha(opacity=25); /* support: IE8 */
	opacity: 0.25;
}
.ui-progressbar-indeterminate .ui-progressbar-value {
	background-image: none;
}
.ui-selectmenu-menu {
	padding: 0;
	margin: 0;
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}
.ui-selectmenu-menu .ui-menu {
	overflow: auto;
	/* Support: IE7 */
	overflow-x: hidden;
	padding-bottom: 1px;
}
.ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup {
	font-size: 1em;
	font-weight: bold;
	line-height: 1.5;
	padding: 2px 0.4em;
	margin: 0.5em 0 0 0;
	height: auto;
	border: 0;
}
.ui-selectmenu-open {
	display: block;
}
.ui-selectmenu-button {
	display: inline-block;
	overflow: hidden;
	position: relative;
	text-decoration: none;
	cursor: pointer;
}
.ui-selectmenu-button span.ui-icon {
	right: 0.5em;
	left: auto;
	margin-top: -8px;
	position: absolute;
	top: 50%;
}
.ui-selectmenu-button span.ui-selectmenu-text {
	text-align: left;
	padding: 0.4em 2.1em 0.4em 1em;
	display: block;
	line-height: 1.4;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.ui-slider {
	position: relative;
	text-align: left;
}
.ui-slider .ui-slider-handle {
	position: absolute;
	z-index: 2;
	width: 1.2em;
	height: 1.2em;
	cursor: default;
	-ms-touch-action: none;
	touch-action: none;
}
.ui-slider .ui-slider-range {
	position: absolute;
	z-index: 1;
	font-size: .7em;
	display: block;
	border: 0;
	background-position: 0 0;
}

/* support: IE8 - See #6727 */
.ui-slider.ui-state-disabled .ui-slider-handle,
.ui-slider.ui-state-disabled .ui-slider-range {
	filter: inherit;
}

.ui-slider-horizontal {
	height: .8em;
}
.ui-slider-horizontal .ui-slider-handle {
	top: -.3em;
	margin-left: -.6em;
}
.ui-slider-horizontal .ui-slider-range {
	top: 0;
	height: 100%;
}
.ui-slider-horizontal .ui-slider-range-min {
	left: 0;
}
.ui-slider-horizontal .ui-slider-range-max {
	right: 0;
}

.ui-slider-vertical {
	width: .8em;
	height: 100px;
}
.ui-slider-vertical .ui-slider-handle {
	left: -.3em;
	margin-left: 0;
	margin-bottom: -.6em;
}
.ui-slider-vertical .ui-slider-range {
	left: 0;
	width: 100%;
}
.ui-slider-vertical .ui-slider-range-min {
	bottom: 0;
}
.ui-slider-vertical .ui-slider-range-max {
	top: 0;
}
.ui-spinner {
	position: relative;
	display: inline-block;
	overflow: hidden;
	padding: 0;
	vertical-align: middle;
}
.ui-spinner-input {
	border: none;
	background: none;
	color: inherit;
	padding: 0;
	margin: .2em 0;
	vertical-align: middle;
	margin-left: 0;
	margin-right: 22px;
}
.ui-spinner-button {
	width: 16px;
	height: 50%;
	font-size: .5em;
	padding: 0;
	margin: 0;
	text-align: center;
	position: absolute;
	cursor: default;
	display: block;
	overflow: hidden;
	right: 0;
}
/* more specificity required here to override default borders */
.ui-spinner a.ui-spinner-button {
	border-top: none;
	border-bottom: none;
	border-right: none;
}
/* vertically center icon */
.ui-spinner .ui-icon {
	position: absolute;
	margin-top: -8px;
	top: 50%;
	left: 0;
}
.ui-spinner-up {
	top: 0;
}
.ui-spinner-down {
	bottom: 0;
}

/* TR overrides */
.ui-spinner .ui-icon-triangle-1-s {
	/* need to fix icons sprite 
	background-position: -65px -16px;*/
}
.ui-tabs {
	position: relative;/* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
	padding: .2em;
}
.ui-tabs .ui-tabs-nav {
	margin: 0;
	padding: .2em .2em 0;
}
.ui-tabs .ui-tabs-nav li {
	list-style: none;
	float: left;
	position: relative;
	top: 0;
	margin: 1px .2em 0 0;
	border-bottom-width: 0;
	padding: 0;
	white-space: nowrap;
}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
	float: left;
	padding: .5em .9em;
	text-decoration: none;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
	margin-bottom: -1px;
	padding-bottom: 1px;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
	cursor: text;
}
.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor {
	cursor: pointer;
}
.ui-tabs .ui-tabs-panel {
	display: block;
	border-width: 0;
	background: none;
}
.ui-tooltip {
	padding: 8px;
	position: absolute;
	z-index: 9999;
	max-width: 300px;
	-webkit-box-shadow: 0 0 5px #aaa;
	box-shadow: 0 0 5px #aaa;
}
body .ui-tooltip {
	border-width: 2px;
}

/*Grid*/
.ui-jqgrid {position: relative;}
.ui-jqgrid .ui-jqgrid-view {position: relative;left:0; top: 0; padding: 0; font-size:11px;}
/* caption*/
.ui-jqgrid .ui-jqgrid-titlebar {padding: .3em .2em .2em .3em; position: relative; font-size: 12px; border-left: 0 none;border-right: 0 none; border-top: 0 none;}
.ui-jqgrid .ui-jqgrid-caption {text-align: left;}
.ui-jqgrid .ui-jqgrid-title { margin: .1em 0 .2em; }
.ui-jqgrid .ui-jqgrid-titlebar-close { position: absolute;top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height:18px; cursor:pointer;}
.ui-jqgrid .ui-jqgrid-titlebar-close span { display: block; margin: 1px; }
.ui-jqgrid .ui-jqgrid-titlebar-close:hover { padding: 0; }
/* header*/
.ui-jqgrid .ui-jqgrid-hdiv {position: relative; margin: 0;padding: 0; overflow-x: hidden; border-left: 0 none !important; border-top : 0 none !important; border-right : 0 none !important;}
.ui-jqgrid .ui-jqgrid-hbox {float: left;}
.ui-jqgrid .ui-jqgrid-htable {table-layout:fixed;margin:0;}
.ui-jqgrid .ui-jqgrid-htable th {height:22px;padding: 0 7px 0 2px;}
.ui-jqgrid .ui-jqgrid-htable th div {overflow: hidden; position:relative; height:auto;}
.ui-th-column, .ui-jqgrid .ui-jqgrid-htable th.ui-th-column {overflow: hidden;white-space: nowrap;text-align:center;border-top : 0 none;border-bottom : 0 none;}
.ui-th-ltr, .ui-jqgrid .ui-jqgrid-htable th.ui-th-ltr {border-left : 0 none!important;}
.ui-th-rtl, .ui-jqgrid .ui-jqgrid-htable th.ui-th-rtl {border-right : 0 none;}
.ui-first-th-ltr {border-right: 1px solid; }
.ui-first-th-rtl {border-left: 1px solid; }
.ui-jqgrid .ui-th-div-ie {white-space: nowrap; zoom :1; height:17px;}
.ui-jqgrid .ui-jqgrid-resize {height:20px !important;position: relative; cursor :e-resize;display: inline;overflow: hidden;}
.ui-jqgrid .ui-grid-ico-sort {overflow:hidden;position:absolute;display:inline; cursor: pointer !important;}
.ui-jqgrid .ui-icon-asc {margin-top:-3px; height:12px;}
.ui-jqgrid .ui-icon-desc {margin-top:3px;height:12px;}
.ui-jqgrid .ui-i-asc {margin-top:0;height:16px;}
.ui-jqgrid .ui-i-desc {margin-top:0;margin-left:13px;height:16px;}
.ui-jqgrid .ui-jqgrid-sortable {cursor:pointer;}
.ui-jqgrid tr.ui-search-toolbar th { border-top-width: 1px !important; border-top-color: inherit !important; border-top-style: ridge !important }
tr.ui-search-toolbar input {margin: 1px 0 0 0}
tr.ui-search-toolbar select {margin: 1px 0 0 0}
/* body */ 
.ui-jqgrid .ui-jqgrid-bdiv {position: relative; margin: 0; padding:0; overflow: auto; text-align:left; font-size:12px;will-change: transform;transform: translateZ(0);}
.ui-jqgrid .ui-jqgrid-btable {table-layout:fixed; margin:0; outline-style: none; }
.ui-jqgrid tr.jqgrow { outline-style: none; }
.ui-jqgrid tr.jqgroup { outline-style: none; }
.ui-jqgrid tr.jqgrow td {/*font-weight: normal;*/overflow: hidden; white-space: nowrap; height: var(--row-height);padding: 0 2px 0 2px;border-bottom-width: 1px; border-bottom-color: inherit; border-bottom-style: solid;}
.ui-jqgrid tr.jqgfirstrow td {padding: 0 7px 0 2px;border-right-width: 1px; border-right-style: solid;}
.ui-jqgrid tr.jqgroup td {font-weight: normal; overflow: hidden; white-space: pre; height: 22px;padding: 0 7px 0 2px;border-bottom-width: 1px; border-bottom-color: inherit; border-bottom-style: solid;}
.ui-jqgrid tr.jqfoot td {font-weight: bold; overflow: hidden; white-space: pre; height: 22px;padding: 0 7px 0 2px;border-bottom-width: 1px; border-bottom-color: inherit; border-bottom-style: solid;}
.ui-jqgrid tr.ui-row-ltr td {
    text-align:left;
    border-right-width: 1px;
    border-right-color: inherit;
    text-indent: 10px;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 1px;
    padding-bottom: 1px;
    border-right-style:none;
}
.ui-jqgrid tr.ui-row-rtl td {text-align:right;border-left-width: 1px; border-left-color: inherit; border-left-style: solid;}
.ui-jqgrid td.jqgrid-rownum { padding: 0 2px 0 2px; margin: 0; border: 0 none;}
.ui-jqgrid .ui-jqgrid-resize-mark { width:2px; left:0; background-color:#777; cursor: e-resize; cursor: col-resize; position:absolute; top:0; height:100px; overflow:hidden; display:none; border:0 none; z-index: 99999;}
/* footer */
.ui-jqgrid .ui-jqgrid-sdiv {position: relative; margin: 0;padding: 0; overflow: hidden; border-left: 0 none !important; border-top : 0 none !important; border-right : 0 none !important;}
.ui-jqgrid .ui-jqgrid-ftable {table-layout:fixed; margin-bottom:0;}
.ui-jqgrid tr.footrow td {font-weight: bold; overflow: hidden; white-space:nowrap; height: 21px;padding: 0 2px 0 2px;border-top-width: 1px; border-top-color: inherit; border-top-style: solid;}
.ui-jqgrid tr.footrow-ltr td {border-right-width: 1px; border-right-color: transparent; border-right-style: solid;}
.ui-jqgrid tr.footrow-rtl td {text-align:right;border-left-width: 1px; border-left-color: inherit; border-left-style: solid;}
/* Pager*/
.ui-jqgrid .ui-jqgrid-pager { border-left: 0 none !important;border-right: 0 none !important; border-bottom: 0 none !important; margin: 0 !important; padding: 0 !important; position: relative; height: 25px;white-space: nowrap;overflow: hidden;font-size:11px;}
.ui-jqgrid .ui-pager-control {position: relative;}
.ui-jqgrid .ui-pg-table {position: relative; padding-bottom:2px; width:auto; margin: 0;}
.ui-jqgrid .ui-pg-table td {font-weight:normal; vertical-align:middle; }
.ui-jqgrid .ui-pg-button  { height:19px !important;}
.ui-jqgrid .ui-pg-button span { display: block; margin: 1px; float:left;}
.ui-jqgrid .ui-pg-input { height:13px;font-size:.8em; margin: 0;}
.ui-jqgrid .ui-pg-selbox {font-size:.8em; line-height:18px; display:block; height:18px; margin: 0;}
.ui-jqgrid .ui-separator {height: 18px; border-left: 1px solid #ccc ; border-right: 1px solid #ccc ; margin: 1px; float: right;}
.ui-jqgrid .ui-paging-info {font-weight: normal;height:19px; margin-top:3px;margin-right:4px;}
.ui-jqgrid .ui-jqgrid-pager .ui-pg-div {padding:1px 0;float:left;position:relative;}
.ui-jqgrid .ui-jqgrid-pager .ui-pg-button { cursor:pointer; }
.ui-jqgrid .ui-jqgrid-pager .ui-pg-div  span.ui-icon {float:left;margin:0 2px;}
.ui-jqgrid td input, .ui-jqgrid td select { margin: 0;}
.ui-jqgrid td textarea {width:auto;height:auto;margin: 0;}
.ui-jqgrid .ui-jqgrid-toppager {border-left: 0 none !important;border-right: 0 none !important; border-top: 0 none !important; margin: 0 !important; padding: 0 !important; position: relative; height: 25px !important;white-space: nowrap;overflow: hidden;}
.ui-jqgrid .ui-jqgrid-toppager .ui-pg-div {padding:1px 0;float:left;position:relative;}
.ui-jqgrid .ui-jqgrid-toppager .ui-pg-button { cursor:pointer; }
.ui-jqgrid .ui-jqgrid-toppager .ui-pg-div  span.ui-icon {float:left;margin:0 2px;}
/*subgrid*/
.ui-jqgrid .ui-jqgrid-btable .ui-sgcollapsed span {display: block;}
.ui-jqgrid .ui-subgrid {margin:0;padding:0; width:100%;}
.ui-jqgrid .ui-subgrid table {table-layout: fixed;}
.ui-jqgrid .ui-subgrid tr.ui-subtblcell td {height:18px;border-right-width: 1px; border-right-color: inherit; border-right-style: solid;border-bottom-width: 1px; border-bottom-color: inherit; border-bottom-style: solid;}
.ui-jqgrid .ui-subgrid td.subgrid-data {border-top:  0 none !important;}
.ui-jqgrid .ui-subgrid td.subgrid-cell {border-width: 0 0 1px 0;}
.ui-jqgrid .ui-th-subgrid {height:20px;}
/* loading */
.ui-jqgrid .loading {position: absolute; top: 45%;left: 45%;width: auto;z-index:101;padding: 6px; margin: 5px;text-align: center;font-weight: bold;display: none;border-width: 2px !important; font-size:11px;}
.ui-jqgrid .jqgrid-overlay {display:none;z-index:100;}
/* IE * html .jqgrid-overlay {width: expression(this.parentNode.offsetWidth+'px');height: expression(this.parentNode.offsetHeight+'px');} */
* .jqgrid-overlay iframe {position:absolute;top:0;left:0;z-index:-1;}
/* IE width: expression(this.parentNode.offsetWidth+'px');height: expression(this.parentNode.offsetHeight+'px');}*/
/* end loading div */
/* toolbar */
.ui-jqgrid .ui-userdata {border-left: 0 none;    border-right: 0 none;	height : 21px;overflow: hidden;	}
/*Modal Window */
.ui-jqdialog { display: none; width: 300px; position: absolute; padding: .2em; font-size:11px; overflow:visible;}
.ui-jqdialog .ui-jqdialog-titlebar { padding: .3em .2em; position: relative;  }
.ui-jqdialog .ui-jqdialog-title { margin: .1em 0 .2em; } 
.ui-jqdialog .ui-jqdialog-titlebar-close { position: absolute;  top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; cursor:pointer;}

.ui-jqdialog .ui-jqdialog-titlebar-close span { display: block; margin: 1px; }
.ui-jqdialog .ui-jqdialog-titlebar-close:hover, .ui-jqdialog .ui-jqdialog-titlebar-close:focus { padding: 0; }
.ui-jqdialog-content, .ui-jqdialog .ui-jqdialog-content { border: 0; padding: .3em .2em; background: none; height:auto;}
.ui-jqdialog .ui-jqconfirm {padding: .4em 1em; border-width:3px;position:absolute;bottom:10px;right:10px;overflow:visible;display:none;height:80px;width:220px;text-align:center;}
.ui-jqdialog>.ui-resizable-se { bottom: -3px; right: -3px}
.ui-jqgrid>.ui-resizable-se { bottom: -3px; right: -3px }
/* end Modal window*/
/* Form edit */
.ui-jqdialog-content .FormGrid {margin: 0;}
.ui-jqdialog-content .EditTable { width: 100%; margin-bottom:0;}
.ui-jqdialog-content .DelTable { width: 100%; margin-bottom:0;}
.EditTable td input, .EditTable td select, .EditTable td textarea {margin: 0;}
.EditTable td textarea { width:auto; height:auto;}
.ui-jqdialog-content td.EditButton {text-align: right;border-top: 0 none;border-left: 0 none;border-right: 0 none; padding-bottom:5px; padding-top:5px;}
.ui-jqdialog-content td.navButton {text-align: center; border-left: 0 none;border-top: 0 none;border-right: 0 none; padding-bottom:5px; padding-top:5px;}
.ui-jqdialog-content input.FormElement {padding:.3em}
.ui-jqdialog-content select.FormElement {padding:.3em}
.ui-jqdialog-content .data-line {padding-top:.1em;border: 0 none;}

.ui-jqdialog-content .CaptionTD {vertical-align: middle;border: 0 none; padding: 2px;white-space: nowrap;}
.ui-jqdialog-content .DataTD {padding: 2px; border: 0 none; vertical-align: top;}
.ui-jqdialog-content .form-view-data {white-space:pre}
.fm-button { display: inline-block; margin:0 4px 0 0; padding: .4em .5em; text-decoration:none !important; cursor:pointer; position: relative; text-align: center; zoom: 1; }
.fm-button-icon-left { padding-left: 1.9em; }
.fm-button-icon-right { padding-right: 1.9em; }
.fm-button-icon-left .ui-icon { right: auto; left: .2em; margin-left: 0; position: absolute; top: 50%; margin-top: -8px; }
.fm-button-icon-right .ui-icon { left: auto; right: .2em; margin-left: 0; position: absolute; top: 50%; margin-top: -8px;}
#nData, #pData { float: left; margin:3px;padding: 0; width: 15px; }
/* End Eorm edit */
/*.ui-jqgrid .edit-cell {}*/
.ui-jqgrid .selected-row, div.ui-jqgrid .selected-row td {font-style : normal;border-left: 0 none;}
/* inline edit actions button*/
.ui-inline-del.ui-state-hover span, .ui-inline-edit.ui-state-hover span,
.ui-inline-save.ui-state-hover span, .ui-inline-cancel.ui-state-hover span {
    margin: -1px;
}
/* Tree Grid */
.ui-jqgrid .tree-wrap {float: left; position: relative;height: inherit;white-space: nowrap;overflow: hidden;}
.ui-jqgrid .tree-minus {position: absolute; height: 18px; width: 18px; overflow: hidden;}
.ui-jqgrid .tree-plus {position: absolute;	height: 18px; width: 18px;	overflow: hidden;}
.ui-jqgrid .tree-leaf {position: absolute;	height: 18px; width: 18px;overflow: hidden;}
.ui-jqgrid .treeclick {cursor: pointer;}
/* moda dialog */
* iframe.jqm {position:absolute;top:0;left:0;z-index:-1;}
/*	 width: expression(this.parentNode.offsetWidth+'px');height: expression(this.parentNode.offsetHeight+'px');}*/
.ui-jqgrid-dnd tr td {border-right-width: 1px; border-right-color: inherit; border-right-style: solid; height:20px}
/* RTL Support */
.ui-jqgrid .ui-jqgrid-caption-rtl {text-align: right;}
.ui-jqgrid .ui-jqgrid-hbox-rtl {float: right; padding-left: 20px;}
.ui-jqgrid .ui-jqgrid-resize-ltr {float: right;margin: -2px -2px -2px 0; width:7px!important;}
.ui-jqgrid .ui-jqgrid-resize-rtl {float: left;margin: -2px 0 -1px -3px;}
.ui-jqgrid .ui-sort-rtl {left:0;}
.ui-jqgrid .tree-wrap-ltr {float: left;}
.ui-jqgrid .tree-wrap-rtl {float: right;}
.ui-jqgrid .ui-ellipsis {text-overflow:ellipsis;}

/* Toolbar Search Menu */
.ui-search-menu { position: absolute; padding: 2px 5px;}
.ui-jqgrid .ui-search-table { padding: 0; border: 0 none; height:20px; width:100%;}
.ui-jqgrid .ui-search-table .ui-search-oper { width:20px; }
a.g-menu-item, a.soptclass, a.clearsearchclass { cursor: pointer; }
.ui-jqgrid .ui-search-table .ui-search-input>input,
.ui-jqgrid .ui-search-table .ui-search-input>select
{
    display: block;
    box-sizing: border-box;
} 
.ui-jqgrid .ui-jqgrid-view input,
.ui-jqgrid .ui-jqgrid-view select,
.ui-jqgrid .ui-jqgrid-view textarea,
.ui-jqgrid .ui-jqgrid-view button {
    font-size: 11px
}

.jqGridHolder {
    box-sizing: border-box;
    border-radius: var(--border-radius-l);
    border: 1px solid var(--bg-border-light);
    overflow: hidden;
    padding: 0;
    float: left;
    width: 100%;
    height: calc(100% - 50px);
}

.jqGridHolder .jqGridHolder {
    border: 0px;
    height: inherit !important;
}

.bubbleDialogHolder.ui-dialog-content .jqGridHolder {
    border: 0px;
}
.bubbleDialogHolder.ui-dialog-content:has(.ui-accordion-content > .jqGridHolder) .ui-accordion-content:has(.jqGridHolder) {
    padding: 0px !important;
    /* Keep the 5px side margins the accordion header uses, or the grid juts out past the card. */
    margin: 0px 5px !important;
    border: solid 1px var(--bg-border-light) !important;
}
.ui-accordion .ui-accordion-content:has(.jqGridHolder) {
    padding: 0px !important;
   
}
.ui-accordion .ui-accordion-content:has(.jqGridHolder):has(.gridMenu){
    padding-top: 5px !important;
}
.jqGridHolder--selectiveContractIndexation{
    height:100% !important;
    max-height:50vh;
}
.ionBizDialogDetails:has(#gview_gridSelectiveContractIndexation){
    height:90vh !important;
}
.jqGridHolder--odataTables{
    min-height: calc(100% - 40px) !important;
}

/* MyTimesheets Today/This week home widget popup: bubble dialog has height:auto,
   so the grid body has no bounded scroll height. Cap it so the rows scroll. */
#gview_gridMyTimesheets .ui-jqgrid-bdiv {
    max-height: 40vh !important;
    overflow-y: auto !important;
}

#westLayout > .ui-layout-content > .jqGridHolder {
    border-right-color: var(--bg-border);
    border-top: 0px !important;
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
    background: var(--bg);
    height: calc(100% - 2px);
}

#eastPane .ui-layout-content .jqGridHolder, .ui-accordion-content:has(.gridMenu).jqGridHolder, .ui-accordion-content:has(.gridMenu) .jqGridHolder {
    border: 0px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}
/*#eastPane .ui-tabs-panel:has(.icon-grid-insert) > .jqGridHolder .ui-jqgrid-btable, .ui-accordion-content:has(.icon-grid-insert).jqGridHolder .ui-jqgrid-btable, .ui-accordion-content:has(.icon-grid-insert) .jqGridHolder .ui-jqgrid-btable {
    border-spacing: 0px 2px;
}*/
.ui-dialog .ui-accordion-content .jqGridHolder {
    border-color: var(--bg-border-light);
}
/* A grid that fills the pane on its own sits directly against the card border, so its
   own would double it. Views emit an inline script beside the grid, hence the :not
   pair rather than :only-child. Panes that also hold a toolbar are handled above. */
.ui-dialog .ui-accordion-content:not(:has(> :not(.jqGridHolder):not(script))) > .jqGridHolder {
    border: 0;
    border-radius: 0 0 var(--border-radius-l) var(--border-radius-l);
}
.ui-accordion-content:has(.jqGridHolder):not(:has(.gridMenu)){
    border: solid 1px var(--east-bg) !important;
}
#eastPane .ui-layout-content .jqGridHolder .ui-jqgrid-hdiv, .ui-accordion-content .jqGridHolder .ui-jqgrid-hdiv, .ui-accordion-content:has(.gridMenu) .jqGridHolder .ui-jqgrid-hdiv {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}
 #eastPane .ui-layout-content .noteHolder{
     border: 0px;
 }
.jqGridHolder .ui-jqgrid.ui-widget {
    width: inherit !important;
    height: 100% !important;

}
:not(#gridPlanningsContainer) > .jqGridHolder .ui-jqgrid.ui-widget { /*don't apply to planning*/
    width: 100% !important;
    height: 100% !important;
    background: var(--bg);
    border-radius: var(--border-radius-md);
    /*margin: 0px 8px 0px 8px;*/
}
:not(#gridPlanningsContainer) > .savedFilters .jqGridHolder .ui-jqgrid.ui-widget {
    background: var(--east-bg);
}
#gridTimesheets .jqGridHolder .ui-jqgrid.ui-widget { /*don't apply to planning and timesheets*/
    width: auto !important;
    height: 100% !important;
    background: var(--bg);
    border-radius: var(--border-radius-sm);
    margin: 0px !important;
}
#gridTimesheets .ui-jqgrid-hdiv:not(.frozen-div), .ui-jqgrid-sdiv:not(.frozen-div) { /*don't apply to planning and timesheets*/
    width: auto !important;
}
#eastPane .ui-accordion-content:not(.reportDataHolder) .ui-jqgrid-bdiv {
    max-height: 600px !important;
}
.ui-jqgrid-view {
    width: 100% !important;
    height: inherit;
}
.ui-dialog:has(.ui-dialog-content > .gridMenu + .jqGridHolder) .ui-dialog-content{
    padding-left: 0px !important;
    padding-right: 0px !important;
    padding-bottom: 0px !important;
}
.ui-dialog-content .tabContainer:not(.tabsStrip) {height:40px;} .ui-dialog-content > .tabContainer ~ .ui-tabs-panel > .gridMenu + .jqGridHolder {
    height: calc(100% - 50px) !important;
    border-color: var(--bg-border-light) !important;
} .ui-dialog-content > .tabContainer ~ .ui-tabs-panel {
    height: calc(100% - 52px) !important;
} .ui-dialog-content > .gridMenu + .jqGridHolder {
    height: calc(100% - 50px) !important;
    border-radius: 0px;
    border-left-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
} .ui-layout-east .ui-accordion-content .ui-jqgrid-view{ width:calc(100%) !important;height: calc(100% - 22px) !important;} .ui-layout-east .reportDataHolder.ui-accordion-content .ui-jqgrid-view{ height: calc(100% - 36px) !important;} .ui-layout-east .reportDataHolder.ui-accordion-content .gridMenu + .jqGridHolder .ui-jqgrid-view{ height: calc(100% - 41px) !important;} .ui-jqgrid-bdiv:not(.frozen-bdiv) { width: inherit !important;min-height: 30px;}
/* height when footer row exists */
.ui-jqgrid-view div.frozen-bdiv { overflow: hidden;} .ui-jqgrid tr.footrow td {
    font-weight: bold;
    overflow: hidden;
    white-space: nowrap;
    height: 21px;
    padding: 0 7px 0 2px;
    border-top-width: 0px !important;
    border-top-color: inherit;
    border-top-style: none !important;
    text-indent: 10px;
}
.jqGridHolder .ui-jqgrid .loading {
    top: 45%;
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: fit-content;
    max-width: 252px;
    z-index: 101;
    padding: 5px 10px;
    text-align: center;
    font-weight: 500;
    font-size: 11px;
    background-color: var(--menu-hover);
    color: white;
    border: solid 1px var(--bg-border-light) !important;
    border-radius: var(--border-radius-md);
}
body.dark .jqGridHolder .ui-jqgrid .loading{
    color: black;
}
.jqGridHolder .ui-jqgrid .loading.noSpinner{
    background-color: #fff1a4 !important;
    color: black;
}
.loading:not(.noSpinner)[style*="display: block"] + .ui-jqgrid-view{
    /* The skeleton overlay is built in JS by ionBiz.jqGrid.js
       (see jqgrid-skeleton-overlay below) so we only need to make sure
       the loading indicator floats above the .ui-jqgrid-view contents. */
    z-index: 13;
}

/* JS-built skeleton overlay (mirrors the ribbon-inline skeleton chips):
   one .jqgrid-skeleton-cell per visible column \u00d7 N rows, each with a
   .jqgrid-skeleton-bar inside that pulses with the same shimmer
   animation as `.chip-skeleton-label` / `.chip-skeleton-value`. */
/* The overlay is mounted inside .ui-jqgrid-bdiv (the body div) so the real
   header (.ui-jqgrid-hdiv) stays visible during reload. Make sure the
   bdiv is a positioning context for the absolute overlay. */
.ui-jqgrid-bdiv:has(> .jqgrid-skeleton-overlay) { position: relative; }
.jqgrid-skeleton-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    /* height + JS top-sync (not bottom:0) keeps the overlay pinned to the
       visible scroll frame; an absolute child of the scrollable bdiv would
       otherwise scroll out of view with the content. */
    height: 100%;
    z-index: 12;
    pointer-events: none;
    overflow: hidden;
    /* Opaque so any previously-rendered grid content underneath is
       fully hidden during reload. Uses the theme background token. */
    background-color: var(--bg, #ffffff);
}
.jqgrid-skeleton-overlay .jqgrid-skeleton-row {
    display: flex;
    flex-direction: row;
    height: var(--row-height, 32px);
    border-bottom: 1px solid color-mix(in srgb, var(--bg-border, #b6bcc4) 35%, transparent);
    box-sizing: border-box;
}
.jqgrid-skeleton-overlay .jqgrid-skeleton-bar { width: 100%; }
.jqgrid-skeleton-overlay .jqgrid-skeleton-cell {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    padding: 0 12px;
    border-right: 1px solid color-mix(in srgb, var(--bg-border, #b6bcc4) 45%, transparent);
    box-sizing: border-box;
    overflow: hidden;
}
/* Not scoped to the overlay: the bar is the app's skeleton primitive, and the home timesheet list
   uses it too. Width is the caller's business, which is why it is not set here. */
.jqgrid-skeleton-bar {
    display: block;
    height: 10px;
    max-width: 100%;
    border-radius: 4px;
    background-color: color-mix(in srgb, var(--bg-border-light, #b6bcc4) 45%, transparent);
    background-image: linear-gradient(
        90deg,
        transparent 0%,
        color-mix(in srgb, var(--input-focus, #2563eb) 22%, transparent) 50%,
        transparent 100%
    );
    background-size: 200% 100%;
    background-repeat: no-repeat;
    background-position: -100% 0;
    animation: jqgrid-skeleton-shimmer 1.4s linear infinite;
}
@keyframes jqgrid-skeleton-shimmer {
    0%   { background-position: -100% 0; }
    100% { background-position: 200% 0; }
}
@media (prefers-reduced-motion: reduce) {
    .jqgrid-skeleton-bar {
        animation: none;
        background-image: none;
    }
}
.jqGridHolder .ui-jqgrid .jqgrid-overlay {
    /*display: block;*/
    position: absolute;
    background-color: rgba(255,255,255, 0.5);
    width: 100%;
    height: 100%;
} .ui-jqgrid-bdiv tr {
    border-bottom: 1px solid var(--bg-border-light); 
}
 #savedFiltersGridWest tr,  #savedFiltersGridWest td{
     border-bottom-color:transparent;
 }
.ui-th-column div { text-align: center;font-weight: bold;line-height: 18px; text-transform: var(--grid-header-text-transform, unset);}
/* --- Darker header grid   ---*/
.ui-jqgrid .ui-jqgrid-htable {
    height: 36px;
    color: var(--txt-color);
    text-indent: 10px;
}
/* holders for header and footer */
.ui-jqgrid-hdiv {
    border-radius: var(--border-radius-sm) var(--border-radius-sm) 0px 0px;
    border-bottom: solid 1px var(--bg-border-light);
    background: var(--grid-header-bg);
}
.frozen-div.ui-jqgrid-hdiv {
    border-radius: var(--border-radius-sm) 0px 0px 0px;
}
.ui-layout-west .ui-jqgrid-hdiv {
    border-radius: 0px 0px 0px 0px;
}
.ui-jqgrid-sdiv {
    border-radius: 2px 2px 0px 0px;
}
.ui-jqgrid-hdiv:not(.frozen-div), .ui-jqgrid-sdiv:not(.frozen-div) { width: 100% !important; } .ui-jqgrid-hdiv.frozen-div { overflow-y: hidden; background-color: #F9FBFA; } .ui-jqgrid tr:not(.jqg-second-row-header) .ui-jqgrid-htable th.ui-th-ltr, tr:not(.jqg-second-row-header) .ui-state-default.ui-th-column.ui-th-ltr {
    white-space: nowrap;
    overflow: hidden;
    border-left: solid 1px transparent;
    border-right: solid 1px transparent;
} .ui-jqgrid .ui-jqgrid-resize {
    z-index: 1;
    border-right: 1px solid transparent;
}
.ui-jqgrid th:hover > .ui-jqgrid-resize{
    border-right: 1px solid var(--bg-border);
}
.jqGridHolder .ui-jqgrid-btable tr td.dayCell.schedule-selected {
    background-color: #fff !important;
    border: 1px solid var(--input-focus);
}
/* --- Lighter header grid   ---*/
/*.ui-layout-east .jqGridHolder,*/
.ui-tooltip .jqGridHolder {
    border: 0px;
} .ui-layout-east > .ui-layout-content > * .ui-jqgrid .ui-jqgrid-htable, .ui-layout-west > .ui-layout-content > * .ui-jqgrid .ui-jqgrid-htable, .ui-dialog .ui-jqgrid .ui-jqgrid-htable, .tooltipster-ionBIZ .ui-jqgrid .ui-jqgrid-htable, .ui-tooltip .ui-jqgrid .ui-jqgrid-htable {
    height: 32px;
    text-indent: 10px;
} 
   .ui-layout-east > .ui-layout-content > * .ui-jqgrid-sdiv, .ui-layout-west > .ui-layout-content > * .ui-jqgrid-sdiv, .ui-dialog .jqGridHolder .ui-jqgrid-sdiv, .tooltipster-base .jqGridHolder .ui-jqgrid-sdiv, .ui-tooltip .jqGridHolder .ui-jqgrid-sdiv {
    background: none;
    background-color: inherit;
} .ui-layout-east > .ui-layout-content > * .ui-jqgrid-sdiv .footrow, .ui-layout-west > .ui-layout-content > * .ui-jqgrid-sdiv .footrow, .ui-dialog .ui-jqgrid-sdiv .footrow, .tooltipster-base .ui-jqgrid-sdiv .footrow, .ui-tooltip .ui-jqgrid-sdiv .footrow {
    height: 36px;
} .ui-jqgrid-sdiv div.ionBiz-progressbar {
    margin-right: 12px;
    margin-left: 12px;
} .ui-layout-east > .ui-layout-content > * .jqGridPager, .ui-layout-west > .ui-layout-content > * .jqGridPager, .ui-dialog .jqGridPager, .tooltipster-base .jqGridPager, .ui-tooltip .jqGridPager {
    background-color: inherit;
} .ui-pg-table td:last-child { width: 55px; } .ui-jqgrid .ui-pager-control {
    padding-right: 5px;
    padding-left: 5px;
} .ui-layout-east > .ui-layout-content > * .jqGridHolder .ui-pg-table .ui-pg-button span, .ui-layout-west > .ui-layout-content > * .jqGridHolder .ui-pg-table .ui-pg-button span, .ui-dialog .jqGridHolder .ui-pg-table .ui-pg-button span, .tooltipster-base .jqGridHolder .ui-pg-table .ui-pg-button span, .ui-tooltip .jqGridHolder .ui-pg-table .ui-pg-button span {
    color: rgb(102, 102, 102);
    background: -moz-linear-gradient(top,  #f9f9f9 0%, #f0f0f0 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9f9f9), color-stop(100%,#f0f0f0)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #f9f9f9 0%,#f0f0f0 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #f9f9f9 0%,#f0f0f0 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #f9f9f9 0%,#f0f0f0 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #f9f9f9 0%,#f0f0f0 100%); /* W3C */
    border: 1px solid rgb(228, 226, 226);
} .ui-layout-east > .ui-layout-content > * .jqGridHolder .ui-pg-table .ui-pg-button.ui-state-disabled span, .ui-layout-west > .ui-layout-content > * .jqGridHolder .ui-pg-table .ui-pg-button.ui-state-disabled span, .ui-dialog .jqGridHolder .ui-pg-table .ui-pg-button.ui-state-disabled span, .tooltipster-base .jqGridHolder .ui-pg-table .ui-pg-button.ui-state-disabled span, .ui-tooltip .jqGridHolder .ui-pg-table .ui-pg-button.ui-state-disabled span {
    color: rgb(204, 204, 204);
} .ui-layout-east > .ui-layout-content > * .jqGridHolder .ui-pg-table .ui-separator, .ui-layout-west > .ui-layout-content > * .jqGridHolder .ui-pg-table .ui-separator, .ui-dialog .jqGridHolder .ui-pg-table .ui-separator, .tooltipster-base .jqGridHolder .ui-pg-table .ui-separator, .ui-tooltip .jqGridHolder .ui-pg-table .ui-separator {
    display: none;
} .ui-jqgrid .ui-paging-info {
    margin-right: 0;
    margin-left: 3px;
} .ui-jqgrid .ui-paging-info span:nth-of-type(2) {
    font-weight: bold;
    color: var(--menu-hover);
    background: var(--bg);
    border-radius: var(--border-radius-xs);
}
/* --- //   ---*/

.ui-jqgrid tr td {
    border-bottom: 0px;
} 

.ui-jqgrid tr.jqgroup td {
    height: 26px;
}

.ui-jqgrid td.jqgrid-rownum { background-color: var(--grid-header-bg); text-indent: 0px !important;} .ui-jqgrid .ui-jqgrid-htable tr:not(.jqg-first-row-header):not(.jqg-second-row-header):not(.jqg-third-row-header) th { height: 29px!important;}
.ui-jqgrid .ui-jqgrid-htable tr.ui-jqgrid-labels:not(.jqg-first-row-header):not(.jqg-second-row-header):not(.jqg-third-row-header) th { height: 36px !important; vertical-align: middle; }
.ui-jqgrid tr.jqgrow td a {
    color: var(--blue);
    font-weight: 500;
}

.ui-jqgrid tr.jqgrow td a.btnUndo {
    color: var(--red);
    font-weight: 500;
}
.ui-jqgrid tr.jqgrow td.selection {
    color: var(--txt-color);
    font-weight: 500;
}
/* Tag look for the identifying cell, in the shapes it comes in: a bare text node, a
   treegrid span.cell-wrapper, and a colour-swatch label span. The text node has no
   element to style, so it is re-rendered from title. The :has() guard allows a leading
   decorative avatar but nothing else, so links, formatter markup and inline-edit inputs
   stay untouched. */
.ui-jqgrid tr.jqgrow td.selection[title]:not([title=""]):not(:has(> :not(.imageWithText))) {
    /* !important: per-grid rules such as workshifts.css set a font-size on the first
       cell, which would print the raw text next to the chip. */
    font-size: 0 !important;
}
/* The chip's own padding replaces the cell indent that keeps plain text off the border.
   On tree cells the indent lands on the chip's line box, not on the floated tree-wrap. */
.ui-jqgrid tr.jqgrow td.selection[title]:not([title=""]):not(:has(> :not(.imageWithText))),
.ui-jqgrid tr.jqgrow td.selection:has(> span:is(.cell-wrapper, .cell-wrapperleaf)) {
    text-indent: 0;
}
.ui-jqgrid tr.jqgrow td.selection[title]:not([title=""]):not(:has(> :not(.imageWithText)))::after,
.ui-jqgrid tr.jqgrow td.selection > .colorautocomplete-color + span,
.ui-jqgrid tr.jqgrow td.selection > span:is(.cell-wrapper, .cell-wrapperleaf):not(:has(input)) {
    font-size: 11px;
    line-height: 18px;
    padding: 2px 8px;
    /* Floated chips inherit the cell indent and re-apply it to their own line box,
       which would push the label off the chip's left padding. */
    text-indent: 0;
    border-radius: var(--border-radius-xs);
    background: color-mix(in srgb, currentColor 5%, transparent);
    color: inherit;
    vertical-align: middle;
}
/* ::after, not ::before, so the chip follows the avatar instead of preceding it. */
.ui-jqgrid tr.jqgrow td.selection[title]:not([title=""]):not(:has(> :not(.imageWithText)))::after {
    /* The / "" alt text keeps screen readers from announcing the value twice. */
    content: attr(title) / "";
    display: inline-block;
}
.ui-jqgrid tr.jqgrow td.selection > .imageWithText {
    margin-right: 6px;
}
/* The glyph carries a -10px margin that cancels the inherited cell indent, which the
   chip rule above removes. */
.ui-jqgrid tr.jqgrow td.selection > .imageWithText span:before {
    margin-left: 0;
}
/* The formatter inlines line-height: 26px on the label span, which would make the chip
   30px tall. The span's 26px gutter is left alone: the swatch is a zero-height float,
   so that margin is measured from the cell edge and is what clears the dot. */
.ui-jqgrid tr.jqgrow td.selection > .colorautocomplete-color + span {
    line-height: 18px !important;
}
.ui-jqgrid tr.jqgrow td.selection > span:is(.cell-wrapper, .cell-wrapperleaf):not(:has(input)) {
    /* The shared cell-wrapper rule is display:flex + height:inherit, which would
       stretch the chip across the whole cell. */
    display: inline-flex;
    height: auto;
    /* The floated tree-wrap is full cell height, so it pins the chip's line box to
       the top; the cell can no longer centre it. */
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
/*Freeze the Name column, better experience when scrolling right in large grids*/

.ui-jqgrid tr.jqgrow.dirty td.sticky-cell {
    background: var(--green) !important;
}
.ui-jqgrid th.sticky-cell {
    background:var(--grid-header-bg) !important;
}
/* Opaque mixes: the sticky cell scrolls over the other cells. */
.ui-jqgrid tr.ui-state-hover td.sticky-cell {
    background: color-mix(in srgb, var(--menu-hover) 8%, var(--bg)) !important;
}
.ui-jqgrid tr.ui-state-highlight td.sticky-cell {
    background: color-mix(in srgb, var(--menu-hover) 10%, var(--bg)) !important;
}
/*END Freeze the Name column, better experience when scrolling right in large grids*/
body.classic .ui-jqgrid tr.jqgrow td.selection {
    color: var(--blue);
    font-weight: 500;
}
.jqGridHolder .jqgrow.ui-state-hover .selection, .jqGridHolder .jqgrow.ui-state-highlight .selection {
        color: var(--blue);
} 
.jqGridHolder .jqgrow.ui-state-hover{background:color-mix(in srgb, var(--menu-hover) 8%, transparent)} .jqGridHolder .ui-widget-header .ui-state-hover { background-color: #192d5c;}
.jqGridHolder th.ui-th-column.ui-state-hover:not(:has(#navigateDatePicker)) { background: var(--hover) !important; }
.jqGridPager {
    border-radius: 0px 0px 2px 2px;
    border-top: solid 1px var(--bg-border-light);
    width: calc(100%) !important;
    bottom: 0px;
    /*background:white;*/
} .jqGridPager input[type='text'], .jqGridPager select {float: none; width:43px !important;} .jqGridPager .ui-pager-control {min-height: 36px;} .jqGridPager .ui-pager-control td {border-width: 0px!important;} .ui-jqgrid .ui-pg-button.ui-state-disabled > .ui-separator {
    display: none;
} .ui-jqgrid .ui-icon-asc:before, .ui-jqgrid .ui-icon-desc:before {font-family: 'ionbiz' !important; font-style: normal; font-weight: normal;} .ui-jqgrid .ui-icon-asc:before {content: "\e669";font-size: 10px;} .ui-jqgrid .ui-icon-desc:before {content: "\e66a";font-size: 10px;} .ui-jqgrid .ui-grid-ico-sort {position:relative;} .jqGridHolder thead .ui-grid-ico-sort.ui-icon-desc.ui-state-disabled, .jqGridHolder thead .ui-grid-ico-sort.ui-icon-asc.ui-state-disabled { display: none; } .jqGridHolder thead .s-ico {
    /* zero width so showing the arrow never reflows the centered header text */
    display: inline-block;
    width: 0;
    overflow: visible;
    white-space: nowrap;
    vertical-align: middle;
    line-height: 0;
    margin-top: -4px;   /* compensates the baseline offset introduced by line-height:0 */
}
.jqGridHolder thead .s-ico .ui-grid-ico-sort {
    margin-top: 0;      /* remove lib offset so the arrow centers on the text midline */
    left: 8px;          /* relative nudge to sit just right of the text without taking layout width */
    vertical-align: middle;
} .jqGridHolder .ui-jqgrid .ui-pg-input {
    text-align: center;
    text-indent:0px !important;
} .jqGridHolder .ui-jqgrid .ui-pg-input, .jqGridHolder select.ui-pg-selbox {
    border: solid 1px var(--bg-border);
    border-radius: var(--border-radius-md);
    color: var(--txt-color);
    height: auto;
    padding: 3px;
    height: 23px;
    line-height: 14px;
    font-weight: 600;
} .jqGridHolder .ui-th-column.ui-state-hover .ui-jqgrid-sortable > .s-ico,
.jqGridHolder .ui-th-column:hover .ui-jqgrid-sortable > .s-ico { display: inline-block !important; }
/* ...but never inside a Kanban board view */
.board .jqGridHolder .ui-th-column.ui-state-hover .ui-jqgrid-sortable > .s-ico,
.board .jqGridHolder .ui-th-column:hover .ui-jqgrid-sortable > .s-ico { display: none !important; }
/* [style*="none"] work around for display:none in style */
.jqGridHolder .ui-th-column.ui-state-hover .ui-jqgrid-sortable > .s-ico[style*="none"] > .ui-icon-asc.ui-state-disabled,
.jqGridHolder .ui-th-column:hover .ui-jqgrid-sortable > .s-ico[style*="none"] > .ui-icon-asc.ui-state-disabled { display: inline !important; }
.board .jqGridHolder .ui-th-column.ui-state-hover .ui-jqgrid-sortable > .s-ico[style*="none"] > .ui-icon-asc.ui-state-disabled,
.board .jqGridHolder .ui-th-column:hover .ui-jqgrid-sortable > .s-ico[style*="none"] > .ui-icon-asc.ui-state-disabled { display: none !important; }
.jqGridHolder select.ui-pg-selbox {
    padding: 3px;
    padding-right:5px;
    background: var(--bg);
    color: var(--txt-color);
    margin-left: 5px;
    text-align: center;
    text-align-last: center;
    justify-content:center;
}
td[dir="ltr"]:has(select.ui-pg-selbox):after {
    font-family: 'ionbiz' !important;
    content: "\e66a";
    font-size: 9px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
    vertical-align: middle;
    right: 10px;
    top: 3px;
    text-indent: 0;
    left: auto;
    position: absolute;
    pointer-events: none;
}
.ui-icon-seek-prev, .ui-icon-seek-next {
    width: 20px;
    height: 20px;
    display: inline-block;
    background-color: var(--bg-border);
    border-radius: 50%;
    font-family: "ionbiz";
    font-size: 10px;
    color: var(--txt-color);
} .ui-icon-seek-prev:hover, .ui-icon-seek-next:hover {
        cursor: pointer;
        background-color: var(--menu-hover) !important;
        color:white;
    } .ui-icon-seek-prev:before, .ui-icon-seek-next:before {
    content: "\e66b";
    float: left;
    height: inherit;
    width: inherit;
    text-align: center;
    text-indent: 0;
    padding-top: 1px;

} .ui-icon-seek-next:before {  content: "\e66c"; }
.jqGridHolder .ui-icon-circlesmall-minus {
    width: 18px;
    height: 18px;
    text-indent: 5px !important;
    overflow: visible !important;
} 
.jqGridHolder .ui-icon-circlesmall-minus:before{
    font-family: 'ionbiz' !important;
    font-weight:900;
    content: "\e672";
    font-size: 11px;
    /*color: var(--red);*/
    text-indent: 0 !important;
    overflow: visible !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

}
.jqGridHolder .ui-icon-circlesmall-plus {
    width: 18px;
    height: 18px;
    
    text-indent: 5px !important;
    overflow: visible !important;
}
.jqGridHolder .ui-icon-circlesmall-plus:before{
    font-family: 'ionbiz' !important;
    content: "\e66f";
    font-weight:900;
    font-size: 11px;
    /*color: var(--blue);*/
    text-indent: 0 !important;
    overflow: visible !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
/* No :has(span): _renderItem always emits the span, and an ancestor :has() makes insertions
   beside <body> restyle the whole document. */
input[data-checkbox="true"][type="checkbox"],
.ui-autocomplete li a > input[type="checkbox"]{
    position: absolute !important;
    opacity: 0;
    cursor: pointer;
    height: 0 !important;
    width: 0 !important;
}
.ui-autocomplete li a > input[type="checkbox"], .ui-autocomplete li a > span:first-of-type{
    padding-left:2px !important;
    margin-left:0px !important;
    
}
.ui-autocomplete li a > input[type="checkbox"] + span:before {
    font-family: 'ionbiz';
    font-style: normal;
    font-size: 11px;
    font-weight: bold;
    vertical-align:top;
    color: var(--txt-color);
    margin-right:10px !important;
}
/* Unchecked icon as the default (doubled attribute keeps the old :not(:checked) specificity); :not(:checked) + span made Chrome restyle every span after an input on any DOM insert/remove. */
.ui-autocomplete li a > input[type="checkbox"][type="checkbox"] + span:before {
    content: "\e93e";
    font-size: 14px;
}
.ui-autocomplete li a > input[type="checkbox"]:checked + span:before {
    content: "\e640";
    font-size: 14px;
    color: var(--menu-hover, #2563eb);
}
input[data-checkbox="true"][type="radio"] {
    position: absolute !important;
    opacity: 0;
    cursor: pointer;
    height: 0 !important;
    width: 0 !important;
} input[data-checkbox="true"][type="checkbox"] + label {
    cursor: pointer;
    display: inline-block;
    text-indent: 0;
    line-height:22px;
}
/* span.editable inherits display:table-cell from the td, which ignores text-align */
.jqGrid tr td.taC > span.editable {
    display: block;
    width: auto;
}
/* The editors inside float, and a plain block box does not contain them, so the span
   collapses to zero height and the caret stretched across it lands above the field. */
.jqGrid tr[editable="1"] td.taC > span.editable {
    display: flow-root;
}
input[data-checkbox="true"][type="checkbox"] + label:before {
    font-family: 'ionbiz';
    font-style: normal;
    font-size: 16px;
    font-weight: bold;
    vertical-align:middle;
    margin-left:2px;
} 
input[data-checkbox="true"][type="checkbox"] + label:after {
    content: attr(data-text);
    margin: 0 4px;
    vertical-align: middle;
} input[data-checkbox="true"][type="radio"] + label:before {
    font-family: 'ionbiz';
    font-style: normal;
    font-size: 16px;
    vertical-align: middle;
    content: "\e93e";
    position: absolute;
    left: 0px;
    cursor: pointer;
    display: inline-block;
    height: 19px;
    float: left;
    margin: 0px 4px 0 0;
    min-width: 17px;
    vertical-align: middle;
    line-height: 18px; 
}
#formConfirmationQuestions input[data-checkbox="true"][type="radio"] + label:before, #formConfirmationQuestions input[data-checkbox="true"][type="radio"]:checked + label:before {
    left: unset !important;
}
label.checkBoxLabel{position: relative;}
input[data-checkbox="true"][disabled="disabled"] + label, input[data-checkbox="true"][readonly="readonly"] + label {
    cursor: default;
    opacity: 0.5;
    pointer-events: none;
} input[data-checkbox="true"][disabled="disabled"]:checked + label {
    cursor: default;
    opacity: 0.5;
}
/* "Unchecked" is tested on the label (:not(checked input + label)) rather than as :not(:checked) before "+":
   Chrome 154 restyles every label on the page for each DOM insert/remove when :not(:checked) precedes "+".
   :where() keeps the old specificity. Same for the unchecked rules below. */
input[data-checkbox="true"][type="checkbox"]:not(.done,.manageChk) + label:not(:where(input[data-checkbox="true"]):checked + :where(label)):before {
    color: var(--txt-color);
    content: "\e93f";
    /* The toggle glyph only fills ~22/24 of the em, so it needs a larger size than
       the tick-style glyphs below to read as a switch. */
    font-size: 26px;
    display: inline-block;
    border-radius: 4px;
}
input.locked[data-checkbox="true"][type="checkbox"]:not(.done) + label:not(:where(input[data-checkbox="true"]):checked + :where(label)):before {
    color: var(--dark-green);
    content: "\e638";
    font-size: 16px;
    display: inline-block;
    border-radius: 4px;
}
td.done input[data-checkbox="true"][type="checkbox"]:not(.done) + label:not(:where(input[data-checkbox="true"]):checked + :where(label)):before {
    color: var(--txt-color);
    content: "\e93e";
    font-size: 16px;
    display: inline-block;
    border-radius: 4px;
}
body.classic input[data-checkbox="true"][type="checkbox"]:not(.done) + label:not(:where(input[data-checkbox="true"]):checked + :where(label)):before {
    color: var(--menu-hover);
    border: 1px solid;
    content:'' !important;
    width: 11px;
    height: 11px;
    display: inline-block;
    border-radius: 4px;
}
input[data-checkbox="true"][type="checkbox"]:checked + label:before {
    content: "\e940";
    font-size: 26px;
    color: var(--menu-hover, #2563eb);
}
body.classic input[data-checkbox="true"][type="checkbox"]:checked + label:before{
    content: "\e931" !important;
    font-size: 16px;
    color: var(--menu-hover, #2563eb);
}
/* [id*=]/[id^=] are tested on the label's for (CheckBoxBase renders <label for="{input id}"> right after the input):
   an [id] attribute before "+ label" made Chrome 154 restyle every label on the page whenever an element
   with an id gets a sibling inserted/removed. Same matches, same specificity. */
#gridSecurityMatrix input[data-checkbox="true"][type="checkbox"]:checked + label:before,
input[data-checkbox="true"][type="checkbox"]:checked + label[for*="chkScope"]:before,
#detailRecurrencePatternGroupForm input[data-checkbox="true"][type="checkbox"]:checked + label[for^="chkIs"]:before,
input[data-checkbox="true"][type="checkbox"]:checked + label[for*="chkTabRecurrence"]:before,
ul#sortable input[data-checkbox="true"][type="checkbox"]:checked + label:before{
    content: "\e640";
    color: var(--menu-hover, #2563eb);
    font-size: 16px;
}
#gridSecurityMatrix input[data-checkbox="true"][type="checkbox"]:not(.done) + label:not(:where(input[data-checkbox="true"]):checked + :where(label)):before,
input[data-checkbox="true"][type="checkbox"]:not(.done) + label[for*="chkScope"]:not(:where(input[data-checkbox="true"]):checked + :where(label)):before,
#detailRecurrencePatternGroupForm input[data-checkbox="true"][type="checkbox"]:not(.done) + label[for^="chkIs"]:not(:where(input[data-checkbox="true"]):checked + :where(label)):before,
input[data-checkbox="true"][type="checkbox"]:not(.done) + label[for*="chkTabRecurrence"]:not(:where(input[data-checkbox="true"]):checked + :where(label)):before,
ul#sortable input[data-checkbox="true"][type="checkbox"]:not(.done) + label:not(:where(input[data-checkbox="true"]):checked + :where(label)):before{
    content: "\e93e";
    font-size: 16px;
}
input[data-checkbox="true"][type="checkbox"] + label[for*="chkScope"]:before{
   vertical-align:top;
}
input[data-checkbox="true"][type="radio"] + label{
    cursor: pointer;
    display: inline-block;
    height: 19px;
    float: left;
    margin: 6px 4px 0 0;
    min-width: 17px;
    vertical-align: middle;
    line-height: 18px;
}
input[data-checkbox="true"][type="radio"]:checked + label:before {
    font-family: 'ionbiz';
    font-style: normal;
    font-size: 16px;
    vertical-align: middle;
    content: "\e941";
    color: var(--txt-color);
    position: absolute;
    left: 0px;
} td.done input[data-checkbox="true"][type="checkbox"] + label:before, input.done[data-checkbox="true"][type="checkbox"] + label:before {
    content: "\e93e";
    font-size: 14px;
} td.done input[data-checkbox="true"][type="checkbox"] + label:after, input.done[data-checkbox="true"][type="checkbox"] + label:after {
    content: "SET DONE";
    font-size: 10px;
    font-weight: bold;
} td.done input[data-checkbox="true"][type="checkbox"]:checked + label:before, input.done[data-checkbox="true"][type="checkbox"]:checked + label:before {
    content: "\e640";
    font-size: 16px;
} td.done input[data-checkbox="true"][type="checkbox"]:checked + label:after {
    content: "";
}
input.done[data-checkbox="true"][type="checkbox"]:checked + label:after{
    content:"DONE";
}
input.locked[data-checkbox="true"][type="checkbox"] + label, input.locked[data-checkbox="true"][type="checkbox"]:checked + label {       
    background:  none;
    margin: 0px;
} input.locked[data-checkbox="true"][type="checkbox"] + label:before {    
   color: var(--dark-green);
   content: "\e638"; 
   font-size: 16px;
} input.locked[data-checkbox="true"][type="checkbox"]:checked + label:before {
    color: var(--red);
    content: "\e639";
    font-size: 16px;
} input.locked[data-checkbox="true"][disabled="disabled"] + label {
    cursor: default;
    opacity: 1;
} input.locked[data-checkbox="true"][disabled="disabled"]:checked + label {
    cursor: default;
    opacity: 1;
} input.orangeCheckbox[data-checkbox="true"][type="checkbox"]:checked + label:before {
    
    font-family: 'ionbiz';
    font-style: normal;
    font-size: 16px;
    vertical-align: middle;
    content: "\e931";
    color: darkorange;
} input.sendBy[data-checkbox="true"][type="checkbox"] + label, input.sendBy[data-checkbox="true"][type="checkbox"]:checked + label, input.manageChk[data-checkbox="true"][type="checkbox"] + label, input.manageChk[data-checkbox="true"][type="checkbox"]:checked + label {
    font-family: 'ionbiz';
    background: none;
    margin: 0px;
} input.sendBy[data-checkbox="true"][type="checkbox"] + label:before {
   color: var(--dark-green);
   content: "\e90d"; 
   font-style: normal;
} input.sendBy[data-checkbox="true"][type="checkbox"]:checked + label:before {       
    color: #feb841;
    content: "\e676";
    font-style: normal;
} input.manageChk[data-checkbox="true"][type="checkbox"] + label:before {
    color: var(--dark-green);
    content: "\e60c";
    font-size: 16px;
} input.manageChk[data-checkbox="true"][type="checkbox"]:checked + label:before {     
    color: #ff5200;
    content: "\e60d";
    font-size: 16px;
} input.sendBy[data-checkbox="true"][disabled="disabled"] + label {
    cursor: default;
    opacity: 1;
} input.sendBy[data-checkbox="true"][disabled="disabled"]:checked + label {
    cursor: default;
    opacity: 1;
} .jqGridHolder tbody td { line-height: 18px;} .jqGridHolder .icon { font-size: 15px;padding:4px;} .jqGridHolder .icon:hover, .jqGridHolder .icon:hover:before { text-decoration: none !important;color: #9E9E9E !important;} 
.jqGridHolder tr.jqfoot[jqfootlevel="0"] td {
    background-color: var(--grid-header-bg) !important;
}
.page_issuekanban .jqGridHolder tr.jqfoot[jqfootlevel="0"] td {
    background-color: var(--bg) !important;
}
.jqGridHolder tr.jqfoot[jqfootlevel="1"] td { background: var(--east-bg) !important;} .jqGridHolder .ui-icon.treeclick {font-family: "ionbiz";font-weight: lighter;font-size: 15px;text-indent: 0; width: 48px;height: inherit;font-style: normal;display:flex;align-items:center;} .jqGridHolder .ui-icon.treeclick:before {
    text-align: center;
    width: 18px;
    height: 18px;
    line-height: 18px;
    position: absolute;
    left: 0;
} .jqGridHolder .ui-icon.treeclick:after {
    text-align: center;
    width: 18px;
    height: 18px;
    line-height: 19px;
    position: absolute;
    left: 18px;
} .jqGridHolder .ui-icon.tree-minus:before { content: "\e672";color: var(--txt-color);font-size: 10px;} .jqGridHolder .icon-download { color: var(--dark-green);font-size: 15px;} .jqGridHolder .icon-warning_2 { vertical-align: middle;} .jqGridHolder #gridPlanningLinkResource .icon-warning_2 { cursor: pointer;} .jqGridHolder .ui-icon.tree-plus:before { content: "\e672";font-size: 8px; transform: rotate(270deg);} .jqGridHolder .ui-icon.ui-icon-relation-1-s:after, .jqGridHolder .ui-icon.ui-icon-relation-1-e:after { content: "\e618";color: var(--menu-hover);} .jqGridHolder .ui-icon.ui-icon-settings-1-s:after, .jqGridHolder .ui-icon.ui-icon-settings-1-e:after { content: "\e632";color: var(--txt-color);} .jqGridHolder .ui-icon.ui-icon-resource-1-s:after, .jqGridHolder .ui-icon.ui-icon-resource-1-e:after { content: "\e620";} .jqGridHolder .ui-icon.ui-icon-leaves-1-s:after, .jqGridHolder .ui-icon.ui-icon-leaves-1-e:after { content: "\e612";color: var(--menu-hover);} .jqGridHolder .ui-icon.ui-icon-project-1-s:after, .jqGridHolder .ui-icon.ui-icon-project-1-e:after { content: "\e934";color: var(--txt-color);} .jqGridHolder .ui-icon.ui-icon-project-leaf:after { content: "\e615";color: var(--txt-color);font-size: 11px;} .jqGridHolder .ui-icon.ui-icon-issue-1-s:after, .jqGridHolder .ui-icon.ui-icon-issue-1-e:after { content: "\e61a";color: var(--menu-hover);} .jqGridHolder .ui-icon.ui-icon-LedgerAccount-1-s:after, .jqGridHolder .ui-icon.ui-icon-LedgerAccount-1-e:after { content: "\e611";color: var(--menu-hover);} .jqGridHolder .ui-icon.ui-icon-invoicing-1-s:after, .jqGridHolder .ui-icon.ui-icon-invoicing-1-e:after { content: "\e620";color: var(--menu-hover);} .jqGridHolder .ui-icon.ui-icon-contact-1-s:after, .jqGridHolder .ui-icon.ui-icon-contact-1-e:after { content: "\e620";color: #8bdeea;} .jqGridHolder .ui-icon.ui-icon-contactfemale-1-s:after, .jqGridHolder .ui-icon.ui-icon-contactfemale-1-e:after { content: "\e620";color: #f6b2f5;} .jqGridHolder .ui-icon.ui-icon-task-1-s:after, .jqGridHolder .ui-icon.ui-icon-task-1-e:after { content: "\e94e";color: var(--txt-color);} .jqGridHolder .ui-icon.ui-icon-contact-leaf:after { content: "\e620";color: var(--menu-hover);font-size: 13px;} .jqGridHolder .ui-icon.ui-applied-filter:after { content: "\e634";color: var(--blue);font-size: 13px;} .jqGridHolder .ui-icon.ui-icon-contactfemale-leaf:after { content: "\e620";color: var(--menu-hover);font-size: 13px;} .jqGridHolder .ui-icon.ui-icon-leaves-leaf:after { content: "\e612";color: var(--menu-hover);font-size: 13px;} .jqGridHolder .ui-icon.ui-icon-department-leaf:after { content: "\e620";color: var(--menu-hover);font-size: 13px;} .jqGridHolder .ui-icon.ui-icon-issue-leaf:after { content: "\e61a";color: var(--menu-hover);font-size: 13px;} .jqGridHolder .ui-icon.ui-icon-task-leaf:after {
    content: "\e952";
    color: var(--txt-color);
    font-size: 13px;
} .jqGridHolder .ui-icon.ui-icon-optional-leaf:after {
    content: "\e92e";
    color: var(--dark-green);
    font-size: 13px;
} .jqGridHolder .ui-icon.ui-icon-optional-1-s:after, .jqGridHolder .ui-icon.ui-icon-optional-1-e:after {
    content: "\e92e";
    color: var(--dark-green) ;
    font-size: 14px;
} .jqGridHolder .ui-icon.milestone:after {
    content: "\e909";
    color: var(--txt-color);
    font-size: 13px;
} .jqGridHolder .ui-icon.ui-icon-resource-leaf:after {
   content: "\e620";opacity:0.9;font-size: 13px;
} .jqGridHolder .ui-icon.ui-icon-settings-leaf:after { content: "\e632";color: var(--txt-color);font-size: 13px;} .jqGridHolder .ui-icon.ui-icon-relation-leaf:after { content: "\e618";color: #FF8A00;font-size: 13px; } .jqGridHolder .ui-icon.ui-icon-cost-leaf:after { content: "\e60b";color: var(--dark-green);font-size: 13px; } .jqGridHolder .ui-icon.ui-icon-item-leaf:after { content: "\e928";color: var(--dark-green);font-size: 13px; } .jqGridHolder .icon-invoice:before{color: var(--txt-color);} .jqGridHolder .ui-jqgrid .ui-pg-table { margin-top: 4px;}
.jqGridHolder .ui-jqgrid-btable tr.ui-state-highlight:not(.jqgrid-new-row) {
    background-color: color-mix(in srgb, var(--menu-hover) 10%, transparent) !important;
}
body.dark .jqGridHolder .ui-jqgrid-btable tr.ui-state-highlight:not(.jqgrid-new-row),
body.dark .jqGridHolder .ui-jqgrid-btable tr.ui-state-hover:not(.jqgrid-new-row) {
    color: var(--green) !important;
}
.jqGridHolder .tree-wrap.tree-wrap-ltr {
    overflow: visible;
    margin-right: 16px;
} .jqGridHolder .jqg-second-row-header {
    text-transform: uppercase;
    font-size: 12px;
} .jqGridHolder .frozen-bdiv {
    background-color: var(--bg);
    z-index: 20;
}
/* subGrid */
.jqGridHolder .sgcollapsed .ui-icon-plus, .jqGridHolder .sgexpanded .ui-icon-minus {  width: 100%; height: 100%;  } .jqGridHolder .sgcollapsed .ui-icon-plus:before {    content: "\e600";      } .jqGridHolder .sgexpanded .ui-icon-minus:before {visibility: hidden;  content: "\e65f"; color: #c0bdb8;     } .jqGridHolder .sgexpanded .ui-icon-minus:before, .jqGridHolder .sgcollapsed .ui-icon-plus:before {
    font-family: "ionbiz";
    color: #9f9f9f;
    float: left;
    font-size: 14px;
    height: 20px;
    line-height: 26px;
    position: relative;
    text-indent: 0.4em;
} .jqGridHolder .sgcollapsed .ui-icon-plus:hover:before { color: #c0bdb8; } .jqGridHolder .sgexpanded .ui-icon-minus:hover:before{ visibility: visible; } .jqGridHolder .subgrid-data .tablediv {
    width: 100%;
}
/* class copied from sch-gantt-all-debug.css */
.jqGridHolder img {margin:4px auto 0px auto} .jqGridHolder .ui-jqgrid-sdiv {
    background-position: left top;background-repeat: repeat-x;
} .jqGridHolder .ui-jqgrid-sdiv .ui-widget-content {
    background: transparent !important;
    background-image: none;
    color: var(--txt-color);
} 
  .jqGrid input, .jqGrid select, .jqGrid textarea, .jqGrid button {
    height:30px;
    line-height:30px;
    width: 100%;
} 
  .jqGridHolder tr[editable="1"] > td.icon-warning_2:before {
    display: none;
} .jqGridHolder span.cell-wrapper, span.cell-wrapperleaf {
    display: flex;
    height: inherit;
    align-items: center;
} .jqGridHolder .tree-wrap + .cell-wrapper input, .jqGridHolder .tree-wrap + .cell-wrapperleaf input { 
    margin-left: 10px;
} .jqGridHolder .taR input { text-align: right !important; padding-right:5px;} .jqGridHolder .taC input { text-align: center !important;} .jqGridHolder .taC input.hasDatepicker { text-align: center !important;} .jqGridHolder .taC input.timepicker { text-align: left !important;} .jqGridHolder .taL input { text-align: left !important;} .jqGridHolder .ui-jqgrid .ui-jqgrid-pager { height: auto!important; background: var(--grid-header-bg); border-radius: 0px 0px var(--border-radius-sm) var(--border-radius-sm); z-index:13;} .jqGridHolder .jqGrid tbody td.weekend {background-color: var(--weekend-bg);}
/*  Timesheet cells Control */
#timesheetCellsWidget .jqGridHolder .ui-jqgrid-sdiv { background-image: none;background-color: transparent;border-top: solid 0px #4B8E99 !important;} .jqGridHolder a:hover { text-decoration: underline !important;} .jqGridHolder a.btnClassic:hover { text-decoration: none !important;} .jqGridHolder .btnResEdit, .jqGridHolder .btnResDelete {
    height: 100%;
    width: 50%;
    border: 0px;
} .jqGridHolder .btnResEdit {background-position: -36px -134px} .jqGridHolder .btnResEdit:hover { opacity: 0.8;} .jqGridHolder .btnResDelete {background-position: -215px -135px} .jqGridHolder .btnResDelete:hover { opacity: 0.8;} .ui-jqgrid .ui-jqgrid-btable td .imageWithText {
    float: left;
    width: 18px;
    height: 18px;
    margin: 0px 0px 0px 5px;
} .ui-jqgrid .ui-jqgrid-btable td .imageWithText img {
    width: 18px;
    height: 18px;
    float: left;
    margin: 0px;
    background-position: left top;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 3px;
    background-size: initial;
}
.ui-jqgrid .ui-jqgrid-btable {
    /*padding: 1px; allow to see borders all around*/
} .jqGridHolder .sla-checked:after {
    content: "\e64f";
    font-family: 'ionbiz' !important;
    margin-left: 5px;
    color: var(--dark-green);
} .jqGridHolder .sla-paused:after { content: "\e642";font-family: 'ionbiz' !important;margin-left: 10px;margin-right: 3px;color: #ffbb4d;} .jqGridHolder .sla-bullet:after { content: "\e621";font-family: 'ionbiz' !important;margin-left: 5px;} .jqGridHolder .sla-bullet.Grey:after {
    color: #ccc;
} .jqGridHolder .sla-bullet.Yellow:after {
    color: #ffbb4d; animation: blinker 2s linear infinite;
} .jqGridHolder .sla-bullet.Red:after {
    color: red;
} .jqGridHolder .ui-icon.ui-icon-contactneutral-leaf:after {
    content: "\e620";
    color: #66ad6f;
    margin-left: 39%;
    font-size: 13px;
} .jqGridHolder .ui-icon.ui-icon-contactneutral-1-s:after, .jqGridHolder .ui-icon.ui-icon-contactneutral-1-e:after {
    content: "\e620";
    color: #66ad6f;
}
.ui-jqgrid .ui-search-table .ui-search-input>input,
.ui-jqgrid .ui-search-table .ui-search-input .filter-op-wrapper input,
.ui-jqgrid .ui-search-table .ui-search-input .filter-op-wrapper input[type="text"] {
    height: 24px !important;
    min-width:17px;
    border-radius: var(--border-radius-xs);
    text-indent:7px !important;
    width: 95% !important;
    box-sizing: border-box;
    padding-right: 15px !important;
    margin: 0 !important;
}
.ui-jqgrid .ui-search-table .ui-search-input>input:focus,
.ui-jqgrid .ui-search-table .ui-search-input .filter-op-wrapper input:focus{
outline: none !important;
border: 1px solid var(--input-focus) !important;
}
.filter-op-wrapper:has(input:focus) .custom-filter-op {
    border-color: var(--input-focus) !important;
}
.ui-jqgrid .ui-search-table {
    height: auto;
}
.ui-jqgrid .ui-search-table .ui-search-input{
    display: flex;
    align-items: center;
}
a.clearsearchclass{
    display: none;/*hide by default*/
    cursor: pointer;
    font-size: 0; /* hide the literal "x" text */
    line-height: 1;
    padding: 2px;
    position: relative;
}
a.clearsearchclass::after {
    content: '\00d7';
    font-size: 14px;
    font-weight: 600;
    color: var(--red, #dc2626);
    opacity: 0.7;
    transition: opacity 0.12s;
}
a.clearsearchclass:hover::after {
    opacity: 1;
}
/* Overlay the clear button on top of the input's right edge */
.ui-jqgrid .ui-search-table {
    position: relative;
}
.ui-jqgrid .ui-search-table td.ui-search-clear {
    position: absolute;
    right: 7px;
    top: 0;
    bottom: 0;
    width: auto;
    padding: 0;
    z-index: 1;
    display: flex !important;
    align-items: center;
}
.ui-jqgrid .ui-search-table td.ui-search-input {
    position: relative;
}
tr.ui-search-toolbar{
    border-color: transparent !important;
}
/* Hides the native 'X' in Chrome, Safari, and Edge */
.ui-search-input input[type="search"]::-webkit-search-decoration,
.ui-search-input input[type="search"]::-webkit-search-cancel-button,
.ui-search-input input[type="search"]::-webkit-search-results-button,
.ui-search-input input[type="search"]::-webkit-search-results-decoration {
    -webkit-appearance: none;
    appearance: none;
    display: none; 
}

/* Drag handle for issue row reordering (GlobalRank) */
tr.rank-drag-placeholder > td {
    background: color-mix(in srgb, var(--menu-hover) 10%, transparent) !important;
    border-left: 4px solid var(--menu-hover) !important;
    pointer-events: none;
}
tr.rank-drag-placeholder.rank-drop-forbidden > td {
    background: color-mix(in srgb, red 8%, transparent) !important;
    border-left: 4px solid red !important;
}
tr.rank-drag-helper.rank-drop-forbidden {
    opacity: 0.5;
    cursor: not-allowed !important;
}
tr.rank-drag-helper {
    background: var(--bg) !important;
    box-shadow: 0 4px 20px var(--shaddow);
}
tr.jqgrow.rank-dragging > td {
    opacity: 0.35;
}

td.drag-handle-cell {
    text-align: center;
    vertical-align: middle;
    padding: 0 !important;
}
/* Only the drag helper needs it (badge anchor); a positioned cell per row = one paint layer each, slows hover hit-testing. */
tr.rank-drag-helper td.drag-handle-cell {
    position: relative;
}
td.drag-handle-cell.sticky-cell {
    position: sticky;
}
.drag-handle-icon {
    display: inline-block;
    cursor: grab;
    font-family: "ionbiz";
    font-size: 20px;
    color: var(--bg-border);
    line-height: var(--row-height);
    text-indent:0px;
    text-align: center;
}
.drag-handle-icon:before {
    content: "\e951";
}
tr.jqgrow.ui-state-hover .drag-handle-icon {
    color: var(--txt-color);
}
.drag-handle-icon:active {
    cursor: grabbing;
}
.drag-count-badge {
    background-clip: padding-box;
    background-color: var(--green);
    border-radius: 11px;
    border: 1px solid var(--bg-border-light);
    box-shadow: 0 0 20px var(--shaddow);
    color: black;
    font-family: sans-serif;
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    height: 14px;
    line-height: 14px;
    min-width: 14px;
    padding: 0 2px;
    position: absolute;
    left: -4px;
    top: -6px;
    text-align: center;
    z-index: 1;
    pointer-events: none;
}
.rank-info-message {
    float: left;
    line-height: 28px;
    font-size: 16px;
    cursor: default;
    position: relative;
}
.rank-info-message:hover::after {
    content: attr(data-message);
    font-family: sans-serif;
    font-size: 11px;
    font-weight: normal;
    white-space: nowrap;
    margin-left: 4px;
    color: var(--txt-color);
    vertical-align: middle;
}
.ui-jqgrid tr.jqgroup b { /*highlight the grouping header*/
    border: 1px solid transparent;
    border-radius: var(--border-radius-md);
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
    background: var(--grid-header-bg);
}
.ui-tooltip, .arrow:after {
    background: -webkit-linear-gradient(#f4f5f7, #f4f5f7 ); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#f4f5f7, #f4f5f7 ); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#f4f5f7, #f4f5f7 ); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#f4f5f7, #f4f5f7 ); /* Standard syntax */
}
.ui-tooltip {
    padding: 10px 20px;
    /*color: white;*/
    border-radius: var(--border-radius-sm);
    box-shadow: 0 0 15px var(--shaddow);
    background: var(--bg) !important;
    min-width: fit-content;
    z-index: 100 !important;
}
  
  .ui-tooltip.cols2 {
       max-width: 300px !important;
  }
  
  .ui-tooltip.cols3 {
       max-width: 460px !important;
  }

.arrow {
    width: 70px;
    height: 18px;
    overflow: hidden;
    position: absolute;
    left: 50%;
    margin-left: -32px;
    bottom: -16px;
}
  .arrow.top {
    top: -18px;
    bottom: auto;
  }
  .arrow.left {
    width: 16px;
    height: 70px;       
    margin-top: -35px;
    top: 50%;
    margin-left: 0px;
    left: -16px;
  }  
  .arrow.right {
    height: 70px;
    left: 100%;
    margin-left: 0;
    margin-top: -35px;
    top: 50%;
    width: 16px;
}

    .arrow:after {
        content: "";
        position: absolute;
        /*left: 20px;*/
        top: -20px;
        width: 25px;
        height: 25px;
        box-shadow: 0px 0px 3px 0px var(--shaddow);
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        tranform: rotate(45deg);
    }
.arrow.top:after {
    bottom: -20px;
    top: auto;
}
.arrow.left:after {
    left: 5px;
    top: 27px;
}
.arrow.right:after {
    left: -18px;
    top: 20px;
}

.userSubMenu .arrow:after {
    /*background: none;
    background-color: #1f2532;*/
    /*border: solid 1px #1f2532;*/
}

.arrow:before {
    content: "";
    position: absolute;
    /*left: 20px;*/
    top: -20px;
    width: 25px;
    height: 25px;
    background: var(--bg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    tranform: rotate(45deg);
    box-shadow: 0px 0px 1px var(--shaddow);
}
.arrow.top:before {
    bottom: -20px;
    top: auto;
}
.arrow.left:before {
    left: 7px;
    top: 19px;
}
.arrow.right:before {
    left: -18px;
    top: 20px;
}

.userSubMenu .arrow:before {
    background: none;
    box-shadow: 0px 0px 1px #837E78;
}

.ui-dialog .arrow.top {
    top: -18px;
    bottom: auto;
  }
.ui-dialog .arrow.left {
    width: 10px;
    height: 70px;       
    margin-top: -35px;
    top: 22px;
    margin-left: 1px;
    left: -10px;
  }  
  
  .ui-dialog .arrow.middle {
      left: -11px!important;
      top: calc(50% + 5px)!important;
  }
  
.ui-dialog.contextMenuPlugin .arrow.left {
    left: -10px;
    top: calc(50% + 5px);
    width: 9px;
}

    .ui-dialog.contextMenuPlugin .arrow.left:after {
        background-color: var(--context-menu-bg);
        box-shadow: 0 0 3px var(--shaddow);
    }

.ui-dialog .arrow.right {
    height: 70px;
    left: 100%!important;
    margin-left: 0px;
    margin-top: -35px;
    top: 22px;
    width: 16px;
}

.ui-dialog.contextMenuPlugin .arrow.right {
    left: calc(100% - 0px);
    top: calc(50% + 5px);
    width: 10px;
}

.ui-dialog.contextMenuPlugin .arrow.right:before {
    left: -20px;
    top: 19px;
}

.ui-dialog.contextMenuPlugin .arrow.right:after {
    left: -21px;
    top: 19px;
    background-color: var(--east-bg);
    box-shadow: 0px 0px 3px var(--bg-border);
}

.ui-dialog .arrow.top:before {
    bottom: -20px;
    top: auto;
}
.ui-dialog .arrow.left:before {
    left: 7px;
    top: 18px;
}
.ui-dialog .arrow.right:before {
    left: -18px;
    top: 20px;
}
.ui-dialog .arrow.top:after {
    bottom: -20px;
    top: auto;
    z-index:1;
}
.ui-dialog .arrow.left:after {
    left: 8px;
    top: 18px;
    box-shadow: 0 0 5px var(--shaddow);
}
.ui-dialog .arrow.right:after {
    left: -18px;
    top: 20px;
}

.ui-dialog {
    background: var(--dialog-bg);
    overflow: visible;
    box-shadow: 0 0 30px 1px var(--shaddow);
    border-radius: var(--border-radius-md) !important;
}

.padRight {
    padding-right: 15px !important;
    padding-bottom: 15px !important;
}
.savedFilters .ui-jqgrid-bdiv:not(.frozen-bdiv) {
    min-height: 30px !important;
    max-height: 500px;
    overflow: auto;
}
span.currency {
    margin-right: 9px; /*9px here + 1px in detail input margin left*/
}

.ui-accordion .ui-accordion-content {
    background: var(--section-bg);
    border-radius: var(--border-radius-md);
    margin: 5px;
    margin-bottom: 6px;
    padding: 10px !important;
    border: 1px solid var(--section-border);
    height: fit-content;
}
.ui-accordion .ui-accordion-content:has(.tabContainer){
    border-color: transparent;
    background-color: transparent;
}
.ionBizDialogDetails.ui-tabs form.ionbizdetails .ui-tabs-panel:not(:has(.ui-accordion-content)) { /*tabs in forms from Settings area*/
    width: calc(100% - 32px);
    background: var(--section-bg);
    border-radius: var(--border-radius-md);
    margin: 5px;
    margin-bottom: 6px;
    padding: 10px !important;
    overflow: auto;
    border: 1px solid var(--section-border);
   
}
.page_applications .ui-accordion .ui-accordion-content:not(.ui-accordion-content-active, :has(form, .halfSizeLeft)):has(.jqGridHolder), .page_settings .ui-accordion .ui-accordion-content:not(.ui-accordion-content-active, :has(form, .halfSizeLeft)):has(.jqGridHolder) {
    min-height:300px;
}

.ui-dialog .ui-dialog-title {
    width: auto;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    position: relative;
    display: block;
}
    .ui-dialog .ui-dialog-titlebar {
        border-radius: var(--border-radius-md) var(--border-radius-md) 0px 0px !important;
    }

    .ui-selectable .ui-selecting {
        background: #eaf4f5;
    }
.ui-selectable .ui-selected:before, .ui-selectable .ui-selected-ionbiz:before 
{
    font-family: "ionbiz";
    content: "\e640";
    color: var(--dark-green);
    font-size: 15px;
    line-height: 16px;
    position: relative;
    float: left;
    left:calc(100% - 16px);
    width: 0px;
    text-indent: 0px!important;
 }
.ui-selectable .ui-selectee:hover { background: var(--hover); border-top-left-radius: 3px; border-bottom-left-radius: 3px;}
.ui-selectable { 
    list-style-type: none;
    margin: 0; padding: 0;
    padding-right:6px;
    background: var(--bg);
    border-radius: var(--border-radius-sm);
    border: 1px solid var(--bg-border-light); 

}
.ui-selectable li      
{
    margin: 0;
    padding: 0.4em;
    font-size: 14px;
    height: 16px;
    line-height:16px;
    width: inherit;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--txt-color);
    white-space: nowrap;
    border-radius: var(--border-radius-xs);
    width: calc(100% - 12px);
    text-indent: 5px;
}

.gridGroupByList .ui-selectable {
    width: 250px;
    float: left;
    overflow: hidden;
    margin-right: 10px;
    margin-bottom: 16px;
}
.gridGroupByList .ui-selectable li{
    font-size:13px;
}
.gridGroupByList .ui-selectable + .ui-selectable { margin-right: 0px;width:32px;}
.gridGroupByList .ui-selectable + .ui-selectable li {text-indent: -999px;}

.ui-spinner  { float: left; padding-left:1px;}
    .ui-spinner .ui-icon {
         margin-top: -7px;
        text-indent: 0;
    }

.ui-button-icon-only .ui-icon{ margin-left: -17px!important;}

.ui-widget-overlay   { background: rgba(102, 102, 102, 0.3);}
.ui-datepicker .ui-datepicker-buttonpane {margin:0px !important; }
.ui-datepicker.noYear .ui-datepicker-year
{
 display:none;   
}
.altcha.svelte-ddsc3z.svelte-ddsc3z { /*forgot password border*/
    border: 1px solid transparent !important;
}

/* remove the colors from the toolsbar buttons*/
.gridMenu a:not(.lnkSaveDetails):hover {
    background: var(--hover);
    /* Not a full pill: .icon-add is pinned to 40px, so 20px would render it as a
       circle while the 73px buttons stay stadium-shaped. */
    border-radius: var(--border-radius-md);
}
#eastHeaderWrapper .gridMenu:not([data-forgrid="notes"]) a.icon-add{
    margin-left:30px;
}
/* Clearance for .btnCloseWest, which is pinned over the toolbar's top-left corner. Belongs on
   the toolbar, not on a.icon-add: a grid without an Add button put its first button under it. */
#centerLayout .ui-layout-content > .gridMenu:not([data-forgrid="notes"]),
/* ProjectsDashboard wraps its toolbar in a sizing div, so the pane is a grandparent. */
#centerLayout .ui-layout-content > .inheritWidth.h100Percent:not(.board) > .gridMenu:not([data-forgrid="notes"]) {
    padding-left: 30px;
}
/* .tbLabeled sizes itself around its caption. */
:is(#centerLayout, #eastHeaderWrapper) .gridMenu:not([data-forgrid="notes"]) a.icon-add:not(.tbLabeled){
    width: 46px;
}
:is(#centerLayout, #eastHeaderWrapper) .gridMenu a.icon-add.btnAddWithArrowData:not(.tbLabeled){
    width: 56px !important;
}
/* The background belongs on the button only. Painting it on the floated :before as
   well drew a hard-edged square patch inside the rounded button, and since a
   pseudo-element can't inherit the anchor's transition it popped in instantly. */
:is(#centerLayout, #eastHeaderWrapper) a.icon-add:hover{
    background: var(--dark-green) !important;
    color: white !important;
    
}
:is(#centerLayout, #eastHeaderWrapper) a.icon-add:hover:before{
    color: white !important;
    font-size: 20px !important;
    content:"\e600" !important;
}
:is(#centerLayout, #eastHeaderWrapper) a.icon-edit:hover{
    background: #192d5c !important;
}
:is(#centerLayout, #eastHeaderWrapper) a.icon-edit:hover, :is(#centerLayout, #eastHeaderWrapper) a.icon-edit:hover:before{
    color: white !important;
}
:is(#centerLayout, #eastHeaderWrapper) a.icon-trash:hover{
    background: var(--red) !important;
}
:is(#centerLayout, #eastHeaderWrapper) a.icon-trash:hover, :is(#centerLayout, #eastHeaderWrapper) a.icon-trash:hover:before{
    color: white !important;
}
:is(#centerLayout, #eastHeaderWrapper) a.icon-refresh:hover{
    background: #fb5405 !important;
}
:is(#centerLayout, #eastHeaderWrapper) a.icon-refresh:hover, :is(#centerLayout, #eastHeaderWrapper) a.icon-refresh:hover:before{
    color: white !important;
}
.gridMenu a:hover .path1:hover:before, a:hover:before, a:hover:after {
    opacity: 1 !important;
    
}
    /* end remove the colors from the toolsbar buttons*/

/*override the timepicker*/
/* Full-screen, but click-through: dismissal rides on the input's blur, so swallowing the click
   would only cost the user their first click on whatever they actually aimed at. */
.timepickr-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: transparent;
    pointer-events: none;
}
.timepickr-dialog {
    position: absolute;
    pointer-events: auto;
    width: 296px;
    box-sizing: border-box;
    padding: 20px;
    border-radius: var(--border-radius-md);
    background: var(--dialog-bg);
    border: 1px solid var(--bg-border-light);
    box-shadow: 0 16px 44px var(--shaddow);
    color: var(--txt-color);
    user-select: none;
}

.timepickr-head {
    display: flex;
    align-items: stretch;
    gap: 8px;
    margin-bottom: 20px;
}
.timepickr-fields {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}
.timepickr-field {
    position: relative;
    flex: 1;
    height: 76px;
    line-height: 76px;
    text-align: center;
    font-size: 44px;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    border-radius: var(--border-radius-sm);
    background: var(--hover);
    cursor: pointer;
    transition: background-color 0.12s ease, color 0.12s ease;
}
.timepickr-field.is-active {
    background: var(--brand-soft);
}
/* Chevrons stay faintly visible: a hover-only hint would never be discovered. */
.timepickr-step {
    position: absolute;
    left: 50%;
    width: 20px;
    height: 14px;
    margin-left: -10px;
    opacity: 0.25;
    transition: opacity 0.12s ease;
}
.timepickr-step:before {
    content: '';
    position: absolute;
    left: 7px;
    top: 4px;
    width: 6px;
    height: 6px;
    border-left: 1.5px solid currentColor;
    border-top: 1.5px solid currentColor;
}
.timepickr-step-up {
    top: 4px;
}
.timepickr-step-up:before {
    transform: rotate(45deg);
}
.timepickr-step-down {
    bottom: 4px;
}
.timepickr-step-down:before {
    top: 2px;
    transform: rotate(-135deg);
}
.timepickr-field:hover .timepickr-step {
    opacity: 0.5;
}
.timepickr-step:hover {
    opacity: 1;
}
.timepickr-colon {
    font-size: 36px;
    font-weight: 500;
    opacity: 0.7;
}
/* Matches the datepicker button pane so both pickers close the same way. */
.timepickr-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 16px;
    padding-top: 10px;
    border-top: 1px solid var(--bg-border-light);
}
.timepickr-view {
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid var(--bg-border);
    border-radius: var(--border-radius-xl);
    background: transparent;
    color: var(--txt-color);
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.15s ease;
}
.timepickr-view:hover {
    background: var(--hover);
}
.timepickr-ok {
    padding: 6px 14px;
    font-size: 10px;
    font-weight: 600;
    border: 1px solid var(--bg-border);
    border-radius: var(--border-radius-xl);
    background: transparent;
    color: var(--txt-color);
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}
.timepickr-ok:hover {
    background: var(--hover);
}

/* Default view: two scroll columns spanning all 24 hours, so there is no AM/PM to reconcile. */
.timepickr-dialog.is-wheel {
    width: 188px; /* only the dial needs the full width */
    padding: 10px 20px 12px; /* the faded outer rows already read as breathing room */
}
.timepickr-wheels {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    height: 200px; /* five rows of 40 */
    /* Only the outermost row is dimmed, and never below ~35% - it must stay scannable.
       The stop at 20% is exactly one row, so the fade never touches the inner neighbours. */
    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0, #000 20%, #000 80%, rgba(0, 0, 0, 0.4) 100%);
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0, #000 20%, #000 80%, rgba(0, 0, 0, 0.4) 100%);
}
.timepickr-dialog:not(.is-wheel) .timepickr-wheels {
    display: none;
}
.timepickr-dialog.is-wheel .timepickr-head,
.timepickr-dialog.is-wheel .timepickr-body {
    display: none;
}
.timepickr-wheel-band {
    position: absolute;
    left: 0;
    right: 0;
    top: 80px;
    height: 40px;
    border-radius: var(--border-radius-sm);
    background: var(--brand-soft);
    pointer-events: none;
}
.timepickr-dialog .timepickr-wheel {
    position: relative;
    box-sizing: border-box;
    flex: 1;
    height: 100%;
    margin: 0 !important;
    padding: 80px 0 !important; /* two rows, so the first and last item can still centre */
    float: none !important;
    text-align: center;
    overflow-y: auto;
    scroll-snap-type: y mandatory;
    overscroll-behavior: contain; /* on touch, the page behind must not scroll along */
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    scrollbar-width: none;
}
.timepickr-dialog .timepickr-wheel::-webkit-scrollbar {
    display: none;
}
.timepickr-dialog .timepickr-wheel > li {
    float: none !important;
    width: auto !important;
    height: 40px;
    padding: 0 !important;
    line-height: 40px;
    scroll-snap-align: center;
    font-size: 19px;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    color: var(--txt-color);
    opacity: 0.5;
    cursor: pointer;
    transition: opacity 0.12s ease, font-size 0.12s ease;
}
/* The centred value is read at a glance, so it carries the same weight as the clock's readout. */
.timepickr-dialog .timepickr-wheel > li.time-selected {
    font-size: 30px;
    font-weight: 600;
    opacity: 1;
    /* `body.dark .time-selected` forces dark ink for the old chip-style selection; this row has
       no chip behind it, so that would leave it near-invisible on the dark dialog. */
    color: var(--menu-hover) !important;
}
.timepickr-wheel-colon {
    font-size: 26px;
    font-weight: 600;
    opacity: 0.7;
}

/* AM/PM is a view switch over the 24h range, not a separate value. */
.timepickr-body {
    position: relative;
}
.timepickr-dialog .timepicker-meridian {
    display: flex !important;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    justify-content: space-between;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 4;
    pointer-events: none; /* the gap between the chips belongs to the dial */
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.timepickr-dialog .timepicker-meridian > li {
    float: none !important;
    width: 46px !important;
    height: 34px;
    padding: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--bg-border-light);
    border-radius: var(--border-radius-xl) !important;
    background: var(--dialog-bg);
    cursor: pointer;
    pointer-events: auto;
    transition: background-color 0.12s ease;
}
.timepickr-dialog .timepicker-meridian > li:hover {
    background: var(--hover);
}
/* --green stays light in every theme, so the chip always needs dark ink. */
.timepickr-dialog .timepicker-meridian > li.time-selected {
    background: var(--green);
    color: var(--dark-bg) !important;
}

.timepickr-dial {
    position: relative;
    width: 256px;
    height: 256px;
    margin: 0 auto 6px;
    border-radius: 50%;
    background: var(--hover);
    touch-action: none;
}
.timepickr-dialog ol,
.timepickr-dialog ol > li {
    list-style: none;
}
.timepickr-dialog .timepicker-hour,
.timepickr-dialog .timepicker-minute {
    position: absolute;
    inset: 0;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    z-index: 2;
}
.timepickr-dialog .timepicker-hour > li,
.timepickr-dialog .timepicker-minute > li {
    position: absolute;
    float: none !important;
    width: 40px !important;
    height: 40px;
    padding: 0 !important;
    line-height: 40px;
    text-align: center;
    border-radius: 50% !important;
    font-size: 16px;
    font-variant-numeric: tabular-nums;
    color: var(--txt-color);
    cursor: pointer;
}
.timepickr-dialog .timepicker-hour > li.time-selected,
.timepickr-dialog .timepicker-minute > li.time-selected {
    color: #fff !important;
    font-weight: 600;
}

.timepickr-hand {
    position: absolute;
    left: 50%;
    width: 2px;
    margin-left: -1px;
    transform-origin: 50% 100%;
    background: var(--blue);
    z-index: 1;
    transition: transform 0.18s ease, height 0.18s ease;
}
.timepickr-knob {
    position: absolute;
    top: -20px;
    left: 50%;
    width: 40px;
    height: 40px;
    margin-left: -20px;
    border-radius: 50%;
    background: var(--blue);
}
.timepickr-pivot {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    margin: -4px 0 0 -4px;
    border-radius: 50%;
    background: var(--blue);
    z-index: 3;
}
#detailRecurrencePatternGroupForm .detailLabel{
    min-width: auto !important; /*Make the pattern align correctly*/
}
#detailRecurrencePatternGroupForm .detailRow {
    min-width: 100% !important; /*Make the pattern fit correctly*/
}

.columChooser > .bubbleDialogHolder > div:first-of-type {
    padding: 5px 5px 5px 10px;
    font-size:11px;
}
.dashboardSectionsContent .detailRow:hover {
    border-radius: var(--border-radius-sm) !important;
    border-left: 2px solid transparent;
}
/* In the flyout the inline-edit links render as bare glyphs next to the 28x26 icon
   buttons, so they have to drop the pill geometry they wear everywhere else
   (fit-content width, 22px box, left-floated icon). The wording stays invisible
   through the color:transparent the flyout already puts on .gridMenu a. */
.submenuCol .gridMenu #submitLines {
    margin-left: 4px;
    padding-left: 0;
}
.submenuCol #submitLines > .lnkSaveDetails,
.submenuCol #submitLines > .lnkCancelDetails {
    width: 28px !important;
    min-width: 28px;
    height: 26px !important;
    line-height: 26px !important;
    padding: 0 !important;
    margin: 0;
    /* Unlike the icon buttons these carry a real Save/Cancel text node, which as a
       flex item would squeeze the glyph out of its 28px box. */
    font-size: 0;
}
.submenuCol #submitLines > .lnkSaveDetails:before,
.submenuCol #submitLines > .lnkCancelDetails:before {
    float: none;
    padding-left: 0;
    line-height: inherit;
}
.submenuCol #submitLines > .lnkSaveDetails:hover,
.submenuCol #submitLines > .lnkCancelDetails:hover {
    background: transparent !important;
}
span.tabCount[style*="background-color: rgb(255, 102, 0)"] {
    color: #fffdfd !important;
}
span.breadcrumb {
    position: absolute;
    left: 14px;
    top: 39px;
    color: var(--menu-hover);
    display:none;
}
.maxWidth.displayGrid{
    width: 98.7% !important;
}

span[data-generic-img-gender="O"]:before, span[data-generic-img-gender="M"]:before {
    font-family: 'ionbiz' !important;
    content: "\e94c";
    margin-left: -10px;
    font-size: 18px;
}
span[data-generic-img-gender="undefined"]:before {
    font-family: 'ionbiz' !important;
    content: "\e665";
    margin-left: -10px;
    font-size: 18px;
}
body.page_schedulemanagement span[data-generic-img-gender="undefined"]:before { /*ScheduleManagement has no picture obj always*/
    
    content: none !important;
    margin-left: -10px;
    font-size: 18px;
}
span[data-generic-img-gender="F"]:before {
    font-family: 'ionbiz' !important;
    content: "\e94d";
    margin-left: -10px;
    font-size: 18px;
}
#permissionsDetailForm {
    height: calc(100% - 27px);
    border: 1px solid var(--bg-border-light);
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 5px;
    background: var(--bg);
    border-radius: var(--border-radius-md);
    padding: 10px;
}
form.ionbizdetails{
    padding-bottom: 1px;

}
/* :not(.ui-accordion-content) - a form that is itself a section pane already gets its card from the accordion rules. */
.ui-dialog:not(:has(.bubbleDialogHolder)) form.ionbizdetails:not(.ui-accordion-content):not(:has(.ui-accordion-content,.ui-tabs-panel, .displayGrid, .lblEmail)) {
    padding-bottom: 1px;
    background: var(--bg);
    border-radius: var(--border-radius-md);
    margin-top: 5px;
    border: 1px solid var(--bg-border-light);
    padding: 10px;
    height: fit-content;
    overflow:auto;
}
.ui-accordion-content:has(form.ionbizdetails.editMode) form.ionbizdetails.editMode {
    box-shadow: none;
    border: none;
    background: transparent;
}
.detailRow div[style*="float:left; width:56%; display: inline-block; margin-left:-15px;"]{ /*Settings >Approval process edit*/
float: right !important;
margin-left:0px !important;
}
a.badgeInk { /*timeregistration badge; stamped by formatLinkTimeRegistration*/
    color: var(--txt-color) !important;
}

/* Overrides an inline background, so it must override the inline text colour that was picked to match it. */
td.notAllwed { background-color: var(--weekend-bg) !important; color: var(--txt-color) !important;}
tr.weekTotalRow { /*stamped by colorWeekTotals in the timesheet/time registration reports*/
    background: var(--grid-header-bg) !important;
}

.kanban.jqGridHolder tr.jqfoot[jqfootlevel="0"] td{
    border-bottom: 0px;
}
.kanban.jqGridHolder .ui-jqgrid tr.jqgroup td {
    border-bottom: 0px;
}
/* A cell that sets its own hex background also sets a contrast-matched text colour inline, so dark mode must leave it alone. */
body.dark span[style*="color: black"], body.dark td[style*="color:#000000"]:not([style*="background-color:#"]), body.dark div[style*="color: #000000"] {
    color: var(--txt-color) !important;
}
body.dark div[style*="color: #ff0000;"], div[style*="color: #ff0000;"]{
    color:var(--red)!important;
}
body.dark span[style*="background-color: lightgrey"] {
    background-color: slategray !important;
}
.mce-btn {
border-radius: var(--border-radius-xl) !important;
}
.mce-btn button { line-height: 16px;} 
.mce-ico, .mce-caret  {opacity: 0.8;}
.mce-btn-group{
    border-radius:0px !important;
}
.mce-primary.mce-btn-has-text, .mce-primary button{
    border-radius: var(--border-radius-xl) !important;
}
.mce-textbox:focus, .mce-textbox.mce-focus {
    border-color: var(--input-focus) !important;
    outline-color: transparent !important;
}
.mce-widget {
    font-family: var(--font-family) !important;
}
.mce-menu-item{
    font: var(--font) !important;
}
.mce-floatpanel.mce-popover.mce-bottom>.mce-arrow:after{
    border-bottom-color: var(--bg) !important;
}
.mce-menu-item{
    margin-left: 3px !important;
    margin-right: 3px !important;
    padding: 5px !important;

}
.mce-window-body, .mce-window-head, .mce-container.mce-foot > .mce-container-body { 
    background: var(--dialog-bg) !important;
    border-radius: var(--border-radius-md) !important;
}
.mce-window-head .mce-close i {
    color: var(--icon-bg) !important;
    font-size: 14px !important;
}
.mce-textbox.mce-multiline{
    text-indent: 0px !important;
}
.replayToNote .avatar[data-image="none"]:before {
    font-family: 'ionbiz' !important;
    content: "\e665";
    font-size: 20px;
    margin-left: 0;
    left: 0;
    left: 14px;
}
.detailInputFlex{
    display:flex !important;
    align-items:center;
    flex-direction:row;
}
.datepicker-inline.threeElements40And30PercentWidth .datepicker {
    width: auto !important;
}
#cumulativePerYearContainer { /*reports grid height*/
    min-height: calc(100% - 355px) !important;
}
.detailInput:has(.threeElements40And30PercentWidth):has(.select-inline){
    width: 70% !important;
}
.ui-menu-multiple-container:has(.closeList) .ui-autocomplete  {
    clip-path: inset(-10px -10px 0px -10px);
    border-bottom-left-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}
.detailInput:has(.hasDatepicker.dirty):before,
.cell:has(.hasDatepicker.dirty):before,
tr[editable="1"] td:has(.editable.timepicker.dirty):before, 
.timepicker-inline:has(.dirty):before {
    color: black;
    opacity: 1 !important;
}
#dynamicWorkschedulePeriod .datepicker-inline{
    margin-top: 5px;
    margin-bottom:5px;
    position:relative;
    left:-20px;
}
#dynamicWorkschedulePeriod label[for="chkPeriod3"]{
    margin-top:12px;
}
.toolbarMenuShadow .scrollableArea .contentBox.activeSubmenu,
.toolbarMenuShadow .scrollableArea .contentBox.active,
.toolbarMenuShadow .scrollableArea .contentBox:hover {
    box-shadow: inset 0px 0px 3px black;
}
.detailRow:has(div#TabGeneral_Subject) {
    border-radius: var(--border-radius-sm);
    padding-right: 0px;
    padding-bottom:0px;
    padding-top:0px;
}

.lightGreen.searchList.token-input-token-facebook::after {
    font-family: "ionbiz";
    font-weight: normal;
    content: "\e618";
    margin-left:2px;
    color: var(--menu-hover);
}
.green.searchList.token-input-token-facebook::after {
    font-family: "ionbiz";
    font-weight: normal;
    content: "\e648";
    margin-left: 2px;
    color: var(--menu-hover);
}
#treeviewAccordion ul > li:has(ul), #treeviewAccordion ul ul{/*general setting sub-menus spacing*/
margin-top: 5px !important;
}
input:focus::placeholder{
    color: transparent; /*make placeholders hide on focus*/
}
.tooltipHolder .detailInput{
    background: transparent;
}

.addBox:not(:last-child) {
    border-right: 1px solid var(--bg-border);
    margin-right:5px;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius:0px !important;
}
#addDialog:where(:hover):has(:hover) .addBox:not(:last-child) {
    border-right-color: transparent !important;
}
.addBox:not(:last-child):hover{
    border-top-right-radius: var(--border-radius-xl) !important;
    border-bottom-right-radius:var(--border-radius-xl) !important;
}
.maxWidth:has(.addBox){
    display: flex;
    justify-content:center;
}
/* All required-field conditions are resolved per form by _stampRequiredRows in ionBiz.Details.js
   (ib-req-label / ib-req-empty / ib-req-dyn); as :has() they re-matched every label on each DOM change. */
.detailRow.ib-req-label > .detailLabel > label:after,
.detailRow.ib-req-dyn > .detailLabel > label:after,
.detailRow.ib-req-empty > .detailLabel:not(:has(*)):after
{ /*mark mandatory fields*/
    content: "*";
    color: var(--red);
    text-indent:0px;
    font-weight:bold;
}
button#start, button#stop{ /*buttons on dashboard > timesheet*/
    border-radius:50% !important;
}
.ui-icon.ui-icon-triangle-1-n, .ui-icon.ui-icon-triangle-1-s{ /*triangles for inputs on Recurrence tab*/
    font-size: 10px;
    color: var(--txt-color);
    opacity: 1;
}
.ui-spinner .ui-icon.ui-icon-triangle-1-n,
.ui-spinner .ui-icon.ui-icon-triangle-1-s { /*replace jQuery UI's hardcoded ▲/▼ text nodes with the chevron the selects use*/
    font-size: 0;
    margin: 0;
    top: 0;
    bottom: 0;
    left: 0;
    /* Keeps the same inset from the field edge the selects use; the button box runs to the border. */
    right: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ui-spinner .ui-icon.ui-icon-triangle-1-n:before,
.ui-spinner .ui-icon.ui-icon-triangle-1-s:before {
    font-family: 'ionbiz';
    content: "\e944";
    font-size: 8px;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.ui-spinner .ui-icon.ui-icon-triangle-1-n:before {
    transform: rotate(180deg);
}
.savedFilters .minicolors-input-swatch { /*saved filters color picker*/
    top: 0px !important
}
.boxOpenPublicHoliday > span:before, .boxOpenPublicHoliday > span.text {
    color: var(--dark-green) !important;
}
.tinymceNoToolbar{ /*don't show the square border if toolbar is not present*/
    border-top-left-radius: 8px !important;
}
#gridPlanningsContainer td[aria-describedby$="_Name"] .user ~ span:not(.ui-icon):not(.cell-wrapper):not(.cell-wrapperleaf):not(.collision){ /* align the planning frozen div with the table behind*/
    margin: 0px !important;
}
#gridPlanningsContainer .ui-jqgrid .ui-jqgrid-btable td:first-child .user { /* align the planning frozen div with the table behind*/
    width: 32px !important;
    height: 32px !important;
}
#gridPlanningsContainer .ui-jqgrid .ui-jqgrid-btable td:first-child .user:after{
    line-height: 32px;
}
.btnShowNotes.icon-notes:before { /* arrow icon for notes*/
    content: "NOTES" !important;
    font-size: 10px !important;
    font: var(--font) !important;
    margin-right: 0px !important;
    font-weight: bold !important;
}
.btnShowNotes.icon-notes { /* left arrow icon for notes*/
    transform: rotate(90deg);
}
#planningBarPanel td:has(.sticky),
#timesheetScheduleBarPanel td:has(.sticky) {
    border-bottom-color: transparent !important;
}
#planningBarPanel table, #planningBarPanel .sticky,
#timesheetScheduleBarPanel table, #timesheetScheduleBarPanel .sticky {
    width: 100% !important;
}
#planningBarPanel .jqGridHolder .jqgrow.ui-state-hover,
#timesheetScheduleBarPanel .jqGridHolder .jqgrow.ui-state-hover{
    background: transparent !important;
}
#planningBarPanel .jqGridHolder .ui-jqgrid-btable tr.ui-state-highlight:not(.jqgrid-new-row),
#timesheetScheduleBarPanel .jqGridHolder .ui-jqgrid-btable tr.ui-state-highlight:not(.jqgrid-new-row){
    background-color: transparent !important

}

#planningBarPanel .jqGridHolder .ui-jqgrid-btable tr.ui-state-highlight:not(.jqgrid-new-row) .sticky,
#timesheetScheduleBarPanel .jqGridHolder .ui-jqgrid-btable tr.ui-state-highlight:not(.jqgrid-new-row) .sticky  {
   background-color: var(--bg-border-light);
}
#planningBarPanel .sticky:hover,
#timesheetScheduleBarPanel .sticky:hover{
    background-color:var(--hover);
}
#planningBarPanel table.ui-jqgrid-btable:has(.sticky),
#timesheetScheduleBarPanel table.ui-jqgrid-btable:has(.sticky){
    margin-top:5px;
}
/* The accordion panel is a direct child of .halfSizeLeft, so `>` keeps :has() from walking the whole panel. */
.displayGrid:has( > .halfSizeLeft > .ui-accordion-content){
    background: var(--east-bg) !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0px !important;
    /* the row is only a two-column wrapper here, so its card padding would add to the
       18px the section headers and wrappers already space themselves with */
    padding: 0px !important;
}

/* the wrapper's own 18px bottom margin is the gap; a float cannot collapse with the
   following header's top margin, so the two would otherwise stack */
.displayGrid:has( > .halfSizeLeft > .ui-accordion-content) + h2.ui-accordion-header,
.displayGrid:has( > .halfSizeLeft > .ui-accordion-content) + * > h2.ui-accordion-header:first-child {
    margin-top: 0px !important;
}
body:not(.classic) .btnAction, body:not(.classic) .btnCancel,
body:not(.classic) .lnkSaveDetails, body:not(.classic) .lnkExtraDetails, body:not(.classic) .lnkExtraSaveDetails, body:not(.classic) .lnkThirdSaveDetails, body:not(.classic) .lnkFourthSaveDetails, body:not(.classic) .lnkSaveAndNewDetails, body:not(.classic) .lnkCancelDetails,
body:not(.classic) .formSubmit, body:not(.classic) .formCancel, body:not(.classic) .formReactSubmit, body:not(.classic) .formReactCancel,
body:not(.classic) .ui-dialog .ui-dialog-buttonpane button.ionbiz-button-confirm, body:not(.classic) .ui-dialog .ui-dialog-buttonpane button,
body:not(.classic) .changePassHolder input.changePassBtn, body:not(.classic) .changePassHolder a.changePassBtn, body:not(.classic) .userSubMenuHolder .resetUserPreferenceHolder input.resetPreferenceBtn { /*round buttons*/
    border-radius: 20px !important;
}
/* A label that is the row's only child is the only .detailLabel the row can hold besides its own
   descendants; the doubled class keeps the specificity of the :has() form this replaced. */
.detailRow > .detailLabel.detailLabel:only-child, .detailRow > .detailLabel:only-child .detailLabel{ /*message labels*/
    max-width: 100% !important;
}
.detailLabel:has(> .icon-warning_1:only-child) .icon-warning_1:before { /*warning icon color for message*/
    color: var(--txt-color) !important;
}
.ui-dialog .ui-dialog-titlebar.icon-error{
    background-color: var(--red) !important;
    color: white !important;
}
.ui-dialog .ui-dialog-titlebar.icon-error:before, .ui-dialog:has(.ui-dialog-titlebar.icon-error) .ui-button .ui-icon-closethick:before{
    color: white !important;
}
.jqgrid-new-row td {
    border-bottom: 1px solid transparent !important;
    padding-top: 2px !important;
}
#ProjectsDashboardTab div:has(.halfSizeLeft):has(.halfSizeRight:nth-of-type(2)) .halfSizeLeft .ui-accordion-content { /*project dashboard Profit Factors Averages div*/
    min-height: 293px;
}

.ui-dialog-content > .gridMenu + .jqGridHolder .ui-jqgrid .ui-jqgrid-bdiv {
    max-height: 600px;
}
.bubbleDialogHolder.ui-dialog-content:has(.jqGridHolder){
    width: calc(100% - 16px) !important;
}
/* A definite height (not min-height): the panes can then shrink in the flex-column dialog content,
   and the grid's own calc(100% - 72px) body height resolves against it. */
#modalWindow .jqGridHolder.ui-accordion-content {
    width: calc(100% - 10px) !important;
    height: 397px;
    padding: 0px !important;
    overflow: hidden; /* the grid body scrolls; a shrunk fractional pane height otherwise adds a 1px pane scrollbar */
}
#gbox_gridAddTimesheetsResource .ui-jqgrid-bdiv, #gbox_gridAddTimesheetsProject .ui-jqgrid-bdiv{

    min-height: 60px !important;
}
#gbox_gridAddTimesheetsResource .ui-jqgrid-bdiv td{ /*dont show borders for this grid*/

    border-bottom: 1px solid transparent !important;
}
.ui-accordion-content:has(#gbox_gridAddTimesheetsResource, #gbox_gridAddTimesheetsProject) {
    overflow: visible;
}
/* The section header is a full-width card, so the grid fills it instead of leaving the rest
   of the card empty. Only the name column takes the slack; the icon column keeps its width. */
#gview_gridAddTimesheetsResource .ui-jqgrid-htable,
#gview_gridAddTimesheetsResource .ui-jqgrid-btable {
    width: 100% !important;
}
#gview_gridAddTimesheetsResource .ui-jqgrid-htable tr:first-child th:last-child,
#gview_gridAddTimesheetsResource .ui-jqgrid-btable tr.jqgfirstrow td:last-child {
    width: auto !important;
}
.detailInput:has(> span:only-child):has(br) {
    text-indent: 0px !important;
    margin-left: 8px;
}
.minicolors-swatch-color{
    cursor: pointer;
}
#btnResetFiltersAndReload{
    display: none;
}
.minicolors-theme-default .minicolors-input{
    width: 150px !important;
}
.gridMenu input.ui-autocomplete-input.iconAC::placeholder { /*uppercase placeholders*/
    color: var(--txt-color);
    text-transform: uppercase;
    font-weight: bold !important;
    font-size: 11px;
}
.ionBizDialogDetails.ui-dialog-content .ui-accordion-content .detailRow{ /*rows are too wide on large screens*/
    max-width: 800px;
}
#InvoiceMemoTab{
    margin-left: 5px;
    margin-top: 5px;
    margin-right: 5px;
}
#SettingsFeaturesTab .halfSizeLeft {
    width: 65%;
}
div[id^="gridDashboardDefinitionToolbar"]{ /*toolbar for Relations Dashboard*/
    display: flex;
    margin-left: 8px !important;
}

/* grid scrollbars: always-visible thin scrollbar.
   The previous "hidden until :hover" pattern (.ui-jqgrid-bdiv:hover { &::-webkit-scrollbar-thumb {...} })
   forced Chromium to recompute painted-scrollbar style on every mousemove inside the grid body,
   which made hover unusable on large (~500-row) grids. The global `scrollbar-width: thin`
   declaration in base.css now handles the visual. */

div[id^="tabrecurrence"] .detailRow {
    display: flex;
    align-items: center;
}
label[for^="chkScopeGroups"], label[for^="chkTabRecurrence"]{
    margin-left: 10px;
}
label[for^="chkScopeGroups"]:after{
    margin-right: 1px !important;
}
.dialog-search-box{
    height: 25px;
    border-radius: 20px;
    background: var(--bg);
    margin-top: 1px;
    width: 100px;
    font-size: x-small;
    text-indent:15px;
}
.mce-content-body li, .body li, .mce-content-body ul, .body ul {
   line-height: 24px;
   text-indent: 0px;
}

.ui-accordion .ui-accordion-content:has(.w33Procent) { /* invoices Export to PDF*/
    min-height: 38px;
}
.ui-accordion .ui-accordion-content[style*="visibility: collapse;"], .ui-accordion .ui-accordion-header[style*="visibility: collapse;"]{ /*sections that are not shown should not occupy space*/
margin: 0px !important;
padding: 0px !important;
border-width: 0px !important;
}
#detailRecurrencePatternGroupForm .detailLabel, #PlanningRecurrenceTab .detailLabel {
    font-size: 0.8em;
}
.ui-spinner a.ui-spinner-button{
    background: transparent;
}
/* Keeps a visible notice (e.g. "Disapproved by" on a reopened timesheet) under its hidden header. */
.ui-accordion .ui-accordion-header.hide + .ui-accordion-content:not(:has(> .holderNotification:not(.hide))){
    display: none !important;
}
.ui-tooltip {
    border-radius:var(--border-radius-md);
}
.detailLabel > input[type="text"][style*="visibility: collapse"]{ /*input in import planning from timesheets*/
    width:0px !important;
}
.sendEmailForm .head:first-of-type{
    border-top-left-radius: var(--border-radius-md);
    border-top-right-radius: var(--border-radius-md);
    border-top-color: var(--bg-border-light);
}
.sendEmailForm .lastHead{
    border-bottom-left-radius: var(--border-radius-md) !important;
    border-bottom-right-radius: var(--border-radius-md) !important;
}
#LeaveRecurrenceTab .detailRow{ /* keep the row narrow on Leaves Recurrence*/
    max-width: 600px;
}
/*#print[onclick*=printGrid]{display: none;}*/
.mce-window.mce-in{
    border-radius: var(--border-radius-md) !important;
}
.mce-listbox button{
    border-radius: var(--border-radius-xl) !important;
    border: 1px solid var(--bg-border-light) !important;
}
.detailInput[name="LeaveStatusName"] {
    padding-right: 12px;
    padding-left: 5px;
    font-weight: 600;
    border-radius: var(--border-radius-xl);
    height: 26px;
    line-height: 28px;
    text-indent: 5px;
    width: fit-content !important;
    background: var(--input-bg) !important;
}
.page_home #eastToolbar.gridMenu{display: flex; flex-direction: row-reverse;}
a.ui-tabs-anchor:before, .recent-container:has(a) .recent-id:before {
    font-family: 'ionbiz' !important;
    speak: none;
    font-size: 0.85em;
    margin-right: 5px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\e93e";
}
/* The report tab strips are named after resources, so the generic tab glyph is noise.
   Payroll and Productivity render their strip in a header div just before the panels. */
#resourcesTabs a.ui-tabs-anchor:before,
#resourcePayrollTabsHeader a.ui-tabs-anchor:before,
#resourceProductivityTabsHeader a.ui-tabs-anchor:before {
    content: none !important;
}
/* In Payroll/Productivity this id is the panel container; elsewhere it is a tab strip. */
#resourcesTabs:not(.tabsStrip){
    display:flex;
}

a[href*="GeneralTab"]:before, a[href*="DetailsTab"]:before, a[href*="DetailTab"]:before {
    content: "\e915";
}
a[href*="NotesTab"]:before {
    content: "\e63f";
}
a[href*="ItemsSuppliersTab"]:before {
    content: "\e618";
}
a[href*="ItemsSalesDiscountsTab"]:before {
    content: "\e60b";
}
a[href*="ItemsCompositionTab"]:before {
    content: "\e928";
}
a[href*="ItemsInCompositionTab"]:before {
    content: "\e935";
}
a[href*="ItemsStockTab"]:before {
    content: "\e954";
}
a[href*="ItemsSerialNumbersTab"]:before {
    content: "#";
}
a[href*="AttachmentsTab"]:before, a[href*="AttachmentsListTab"]:before, a[href*="InvoicingProposalsMergesTab"]:before, a[href="#InvoiceMergesTab"]:before {
    content: "\e60a";
}
a[href*="EmailsHistoryTab"]:before {
    content: "\e676" !important;
}
a[href*="HistoryTab"]:before {
    content: "\e660";
}
a[href*="CustomFieldsTab"]:before, a[href*="CustomizationTab"]:before, a[href*="FeaturesTab"]:before {
    content: "\e678";
}
a[href*="IssuesTab"]:before, a[href*="TicketTab"]:before, a[href*="TicketsTab"]:before, a[href*="IssuesListTab"]:before, a[href*="IssueBarTab"]:before {
    content: "\e61a";
}
a[href*="FinancialsTab"]:before, a[href*="FinancialTab"]:before {
    content: "\e933";
}
a[href*="CostsTab"]:not(a[href*="CostsTable"]):before, a[href*="ProjectsBuildBudgetTab"]:before,.recent-container:has(a[href*="/Cost"]) .recent-id:before {
    content: "\e60b";
}
a[href*="TaskResourcesTab"]:before, a[href*="ResourcesTab"]:before, .recent-container:has(a[href*="/Resource"]) .recent-id:before {
    content: "\e648";
}
a[href*="TimesheetsTab"]:before {
    content: "\e663";
}
a[href*="LinksTab"]:before, a[href*="LinksListTab"]:before {
    content: "\e921";
}
a[href*="DashboardTab"]:before, a[href*="Dashboard/Index"]:before {
    content: "\e94a";
    font-family:'ionbiz';
    margin-right: 4px;
}
a[href$="/IssueKanban/Index"]:before, .recent-container:has(a[href*="/Issue"]) .recent-id:before {
    content: "\e94a";
    font-family:'ionbiz';
    margin-right: 4px;
}
a[href*="GantTab"]:before {
    content: "\e909";
}
a[href*="TasksTab"]:before, a[href*="TaskBarTab"]:before, .recent-container:has(a[href*="/MyTask"]) .recent-id:before {
    content: "\e952";
}
a[href*="ExtraTab"]:before {
    content: "\e928";
}
a[href*="SkillsTab"]:before {
    content: "\e953";
}
a[href*="MemoTab"]:before {
    content: "\e63f";
}
a[href*="DigitalSigningLinesTab"]:before {
    content: "\e915";
}
a[href*="InfoTab"]:before {
    content: "\e927";
}
a[href*="RMATab"]:before {
    content: "\e935";
}
a[href*="FlowTab"]:before {
    content: "\e914";
}
a[href*="ItemTab"]:before, a[href*="AssetsTab"]:before, a[href*="ItemsTab"]:before, .recent-container:has(a[href*="/Item"]) .recent-id:before {
    content: "\e928";
}
a[href*="RecurrenceTab"]:before {
    content: "\e617";
}
a[href*="QuotesLinesTab"]:before {
    content: "\e616";
}
a[href*="AddressesTab"]:before {
    content: "\e610";
}
a[href*="TimelineTab"]:before {
    content: "\e920";
}
a[href*="BalanceTab"]:before {
    content: "\e660";
}
a[href*="TextsTab"]:before, a[href*="TextTab"]:before {
    content: "\e626";
}
a[href*="SlaTab"]:before {
    content: "\e61c";
}
a[href*="LineListTab"]:before {
    content: "\e916";
}
a[href*="DynamicWorkscheduleTab"]:before {
    content: "\e608";
}
a[href*="LeavesTab"]:before {
    content: "\e612";
}
a[href*="CVTab"]:before {
    content: "\e682";
}
a[href*="PermissionsTab"]:before, a[href*="LicenseTab"]:before {
    content: "\e641";
}
a[href*="RelationsTab"]:before, .recent-container:has(a[href*="/Relation"]) .recent-id:before {
    content: "\e618";
}
a[href*="QuotesTab"]:before {
    content: "\e616";
}
a[href*="ProjectsTab"]:before, .recent-container:has(a[href*="/Project"]) .recent-id:before {
    content: "\e934";
}
a[href$="PlanningTab"]:before {
    content: "\e936";
}
a[href*="TimeRegistrationsTab"]:before {
    content: "\e938";
}
a[href*="InvoicingTab"]:before, .recent-container:has(a[href*="/Invoice"]) .recent-id:before {
    content: "\e611";
}
a[href*="ProcurementTab"]:before, .recent-container:has(a[href*="/Purchase"]) .recent-id:before {
    content: "\e93a";
}
a[href*="PausesTab"]:before {
    content: "\e642";
}
a[href*="HeaderTab"]:before {
    content: "\e670";
}
a[href*="FooterTab"]:before {
    content: "\e672";
}
a[href*="SolutionTab"]:before {
    content: "\e92e";
}
a[href*="TestTab"]:before {
    content: "\e923";
}
a[href*="PrintTab"]:before {
    content: "\e900";
}
a[href*="LinesTab"]:before {
    content: "\e915";
}
a[href*="StickyBarTab"]:before {
    content: "\e68c";
}
/*Add a More Menu for overflowing menu items*/
.dropdown-links {
    position: fixed;
    background-color: var(--bg);
    list-style: none;
    padding: 0;
    z-index: 2;
    margin: 0;
    min-width: 150px;
    box-shadow: 0 0 8px var(--shaddow);
    padding: 5px;
    padding-left: 10px;
    border-radius: var(--border-radius-xl);
    display: none;
}
#eastPane .dropdown-links {
    right: 5px;
}

.dropdown-links li{
    padding: 0px 8px 0px 8px;
    margin-top: 4px !important;
    border-radius: var(--border-radius-md);
    border-left: solid 3px transparent;
}
.dropdown-links li:first-of-type{
    margin-top: 0px !important;
}
.dropdown-links li a{
   display: inline-block;
   padding-top: 5px;
   padding-bottom: 5px;
   font-size: 14px;
   width: 100%;
}
.dropdown-links li:hover{
    background-color: var(--hover);
    background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
    background-size: 2px 50%;
    background-repeat: no-repeat;
    background-position: left center;
    border-radius: var(--border-radius-xs);
    cursor: pointer;
}
#northLayout:has(.dropdown-links){ /*allows the hidden menu items to display over it*/
    z-index: auto !important;
}
#innerMainMenu .dropdown-links{
    right:unset;
    background: var(--header-bg);
    min-width: 100px;
}
#innerMainMenu .dropdown-links .contentBox{
    margin-top: 10px;
}
.more-button {
    background-color: transparent;
    color: var(--txt-color);
    border: none;
    border-radius: var(--border-radius-md);
    padding: 4px;
    font-size: 12px;
    cursor: pointer;
    margin-top: 3px;
}
.more-menu:before {
    font-family: 'ionbiz' !important;
    speak: none;
    font-style: normal;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 10px;
    content: "\e942";
    opacity:1;
    position: relative;
    top: -1px;
}
#resourcesTabs .more-menu:before{
    top: 3px !important;
}
.ui-dialog .more-menu:before{
    top: 2px;
}
/* Show the dropdown on hover/focus of the 'More' button */
.more-menu:hover .dropdown-links,
.more-menu:focus-within .dropdown-links {
  display: block;
}
#innerMainMenu .more-menu:hover .dropdown-links,
#innerMainMenu .more-menu:focus-within .dropdown-links {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#innerMainMenu .more-menu:hover, .more-menu:hover {
    color: var(--menu-hover);
    background:var(--east-bg);
}
body.classic #innerMainMenu .more-menu:hover {
    color: white;
    background:var(--menu-active);
}
#innerMainMenu:has(.more-menu:not([hidden])){
    height: 55px;
    border: solid 1px transparent;
    border-radius: var(--border-radius-md);
    /*background: var(--bg);*/
    top:1px;
    display:flex;
    justify-content:space-between;
}
body.classic #innerMainMenu:has(.more-menu:not([hidden])){
    background: var(--header-bg);
    border-color: transparent;
    box-shadow: 0px 0px 3px black inset;
}
/* Styling for the 'More' menu button and dropdown */
.more-menu {
    position: static;
    float: right;
    right:15px;
    width:20px;
    margin-top: 5px;
    margin-left: 3px;
    margin-right: 5px;
    min-height:20px;
    padding-left:10px;
    background: var(--bg);
    border: 1px solid var(--bg-border-light);
    border-radius: var(--border-radius-xs);

}
#innerMainMenu .more-menu {
    top: 0px !important;
    border-color: transparent;
    padding-top: 3px;
    width: 40px;
    margin-right:5px;
    right:unset;
    padding-left: 0px;
    text-align: center;
    background: var(--header-background);
    color: var(--icon-bg);
}
#innerMainMenu .more-button{
    color: var(--icon-bg);
    font-size: 11px;
    font-weight: 500;
}
#innerMainMenu .more-menu:before {
    top: 0px !important;
    font-size:18px !important;
    font-weight: normal !important;
}
/*End Add a More Menu for overflowing menu items*/
/*Recent Items container*/
.recent-container{
    width: fit-content;
    min-width: 500px;
    height: auto;
    max-height: calc(100vh - 80px);
    overflow-y: auto;
    padding:5px;
    position: fixed;
    background: var(--bg);
    box-shadow: 0 0 8px var(--shaddow);
    border-radius: var(--border-radius-xl);
    top: 60px;
    right: 20px;
    z-index:2;
}
.recent-group-header {
    font-size: 11px;
    font-weight: bold;
    color: var(--txt-color);
    opacity:1;
    text-transform: uppercase;
    padding: 10px 0 5px 15px;
    border-bottom: 1px solid var(--bg-border-light);
    margin-bottom: 5px;
}
.recent-date{
    border: 1px solid var(--bg-border-light);
    border-radius: var(--border-radius-sm);
    background: var(--east-bg);
    padding: 3px;
    margin-right: 5px;
    width: 95px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-flex;
    align-items: center;
}
.recent-date:before{
    font-family: 'ionbiz' !important;
    content: "\e943";
    font-size: 10px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline;
    margin-right:3px;
    vertical-align: middle;
    top: -1px;
    position:relative;
    text-indent: 3px;
    z-index: 1;
    pointer-events: none;
    opacity: 1;
}
.recent-id{
    font-weight:600;
    margin-right: 5px;
    opacity: 0.8;
}
.recent-container .btnClosePanel{
    position: absolute;
    right: 5px;
    top: 10px;
    z-index:3;
}
.recent-container .btnClosePanel:before{
    margin-right: 5px;
    font-size: 8px;
    font-family: 'ionbiz' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content:"\e622";
}
.recent-container ol {
    
    padding-left:1px;
    list-style:none;
    max-height:400px;
    overflow:auto;
}
.recent-container h2 {
    text-transform:capitalize;
    opacity: 0.8;
    margin-top: 10px !important;
}
.recent-container h2:before {
    margin-right: 5px;
    font-family: 'ionbiz' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 14px;
    content: "\e64c";
}
.recent-container ol li {
    border: 1px solid transparent;
    border-radius: 3px;
    border-bottom-right-radius: var(--border-radius-xs);
    border-top-right-radius: var(--border-radius-xs);
    padding: 8px;
    padding-left: 18px;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 2px 0%;
    margin-bottom: 5px;
}
.recent-container ol li:hover {
    background-color: var(--hover);

    background-repeat: no-repeat;
    background-position: left center;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.recent-container ol li a {
    width: 100%;
    padding-top: 4px;
    padding-bottom: 4px;
    color: var(--menu-hover);
    font-weight: 500;
}
/*End Recent Items container*/

.page_timesheetcells .ui-jqgrid tr.jqgrow.ui-row-ltr:hover {
    background: color-mix(in srgb, var(--menu-hover) 8%, transparent);
}

#view-shortcuts{
    min-width:30vw;
    height:730px;
    overflow: auto;
    display:flex;
    flex-direction: row;
    background: var(--bg);
    border-radius: var(--border-radius-xl);
    padding: 5px;
    margin-top:10px;
}
.shortcut-item {
    padding: 7px;
    border-radius: var(--border-radius-xl);
}
.shortcut-item:hover {
    background: var(--hover);
}
.shortcut-name{
    padding: 3px 10px 3px 10px;
    font-weight: 500;
    background: var(--east-bg);
    border: 1px solid var(--bg-border);
    border-radius: var(--border-radius-sm);
    margin-right: 10px;
    min-width: 100px;
}
.shortcut-category{
    margin: 14px 7px 4px 7px;
    font-weight: 600;
    font-size: 0.85em;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--txt-color-light, var(--txt-color));
    opacity: 0.7;
    border-bottom: 1px solid var(--bg-border);
    padding-bottom: 4px;
}
rect.highcharts-legend-box {
    fill: var(--bg);
    stroke: var(--bg-border-light);
    rx: var(--border-radius-sm);
    ry: var(--border-radius-sm);
}
/* Highcharts hardcodes these colours as presentation attributes, which CSS outranks. */
.highcharts-grid-line,
.highcharts-axis-line,
.highcharts-tick,
.highcharts-point {
    stroke: var(--bg-border-light);
}
.highcharts-column-series rect, .highcharts-point-hover rect{
    rx: 3px;
    ry: 3px;
}
path.highcharts-tooltip-box {
    fill: var(--bg);
    stroke: var(--txt-color);
}
.highcharts-tooltip table, .highcharts-tooltip span, .highcharts-series-hover{
    background: var(--bg);
    font: var(--font) !important;
    color: var(--txt-color);
}
#InvoicingProposalsNotesTab .detailRow{
    background: var(--bg);
    padding: 5px;
    margin: 5px;
    border: 1px solid var(--bg-border-light);
    width:50%;
}
#pager_grid_center{overflow: hidden;}
.page_contact .detailInput:has(#ResourceName, #PersonalRelationName){ /*somehow these 2 fields have static postion*/
    position:relative;
}
.contextMenuPlugin .icon-add, .contextMenuPlugin .icon-add:before{
    font-size: 15px !important;
}
/*SendInvoiceBy field for Safari*/
#relationAddressDetailForm select#SendInvoiceByOption option{
    color: transparent;
}
#relationAddressDetailForm select#SendInvoiceByOption option:after {
    left: 25px;
    color: var(--txt-color);
    position: absolute;
    font: var(--font);
}
#relationAddressDetailForm select#SendInvoiceByOption option:before {
    color: var(--txt-color);
}
#relationAddressDetailForm select#SendInvoiceByOption option[value="0"]:after {
    content: "Email" !important;
}
#relationAddressDetailForm select#SendInvoiceByOption option[value="0"]:before {
    content: "\e676" !important;  
}
#relationAddressDetailForm select#SendInvoiceByOption option[value="1"]:after {
    content: "Mail" !important;
}
#relationAddressDetailForm select#SendInvoiceByOption option[value="1"]:before {
    content: "\e90d" !important;
}
#relationAddressDetailForm select#SendInvoiceByOption option[value="2"]:after {
    content: "Platform" !important;
}

#relationAddressDetailForm select#SendInvoiceByOption option[value="2"]:before {
    content: "\e92f" !important;
}
#relationAddressDetailForm select#SendInvoiceByOption option[value="3"]:after {
    content: "Peppol" !important;
}

#relationAddressDetailForm select#SendInvoiceByOption option[value="3"]:before {
    content: "\e921" !important;
}
/*SendInvoiceBy field for Safari*/
.filter-resource-name{
    padding-left:15px; 
    padding-right:15px; 
    font-size: 11px !important;
    border-radius: var(--border-radius-xl);
    cursor: pointer;
    color: var(--menu-hover);
    font-weight:600;
    text-transform: uppercase;
    width: fit-content !important;
    line-height: 37px !important;
}
.ui-datepicker-week-col{
    font-size: 10px;
    background: var(--east-bg);
    text-align: center;
    color: var(--txt-color) !important;
    opacity:0.6;
}

.mce-grid td.mce-grid-cell div {border-radius:50%;}
/* the "×" character's ink sits low and right in its em box; draw the cross with two bars instead */
.mce-colorbtn-trans div { position: relative; font-size: 0 !important; }
.mce-colorbtn-trans div::before, .mce-colorbtn-trans div::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 9px;
    height: 2px;
    border-radius: 1px;
    background: #707070;
}
.mce-colorbtn-trans div::before { transform: translate(-50%, -50%) rotate(45deg); }
.mce-colorbtn-trans div::after { transform: translate(-50%, -50%) rotate(-45deg); }
.mce-menu-item {
    border-radius: var(--border-radius-xs);
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 2px 0%;
    transition: background 0.1s;
    font-family: var(--font-family) !important;
}
.mce-menu-item-normal.mce-active{
        background-color: var(--bg) !important;
        background-image: linear-gradient(var(--menu-hover), var(--menu-hover)) !important;
        background-size: 2px 50% !important;
        background-repeat: no-repeat !important;
        background-position: left center !important;
        color: var(--txt-color) !important;
}
.mce-menu-item:not(.mce-menu-item-sep):hover,
.mce-menu-item:not(.mce-menu-item-sep).mce-selected,
.mce-menu-item:not(.mce-menu-item-sep):focus{
        background-color: var(--hover) !important;
        background-image: linear-gradient(var(--menu-hover), var(--menu-hover)) !important;
        background-size: 2px 50% !important;
        background-repeat: no-repeat !important;
        background-position: left center !important;
        color: var(--txt-color) !important;
}
.mce-menu-item:hover .mce-text,
.mce-menu-item.mce-selected .mce-text,
.mce-menu-item:focus .mce-text,
.mce-menu-item-normal.mce-active .mce-text{color: var(--txt-color) !important;}
.mce-content-body *[contentEditable=false][data-mce-selected]{
    outline: 1px solid var(--input-focus) !important;
    border-radius: var(--border-radius-md);
    margin-right:10px;
    margin-left:1px;
}
/* Class-keyed rather than pre[class*="language-"], for the reason documented at the top of
   codesample/css/prism.css: the class-attribute bucket costs a full-document walk per recalc.
   Keep this language list in sync with prism.css. */
.ionbiztinymce pre:is(.language-markup,.language-html,.language-xml,.language-svg,.language-mathml,.language-javascript,.language-js,.language-css,.language-clike,.language-php,.language-ruby,.language-python,.language-java,.language-c,.language-csharp,.language-cpp,.language-none){
	background: var(--east-bg) !important;
	border-radius: var(--border-radius-md);
	border: 1px solid var(--bg-border-light);
}
.sticky-cell {
    position: sticky;
    background-color: var(--bg) !important; /* Must have a background */
    border-right: 1px solid var(--bg-border-light) !important;
    z-index: 10;
}
.frozen-div .ui-jqgrid-htable th{z-index:11;position:relative;background:var(--grid-header-bg);}
.frozen-div.ui-jqgrid-hdiv {z-index: 11;}
/* Any non-auto touch-action makes Safari rebuild touch regions for the whole grid on every hover repaint. */
.ui-jqgrid tr.ui-sortable-handle {
    touch-action: auto;
}
.unstick-handle:before, .stick-handle:before{
    font-family: 'ionbiz' !important;
    speak: none;
    font-size: 14px;
    margin-right: 5px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\e925";
    color: var(--txt-color);
}
.unstick-handle:before{
    color: var(--menu-hover) !important;
    content: "\e926" !important;
}
.unstick-handle, .stick-handle{
    margin-left: auto;
    cursor: pointer;
    min-width:20px;
}
/*bgLocked makes the Dialog too red*/
.ionBizDialogDetails.bgLocked {
    background: var(--dialog-bg) !important;
}
.ui-dialog:has(.ionBizDialogDetails.bgLocked) .ui-dialog-titlebar,
.ui-dialog:has(.ionBizDialogDetails.bgLocked) .ui-dialog-titlebar:before,
.ui-dialog:has(.ionBizDialogDetails.bgLocked) .ui-icon-closethick:before,
.ui-dialog:has(.ionBizDialogDetails.bgLocked) #btnMaxModal:before {
    background: var(--red) !important;
    color: white !important;
}
/* End bgLocked makes the Dialog too red*/
th.cellMedium, th.cellMedium > div, td.cellMedium {
    text-align: left !important;
}
.filter-op-wrapper {
    display: flex;
    align-items: center;
    position: relative;
    width: 100%;
}
.custom-filter-op {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    font-size: 12px;
    font-weight: 600;
    color: var(--txt-color, #888);
    background: var(--east-bg, #f5f5f5);
    border: 1px solid var(--bg-border, #b6bcc4);
    border-right: none;
    border-radius: var(--border-radius-sm, 3px) 0 0 var(--border-radius-sm, 3px);
    cursor: pointer;
    flex-shrink: 0;
    user-select: none;
    transition: background 0.12s, color 0.12s;
}
.custom-filter-op:hover {
    background: var(--menu-hover, #2563eb);
    color: var(--bg);
}
.filter-op-wrapper input {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}
.filter-op-popover {
    display: none;
    position: fixed;
    z-index: 9999;
    background: var(--bg, #fff);
    border: 1px solid var(--bg-border-light, #b6bcc4);
    border-radius: var(--border-radius-sm, 6px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    padding: 6px 0;
    min-width: 140px;
}
.filter-op-popover .filter-op-option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    font-size: 12px;
    font-weight: 500;
    color: var(--txt-color);
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 2px 0%;
    transition: background 0.1s;
}
.filter-op-popover .filter-op-option:hover {
    background-color: var(--hover, #f0f4ff);
    background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
    background-size: 2px 50%;
    background-repeat: no-repeat;
    background-position: left center;
    color: var(--menu-hover, #2563eb);
}
.filter-op-popover .filter-op-option span {
    color: var(--txt-color-light, #666);
    font-weight: 400;
}
.page_yearview .custom-filter-op { display: none !important; }
.page_yearview .filter-op-wrapper input {
    border-top-left-radius: var(--border-radius-md) !important;
    border-bottom-left-radius: var(--border-radius-md) !important;
}
/* Filter autocomplete popover */
.filter-autocomplete-popover {
    display: none;
    position: fixed;
    z-index: 10000;
    font-family: var(--font);
    background: var(--bg, #fff);
    border: 1px solid var(--bg-border, #b6bcc4);
    border-radius: var(--border-radius-sm, 6px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    padding: 6px;
    padding-top:3px;
    min-width: 120px;
}
.filter-autocomplete-list {
    max-height: 300px;
    overflow-y: auto;
}
/* Separator only while the Clear filter button is visible below the list */
.filter-autocomplete-list:has(+ .filter-autocomplete-actions:not(.filter-autocomplete-actions-bottom)) {
    border-bottom: 1px solid var(--bg-border-light);
}
.filter-autocomplete-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    font-size: 12px;
    color: var(--txt-color);
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 2px 0%;
    border-radius: var(--border-radius-sm);
    transition: background 0.1s;
}
.filter-autocomplete-item:hover,
.filter-autocomplete-item.filter-autocomplete-active {
    background-color: var(--hover, #f0f4ff);
    background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
    background-size: 2px 50%;
    background-repeat: no-repeat;
    background-position: left center;
    color: var(--menu-hover, #2563eb);
}
.filter-autocomplete-typed {
    border-bottom: 1px solid var(--bg-border-light, #e0e3e8);
    margin-bottom: 2px;
}
.filter-autocomplete-header {
    height: 0;
    margin: 0;
    padding: 0;
}
.filter-autocomplete-footer {
    display: flex;
    justify-content: space-between;
    gap: 4px;
    padding: 6px 8px 4px;
    border-top: 1px solid var(--bg-border-light, #e0e3e8);
    margin-top: 2px;
}
.filter-autocomplete-stat {
    display: flex;
    align-items: center;
    gap: 4px;
}
.filter-autocomplete-stat-label {
    font-weight: 500;
    font-size: 11px;
    color: var(--txt-color, #2563eb);
}
.filter-autocomplete-stat-value {
    font-weight: 600;
    font-size: 12px;
    font-variant-numeric: tabular-nums;
    color: var(--txt-color);
    user-select: text;
    cursor: text;
    border: 1px solid var(--bg-border-light);
    border-radius: var(--border-radius-xs);
    padding: 0px 5px 0px 5px;
    background: var(--east-bg);
}
.filter-autocomplete-close {
    position: absolute;
    top: 4px;
    right: 6px;
    z-index: 1;
    cursor: pointer;
    font-size: 18px;
    font-weight: 400;
    color: var(--txt-color, #666);
    line-height: 1;
    padding: 0 2px;
    opacity: 0.5;
}
.filter-autocomplete-close:hover {
    color: var(--red, #333);
}
.filter-autocomplete-cb {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
.filter-autocomplete-cb + span:before {
    font-family: 'ionbiz';
    font-style: normal;
    font-size: 14px;
    font-weight: bold;
    vertical-align: top;
    color: var(--txt-color);
    position: relative;
    top:1px;
    margin-right: 10px;
}
/* Unchecked icon as the default (doubled class keeps the old :not(:checked) specificity); :not(:checked) + span made Chrome restyle every span after an input on any DOM insert/remove. */
.filter-autocomplete-cb.filter-autocomplete-cb + span:before {
    content: "\e93e";
}
.filter-autocomplete-cb:checked + span:before {
    content: "\e640";
    color: var(--menu-hover, #2563eb);
}
.filter-autocomplete-item .tabCount {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 12px;
    height: 16px;
    padding: 0 4px;
    margin-left: auto;
    font-size: 10px;
    font-weight: 600;
    line-height: 16px;
    color: var(--txt-color);
    background: var(--weekend-bg);
    border-radius: var(--border-radius-sm);
    position: static;
    float: none;
    box-shadow: none;
    border: none;
    margin-top: 0;
}
.filter-autocomplete-blank {
    opacity: 0.7;
}
tr.no-result{
    opacity: 0;
}
.set-home{
    display: flex !important;
    opacity: 0;
    width:10px;
    height:10px;
    margin-left: 5px;
    float:right;
    line-height:26px;

}
.active-home {
    opacity: 1;
    align-items: center;
    color: var(--menu-hover);
}
.set-home:after{
    font-family: 'ionbiz' !important;
    content: "\e610";
    font-size: 12px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    vertical-align: middle;
    z-index: 1;
    margin-top:5px;
    pointer-events: none;
}
@media (hover: hover) {
    .submenuCol a:hover .set-home {
        opacity:1;
        align-items: center;
    }
}
/* --- Column header menu (reuses .filter-autocomplete-popover) --- */
.ion-col-menu-grid .ui-jqgrid-labels th.ui-th-column {
    cursor: pointer;
}
/* Header whose menu is currently open */
.ui-jqgrid-labels th.ion-col-menu-active,
.ui-jqgrid-labels th.ion-col-menu-active > div {
    color: var(--menu-hover, #2563eb);
    background: var(--hover, #f0f4ff);
}
/* Funnel indicator on columns with an active filter */
.ui-jqgrid-labels th.ion-col-filtered > div:before {
    font-family: 'ionbiz' !important;
    content: "\e634";
    color: var(--menu-hover, #2563eb);
    font-size: 10px;
    margin-right: 4px;
    speak: none;
    font-style: normal;
    font-weight: normal;
}
.filter-autocomplete-actions {
    display: flex;
    flex-direction: column;
    padding: 2px 0;
}
/* First action sits under the close button — keep its hover clear of it */
.filter-autocomplete-header + .filter-autocomplete-actions .filter-autocomplete-action:first-child {
    width: auto;
    margin-right: 15px;
}
.filter-autocomplete-actions-bottom {
    border-top: 1px solid var(--bg-border-light, #e0e3e8);
    margin-top: 2px;
}
.filter-autocomplete-action {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 8px 12px;
    border: none;
    background: transparent;
    font-family: var(--font);
    font-size: 12px;
    color: var(--txt-color);
    cursor: pointer;
    text-align: left;
    border-radius: var(--border-radius-sm);
}
.filter-autocomplete-action:hover {
    background: var(--hover, #f0f4ff);
    color: var(--menu-hover, #2563eb);
}
.filter-autocomplete-action.filter-autocomplete-action-active {
    color: var(--menu-hover, #2563eb);
}
.filter-autocomplete-section-label {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--txt-color);
    opacity: 0.6;
    padding: 6px 12px 2px;
}
/* No sort actions above: keep the label clear of the close button */
.filter-autocomplete-header + .filter-autocomplete-section-label {
    margin-top: 10px;
}
.filter-autocomplete-search-row {
    display: flex;
    align-items: center;
    gap: 0px;
    padding: 4px 10px 6px;
}
.filter-autocomplete-op {
    position: relative;
    flex: 0 0 auto;
    box-sizing: border-box;
    min-width: 38px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0 6px;
    font-family: var(--font);
    font-size: 14px;
    color: var(--txt-color);
    background: var(--input-bg, #fff);
    border: 1px solid var(--bg-border, #e0e3e8);
    border-radius: var(--border-radius-xs);
    cursor: pointer;
    user-select: none;
    border-right-color: transparent;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}
.filter-autocomplete-op:hover {
    border-color: var(--menu-hover, #2563eb);
}
.filter-autocomplete-op-current {
    line-height: 1;
}
.filter-autocomplete-op-caret {
    width: 0;
    height: 0;
    margin-left: auto;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 3px solid var(--txt-color);
    opacity: 0.55;
}
.filter-autocomplete-op-menu {
    display: none;
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    z-index: 10002;
    min-width: 170px;
    background: var(--bg, #fff);
    border: 1px solid var(--bg-border, #b6bcc4);
    border-radius: var(--border-radius-sm);
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    padding: 2px 0;
}
.filter-autocomplete-op-open .filter-autocomplete-op-menu {
    display: block;
}
.filter-autocomplete-op-option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    font-size: 12px;
    color: var(--txt-color);
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none;
}
.filter-autocomplete-op-option:hover {
    background: var(--hover, #f0f4ff);
    color: var(--menu-hover, #2563eb);
}
.filter-autocomplete-op-option-active {
    color: var(--menu-hover, #2563eb);
    font-weight: 600;
}
.filter-autocomplete-op-sym {
    display: inline-flex;
    width: 16px;
    justify-content: center;
}
.filter-autocomplete-input {
    flex: 1 1 auto;
    min-width: 0;
    padding: 5px 8px;
    font-family: var(--font);
    font-size: 12px;
    color: var(--txt-color);
    background: var(--input-bg, #fff);
    border: 1px solid var(--bg-border, #e0e3e8);
    border-radius: var(--border-radius-xs);
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}
.filter-autocomplete-input:focus {
    outline: none;
    border-color: var(--bg-border, #2563eb);
}
input.filter-autocomplete-input.hasDatepicker{
    text-indent: 0px !important;
}
.fa-ico {
    display: inline-flex;
    width: 16px;
    justify-content: center;
    flex: 0 0 16px;
}
/* Icon-font glyphs only: a text glyph missing from DM Sans loads a fallback face and relayouts the whole page. */
.fa-ico:before {
    font-family: 'ionbiz' !important;
    font-size: 12px;
    speak: none;
    font-style: normal;
    font-weight: normal;
}
.fa-ico-asc:before { content: "\e669"; }
.fa-ico-desc:before { content: "\e66a"; }
.fa-ico-clear:before { content: "\e622"; color: #fb5405;}
.fa-ico-pin:before { content: "\e955"; color: var(--menu-hover); }
.fa-ico-hide:before { content: "\e60d"; color: var(--red); }
div[name="customFieldsSections"] > .maxWidth > .ui-accordion-content > .halfSizeLeft {
    width: 50% !important;
}
#oAuthClientSecretMessageSection,#OAuthRedirectURLMessage{
    text-indent: 7px;
}
#quickEditCellContainer{
    min-width:50vw;
}
.tooltipster-content form.ionbizdetails:has(.halfSizeLeft), .tooltipster-content:has(> .halfSizeLeft) { /*display the halfSizeLeft and halfSizeRight with the same height in tooltips*/
    display: flex;
}
.bubbleTitle{
    text-indent: 10px;
}
img[src*="/Lib/tinymce"] { /*emoji size*/
    width: 24px !important;
    height: 24px !important;
}
.tooltipster-planning .detailInput:not([style*="width:"]):has(> span:only-child){
  text-indent: 0px !important;
  padding-left: 28px !important;
}
form#ApplicationsDetailForm > div > div > div > div > span{/*align the checkboxes on the Applications form*/
    display: inline-block;
    min-width:80px
}
span#secretKey{
    text-indent:0px;
    filter:blur(3px);
}
.detailInput:hover:has(span#secretKey) span#secretKey{
    filter:none;
}
.detailInput:has(#QuoteGeneralTabModel_Financial_DiscountType,#General_DiscountType,#General_QuoteMarginType,#TabGeneral_IssueInIonBizSection_CompletedPercent){ /*narrow fields*/
    width: calc(52% - 50px);
}
.icon-item-green:before {
    content: "\e928";
    color: var(--dark-green);
}
/*New tab style*/
/* Flattens jQuery UI's folder-tab spacing, including the 1px overhang on the active tab. */
.ui-tabs .ui-tabs-nav li,
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
    margin: 0;
    padding: 0;
}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor{
    float: none;
    padding: 0 13px;
}
.bgLocked #mainTabs1 .tabsHolder li a{
    color:var(--txt-color);
}
.bgLocked .tabsHolder li.ui-tabs-active a {
    color:var(--menu-hover) !important;
}
#detailNameHolder:hover span#detailNameHolderText:after { /*copy icon*/
    content: "\e62d";
    font-size:12px;
    margin-left:10px;
    font-weight: bold;
    font-family: 'ionbiz' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    cursor:pointer;
}
.hover-copy-span{
    position:absolute;
	left:-30px;
	line-height:34px;
}
.hover-copy-span-sixty{
    left:-60px !important;
}
i.hover-copy-span{ /*copy msg in chatbot*/
    position:absolute;
	left:-4px;
    top:1px;
	line-height:26px;
}
.hover-copy-span:before { /*copy icon*/
    content: "\e62d";
    font-size:12px;
    margin-left:10px;
    font-weight: bold;
    font-family: 'ionbiz' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    cursor:pointer;

}
.detailInput > span.bold > span{
    min-width:50px;
}
.bubbleDialogHolder:has(#resourceNameHolder > .jqGridHolder) {
    width: 100% !important;
}
.mce-btn.mce-active .mce-ico, .mce-btn:hover .mce-ico{
    color: var(--menu-hover);
    opacity: 1;
}
.mce-colorbutton .mce-preview{
    height: 3px !important;
    border-radius:2px;
    padding-right: 4px !important;
}
.note .mce-colorbutton .mce-preview{
    margin-left: -19px !important;
}
i.mce-i-backcolor{
    border-top-left-radius:3px;
    border-top-right-radius:3px;
}
/* --- CSS STYLES Chatbot --- */
#ionChat{
    width:24px;
    height: 22px;
    margin-left:8px;
    margin-right:6px;
}
#ionChat:before {
    font-family: 'ionbiz';
    content: "\e62f";
    font-size: 22px;
    color: var(--icon-bg);

}
#ionChat:hover:before{
    color: var(--menu-hover);
}
.chatbot-tooltip-arrow:after{
    background-color: var(--header-bg) !important;
}

/* Trigger Button */
#chat-trigger {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 60px;
    height: 60px;
    background-color: #d0fe90;
    color: black;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    cursor: pointer;
    z-index: 9999;
    transition: transform 0.3s;
}

    #chat-trigger:hover {
        transform: scale(1.1);
    }

/* Chat Window */
/* The window is hosted in a jQuery UI tooltip whose padding and radius would frame the
   card, so they are stripped and #chat-window becomes the card itself. The tooltip also
   carries the size, because it owns the position that the north and west resize handles
   have to move. */
.ui-tooltip:has(#chat-window) {
    padding: 0;
    border-radius: var(--border-radius-xl);
    box-shadow: var(--shadow-xl);
    width: 40vw;
    height: min(650px, calc(100dvh - 120px));
    min-width: 300px;
    max-width: none; /* jQuery UI caps every tooltip at 300px */
    min-height: 300px;
}

/* jQuery UI wraps the content in its own div, which has to pass the height through. */
.ui-tooltip:has(#chat-window) > .ui-tooltip-content {
    height: 100%;
}

.ui-tooltip:has(#chat-window).ui-resizable-resizing {
    user-select: none;
}

.ui-tooltip:has(#chat-window) > .ui-resizable-n,
.ui-tooltip:has(#chat-window) > .ui-resizable-s,
.ui-tooltip:has(#chat-window) > .ui-resizable-e,
.ui-tooltip:has(#chat-window) > .ui-resizable-w {
    /* Wider than the jQuery UI default, which is hard to catch on a rounded card. */
    width: auto;
    height: auto;
    inset: 0;
}

.ui-tooltip:has(#chat-window) > .ui-resizable-n { bottom: auto; height: 6px; }
.ui-tooltip:has(#chat-window) > .ui-resizable-s { top: auto; height: 6px; }
.ui-tooltip:has(#chat-window) > .ui-resizable-w { right: auto; width: 6px; }
.ui-tooltip:has(#chat-window) > .ui-resizable-e { left: auto; width: 6px; }

.ui-tooltip:has(#chat-window) > .ui-resizable-ne,
.ui-tooltip:has(#chat-window) > .ui-resizable-nw,
.ui-tooltip:has(#chat-window) > .ui-resizable-se,
.ui-tooltip:has(#chat-window) > .ui-resizable-sw {
    width: 16px;
    height: 16px;
}

#chat-window {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    padding-bottom: 26px; /* room for the disclaimer parked at the bottom */
    background-color: var(--bg);
    border: 1px solid var(--bg-border-light);
    border-radius: var(--border-radius-xl);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    z-index: 9999;
}
.chat-send:after, .chat-close:after, .chat-icon:after, .history-send:after{
    font-family:'ionbiz';
}
.chat-icon:after{
    content:'\e946';
    font-size:17px;
}
.chat-close:after{
    content:'\e622';
    font-size: 10px;

}
.chat-send:after{
    content:'\e947';
    font-size:16px;
}
.history-send:after{
    content:'\e621';
    font-size:16px;
}

/* Header */
.chat-header {
    flex: 0 0 auto;
    background-color: var(--bg);
    color: var(--txt-color);
    border-bottom: 1px solid var(--bg-border-light);
    padding: 14px 12px 14px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.header-info {
    min-width: 0;
}

.header-info h4 {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.01em;
}

/* The disclaimer belongs under the composer but is markup-bound to the header, so it is
   lifted out and parked in the window's bottom padding. */
.header-info p {
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 8px;
    margin: 0;
    font-size: 10px;
    line-height: 1.2;
    text-align: center;
    opacity: 0.45;
    pointer-events: none;
}

.close-chat {
    margin-left: auto;
    flex: 0 0 auto;
    cursor: pointer;
    width: 28px;
    height: 28px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--txt-color);
    opacity: 0.55;
    transition: background var(--dur-fast) var(--ease-out), opacity var(--dur-fast) var(--ease-out);
}

.close-chat:hover {
    background: var(--hover);
    opacity: 1;
}

/* Body */
.chat-body {
    flex: 1;
    min-height: 0;
    padding: 16px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    display: flex;
    flex-direction: column;
    gap: 14px;
    background-color: var(--east-bg);
    /* Height removed here so flex handles resizing automatically */
}

.chat-icon-holder {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    background: var(--bg-brand-soft);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--blue);
}

body.dark .chat-icon-holder {
    background: color-mix(in srgb, var(--blue) 22%, transparent);
}

/* Messages */
.message {
    max-width: 85%;
    align-self: flex-start;
    font-size: 14px;
    line-height: 1.5;
    position: relative;
    word-wrap: break-word;
}

/* The bubble, its copy button and its timestamp are flat siblings, so a grid is what
   turns them into a bubble with an action row underneath. */
.message:has(.msg-content) {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas:
        "bubble bubble"
        "tools  stamp";
    justify-items: start;
    align-items: center;
    row-gap: 4px;
    column-gap: 6px;
}

.message > .msg-content {
    grid-area: bubble;
    max-width: 100%;
}

/* Bubbles are squared off on the side they are anchored to and round on the open side. */
.message > .msg-content,
.message.bot {
    padding: 11px 14px;
    border: 1px solid var(--bg-border-light);
    border-radius: var(--border-radius-xs) var(--border-radius-xl) var(--border-radius-xl) var(--border-radius-xs);
    background-color: var(--bg);
    box-shadow: var(--shadow-xs);
}

/* The wrapper is the bubble once one exists, so the fallback chrome has to come back off. */
.message.bot:has(.msg-content) {
    padding: 0;
    border: none;
    background: none;
    box-shadow: none;
}

.message.user {
    align-self: flex-end;
    justify-items: end;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "bubble bubble"
        "stamp  tools";
}

.message.user > .msg-content {
    padding: 11px 14px;
    border: 1px solid var(--blue);
    border-radius: var(--border-radius-xl) var(--border-radius-xs) var(--border-radius-xs) var(--border-radius-xl);
    background-color: var(--blue);
    color: var(--ion-white);
}

.chat-copy-btn {
    grid-area: tools;
    position: static;
    width: 24px;
    height: 24px;
    padding: 0;
    background: none;
    border: none;
    border-radius: var(--border-radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--txt-color);
    font-size: 12px;
    opacity: 0; /* Hidden until the message is hovered */
    transition: opacity var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}

/* The icon is absolutely placed for its other host, which would knock it out of the button. */
.chat-copy-btn > i.hover-copy-span {
    position: static;
    line-height: 1;
}

.chat-copy-btn > i.hover-copy-span:before {
    margin-left: 0;
}

.message:hover .chat-copy-btn {
    opacity: 0.5;
}

.message .chat-copy-btn:hover,
.message .chat-copy-btn:focus-visible {
    opacity: 1;
    background: var(--hover);
    color: var(--menu-hover);
}

/* The timestamp is written with inline styles by the message template. */
.message > span {
    grid-area: stamp;
    margin-top: 0 !important;
    font-size: 10px !important;
    color: var(--txt-color) !important;
    opacity: 0.45;
}

/* Citations / Sources Styling */
.citation-box {
    display: block;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--bg-border-light);
    font-size: 11px;
    opacity: 0.7;
}

.citation-badge {
    display: inline-flex;
    align-items: center;
    background: var(--bg-brand-soft);
    color: var(--blue);
    padding: 3px 8px;
    border-radius: var(--r-pill);
    margin-right: 5px;
    font-weight: 600;
}

.chat-actions{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 16px 0;
    background-color: var(--bg);
}
.chat-actions:empty{
    padding: 0;
}
.chat-actions button, .chat-actions a{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 34px;
    padding: 0 14px;
    margin-right: 0;
    background: var(--bg);
    border-radius: var(--r-pill);
    border: 1px solid var(--bg-border-light);
    color:var(--txt-color);
    cursor:pointer;
    font-size: 13px;
    line-height:1;
    white-space: nowrap;
    transition: background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.chat-actions button:hover, .chat-actions a:hover{
    background: var(--hover);
    border-color: var(--bg-border);
}
.chat-actions button:disabled{
    opacity: 0.5;
    cursor: default;
}
.chat-actions button:before, .chat-actions a:before{
    margin-right: 0;
    font-size: 14px;
    color: var(--menu-hover);
}

/* Split translate button: main part translates to the user's language, caret opens the language picker. */
.chat-actions .translateSplit {
    position: relative;
    display: inline-flex;
    align-items: stretch;
    margin-right: 0;
    vertical-align: middle;
}
.chat-actions .translateSplit > button {
    margin-right: 0;
}
.chat-actions .translateSplit .translateSplitMain {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding-right: 10px;
}
.chat-actions .translateSplit .translateSplitCaret {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: none;
    padding: 0 12px 0 6px;
    font-size: 10px;
}
.chat-actions .translateSplit .translateSplitCaret:hover {
    background: var(--hover);
}
.chat-actions .translateLangMenu {
    display: none;
    position: absolute;
    bottom: calc(100% + 6px);
    left: 0;
    min-width: 180px;
    background: var(--bg);
    border: 1px solid var(--bg-border-light);
    border-radius: var(--border-radius-md);
    box-shadow: var(--shadow-lg);
    padding: 4px;
    z-index: 1000;
}
.chat-actions .translateLangMenu.open {
    display: block;
}
.chat-actions .translateLangMenu .translateLangItem {
    display: block;
    width: 100%;
    height: auto;
    text-align: left;
    margin: 0;
    border: 1px solid transparent;
    background: transparent;
    border-radius: var(--border-radius-sm);
    padding: 6px 8px;
    line-height: 20px;
}
.chat-actions .translateLangMenu .translateLangItem:hover {
    background: var(--hover);
    border-color: transparent;
}
.chat-actions .translateLangMenu .translateLangDefault {
    font-style: normal;
    opacity: 0.55;
}

/* Footer */
/* The footer itself is the input pill, so the send button reads as sitting inside the field. */
.chat-footer {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 12px 16px 8px;
    padding: 5px 5px 5px 6px;
    background-color: var(--bg);
    border: 1px solid var(--bg-border-light);
    border-radius: var(--r-pill);
    transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}

.chat-footer:focus-within {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--blue) 18%, transparent);
}

/* The global input:focus rule paints an inset outline with !important, which would draw a
   second box inside the composer pill. */
#chat-input, #chat-input:focus {
    flex: 1;
    min-width: 0;
    height: 36px;
    padding: 0 10px;
    text-indent: 0;
    border-radius: 0;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent;
    color: var(--txt-color);
    font-size: 14px;
}

#chat-input::placeholder {
    color: var(--txt-color);
    opacity: 0.45;
}

#send-btn, #history-btn {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    margin-left: 0;
    border: none;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
    transition: background var(--dur-fast) var(--ease-out);
}

#send-btn {
    background: var(--blue);
    color: var(--ion-white);
}

#send-btn:hover {
    background: color-mix(in srgb, var(--blue) 80%, var(--ion-biscay));
}

#history-btn {
    background: none;
    color: var(--txt-color);
    opacity: 0.55;
}

#history-btn:hover {
    background: var(--hover);
    opacity: 1;
}

/* Loading */
.typing-indicator {
    display: none;
    padding: 6px 16px 0;
    margin-bottom: 0;
    background-color: var(--bg);
    font-size: 12px;
    font-style: normal;
    color: var(--txt-color);
    opacity: 0.55;
}

/* --- FIX FOR LISTS & FORMATTING --- */
.message ul, .message ol {
    margin: 5px 0 8px 20px;
    padding: 0;
}

.message li {
    margin-bottom: 4px;
}

.message p {
    margin: 0 0 8px 0;
}

/* Tag-keyed rather than `> :last-child`: a bare pseudo-class subject is tested against every
   element in the document. Only block tags carry a margin-bottom worth resetting. */
.msg-content > p:last-child, .msg-content > div:last-child,
.msg-content > ul:last-child, .msg-content > ol:last-child,
.msg-content > pre:last-child, .msg-content > blockquote:last-child,
.msg-content > table:last-child, .msg-content > hr:last-child,
.msg-content > h1:last-child, .msg-content > h2:last-child,
.msg-content > h3:last-child, .msg-content > h4:last-child,
.msg-content > h5:last-child, .msg-content > h6:last-child {
    margin-bottom: 0;
}

.message strong {
    font-weight: 700;
}

.message a {
    color: var(--menu-hover);
}

.message.user a {
    color: var(--ion-white);
    text-decoration: underline;
}

.message code {
    padding: 2px 5px;
    border-radius: var(--border-radius-xxs);
    background: var(--hover);
    font-family: monospace;
    font-size: 90%;
}

.message pre {
    background: var(--east-bg);
    border: 1px solid var(--bg-border-light);
    color: var(--txt-color);
    padding: 10px 12px;
    border-radius: var(--border-radius-md);
    overflow-x: auto;
    font-size: 12px;
}

.message.user code, .message.user pre {
    background: color-mix(in srgb, var(--ion-white) 18%, transparent);
    border-color: transparent;
    color: var(--ion-white);
}
a.emoji{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 3px;
    box-sizing: border-box;
    border: 1px solid transparent;
    border-radius: var(--border-radius-sm);
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.1s ease;
}
a.emoji img{
    width: 20px;
    height: 20px;
}
a.emoji .emoji-char{
    font-size: 20px;
    line-height: 1;
}
a.emoji:hover{
    border-radius:var(--border-radius-sm);
    border-color: var(--bg-border) !important;
    background: var(--hover);
    transform: scale(1.12);
}
/* First search match: signals what Enter will insert. */
a.emoji.ion-emoji-active{
    border-color: var(--menu-hover) !important;
    background: var(--hover);
}
/* Custom categorised emoji picker (body-appended popup) */
.ion-emoji-picker{
    position: fixed;
    z-index: 65540;
    width: 300px;
    max-height: 340px;
    overflow-y: auto;
    padding: 0 8px 8px;
    box-sizing: border-box;
    background: var(--bg);
    border: 1px solid var(--bg-border);
    border-radius: var(--border-radius-md);
    box-shadow: rgb(0 7 22 / 15%) 0px 4px 12px 0px;
}
/* Full-width sticky search bar; the 8px bottom margin gives the gap below it. */
.ion-emoji-search{
    position: sticky;
    top: 0;
    z-index: 1;
    height: 20px;
    margin: 0 -8px 8px;
    padding: 8px;
    background: var(--bg);
}
.ion-emoji-search-input{
    width: 100%;
    box-sizing: border-box;
    padding: 5px 8px;
    font: var(--font);
    color: var(--txt-color);
    background: var(--bg);
    border: 1px solid var(--bg-border);
    border-radius: var(--border-radius-sm);
    outline: none;
}
.ion-emoji-search-input:focus{
    border-color: var(--blue);
}
.ion-emoji-cat{
    margin: 6px 2px 2px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--txt-color);
    opacity: 0.6;
}
.ion-emoji-cat:first-child{
    margin-top: 0;
}
.ion-emoji-grid{
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
}
/* Quick-insert chips (@ mention, // date) */
.ion-tag{
    display: inline-block;
    line-height: 16px;
    margin: 2px 3px;
    padding: 1px 6px;
    font-size: 11px;
    text-shadow: none;
    border-radius: var(--border-radius-xl) !important;
    border-top-left-radius: var(--border-radius-xs) !important;
    border-bottom-left-radius: var(--border-radius-xs) !important;
    color: color-mix(in srgb, var(--blue), var(--txt-color) 25%) !important;
    border: 1px solid color-mix(in srgb, var(--blue, transparent), var(--bg) 60%) !important;
    background-color: color-mix(in srgb, var(--blue), var(--bg) 92%) !important;
}
.ion-ref{
    display: inline-block;
    line-height: 16px;
    margin: 2px 3px;
    padding: 1px 6px;
    font-size: 11px;
    text-shadow: none;
    text-decoration: none !important;
    border-radius: var(--border-radius-xl) !important;
    border-top-left-radius: var(--border-radius-xs) !important;
    border-bottom-left-radius: var(--border-radius-xs) !important;
    color: color-mix(in srgb, var(--blue), var(--txt-color) 25%) !important;
    border: 1px solid color-mix(in srgb, var(--blue, transparent), var(--bg) 60%) !important;
    background-color: var(--bg) !important;
}
.rteInlineActions{
    display: flex;
    justify-content: flex-start;
    gap: 6px;
    margin-top: 8px;
}
.rteInlineActions > a{
    min-width: 40px;
}
.ion-date{
    display: inline-block;
    padding: 1px 8px 1px 4px;
    border: 1px solid var(--bg-border) !important;
    border-radius: 6px var(--border-radius-xl) var(--border-radius-xl) 6px !important;
    background: var(--east-bg) !important;
    line-height: 1.4;
    font-size: 12px;
    color: var(--txt-color) !important;
}
.ion-mention-list{
    position: absolute;
    z-index: 65540;
    min-width: 180px;
    max-width: 280px;
    max-height: 320px;
    overflow-y: auto;
    padding: 4px;
    box-sizing: border-box;
    background: var(--bg);
    border: 1px solid var(--bg-border);
    border-radius: var(--border-radius-md);
    box-shadow: rgb(0 7 22 / 15%) 0px 4px 12px 0px;
}
.ion-mention-item{
    display: block;
    box-sizing: border-box;
    padding: 1px 10px 0px 10px;
    margin-bottom: 5px;
    min-height: 30px;
    line-height: 28px;
    border-radius: var(--border-radius-md);
    color: var(--txt-color);
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 2px 0%;
    transition: background 0.1s;
}
.ion-mention-item:last-child{
    margin-bottom: 0;
}
.ion-mention-ico{
    display: inline-block;
    margin-right: 6px;
}
.ion-mention-list-rich{
    max-width: 360px;
    max-height: 420px;
}
.ion-mention-item-rich{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 10px;
    min-height: 0;
    line-height: 1.3;
    white-space: normal;
}
.ion-mention-item-rich .ion-mention-ico{
    flex: 0 0 auto;
    margin-right: 0;
    font-size: 16px;
    line-height: 1;
}
.ion-mention-text{
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
}
.ion-mention-label{
    font-size: 13px;
    font-weight: 500;
    color: var(--txt-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ion-mention-desc{
    font-size: 11px;
    font-weight: 400;
    color: var(--txt-color);
    opacity: 0.6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ion-mention-kbd{
    flex: 0 0 auto;
    margin-left: 8px;
    padding: 1px 6px;
    min-width: 16px;
    line-height: 18px;
    text-align: center;
    font-size: 11px;
    font-weight: 600;
    color: var(--txt-color);
    opacity: 0.7;
    background: var(--hover);
    border: 1px solid var(--bg-border);
    border-radius: var(--border-radius-sm);
}
.ion-mention-item:hover,
.ion-mention-item.active{
    background-color: var(--hover);
    background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 2px 50%;
    border-radius: var(--border-radius-xs);
}
.ion-mention-hint{
    padding: 6px 8px;
    font-size: 11px;
    font-style: italic;
    color: var(--txt-color);
    opacity: 0.6;
    white-space: nowrap;
}
.ion-mention-list.ion-recents{
    display: flex;
    width: 440px;
    max-width: 92vw;
    max-height: 300px;
    padding: 0;
    overflow: hidden;
}
.ion-recents-nav{
    flex: 0 0 132px;
    box-sizing: border-box;
    overflow-y: auto;
    padding: 4px;
    border-right: 1px solid var(--bg-border);
    background: var(--east-bg);
}
.ion-recents-nav-title{
    margin-top: 8px;
    padding: 6px 8px 4px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--txt-color) 60%, transparent);
}
.ion-recents-nav-title:first-child{
    margin-top: 0;
}
.ion-recents-tab{
    display: block;
    box-sizing: border-box;
    padding: 5px 8px 5px 14px;
    margin-bottom: 3px;
    border-radius: var(--border-radius-xs);
    color: var(--txt-color);
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    text-transform: capitalize;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ion-recents-tab:hover{
    background-color: var(--hover);
}
.ion-recents-tab.active{
    background-color: color-mix(in srgb, var(--green) 50%, transparent);
    font-weight: 700;
}
.ion-recents-body{
    position: relative;
    flex: 1 1 auto;
    box-sizing: border-box;
    overflow-y: auto;
    padding: 4px;
}
.ion-recents-group-head{
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 5px 8px 3px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--txt-color) 55%, transparent);
    background: var(--bg);
}
/* Cover the body's top padding so items don't bleed above the sticky header. */
.ion-recents-group-head::before{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -4px;
    height: 4px;
    background: var(--bg);
}
.ion-date-popup{
    position: absolute;
    z-index: 65540;
}
.ui-layout-content:focus-visible,
.ui-layout-pane:focus-visible {
    outline: none;
}

/* Circular chevron affordance that fades in when hovering the east toggler/resizer */
.ui-layout-resizer-east {
    overflow: visible !important; /* the toggler/circle lives inside the resizer; let it spill out */
    z-index: 100 !important;
}
.ui-layout-toggler-east {
    overflow: visible !important; /* let the circle escape the 5px-wide strip */
    background-color: transparent !important;
    opacity: 1 !important; /* plugin dims the toggler to 60% on resizer-hover */
    z-index: 101 !important; /* sit above the adjacent panes */
}
.ui-layout-toggler-east::after {
    content: "\2039"; /* single left-pointing angle quote */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    font-size: 16px;
    font-weight: bold;
    line-height: 1;
    color: var(--txt-color);
    background: var(--bg);
    border: 1px solid var(--bg-border);
    border-radius: 50%;
    box-shadow: 0 2px 6px var(--shaddow);
    opacity: 0; /* revealed on hover of the toggler/resizer */
    transition: opacity 0.15s ease, background 0.15s ease;
    pointer-events: none; /* only clickable once revealed (see hover rule) */
    cursor: pointer;
}
.ui-layout-toggler-east:hover::after,
.ui-layout-toggler-east-hover::after,
.ui-layout-resizer-hover .ui-layout-toggler-east::after {
    opacity: 1;
    pointer-events: auto; /* the whole circle is the clickable toggle target */
}
.ui-layout-toggler-east:hover::after {
    background: var(--hover);
}
.ui-layout-toggler-east-open::after { content: "\203A"; } /* › : click collapses the pane */
.ui-layout-toggler-east-closed::after { content: "\2039"; } /* ‹ : click opens the pane */

/* Rounded outer corners for tables in the rich-text editor and saved notes; border-radius needs separate borders. */
.mce-content-body .mce-item-table,
.note .body table,
.note .comment .commentBody table {
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #e0e0e0;
    border: 1px solid var(--bg-border);
    border-radius: 6px;
    overflow: hidden;
}

/* Remove left padding on editor headings (e.g. pasted markdown H2s). */
.mce-content-body h2,
.ionbiztinymce h2, .note h2 {
    padding-left: 0 !important;
}

/* This is the default Tooltipster theme (feel free to modify or duplicate and create multiple themes!): */
.tooltipster-default {
	border-radius: 5px; 
	border: 2px solid #000;
	background: #4c4c4c;
	color: #fff;
}

/* Use this next selector to style things like font-size and line-height: */
.tooltipster-default .tooltipster-content {
	font-family: Arial, sans-serif;
	font-size: 14px;
	line-height: 16px;
	padding: 8px 10px;
	overflow: hidden;
}

/* This next selector defines the color of the border on the outside of the arrow. This will automatically match the color and size of the border set on the main tooltip styles. Set display: none; if you would like a border around the tooltip but no border around the arrow */
.tooltipster-default .tooltipster-arrow .tooltipster-arrow-border {
	/* border-color: ... !important; */
}


/* If you're using the icon option, use this next selector to style them */
.tooltipster-icon {
	cursor: help;
	margin-left: 4px;
}

.tooltipster-ionBIZ .jqGridHolder {
	border-color: var(--bg-border-light) !important;
	border-radius: var(--border-radius-xl) !important;
}








/* This is the base styling required to make all Tooltipsters work */
.tooltipster-base {
	padding: 0;
	font-size: 0;
	line-height: 0;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 9999999;
	pointer-events: none;
	width: auto;
	overflow: visible;
}
.tooltipster-base .tooltipster-content {
	overflow: hidden;
}


/* These next classes handle the styles for the little arrow attached to the tooltip. By default, the arrow will inherit the same colors and border as what is set on the main tooltip itself. */
.tooltipster-arrow {
	display: block;
	text-align: center;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
}
.tooltipster-arrow span, .tooltipster-arrow-border {
	display: block;
	width: 0; 
	height: 0;
	position: absolute;
}
.tooltipster-arrow-top span, .tooltipster-arrow-top-right span, .tooltipster-arrow-top-left span {
	border-left: 8px solid transparent !important;
	border-right: 8px solid transparent !important;
	border-top: 8px solid;
	bottom: -7px;
}
.tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-top-left .tooltipster-arrow-border {
	border-left: 9px solid transparent !important;
	border-right: 9px solid transparent !important;
	border-top: 9px solid;
	bottom: -7px;
}

.tooltipster-arrow-bottom span, .tooltipster-arrow-bottom-right span, .tooltipster-arrow-bottom-left span {
	border-left: 8px solid transparent !important;
	border-right: 8px solid transparent !important;
	border-bottom: 8px solid;
	top: -7px;
}
.tooltipster-arrow-bottom .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border {
	border-left: 9px solid transparent !important;
	border-right: 9px solid transparent !important;
	border-bottom: 9px solid;
	top: -7px;
}
.tooltipster-arrow-top span, .tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-bottom span, .tooltipster-arrow-bottom .tooltipster-arrow-border {
	left: 0;
	right: 0;
	margin: 0 auto;
}
.tooltipster-arrow-top-left span, .tooltipster-arrow-bottom-left span {
	left: 6px;
}
.tooltipster-arrow-top-left .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border {
	left: 5px;
}
.tooltipster-arrow-top-right span,  .tooltipster-arrow-bottom-right span {
	right: 6px;
}
.tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border {
	right: 5px;
}
.tooltipster-arrow-left span, .tooltipster-arrow-left .tooltipster-arrow-border {
	border-top: 8px solid transparent !important;
	border-bottom: 8px solid transparent !important; 
	border-left: 8px solid;
	top: 50%;
	margin-top: -7px;
	right: -7px;
}
.tooltipster-arrow-left .tooltipster-arrow-border {
	border-top: 9px solid transparent !important;
	border-bottom: 9px solid transparent !important; 
	border-left: 9px solid;
	margin-top: -8px;
}
.tooltipster-arrow-right span, .tooltipster-arrow-right .tooltipster-arrow-border {
	border-top: 8px solid transparent !important;
	border-bottom: 8px solid transparent !important; 
	border-right: 8px solid;
	top: 50%;
	margin-top: -7px;
	left: -7px;
}
.tooltipster-arrow-right .tooltipster-arrow-border {
	border-top: 9px solid transparent !important;
	border-bottom: 9px solid transparent !important; 
	border-right: 9px solid;
	margin-top: -8px;
}


/* Some CSS magic for the awesome animations - feel free to make your own custom animations and reference it in your Tooltipster settings! */

.tooltipster-fade {
	opacity: 0;
	-webkit-transition-property: opacity;
	-moz-transition-property: opacity;
	-o-transition-property: opacity;
	-ms-transition-property: opacity;
	transition-property: opacity;
}
.tooltipster-fade-show {
	opacity: 1;
}

.tooltipster-grow {
	-webkit-transform: scale(0,0);
	-moz-transform: scale(0,0);
	-o-transform: scale(0,0);
	-ms-transform: scale(0,0);
	transform: scale(0,0);
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	-ms-transition-property: -ms-transform;
	transition-property: transform;
	-webkit-backface-visibility: hidden;
}
.tooltipster-grow-show {
	-webkit-transform: scale(1,1);
	-moz-transform: scale(1,1);
	-o-transform: scale(1,1);
	-ms-transform: scale(1,1);
	transform: scale(1,1);
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
	-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
	-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
	-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
}

.tooltipster-swing {
	opacity: 0;
	-webkit-transform: rotateZ(4deg);
	-moz-transform: rotateZ(4deg);
	-o-transform: rotateZ(4deg);
	-ms-transform: rotateZ(4deg);
	transform: rotateZ(4deg);
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	-ms-transition-property: -ms-transform;
	transition-property: transform;
}
.tooltipster-swing-show {
	opacity: 1;
	-webkit-transform: rotateZ(0deg);
	-moz-transform: rotateZ(0deg);
	-o-transform: rotateZ(0deg);
	-ms-transform: rotateZ(0deg);
	transform: rotateZ(0deg);
	-webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 1);
	-webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); 
	-moz-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); 
	-ms-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); 
	-o-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); 
	transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
}

.tooltipster-fall {
	top: 0;
	-webkit-transition-property: top;
	-moz-transition-property: top;
	-o-transition-property: top;
	-ms-transition-property: top;
	transition-property: top;
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
	-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
	-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
	-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
}
.tooltipster-fall-show {
}
.tooltipster-fall.tooltipster-dying {
	-webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	-ms-transition-property: all;
	transition-property: all;
	top: 0px !important;
	opacity: 0;
}

.tooltipster-slide {
	left: -40px;
	-webkit-transition-property: left;
	-moz-transition-property: left;
	-o-transition-property: left;
	-ms-transition-property: left;
	transition-property: left;
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
	-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
	-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
	-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
	-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); 
	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
}
.tooltipster-slide.tooltipster-slide-show {
}
.tooltipster-slide.tooltipster-dying {
	-webkit-transition-property: all;
	-moz-transition-property: all;
	-o-transition-property: all;
	-ms-transition-property: all;
	transition-property: all;
	left: 0px !important;
	opacity: 0;
}


/* CSS transition for when contenting is changing in a tooltip that is still open. The only properties that will NOT transition are: width, height, top, and left */
.tooltipster-content-changing {
	opacity: 0.5;
	-webkit-transform: scale(1.1, 1.1);
	-moz-transform: scale(1.1, 1.1);
	-o-transform: scale(1.1, 1.1);
	-ms-transform: scale(1.1, 1.1);
	transform: scale(1.1, 1.1);
}

.tooltipster-ionBIZ {
    border-radius: 24px;
    max-width: 900px;
    padding: 15px 20px !important;
    font-size: 12px;
    font-weight: normal;
    background: var(--bg) !important;
    box-shadow: 0 0 10px var(--shaddow);
    color: var(--txt-color);
    pointer-events: inherit;
    margin-left:-5px;
    border: 1px solid var(--bg-border);
}
/* The fade-out keeps the tooltip in the DOM for `speed` ms; the `pointer-events: inherit` above
   would otherwise let it go on swallowing hover from whatever is underneath until it is removed. */
.tooltipster-ionBIZ.tooltipster-dying {
    pointer-events: none;
}
.tooltipster-ionBIZ:has(.detailRow, .jqGridHolder){
        padding: 5px 0px !important;
}
.tooltipster-ionBIZ:has(#gbox_gridPlanningDetailResourceTooltip,#gbox_gridPlanningDetailProjectTooltip){
        padding: 0px 0px !important;
}
.ui-dialog.tooltipster-ionBIZ{
    border-radius:8px;
}
body.dark .tooltipster-ionBIZ{
    background: #525252;
}
    .tooltipster-ionBIZ .tooltipster-content {
        background: inherit !important;
        line-height: 14px;
        font-size: inherit;
        color: inherit;
        max-height: 500px;
        min-height:15px;
        overflow-y: auto;
    }
/* Only the padding-less variants let the scrolling content reach the wrapper edge, where its
   square corners would otherwise paint over the rounded ones. */
.tooltipster-ionBIZ:has(.detailRow, .jqGridHolder) .tooltipster-content,
.tooltipster-ionBIZ:has(#gbox_gridPlanningDetailResourceTooltip, #gbox_gridPlanningDetailProjectTooltip) .tooltipster-content {
    border-radius: inherit;
}
.tooltipster-content .halfSizeLeft, .tooltipster-content .halfSizeRight {
    background: var(--bg);
    border: 1px dashed var(--bg-border-light) !important;
    border-radius: calc(var(--border-radius-xl) + 2px);
    padding: 5px;
    margin-left:5px !important;
    margin-right: 5px !important;
    min-width:calc(50% - 40px);
}

.tooltipster-ionBIZ-green {
    font-size: 12px;
    color: black;
    width: auto;
    min-width: 200px;
    font-weight: 500;
    background: var(--green) !important;
}
.tooltipster-ionBIZ-red {
    font-size: 12px;
    width: auto;
    min-width: 200px;
    font-weight: 500;
    background: #ff6367 !important;
}

.tooltipster-ionBIZ-green .tooltipster-content, .tooltipster-ionBIZ-red .tooltipster-content { padding: 2px 0px 2px 15px; }
.tooltipster-ionBIZ-green .tooltipster-content span:before, .tooltipster-ionBIZ-red .tooltipster-content span:before { position: absolute; left: 15px; }

/* `span, a` rather than `*`: red tooltips hold a single span.icon-warning_3 wrapping an <a>,
   and a universal subject would be tested against every element in the document. */
.tooltipster-ionBIZ-red .tooltipster-content span, .tooltipster-ionBIZ-red .tooltipster-content a, .tooltipster-ionBIZ-red .icon-warning_3:before { color: #fdfdfd; display:flex;align-items:center }
.tooltipster-ionBIZ-red .tooltipster-content a:hover { color: white; }

.bubbleHead { float: left;width: 100%;clear: both;padding: 0px 0px 20px 0px;border-bottom: solid 1px #6E665B;margin-bottom: 20px;font-size:14px;}
.bubbleHead .bubbleImg { float: left;width: 50px;height: 50px;border: solid 2px #fff;border-radius: 3px;
             background-size: cover;background-position: center center;background-repeat: no-repeat;}
.bubbleHead h3 { margin: 18px 0px 0px 0px;text-indent: 20px;}
.bubbleHead div.bubbleTitle + h3 { margin: 0px 0px 0px 0px;text-indent: 20px;}
.bubbleHead div.bubbleTitle { text-indent: 20px; color:#33909f; margin-top: 10px;}
.bubbleContent { float: left;clear: both;width: 100%;}

.bubbleContent .detailRow {
    float: left;
    clear: both;
    width: 100%;
    min-width: 350px;
    height: 26px;
    line-height: 26px;
    padding: 0px;
}

.bubbleContent .detailRow .detailLabel {
    color: #999999;
    font-weight: bold;
    font-size: 12px;
    height: 26px;
    line-height: 26px;
    padding: 0px;
    font-weight: bold;
}

.bubbleContent .detailRow .detailInput {
    font-weight: bold;
    font-size: 12px;
    font-style: normal;
    height: 26px;
    line-height: 26px;
    font-weight: bold;
}

.tt-close {
    position: absolute;
    top: 15px;
    right: 5px;
    color: var(--txt-color);
    cursor: pointer;
    font-weight: lighter;
    width: 20px;
    height: 15px;
    border: 0px;
    cursor: pointer;
    display: inline-block;
    font-size:0px; /*don't show the x text*/
    overflow: hidden;
}
.tt-close:before{
      font-family: 'ionbiz' !important;
      content: "\e622";
      font-size: 9px;
      text-indent: 0px !important;
      color: var(--txt-color);
      opacity: 0.7;
}
.tt-close:hover { color: var(--red);}
.tt-close:hover:before { color: var(--red);}
.tooltipster-ionBIZ .ui-dialog-titlebar { display: none;}
.tooltipster-ionBIZ.ui-dialog .ui-dialog-content { padding: 0px !important;}
.tooltipster-ionBIZ .detailRow { padding: 0px!important;}
/*
 * Default Layout Theme
 *
 * Created for jquery.layout 
 *
 * Copyright (c) 2010 
 *   Fabrizio Balliano (http://www.fabrizioballiano.net)
 *   Kevin Dalman (http://allpro.net)
 *
 * Dual licensed under the GPL (http://www.gnu.org/licenses/gpl.html)
 * and MIT (http://www.opensource.org/licenses/mit-license.php) licenses.
 *
 * Last Updated: 2010-02-10
 * NOTE: For best code readability, view this with a fixed-space font and tabs equal to 4-chars
 */

/*
 *	DEFAULT FONT
 *	Just to make demo-pages look better - not actually relevant to Layout!
 */
/*body {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size:   100%;
	font-size:  80%;
}*/

/*
 *	PANES & CONTENT-DIVs
 */
.ui-layout-pane { /* all 'panes' */
	/*background:	#FFF; */
	padding:	0px;  
	overflow:	auto;
	/* DO NOT add scrolling (or padding) to 'panes' that have a content-div,
	   otherwise you may get double-scrollbars - on the pane AND on the content-div
	   - use ui-layout-wrapper class if pane has a content-div
	   - use ui-layout-container if pane has an inner-layout
	*/
	}
	/* (scrolling) content-div inside pane allows for fixed header(s) and/or footer(s) */
	.ui-layout-content {
		padding:	0px 1px 1px 1px;
		position:	relative; /* contain floated or positioned elements */
		overflow:	auto; /* add scrolling to content-div */
	}
    
/*
 *	UTILITY CLASSES
 *	Must come AFTER pane-class above so will override
 *	These classes are NOT auto-generated and are NOT used by Layout
 */
.layout-child-container,
.layout-content-container {
	padding:	0;
	overflow:	hidden;
}
.layout-child-container {
	border:		0; /* remove border because inner-layout-panes probably have borders */
}
.layout-scroll {
	overflow:	auto;
}
.layout-hide {
	display:	none;
}

/*
 *	RESIZER-BARS
 */
.ui-layout-resizer	{ /* all 'resizer-bars' */
	background:		#f9fbfa;
	/*border:			1px solid #BBB;*/
	border-width:	0;
	}
	.ui-layout-resizer-drag {		/* REAL resizer while resize in progress */
	}
	.ui-layout-resizer-hover	{	/* affects both open and closed states */
	}
	/* NOTE: It looks best when 'hover' and 'dragging' are set to the same color,
		otherwise color shifts while dragging when bar can't keep up with mouse */
	.ui-layout-resizer-open-hover {	/* hover-color to 'resize' */
	    /*background-color: #FAFAFA;*/
	}
	.ui-layout-resizer-dragging {	/* resizer beging 'dragging' */
		background: transparent;
	    opacity: .80;
		filter:  alpha(opacity=80);
}
	.ui-layout-resizer-dragging {	/* CLONED resizer being dragged */
		border-right: 	 1px solid #BBB;
	}
	.ui-layout-resizer-north-dragging,
	.ui-layout-resizer-south-dragging {
		border-width:	1px 0;
	}
	.ui-layout-resizer-west-dragging,
	.ui-layout-resizer-east-dragging {
		border-width:	0 1px;
	}
	/* NOTE: Add a 'dragging-limit' color to provide visual feedback when resizer hits min/max size limits */
	.ui-layout-resizer-dragging-limit {	/* CLONED resizer at min or max size-limit */
		background: #E1A4A4; /* red */
	}

	.ui-layout-resizer-closed-hover	{ /* hover-color to 'slide open' */
		background: #EBD5AA;
	}
	.ui-layout-resizer-sliding {	/* resizer when pane is 'slid open' */
		opacity: .10; /* show only a slight shadow */
		filter:  alpha(opacity=10);
		}
		.ui-layout-resizer-sliding-hover {	/* sliding resizer - hover */
			opacity: 1.00; /* on-hover, show the resizer-bar normally */
			filter:  alpha(opacity=100);
		}
		/* sliding resizer - add 'outside-border' to resizer on-hover 
		 * this sample illustrates how to target specific panes and states */
		.ui-layout-resizer-north-sliding-hover	{ border-bottom-width:	1px; }
		.ui-layout-resizer-south-sliding-hover	{ border-top-width:		1px; }
		.ui-layout-resizer-west-sliding-hover	{ border-right-width:	1px; }
		.ui-layout-resizer-east-sliding-hover	{ border-left-width:	1px; }

/*
 *	TOGGLER-BUTTONS
 */
.ui-layout-toggler {
	/*
	border: 1px solid #BBB; 
	background-color: #BBB;*/
	}
	.ui-layout-resizer-hover .ui-layout-toggler {
		opacity: .60;
		filter:  alpha(opacity=60);
	}
	.ui-layout-toggler-hover , /* need when NOT resizable */
	.ui-layout-resizer-hover .ui-layout-toggler-hover { /* need specificity when IS resizable */
		background-color: var(--green);
		opacity: 1.00;
		filter:  alpha(opacity=100);
	}
	.ui-layout-toggler-north ,
	.ui-layout-toggler-south {
		border-width: 0 1px; /* left/right borders */
	}
	.ui-layout-toggler-west ,
	.ui-layout-toggler-east {
		border-width: 1px 0; /* top/bottom borders */
	}
	/* hide the toggler-button when the pane is 'slid open' */
	.ui-layout-resizer-sliding  .ui-layout-toggler {
		display: none;
	}
	/*
	 *	style the text we put INSIDE the togglers
	 */
	.ui-layout-toggler .content {
		color:			#666;
		font-size:		12px;
		font-weight:	bold;
		width:			100%;
		padding-bottom:	0.35ex; /* to 'vertically center' text inside text-span */
	}

/*
 *	PANE-MASKS
 *	these styles are hard-coded on mask elems, but are also 
 *	included here as !important to ensure will overrides any generic styles
 */
.ui-layout-mask {
	border:		none !important;
	padding:	0 !important;
	margin:		0 !important;
	overflow:	hidden !important;
	position:	absolute !important;
	opacity:	0 !important;
	filter:		Alpha(Opacity="0") !important;
}
.ui-layout-mask-inside-pane { /* masks always inside pane EXCEPT when pane is an iframe */
	top:		0 !important;
	left:		0 !important;
	width:		100% !important;
	height:		100% !important;
}
div.ui-layout-mask {}		/* standard mask for iframes */
iframe.ui-layout-mask {}	/* extra mask for objects/applets */

/*
 *	Default printing styles
 */
@media print {
	/*
	 *	Unless you want to print the layout as it appears onscreen,
	 *	these html/body styles are needed to allow the content to 'flow'
	 */
	html {
		height:		auto !important;
		overflow:	visible !important;
	}
	body.ui-layout-container {
		position:	static !important;
		top:		auto !important;
		bottom:		auto !important;
		left:		auto !important;
		right:		auto !important;
		/* only IE6 has container width & height set by Layout */
		_width:		auto !important;
		_height:	auto !important;
	}
	.ui-layout-resizer, .ui-layout-toggler {
		display:	none !important;
	}
	/*
	 *	Default pane print styles disables positioning, borders and backgrounds.
	 *	You can modify these styles however it suit your needs.
	 */
	.ui-layout-pane {
		border:		none !important;
		background:	 transparent !important;
		position:	relative !important;
		top:		auto !important;
		bottom:		auto !important;
		left:		auto !important;
		right:		auto !important;
		width:		auto !important;
		height:		auto !important;
		overflow:	visible !important;
	}
}
/* use ? before the # in order to force the bundle comfig to append the version of the referenced files; otherwise verion is not added */
@font-face {
    font-family: 'ionbiz';
    src:  url('../Content/Themes/Blue/fonts/ionbiz.eot?v=RkdjhTfu2TGcFDWStZZuI4YlwAY&#iefix');
    src:  url('../Content/Themes/Blue/fonts/ionbiz.ttf?v=RkdjhTfu2TGcFDWStZZuI4YlwAY&#iefix') format('truetype'),
          url('../Content/Themes/Blue/fonts/ionbiz.woff?v=RkdjhTfu2TGcFDWStZZuI4YlwAY&#iefix') format('woff'),
          url('../Content/Themes/Blue/fonts/ionbiz.svg?v=RkdjhTfu2TGcFDWStZZuI4YlwAY&#ionbiz') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

.path1:before, .path2:before, .path3:before, [class^="icon-"]:before, [class*=" icon-"]:before {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'ionbiz' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.icon-add:before { /*e600*/
    content: "\e945";
}

.icon-camera:before {
    font-family: 'ionbiz' !important;
    content: "\e68e";
    font-style: normal;
    font-size: 18px !important;
    margin-left: 10px !important;
    vertical-align: -2px;
}

.icon-check_mark:before {
    content: "\e601";
}
.icon-edit:before {
    content: "\e602";
}
.icon-excel:before {
    content: "\e604";
}
.icon-paste:before {
    content: "\e603";
}

.icon-refresh:before {
    content: "\e901";
}

.icon-trash:before {
    content: "\e606";
}

.icon-arrow:before {
    content: "\e607";
}

.icon-calendar:before {
    content: "\e608";
}

.icon-download:before {
    content: "\e609";
}

.icon-upload:before {
    content: "\e60a";
}

.icon-cost:before {
    content: "\e60b";
}

.icon-view:before {
    content: "\e60c";
}

.icon-no-view:before {
    content: "\e60d";
}

.icon-fav:before {
    content: "\e60e";
}

.icon-wait:before {
    content: "\e60f";
}

.icon-home:before {
    content: "\e610";
}

.icon-invoice:before {
    content: "\e611";
}

.icon-leave:before {
    content: "\e612";
}

.icon-pdf:before {
    content: "\e613";
}

.icon-planning:before {
    content: "\e936";
}
.icon-planning_old:before {
    content: "\e614";
}
.icon-project:before {
    content: "\e934";
}
.icon-project_old:before {
    content: "\e615";
}

.icon-project_fill:before {
    content: "\e934";
}

.icon-quote:before {
    content: "\e616";
}

.icon-recurrence:before {
    content: "\e617";
}

.icon-relation:before {
    content: "\e618";
}

.icon-sun:before {
    content: "\e619";
}

.icon-issue:before {
    content: "\e61a";
}
.icon-issue_fill:before {
    content: "\e937";
}
.icon-time_1:before {
    content: "\e61b";
}

.icon-time_2:before {
    content: "\e61c";
}

.icon-time_3:before {
    content: "\e61d";
}

.icon-time_4:before {
    content: "\e61e";
}

.icon-timeregistration:before {
    content: "\e938";
}
.icon-timeregistration_old:before {
    content: "\e61f";
}
.icon-timeregistration_fill:before {
    content: "\e938";
}
.icon-user:before {
    content: "\e620";
}

.icon-clock_3:before {
    content: "\e621";
}

.icon-close:before {
    content: "\e622";
}

.icon-credit_note:before {
    content: "\e623";
}

.icon-cut:before {
    content: "\e624";
}

.icon-diferent:before {
    content: "\e625";
}

.icon-doc:before {
    content: "\e626";
}

.icon-doc_excel:before {
    content: "\e627";
}

.icon-expense_sheet:before {
    content: "\e628";
}

.icon-doc_image:before {
    content: "\e629";
}

.icon-doc_text:before {
    content: "\e62a";
    color: #444;
}

.icon-doc_video:before {
    content: "\e62b";
}

.icon-doc_zip:before {
    content: "\e62c";
}

.icon-duplicate:before {
    content: "\e62d";
}

.icon-error:before {
    content: "\e62e";
}

.icon-faq:before {
    content: "\e62f";
}

.icon-features:before {
    content: "\e630";
    color: #444;
}

.icon-gear:before {
    content: "\e631";
    color: #444;
}

.icon-general:before {
    content: "\e632";
}

.icon-doc_pdf:before {
    content: "\e613";
    
}

.icon-gear_3:before {
    content: "\e634";
}

.icon-hour_glass_2:before {
    content: "\e635";
}

.icon-marker:before {
    content: "\e636";
}

.icon-lock:before {
    content: "\e637";
}

.icon-lock_green:before {
    content: "\e638";
}

.icon-lock_red:before {
    content: "\e639";
}

.icon-maximize:before {
    content: "\e63a";
}

.icon-minimize:before {
    content: "\e63b";
}

.icon-minus:before {
    content: "\e63c";
}

.icon-move:before {
    content: "\e63d";
}

.icon-no:before {
    content: "\e63e";
}

.icon-notes:before {
    content: "\e90c";
    font-size: large;
    color: var(--icon-bg);
    margin-right: 5px;
    cursor: pointer;
}

.icon-ok:before {
    content: "\e640";
}

.icon-password:before {
    content: "\e641";
}

.icon-pause:before {
    content: "\e642";
}

.icon-play:before {
    content: "\e643";
}

.icon-plus:before {
    content: "\e644";
}

.icon-power:before {
    content: "\e645";
}

.icon-purchase_invoice:before {
    content: "\e646";
}

.icon-reports:before {
    content: "\e647";
}

.icon-resource:before {
    content: "\e648";
}

.icon-magnify-glas:before {
    content: "\e649";
}

.icon-split:before {
    content: "\e64a";
}

.icon-stop:before {
    content: "\e64b";
}

.icon-time_5:before {
    content: "\e64c";
}

.icon-arrow_4:before {
    content: "\e64d";
}

.icon-car_circle:before {
    content: "\e64e";
}

.icon-check_4:before {
    content: "\e64f";
}

.icon-circle_next:before {
    content: "\e650";
}

.icon-close_3:before {
    content: "\e651";
}

.icon-f1:before {
    content: "\e652";
}

.icon-f2:before {
    content: "\e653";
}

.icon-f3:before {
    content: "\e654";
}

.icon-gr1:before {
    content: "\e655";
}

.icon-gr1_1:before {
    content: "\e656";
}

.icon-gr2:before {
    content: "\e657";
}

.icon-gr2_1:before {
    content: "\e658";
}

.icon-gr3:before {
    content: "\e659";
}

.icon-gr3_1:before {
    content: "\e65a";
}

.icon-gr4:before {
    content: "\e65b";
}

.icon-gr4_1:before {
    content: "\e65c";
}

.icon-invoice22:before {
    content: "\e65d";
}

.icon-ion:before {
    content: "\e65e";
}

.icon-minus_2:before {
    content: "\e65f";
}

.icon-note:before {
    content: "\e660";
}

.icon-phone:before {
    content: "\e661";
}

.icon-reload_3:before {
    content: "\e662";
}

.icon-timesheet:before {
    content: "\e939";
}
.icon-timesheet_old:before {
    content: "\e663";
}
.icon-timesheet_fill:before {
    content: "\e939";
}
.icon-man:before {
    content: "\e664";
}

.icon-user_circle:before {
    content: "\e665";
}

.icon-warning_2:before {
    content: "\e666";
}

.icon-warning_3:before {
    content: "\e667";
}

.icon-woman:before {
    content: "\e668";
}

.icon-arrow_up:before {
    content: "\e669";
}

.icon-arrow_down:before {
    content: "\e66a";
}

.icon-arrow_left:before {
    content: "\e66b";
}

.icon-arrow_right:before {
    content: "\e66c";
}

.icon-circle_prev:before {
    content: "\e66d";
}

.icon-left_1:before {
    content: "\e66e";
}

.icon-right_1:before {
    content: "\e66f";
}

.icon-up_big:before {
    content: "\e670";
}

.icon-down_big:before {
    content: "\e672";
}

.icon-make-group:before {
    content: "\e673";
}

.icon-add-remove:before {
    content: "\e674";
}

.icon-bell:before {
    content: "\e67d";
}

.icon-add-timesheet .path1:before {
    content: "\e671";
}

.icon-add-timesheet .path2:before {
    content: "\e685";
    margin-left: -1em;
}

.icon-doc_word:before {
    content: "\e675";
}

.icon-email:before {
    content: "\e676";
}

.icon-filter-checkmark .path1:before {
    content: "\e902";
    color: rgb(0, 0, 0);
}

.icon-filter-checkmark .path2:before {
    content: "\e903";
    margin-left: -1em;
    color: rgb(1, 1, 1);
}

.icon-features2:before {
    content: "\e678";
}

.icon-filter-reset .path1:before {
    content: "\e679";
    color: rgb(0, 0, 0);
}

.icon-filter-reset .path2:before {
    content: "\e67a";
    margin-left: -1em;
    color: rgb(1, 1, 1);
}

.icon-follow:before {
    content: "\e67c";
}

.icon-help:before {
    content: "\e67e";
}

.icon-import-excel:before {
    content: "\e681";
}

.icon-search:before {
    content: "\e687";
}

.icon-ImportMSProjects:before {
    content: "\e688";
}

.icon-leads:before {
    content: "\e68c";
}

.icon-multiedit:before {
    content: "\e68d";
}

.icon-photo:before {
    content: "\e68e";
}

.icon-play2:before {
    content: "\e68f";
}

.icon-reset-preferences:before {
    content: "\e690";
}

.icon-translate:before {
    content: "\e692";
}

.icon-unasign .path1:before {
    content: "\e693";
}

.icon-unasign .path2:before {
    content: "\e694";
    margin-left: -1em;
}

.icon-unasign .path3:before {
    content: "\e695";
    margin-left: -1em;
    color: rgb(250, 250, 250);
}

.icon-unfollow:before {
    content: "\e696";
}

.icon-hide-timesheet .path1:before {
    content: "\e697";
    color: rgb(0, 0, 0);
}

.icon-hide-timesheet .path2:before {
    content: "\e69b";
    margin-left: -1em;
    color: rgb(1, 1, 1);
}

.icon-show-timesheet .path1:before {
    content: "\e698";
    color: rgb(0, 0, 0);
}

.icon-show-timesheet .path2:before {
    content: "\e69a";
    margin-left: -1em;
    color: rgb(1, 1, 1);
}

.icon-workload:before {
    content: "\e67f";
}

.icon-multiedit-timesheet .path1:before {
    content: "\e680";
    color: rgb(0, 0, 0);
}

.icon-multiedit-timesheet .path2:before {
    content: "\e683";
    margin-left: -1em;
    color: rgb(1, 1, 1);
}

.icon-contract .path1:before {
    content: "\e682";
    color: rgb(0, 0, 0);
}

.icon-contract .path2:before {
    content: "\e684";
    margin-left: -1em;
    color: rgb(1, 1, 1);
}

.icon-printer:before {
    content: "\e900";
}

.icon-refresh-checkmark .path1:before {
    content: "\e905";
    color: rgb(1, 1, 1);
}

.icon-refresh-checkmark .path2:before {
    content: "\e906";
    margin-left: -1.234375em;
    color: rgb(0, 0, 0);
}

.icon-indent:before {
    content: "\e907";
}

.icon-outdent:before {
    content: "\e908";
}

.icon-milestone:before {
    content: "\e909";
}

.icon-unlike:before {
    content: "\e90a";
}

.icon-like:before {
    content: "\e90b";
}

.icon-read:before {
    content: "\e90c";
}

.icon-unread:before {
    content: "\e90d";
}

.icon-show-unread:before {
    content: "\e90e";
}

.icon-interface:before {
    content: "\e904";
}

.icon-sort-alpha-asc:before {
    content: "\e910";
}

.icon-reply:before {
    content: "\e911";
}

.icon-reply-all:before {
    content: "\e912";
}

.icon-forward:before {
    content: "\e90f";
}

.icon-transfer:before {
    content: "\e913";
}

.icon-flow-tree:before {
    content: "\e914";
}

.icon-list-items:before {
    content: "\e915";
}

.icon-grid-insert .path1:before {
    content: "\e916";
    color: rgb(1, 1, 1);
}

.icon-grid-insert .path2:before {
    content: "\e917";
    margin-left: -1.2001953125em;
    color: rgb(68, 68, 68);
}

.icon-grid-quick-edit .path1:before {
    content: "\e918";
    color: rgb(1, 1, 1);
}

.icon-grid-quick-edit .path2:before {
    content: "\e919";
    margin-left: -1.2001953125em;
    color: rgb(68, 68, 68);
}

.icon-multiedit-issue .path1:before {
    content: "\e91a";
    color: rgb(0, 0, 0);
}

.icon-multiedit-issue .path2:before {
    content: "\e91b";
    margin-left: -1em;
    color: rgb(1, 1, 1);
}

.icon-calculate:before {
    content: "\e91c";
}

.icon-assigned .path1:before {
    content: "\e91d";
    color: rgb(0, 0, 0);
}

.icon-assigned .path2:before {
    content: "\e91e";
    margin-left: -1em;
    color: rgb(250, 250, 250);
}

.icon-assigned .path3:before {
    content: "\e91f";
    margin-left: -1em;
    color: rgb(1, 1, 1);
}

.icon-activity:before {
    content: "\e920";
}

.icon-link:before {
    content: "\e921";
}

.icon-invoice-schedule:before {
    content: "\e922";
}

.icon-process:before {
    content: "\e923";
}

.icon-new-version:before {
    content: "\e924";
}

.icon-empty-star:before {
    content: "\e925";
}

.icon-star:before {
    content: "\e926";
}

.icon-lookup:before {
    content: "\e927";
}

.icon-item:before {
    content: "\e935";
}
.icon-item_old:before {
    content: "\e928";
}

.icon-item_fill:before {
    content: "\e935";
}

.icon-procurement:before {
    content: "\e93a";
}
.icon-procurement_old:before {
    content: "\e929";
}
.icon-procurement_fill:before {
    content: "\e93a";
}
.icon-share:before {
    content: "\e92a";
}

.icon-unlink:before {
    content: "\e92b";
}

.icon-planning-draft:before {
    content: "\e92c";
}
.icon-planning_fill:before {
    content: "\e936";
}
.icon-add-remove-item:before {
    content: "\e92d";
}

.icon-optional:before {
    content: "\e92e";
}

.icon-platform:before {
    content: "\e92f";
}

.icon-unchecked:before {
    content: "\e930";
}

.icon-checked:before {
    content: "\e931";
}

.icon-location:before {
    content: "\e932";
}

.icon-chart:before {
    content: "\e933";
}
.icon-logo_full.path1:before {
    content: "\e93b";
    color: var(--menu-hover);
    font-size: 50px;
}

.icon-logo_full.path2:before {
    content: "\e93c";
    margin-left: -2.75em;
    color: var(--icon-bg);
    font-size: 50px;
}
.icon-logo_small:before {
    content: "\e93d";
}
.icon-radiobox:before {
    content: "\e93e";
}
.icon-toggle_off:before {
  content: "\e93f";
}
.icon-toggle_on:before {
  content: "\e940";
}
.icon-radiobox_checked:before {
  content: "\e941";
}
.icon-hamburger-menu:before {
  content: "\e942";
}
.icon-calendar_round:before {
  content: "\e943";
}
.icon-down_wide:before {
  content: "\e944";
}
.icon-add_fill:before {
  content: "\e945";
}
.icon-chatbot:before {
  content: "\e946";
}
.icon-chat-send:before {
  content: "\e947";
}
.icon-replyline:before {
  content: "\e948";
}
.icon-dashboard:before {
  content: "\e94a";
}
.icon-logout:before {
  content: "\e949";
}
.icon-man_line:before {
  content: "\e94c";
}
.icon-woman_line:before {
  content: "\e94d";
}
.icon-workflow:before {
  content: "\e94e";
}
.icon-briefcase:before {
  content: "\e94b";
}
.icon-drag_handle:before {
  content: "\e951";
}
.icon-lookup_modern:before {
  content: "\e94f";
}
.icon-project_task:before {
  content: "\e952";
}
.icon-skills:before {
  content: "\e953";
}
/********************************************************/
/*  Project:        iONBIZ
/*  Created by:     Ovidiu Burciu
/*  Creation Date:  17.apr.2014
/********************************************************/
/* TABLE OF CONTENTS                                    */
/********************************************************
    [0] General Layout 
    [1] Header + Menu
    [2] Modal Details
    [3] Color Picker
    [4] Detail Layout
    [5] Grid
    [6] Projects
    [7] Send Email
    [8] Shared
    [9] Page Specific
    [9.1] To Plan
    [--] Utils 
********************************************************/


/*******************************************************
    [0] General Layout 
********************************************************/
:root {
    --bg: #fdfdfd;
    --input-bg: #fbfbfb;
    --input-bg-required: #edeff0;
    --input-focus: #c4c4c4;
    --dialog-bg: #fefefe;
    --east-bg: #fbfbfb;
    --section-bg: #ffffff;
    --section-border: #E9ECEC;
    /* Section card outline. Separate from --section-border because in dark that value
       is almost the same as --section-bg, which erases the card edge. */
    --card-border: var(--section-border);
    --weekend-bg: #edeff0;
    --context-menu-bg: var(--bg);
    --grid-header-bg: #fbfbfb;
    /*keep existing behaviour as the unset, override from statsig*/
    --grid-header-text-transform: unset;
    --hover: #f2f2f2;
    --shaddow: rgb(0 7 22 / 15%);
    --dark-bg: #222222;
    --dark-bg-dialog: #282828;
    --dark-bg-txt: #A8ABA7;
    --txt-color: #2B2F38;
    --txt-color-muted: #8A8F99;
    --bg-border: #d7d7d7;
    --bg-border-light: #e9ecee;
    --dark-bg-input-edit: #2e2e2e;
    --blue: #2f6af9;
    --green: #d0fe90ed;
    --dark-green: #119D58;
    --red: #B30004;
    --header-bg: #fbfbfb;
    --menu-hover: var(--blue);
    --menu-active: var(--bg);
    --submenu-hover: var(--green);
    --public-holiday: var(--green);
    --icon-bg: #141414;
    --border-radius-xxs: 4px;
    --border-radius-xs:6px;
    --border-radius-sm:9px;
    --border-radius-md:12px;
    --border-radius-l:14px;
    --border-radius-xl:16px;
    --row-height:32px;
    --resizer-width: 1px;
    /* Main menu footprint. The bar height matches #mainMenu's own height, which is what
       the old jquery.layout north pane used to read off it at init. */
    --menu-bar-h: 64px;
    /* The open rail has to fit the longest label — "Time registrations", 94px — beside the
       36px icon column and the 21px chevron, plus the tile's own 8px margins and 10px
       padding. 180px leaves the label ~9px of slack for longer translations. */
    --menu-rail-w: 180px;
    --menu-rail-w-collapsed: 56px;
    /* The collapsed tile's interior: rail width less the tile's 4px margins and 5px
       padding. Keeping the icon box exactly this wide stops the glyph moving on open. */
    --menu-rail-icon-w: calc(var(--menu-rail-w-collapsed) - 20px);
    --menu-rail-row-h: 30px;
    --date-accent: #7c3aed;
    --date-accent-bg: rgba(124, 58, 237, 0.08);
    --ion-reef:#d0fe90ed;
    --ion-biscay:#192d5c;
    --brand-soft:#eaf0fe;
    --font-family: "DM Sans", Onest, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    --font: 0.87em var(--font-family);
}
/* Shared by the submenu flyout and the tile it was opened from — the two carry one surface
   so they read as a single shape. It has to be a panel surface, not the bar's --menu-active:
   everything inside the flyout (links, column rule, quick filter) is drawn for one, and
   classic's --menu-active is dark navy while its text is not.
   Declared on body, not :root: a custom property is substituted against the element that
   declares it, and the themes below only reach body — on :root this would be stuck light. */
body {
    --menu-panel-bg: var(--dialog-bg);
}

/*Classic Theme*/
body.classic {
    --header-bg: #1f2532;
    --icon-bg: #BCCED1;
    --shaddow: rgb(0 7 22 / 15%);
    --menu-hover: #3891a3;
    --menu-active: #363f52;
    --submenu-hover: #fae185;
    --public-holiday: var(--green);
    --blue: #3891a3;
    --green: #d7f9c7;
    /*--font: 0.8em Arial, Helvetica, sans-serif;*/
}
body.classic .loginLogo .icon-logo_full.path2:before{
    color:var(--txt-color);
}
 body.classic #mainMenu a:focus:before, body.classic #mainMenu a:hover, body.classic #mainMenu a:hover:before, body.classic #mainMenu .contentBox.active a:before, body.classic #mainMenu a:hover:after, body.classic #mainMenu .contentBox.active a:after, body.classic #mainMenu .contentBox.activeSubmenu a:before, body.classic #mainMenu .contentBox.activeSubmenu a:after{
     color: white;
 }
    body.classic .ui-jqgrid .ui-jqgrid-bdiv{
        font-size: 12px !important;
    }
    body.classic a{
        font-size: 12px;
    }

    body.classic .jqGridHolder .jqgrow.ui-state-hover .selection, body.classic .ui-jqgrid tr.jqgrow td.selection:hover, body.classic .jqGridHolder .jqgrow.ui-state-highlight .selection {
        color: #679B03;
    }
    body.classic .ui-dialog .arrow:after {
        background-color: var(--east-bg);
    }
    body.classic #quickSearchHolder input{
        border: 1px solid black !important;
    }
    body.classic #innerMainMenu div.scrollingHotSpotLeftVisible,
    body.classic #innerMainMenu div.scrollingHotSpotRight{
        background-color: black;
    }
    body.classic .gridFilter .header,
    body.classic .ui-dialog .ui-dialog-titlebar {
        background-color: var(--east-bg);
    }
    
    body.classic .ui-button-text, body.classic .lnkSaveDetails, body.classic .lnkExtraDetails, body.classic .lnkExtraSaveDetails, body.classic .lnkThirdSaveDetails, body.classic .lnkFourthSaveDetails, body.classic .lnkSaveAndNewDetails, body.classic .lnkCancelDetails, body.classic .btnAction, body.classic .btnCancel {
        text-transform: uppercase;
    }
    body.classic .lnkCancelDetails{
        border-radius: var(--border-radius-sm);
    }
    body.classic .btnSubMenu:before{
        color: var(--bg) !important;
    }
    body.classic .btnSubMenu:hover::before {
        color: black !important;
    }
    body.classic .btnSubMenu:hover {
        color: var(--header-bg) !important;
    }
    body.classic .ui-layout-resizer-east-open {
        box-shadow: -3px -1px 3px -1px #858484;
        background-color: var(--east-bg);
    }
    body.classic #logo:hover{
        background: var(--menu-active) !important;
    }
    body.classic input:not(.quickSearchAutocomplete, .qSearch):required:invalid {
        border: 1px solid var(--red) !important;
    }
    body.classic .lnkCancelDetails{
        min-width:65px;
    }
    /*End Classic Theme*/
    html {
        height: 100%;
        -webkit-overflow-scrolling: touch;
    }
/* Momentum scrolling must sit on the actual scroll container (not just html, where it isn't inherited); without it iOS ignores the first swipe on a freshly-shown grid body. */
.ui-jqgrid-bdiv {
    -webkit-overflow-scrolling: touch;
}
body {
    height: 100%;
    margin: 0px;
    color: var(--txt-color);
    font: var(--font);
    background-color: var(--bg);
    overflow: hidden;
}

/* ============================================================
   App shell. The main header used to be a jquery.layout "north" pane, which pinned it
   to the top. It is placed here instead so it can sit on any edge; jquery.layout still
   owns everything inside #workspace. body[data-menu-position] picks the edge.
   ============================================================ */
#appShell {
    width: 100%;
    height: 100%;
    display: grid;
    /* minmax(0,1fr) rather than 1fr: a grid track's automatic minimum is its content,
       so a wide grid would push the content area past the viewport instead of scrolling. */
    grid-template-columns: 1fr;
    grid-template-rows: var(--menu-bar-h) minmax(0, 1fr);
    grid-template-areas: "menu" "body";
}

/* iOS draws the status bar of an installed web app as glass that bleeds a few pixels into
   the top of the viewport. Reserving a flat strip there keeps our own controls out of it.
   The viewport itself is untouched — the shell just gets shorter by the same amount. */
@media (display-mode: standalone) and (max-width: 768px) {
    #appShell {
        box-sizing: border-box;
        padding-top: var(--pwa-top-gap, 16px);
        background-color: var(--bg);
    }
}

#northLayout {
    grid-area: menu;
    position: relative;
    overflow: hidden;
    min-width: 0;
    min-height: 0;
}

#workspace {
    grid-area: body;
    position: relative;
    overflow: visible;
    min-width: 0;
    min-height: 0;
    margin: 0px;
}

/* Pins the side rail open. Only a rail can collapse, so the button is revealed there
   and stays hidden on the top and bottom bars and on touch, where the rail never
   collapses in the first place. */
.rail-pin-toggle {
    display: none;
}

/* Below 769px the row belongs to .mob-topbar, whose height comes from its own content —
   the safe-area inset and the user's text scaling both grow it. The north pane used to
   be size:"auto" and absorbed that; a fixed track plus overflow:hidden would clip it. */
@media (max-width: 768px) {
    #appShell {
        grid-template-rows: auto minmax(0, 1fr);
    }

    /* The desktop bar is covered by .mob-topbar here but still occupies the row. Left to
       spill, its tiles give #northLayout a scrollable overflow, and the scrollIntoView
       that reveals the current item then drags the topbar out of sight. */
    #mainMenu {
        overflow: hidden;
    }
}

/* Alternate menu edges. Below 769px the mobile topbar and drawer already own the
   navigation, so the bar stays on top there whatever the preference says. */
@media (min-width: 769px) {

/* ── Horizontal bar ─────────────────────────────────────────── */
/* Selecting a tile used to widen it from 90px to 110px, which slid its own icon and
   label 7.5px right and pushed every tile after it along by 20px. The label box is the
   same size either way, so holding the width costs nothing but the extra whitespace. */
body:is([data-menu-position="top"], [data-menu-position="bottom"]) #mainMenu #innerMainMenu > .contentBox.active,
body:is([data-menu-position="top"], [data-menu-position="bottom"]) #mainMenu #innerMainMenu > .contentBox.activeSubmenu {
    width: 90px !important;
}

body:is([data-menu-position="top"], [data-menu-position="bottom"]) #mainMenu #innerMainMenu > .contentBox.active > a:first-of-type:after,
body:is([data-menu-position="top"], [data-menu-position="bottom"]) #mainMenu #innerMainMenu > .contentBox.activeSubmenu > a:first-of-type:after,
body:is([data-menu-position="top"], [data-menu-position="bottom"]) #mainMenu #innerMainMenu > .contentBox.active a:not(.btnSubMenu):before,
body:is([data-menu-position="top"], [data-menu-position="bottom"]) #mainMenu #innerMainMenu > .contentBox.activeSubmenu a:not(.btnSubMenu):before {
    width: 95px !important;
}

/* ── Bottom bar ─────────────────────────────────────────────── */
body[data-menu-position="bottom"] #appShell {
    grid-template-rows: minmax(0, 1fr) var(--menu-bar-h);
    grid-template-areas: "body" "menu";
}

body[data-menu-position="bottom"] #mainMenu {
    border-bottom: 0;
    border-top: 1px solid var(--bg-border-light);
}

/* The glyph is a down chevron, matching a submenu that drops out of the top bar. From
   the bottom bar the submenu rises instead, so the chevron turns to follow it. */
body[data-menu-position="bottom"] #innerMainMenu > .contentBox > .btnSubMenu {
    transform: rotate(180deg);
}

/* Fixed with auto insets, so the overflow dropdown lands at its static position under
   the button — below the bar, off-screen. It is pinned above the bar instead, in the
   "More" dropdown block further down. */

/* ── Side rails ─────────────────────────────────────────────── */
/* The bar's interior is absolutely positioned: #logo pinned left, #mainMenu filling the
   middle with paddings reserving the logo and pill slots, the pill pinned right. The
   rail drops all three back into flow and stacks them in a flex column instead.
   Everything below is shared by both rails; the edge-specific bits follow after. */
body:is([data-menu-position="left"], [data-menu-position="right"]) #appShell {
    position: relative;
    grid-template-rows: minmax(0, 1fr);
}

body[data-menu-position="left"] #appShell {
    grid-template-columns: var(--menu-rail-w) minmax(0, 1fr);
    grid-template-areas: "menu body";
}

body[data-menu-position="right"] #appShell {
    grid-template-columns: minmax(0, 1fr) var(--menu-rail-w);
    grid-template-areas: "body menu";
}

body:is([data-menu-position="left"], [data-menu-position="right"]) #northLayout {
    /* Stacking the three absolutely-pinned blocks instead of re-pinning them means the
       nav simply takes whatever height the logo and the pill leave over. */
    display: flex;
    flex-direction: column;
}

/* Drawn inside the rail rather than as a border on it. #northLayout is overflow:hidden,
   which clips its children to the padding box, so a border would sit where the open
   tile can never reach to break it. This also makes the rail exactly --menu-rail-w wide
   instead of a pixel over, since it is content-box. */
body[data-menu-position="left"] #northLayout {
    background-image: linear-gradient(var(--bg-border-light), var(--bg-border-light));
    background-size: 1px 100%;
    background-position: right top;
    background-repeat: no-repeat;
}

body[data-menu-position="right"] #northLayout {
    background-image: linear-gradient(var(--bg-border-light), var(--bg-border-light));
    background-size: 1px 100%;
    background-position: left top;
    background-repeat: no-repeat;
}

body:is([data-menu-position="left"], [data-menu-position="right"]) #logo {
    position: static;
    float: none;
    display: block;
    flex: 0 0 auto;
    margin: 8px 0 0;
    text-align: center;
}

body:is([data-menu-position="left"], [data-menu-position="right"]) #logo_img {
    /* content-box by default, so the edge padding below would widen it past the rail. */
    box-sizing: border-box;
    width: 100%;
    height: 34px;
}

/* Aligned to the docked edge, not centred, so the mark keeps its place when the rail
   opens and the wordmark appears beside it. The inset is the tile's own edge offset plus
   half the slack the 26px mark leaves in the 36px icon column, which puts the mark on the
   same centreline as the menu glyphs. */
body[data-menu-position="left"] #logo_img {
    justify-content: flex-start;
    padding-left: 14px;
}

/* The wordmark trails to the right of the mark, so the lockup can only be kept inside a
   rail that grows leftwards by pinning its right edge — which means the mark slides left
   as the rail opens instead of holding still the way it does on the left rail. */
body[data-menu-position="right"] #logo_img {
    justify-content: flex-end;
    padding-right: 16px;
}

/* The lockup is two icon-font glyphs overlapped by a -2.75em margin, so the whole thing
   scales from font-size alone. At 50px it measures 146px, well past the rail width. */
body:is([data-menu-position="left"], [data-menu-position="right"]) #logo_img .icon-logo_full.path1:before,
body:is([data-menu-position="left"], [data-menu-position="right"]) #logo_img .icon-logo_full.path2:before {
    font-size: 32px;
}

body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu {
    position: static;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    height: auto;
    margin-top: 10px;
    padding: 0;
    border-bottom: 0;
    overflow-x: hidden;
    overflow-y: auto;
    /* No scrollbar at all rather than `scrollbar-gutter: stable`: the tiles must not shift
       sideways when the rail's available height settles, but a reserved gutter narrows the
       content box, and that box is what clips the open tile's reach to the docked panel.
       macOS overlay scrollbars reserve nothing, so this is what Chromium already drew;
       Firefox reserves a classic 15px and cut the tile 14px short of the panel. */
    scrollbar-width: none;
}

body:is([data-menu-position="left"], [data-menu-position="right"]) #innerMainMenu {
    display: flex;
    flex-direction: column;
}

body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu .contentBox,
body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu .contentBox.active,
body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu .contentBox.activeSubmenu {
    position: relative;
    /* content-box by default, so the 5px padding would push the tile past the rail. The
       leftover scrollable overflow lets scrollIntoView shunt the whole strip sideways.
       The width has to come to the margins exactly, or the tile stops short of the rail's
       inner edge and the open tile's outline cannot reach the panel docked against it. */
    box-sizing: border-box;
    width: calc(100% - 8px) !important;
    margin: 0 4px 2px;
    /* Both the icon and the label are absolutely positioned, so they add no height of
       their own and tiles would otherwise collapse onto each other. */
    min-height: calc(var(--menu-rail-row-h) + 10px);
}

body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu a,
body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu #innerMainMenu > .contentBox > a:first-of-type {
    float: none;
    width: 100%;
}

/* The 29px top padding reserved room for the label under the icon; it is beside it now. */
body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu #innerMainMenu > .contentBox > a:first-of-type {
    padding: 0;
    height: var(--menu-rail-row-h);
    margin-bottom: 0;
}

/* Icon beside the label rather than above it. The icon column is exactly as wide as the
   collapsed tile's interior, so the glyph lands on the same spot whether the rail is
   collapsed or open — the label is the only thing that appears. Both boxes also have to
   drop the hardcoded 95px/110px widths, which the active state uses to widen a top-bar
   tile; here the tile is fixed to the rail and only its contents would have moved. */
body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu .contentBox a:not(.btnSubMenu):before {
    width: var(--menu-rail-icon-w) !important;
    top: 0;
    height: var(--menu-rail-row-h);
    line-height: var(--menu-rail-row-h);
    font-size: 20px;
    /* A column of near-black glyphs reads heavy; the current and hovered items below
       stay at full strength so they still carry the selection. */
    opacity: 0.65;
}

body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu .contentBox:hover a:not(.btnSubMenu):before,
body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu .contentBox.active a:not(.btnSubMenu):before,
body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu .contentBox.activeSubmenu a:not(.btnSubMenu):before {
    opacity: 1;
}

body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu #innerMainMenu > .contentBox > a:first-of-type:after,
body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu #innerMainMenu > .contentBox.active > a:first-of-type:after,
body:is([data-menu-position="left"], [data-menu-position="right"]) #mainMenu #innerMainMenu > .contentBox.activeSubmenu > a:first-of-type:after {
    /* auto so the left/right pair below sizes it; the base rule sets an explicit width. */
    width: auto !important;
    top: 0;
    height: var(--menu-rail-row-h);
    line-height: var(--menu-rail-row-h);
}

/* The icon hugs the docked edge so it stays put while the rail grows inwards. */
body[data-menu-position="left"] #mainMenu .contentBox a:not(.btnSubMenu):before {
    left: 0;
    right: auto;
}

body[data-menu-position="left"] #mainMenu #innerMainMenu > .contentBox > a:first-of-type:after,
body[data-menu-position="left"] #mainMenu #innerMainMenu > .contentBox.active > a:first-of-type:after,
body[data-menu-position="left"] #mainMenu #innerMainMenu > .contentBox.activeSubmenu > a:first-of-type:after {
    left: var(--menu-rail-icon-w);
    right: 0;
    text-align: left;
}

/* Only the selected tile shows a chevron, so only it has to make room for one. */
body[data-menu-position="left"] #mainMenu #innerMainMenu > .contentBox.active > a:first-of-type:after,
body[data-menu-position="left"] #mainMenu #innerMainMenu > .contentBox.activeSubmenu > a:first-of-type:after {
    right: 21px;
}

body[data-menu-position="right"] #mainMenu .contentBox a:not(.btnSubMenu):before {
    left: auto;
    right: 0;
}

/* Left-aligned like the left rail, and indented by the chevron's width on every tile
   rather than only the selected one, so the label does not jump when you select. */
body[data-menu-position="right"] #mainMenu #innerMainMenu > .contentBox > a:first-of-type:after,
body[data-menu-position="right"] #mainMenu #innerMainMenu > .contentBox.active > a:first-of-type:after,
body[data-menu-position="right"] #mainMenu #innerMainMenu > .contentBox.activeSubmenu > a:first-of-type:after {
    left: 21px;
    right: var(--menu-rail-icon-w);
    text-align: left;
}

body:is([data-menu-position="left"], [data-menu-position="right"]) #innerMainMenu > .contentBox > .btnSubMenu {
    position: absolute;
    float: none;
    top: 50%;
    margin-top: 0;
}

/* The 21px circle is a small target next to a full-width row, so the clickable box is
   extended past it: the tile's full height, out to the rail's edge, and towards the label
   up to where the longest label ends. Both rails rotate the chevron, so local top is the
   label side and local left/right are the tile's height. */
body:is([data-menu-position="left"], [data-menu-position="right"]) #innerMainMenu > .contentBox > .btnSubMenu:after {
    content: "";
    position: absolute;
    top: -12px;
    bottom: -6px;
    left: -10px;
    right: -10px;
}

/* The glyph is a down chevron, which points at where the submenu drops from the top bar.
   Rail submenus open sideways, so it turns to face the edge they come out of. */
body[data-menu-position="left"] #innerMainMenu > .contentBox > .btnSubMenu {
    right: 2px;
    transform: translateY(-50%) rotate(-90deg);
}

body[data-menu-position="right"] #innerMainMenu > .contentBox > .btnSubMenu {
    left: 2px;
    transform: translateY(-50%) rotate(90deg);
}

body:is([data-menu-position="left"], [data-menu-position="right"]) .topbar-pill-slot {
    position: static;
    flex: 0 0 auto;
    padding: 8px 0;
}

/* Edge-aligned like the logo and the menu icons, so the pill's buttons hold their
   position when the rail opens, and inset so they share the icons' centreline. */
body[data-menu-position="left"] .topbar-pill-slot {
    justify-content: flex-start;
    padding-left: 2px;
}

body[data-menu-position="right"] .topbar-pill-slot {
    justify-content: flex-end;
    padding-right: 4px;
}

/* The bubble arrow is drawn from the anchor's horizontal centre, which only reads as a
   pointer when the bubble sits above or below it. Rail bubbles open sideways instead.
   Grid filter bubbles keep theirs — they are still anchored to toolbar buttons. */
body:is([data-menu-position="left"], [data-menu-position="right"]) .ui-tooltip:not(.gridFilter) > .arrow {
    display: none;
}

/* ── Open submenu's source tile ─────────────────────────────────
   Nothing said which module a panel belonged to: the tile was carried by :hover alone,
   which drops the moment the pointer moves into the panel. jQuery UI points the chevron
   at the panel it opened with aria-describedby, so the state is already in the DOM.
   Direct children only: the same markup moved into the overflow panel is a list row,
   with no bar edge to bracket itself against.
   ─────────────────────────────────────────────────────────────── */
#innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]) {
    background: var(--menu-panel-bg);
    border-radius: var(--border-radius-sm);
    /* Above the panel, which outranks the menu at z-index 100. The panel draws the
       divider along its own docked edge and the tile has to break it again for its
       own width. No ancestor of either is a stacking context, so the two compare
       directly. */
    z-index: 101;
}

/* Two ids, so this also outranks the classic theme's `#mainMenu .contentBox.active a`
   rules — they paint the label white for a dark bar, and this tile is not one. */
#mainMenu #innerMainMenu > .contentBox > a:has(~ .btnSubMenu[aria-describedby]),
#mainMenu #innerMainMenu > .contentBox > a:has(~ .btnSubMenu[aria-describedby]):before,
#mainMenu #innerMainMenu > .contentBox > a:has(~ .btnSubMenu[aria-describedby]):after,
#mainMenu #innerMainMenu > .contentBox > a.btnSubMenu[aria-describedby],
#mainMenu #innerMainMenu > .contentBox > a.btnSubMenu[aria-describedby]:before,
#mainMenu #innerMainMenu > .contentBox > a.btnSubMenu[aria-describedby]:after {
    color: var(--menu-hover);
    opacity: 1;
}

/* The tile is outlined in the panel's own border colour and left open on the edge the
   panel came out of, so the two read as one bracketed shape. Drawn as an overlay rather
   than a border on the tile itself, which would resize a bar tile by the 2px it adds. */
#innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]):before {
    content: "";
    position: absolute;
    inset: 0;
    border: 1px solid var(--bg-border);
    border-radius: var(--border-radius-sm);
    pointer-events: none;
}

/* The bar or rail draws its own divider, and it runs straight through the mouth of the
   bracket, between the open tile and the panel. The tile reaches across the divider and
   covers it for its own width rather than having the panel paint around it: the tile
   always knows where it is, whereas the panel would have to be told at open time and
   told again whenever collision handling moved it.

   Every reach below is written as the bar's or rail's full extent rather than the gap
   it actually has to cross, because the tile's offset from that edge is a float-layout
   result CSS cannot read. The surplus is exactly that offset and lands outside
   #northLayout, which clips it; measuring the gap instead leaves the divider showing
   through the mouth as soon as browser zoom or a padding change moves the tile. */
body[data-menu-position="top"] #innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]):before {
    /* Tiles are laid out from the top of the bar whichever edge it is on, so reaching the
       foot of a top bar has to discount the tile's own height: 100% is the tile. */
    bottom: calc(100% - var(--menu-bar-h));
    border-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

body[data-menu-position="bottom"] #innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]):before {
    top: calc(100% - var(--menu-bar-h));
    border-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

body[data-menu-position="left"] #innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]):before {
    right: calc(100% - var(--menu-rail-w));
    border-right: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

body[data-menu-position="right"] #innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]):before {
    left: calc(100% - var(--menu-rail-w));
    border-left: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/* The tile's own corners have to go square on the same edge, or its rounded background
   notches the join the bracket and the filler have just closed. */
body[data-menu-position="top"] #innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]) {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

body[data-menu-position="bottom"] #innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]) {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

body[data-menu-position="left"] #innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

body[data-menu-position="right"] #innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/* Fills the mouth of the bracket: the strip of bar or rail between the tile's edge and
   the panel's, divider included, carrying the panel's surface across it so the two
   meet without a seam. Held a pixel clear of the bracket's arms, which are drawn by
   :before and painted first. */
#innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]):after {
    content: "";
    position: absolute;
    background: var(--menu-panel-bg);
    pointer-events: none;
}

body[data-menu-position="top"] #innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]):after {
    top: 100%;
    bottom: calc(100% - var(--menu-bar-h));
    left: 1px;
    right: 1px;
}

body[data-menu-position="bottom"] #innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]):after {
    top: calc(100% - var(--menu-bar-h));
    bottom: 100%;
    left: 1px;
    right: 1px;
}

body[data-menu-position="left"] #innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]):after {
    left: 100%;
    right: calc(100% - var(--menu-rail-w));
    top: 1px;
    bottom: 1px;
}

body[data-menu-position="right"] #innerMainMenu > .contentBox:has(> .btnSubMenu[aria-describedby]):after {
    right: 100%;
    left: calc(100% - var(--menu-rail-w));
    top: 1px;
    bottom: 1px;
}

/* ── Submenu flyout ─────────────────────────────────────────────
   Docked to the bar or rail it was opened from instead of floating clear of it: same
   surface, square on the docked edge and no arrow, so the two read as one piece of
   chrome. Only the panel's outline moves — its contents are laid out the same
   whichever edge the menu is on.
   ─────────────────────────────────────────────────────────────── */
.ui-tooltip:has(.submenuHolder) {
    border-radius: 0;
    /* Carrying the selected tile's surface rather than the bar's is what joins the two:
       the tile stops looking like a lit patch of the bar and starts looking like the
       near corner of the panel. An outline finds the panel's free edges against the
       page; the shadow only lifts it off what it covers. */
    border: 1px solid var(--bg-border);
    background: var(--menu-panel-bg) !important;
}

.ui-tooltip:has(.submenuHolder) > .arrow {
    display: none;
}

/* Docked one pixel into the bar or rail, so the panel's own border lands on the divider
   row and stands in for it across the panel's width — which is the only stretch of it
   that belongs to the panel. Everywhere else the bar's lighter divider is left alone,
   and at the open tile the tile's filler breaks both. The offsets have to beat the
   inline top/left jQuery UI positions the bubble with; it anchors to the chevron, which
   sits short of the bar's edge. */
body[data-menu-position="top"] .ui-tooltip:not(.bubble-in-more):has(.submenuHolder) {
    top: calc(var(--menu-bar-h) - 1px) !important;
    border-bottom-left-radius: var(--border-radius-md);
    border-bottom-right-radius: var(--border-radius-md);
    box-shadow: 0 16px 28px -12px var(--shaddow);
}

body[data-menu-position="bottom"] .ui-tooltip:not(.bubble-in-more):has(.submenuHolder) {
    top: auto !important;
    bottom: calc(var(--menu-bar-h) - 1px);
    border-top-left-radius: var(--border-radius-md);
    border-top-right-radius: var(--border-radius-md);
    box-shadow: 0 -16px 28px -12px var(--shaddow);
}

/* The rails dock the same way, but their docked edge carries no border: the tile cannot
   reach over one there, because a rail's #northLayout is positioned with a z-index and
   so is a stacking context that caps the tile inside it however high it is raised. The
   panel draws that stretch of divider itself instead, as a gradient it stops short of
   its own top — the bubble is anchored so the tile's top meets the panel's, so the
   stretch to leave open is exactly one rail row measured from there. The shorthand
   repeats the colour because .ui-tooltip sets `background` !important. */
body[data-menu-position="left"] .ui-tooltip:has(.submenuHolder) {
    left: calc(var(--menu-rail-w) - 1px) !important;
    border-left: 0;
    /* One px past the row so it meets the outside of the tile's bottom arm, not its inside. */
    background: var(--menu-panel-bg) linear-gradient(var(--bg-border), var(--bg-border))
                left bottom / 1px calc(100% - var(--menu-rail-row-h) - 9px)
                no-repeat border-box border-box !important;
    border-top-right-radius: var(--border-radius-md);
    border-bottom-right-radius: var(--border-radius-md);
    box-shadow: 16px 0 28px -12px var(--shaddow);
}

body[data-menu-position="right"] .ui-tooltip:has(.submenuHolder) {
    left: auto !important;
    right: calc(var(--menu-rail-w) - 1px) !important;
    border-right: 0;
    background: var(--menu-panel-bg) linear-gradient(var(--bg-border), var(--bg-border))
                right bottom / 1px calc(100% - var(--menu-rail-row-h) - 9px)
                no-repeat border-box border-box !important;
    border-top-left-radius: var(--border-radius-md);
    border-bottom-left-radius: var(--border-radius-md);
    box-shadow: -16px 0 28px -12px var(--shaddow);
}

/* A panel that would overrun the viewport is flipped to grow upwards from the tile, which
   puts the tile at its foot instead of its head: the stretch of divider it draws then has
   to stop short of its own bottom. */
body:is([data-menu-position="left"], [data-menu-position="right"]) .ui-tooltip.bubble-above:has(.submenuHolder) {
    background-position-y: top !important;
}

/* ── Overflow "More" dropdown ───────────────────────────────────
   Built the same way as a submenu flyout, because it is the same gesture: the button
   carries the panel's surface and is left open on the edge the panel came out of. Only
   the bars have one — the rail scrolls instead, so initMoreNavForMainMenu skips it.
   ─────────────────────────────────────────────────────────────── */
#innerMainMenu .more-menu {
    position: relative;
}

#innerMainMenu .more-menu:is(:hover, :focus-within, .is-pinned) {
    /* Two ids, so this also outranks the classic theme's `#innerMainMenu .more-menu:hover`,
       which paints the button white-on-navy for a dark bar. This one is a panel. */
    z-index: 101;
}

/* Hover only holds the panel while the pointer is on it, which is no use when the next
   step is a submenu that flies out beside it. Clicking the button pins it instead. */
#innerMainMenu .more-menu.is-pinned > .dropdown-links {
    display: flex;
    flex-direction: column;
    align-items: center;
}

#mainMenu #innerMainMenu .more-menu:is(:hover, :focus-within, .is-pinned) {
    background: var(--menu-panel-bg);
    border-color: var(--bg-border);
    color: var(--menu-hover);
}

/* The label carries --icon-bg, which is picked for the bar behind it: near-white in
   classic, and invisible the moment the button becomes a panel tab. It follows the
   button's own colour instead, as the chevron already does. */
#mainMenu #innerMainMenu .more-menu:is(:hover, :focus-within, .is-pinned) .more-button {
    color: var(--menu-hover);
}

/* Transparent rather than removed: dropping the border would resize the button by the
   1px it occupies and shunt the tiles beside it. */
body[data-menu-position="top"] #mainMenu #innerMainMenu .more-menu:is(:hover, :focus-within, .is-pinned) {
    border-bottom-color: transparent;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

body[data-menu-position="bottom"] #mainMenu #innerMainMenu .more-menu:is(:hover, :focus-within, .is-pinned) {
    border-top-color: transparent;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

/* Carries the button's surface and arms across the strip of bar between it and the
   panel, covering the stretch of the panel's border that falls under the button. It is
   painted over the panel by tree order — the pseudo is the last child — which is why
   the panel below drops to z-index 0: at 2 it would outrank the pseudo's auto.
   Deliberately still hit-testable: it is the only thing bridging the gap the docking
   opens up between button and panel, and the menu closes the moment hover is lost. */
#innerMainMenu .more-menu:is(:hover, :focus-within, .is-pinned):after {
    content: "";
    position: absolute;
    /* Insets are measured from the padding box, so -1px reaches the button's border box. */
    left: -1px;
    right: -1px;
    background: var(--menu-panel-bg);
    border-left: 1px solid var(--bg-border);
    border-right: 1px solid var(--bg-border);
}

body[data-menu-position="top"] #innerMainMenu .more-menu:is(:hover, :focus-within, .is-pinned):after {
    top: 100%;
    bottom: calc(100% - var(--menu-bar-h));
}

body[data-menu-position="bottom"] #innerMainMenu .more-menu:is(:hover, :focus-within, .is-pinned):after {
    bottom: 100%;
    top: calc(100% - var(--menu-bar-h));
}

/* Docked a pixel into the bar so its own border lands on the divider row and stands in
   for it, and pulled 1px left so its border box lines up with the button's rather than
   with the inside of the button's border. */
body:is([data-menu-position="top"], [data-menu-position="bottom"]) #innerMainMenu .dropdown-links {
    z-index: 0;
    margin-left: -1px;
    background: var(--menu-panel-bg);
    border: 1px solid var(--bg-border);
}

body[data-menu-position="top"] #innerMainMenu .dropdown-links {
    top: calc(var(--menu-bar-h) - 1px);
    border-radius: 0 0 var(--border-radius-md) var(--border-radius-md);
    box-shadow: 0 16px 28px -12px var(--shaddow);
}

body[data-menu-position="bottom"] #innerMainMenu .dropdown-links {
    top: auto;
    bottom: calc(var(--menu-bar-h) - 1px);
    border-radius: var(--border-radius-md) var(--border-radius-md) 0 0;
    box-shadow: 0 -16px 28px -12px var(--shaddow);
}

/* The shadow is for the page under the panel, not for the flyout beside it: blurred over
   28px it washes a good 15px into the surface the two are meant to share, which reads as
   the flyout being a slightly different colour. Clipped off on whichever side the flyout
   went, bar the pixel the seam filler below needs to reach over its border. */
#innerMainMenu .dropdown-links:has(.contentBox.flyout-left > .btnSubMenu[aria-describedby]) {
    clip-path: inset(-40px -40px -40px -1px);
}

#innerMainMenu .dropdown-links:has(.contentBox.flyout-right > .btnSubMenu[aria-describedby]) {
    clip-path: inset(-40px -1px -40px -40px);
}

/* The items were drawn for the bar they came out of and now sit on a panel: classic's
   --icon-bg is near-white and its active/hover rules paint white on navy, none of which
   survives a light surface. Two ids, which is what it takes to outrank them. */
#mainMenu #innerMainMenu .dropdown-links a,
#mainMenu #innerMainMenu .dropdown-links a:before,
#mainMenu #innerMainMenu .dropdown-links a:after {
    color: var(--txt-color);
}

#mainMenu #innerMainMenu .dropdown-links .contentBox:is(:hover, .active, .activeSubmenu) {
    background: var(--hover);
}

/* The open-submenu case is matched on the tile's own two links (label, then chevron) rather
   than through `.contentBox:has(...) a`. The doubled .contentBox keeps the :is() branch at the
   specificity the dropped :has() argument used to lend it. Not [class]: Blink would then restyle
   every descendant <a> of any element whose class attribute changes (~10ms per pane hover). */
#mainMenu #innerMainMenu .dropdown-links .contentBox.contentBox:is(:hover, .active, .activeSubmenu) a,
#mainMenu #innerMainMenu .dropdown-links .contentBox.contentBox:is(:hover, .active, .activeSubmenu) a:before,
#mainMenu #innerMainMenu .dropdown-links .contentBox.contentBox:is(:hover, .active, .activeSubmenu) a:after,
#mainMenu #innerMainMenu .dropdown-links .contentBox > a:has(~ .btnSubMenu[aria-describedby]),
#mainMenu #innerMainMenu .dropdown-links .contentBox > a:has(~ .btnSubMenu[aria-describedby]):before,
#mainMenu #innerMainMenu .dropdown-links .contentBox > a:has(~ .btnSubMenu[aria-describedby]):after,
#mainMenu #innerMainMenu .dropdown-links .contentBox > a.btnSubMenu[aria-describedby],
#mainMenu #innerMainMenu .dropdown-links .contentBox > a.btnSubMenu[aria-describedby]:before,
#mainMenu #innerMainMenu .dropdown-links .contentBox > a.btnSubMenu[aria-describedby]:after {
    color: var(--menu-hover);
}

/* The row whose submenu is open is bracketed exactly like a bar tile, but against the
   panel's own edge instead of the bar's: outline open on the side the flyout went, and
   the strip between them painted over, so the flyout grows out of the row rather than
   sitting next to it behind two borders. No highlight fill: the row already carries the
   panel's surface, and the bracket is what marks it. */
#mainMenu #innerMainMenu .dropdown-links .contentBox:has(> .btnSubMenu[aria-describedby]) {
    background: var(--menu-panel-bg);
}

#innerMainMenu .dropdown-links .contentBox:has(> .btnSubMenu[aria-describedby]):before,
#innerMainMenu .dropdown-links .contentBox:has(> .btnSubMenu[aria-describedby]):after {
    content: "";
    position: absolute;
    pointer-events: none;
}

/* A row's label hangs 2.5px below its own box and its icon starts 5px below the top, so
   an outline drawn on the box alone runs straight through the text. Taken 8px past the
   bottom instead, which puts a matching 5px either side of the two and still leaves 4px
   of the 12px gap to the next row. */
#innerMainMenu .dropdown-links .contentBox:has(> .btnSubMenu[aria-describedby]):before {
    top: 0;
    bottom: calc(-1 * var(--bracket-drop));
    border: 1px solid var(--bg-border);
    border-radius: var(--border-radius-sm);
}

/* Reaches the panel's border box: 10px of panel padding + its 1px border on the left,
   5px + 1px plus the row's own 3px margin on the right. The filler runs 1px further, over
   the flyout's border, and is held a pixel clear of the bracket's arms. The closed side
   is taken 4px out into the panel's padding, so the longer labels are not set against it. */
#innerMainMenu .dropdown-links .contentBox.flyout-left:has(> .btnSubMenu[aria-describedby]):before {
    left: -11px;
    right: -4px;
    border-left: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

#innerMainMenu .dropdown-links .contentBox.flyout-left:has(> .btnSubMenu[aria-describedby]):after {
    right: 100%;
    left: -12px;
    top: 1px;
    bottom: calc(1px - var(--bracket-drop));
    background: var(--menu-panel-bg);
}

#innerMainMenu .dropdown-links .contentBox.flyout-right:has(> .btnSubMenu[aria-describedby]):before {
    left: -4px;
    right: -9px;
    border-right: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

#innerMainMenu .dropdown-links .contentBox.flyout-right:has(> .btnSubMenu[aria-describedby]):after {
    left: 100%;
    right: -10px;
    top: 1px;
    bottom: calc(1px - var(--bracket-drop));
    background: var(--menu-panel-bg);
}

} /* end @media (min-width: 769px) */

/* How far a row's bracket is carried past its own foot to clear the label. Declared out
   here rather than beside the bracket because bubbleMenu reads it to level the flyout,
   and has to be able to at any width. */
#innerMainMenu .dropdown-links .contentBox {
    --bracket-drop: 8px;
}

/* A submenu opened from a row of the overflow panel is a nested menu, not a bar one: it
   flies out beside the panel and squares off against it, and jQuery UI flips it to the
   panel's other side when there is no room. Kept outside the media query above because
   the panel it belongs to has one at every width. */
.ui-tooltip.bubble-in-more:has(.submenuHolder) {
    background: var(--menu-panel-bg) !important;
    border: 1px solid var(--bg-border);
    border-radius: var(--border-radius-md);
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    box-shadow: 16px 0 28px -12px var(--shaddow);
}

.ui-tooltip.bubble-in-more.bubble-left:has(.submenuHolder) {
    border-radius: var(--border-radius-md);
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    box-shadow: -16px 0 28px -12px var(--shaddow);
}

.ui-tooltip.bubble-in-more > .arrow {
    display: none;
}

/* ── Collapsed rail ─────────────────────────────────────────────
   Icons only until the pointer is over it. Gated on (hover: hover) so touch devices,
   which have no way to reveal the labels, keep the rail permanently open.
   ─────────────────────────────────────────────────────────────── */
@media (min-width: 769px) and (hover: hover) {

body[data-menu-position="left"] #appShell {
    grid-template-columns: var(--menu-rail-w-collapsed) minmax(0, 1fr);
}

body[data-menu-position="right"] #appShell {
    grid-template-columns: minmax(0, 1fr) var(--menu-rail-w-collapsed);
}

/* Taken out of the grid flow so the open rail overlays the content instead of
   resizing the track, which would reflow every grid and pane on the page. */
body:is([data-menu-position="left"], [data-menu-position="right"]) #northLayout {
    position: absolute;
    top: 0;
    bottom: 0;
    width: var(--menu-rail-w-collapsed);
    /* !important to outrank the narrow-screen and dropdown-links rules that force
       z-index:auto on the top bar; an overlaying rail has to keep its stacking order. */
    z-index: 30 !important;
    transition: width var(--dur-fast) var(--ease-out);
}

body[data-menu-position="left"] #northLayout {
    left: 0;
}

/* jquery.layout stacks its resizers and togglers at z-index 100+. #workspace is only
   position:relative, so those escape into #appShell's stacking context and outrank the
   rail. Giving #workspace a stacking context of its own keeps them inside it. */
body:is([data-menu-position="left"], [data-menu-position="right"]) #workspace {
    z-index: 0;
}

/* Anchored to the right edge so it grows inwards over the content. */
body[data-menu-position="right"] #northLayout {
    right: 0;
}

/* Open state. `rail-hover` stands in for `#northLayout:hover` because the pointer being on
   the utility pill must not open the rail — see ToolbarMenu.cshtml. `rail-open` holds it
   open for as long as one of its submenus is: reaching the flyout means taking the pointer
   off the rail, and collapsing then would pull the flyout's anchor out from under it.
   Both sit on #northLayout, not on body: a state class on body makes Chromium walk the
   entire document to invalidate, ~23ms per toggle on a large grid page. `data-menu-rail`
   stays on body — it is written before the rail is parsed, and it rarely changes. */
body:is([data-menu-position="left"], [data-menu-position="right"]) #northLayout:is(.rail-hover, .rail-open) {
    width: var(--menu-rail-w);
    box-shadow: var(--shadow-lg);
}

/* path1 and path2 are two colour layers of the same full lockup, so hiding one still
   leaves its advance width. Swap in the mark-only glyph instead. */
body:not([data-menu-rail="pinned"]):is([data-menu-position="left"], [data-menu-position="right"]) #northLayout:not(.rail-hover, .rail-open) #logo_img .icon-logo_full.path2 {
    display: none;
}

body:not([data-menu-rail="pinned"]):is([data-menu-position="left"], [data-menu-position="right"]) #northLayout:not(.rail-hover, .rail-open) #logo_img .icon-logo_full.path1:before {
    content: "\e93d";
    /* Without the scale the mark grows as the rail collapses, because logo_small fills
       more of its em box than logo_full's first layer does. */
    display: inline-block;
    transform: scale(0.78);
}

/* logo_full carries 2px less left bearing than logo_small, so the mark would slide
   sideways as the rail opens. Both layers move together to keep them registered.
   Two selectors because the pinned flag and the open classes now live on different
   elements, and `:is()` cannot span both. */
body[data-menu-rail="pinned"][data-menu-position="left"] #logo_img .icon-logo_full:is(.path1, .path2):before,
body[data-menu-position="left"] #northLayout:is(.rail-hover, .rail-open) #logo_img .icon-logo_full:is(.path1, .path2):before {
    display: inline-block;
    transform: translateX(2px);
}

body:not([data-menu-rail="pinned"]):is([data-menu-position="left"], [data-menu-position="right"]) #northLayout:not(.rail-hover, .rail-open) #mainMenu #innerMainMenu > .contentBox > a:first-of-type:after {
    display: none;
}

body:not([data-menu-rail="pinned"]):is([data-menu-position="left"], [data-menu-position="right"]) #northLayout:not(.rail-hover, .rail-open) #innerMainMenu > .contentBox > .btnSubMenu {
    display: none !important;
}

/* ── Pinned rail ────────────────────────────────────────────────
   Kept open by the user instead of collapsing to icons. The rail goes back into the
   shell's grid track, so the content is pushed aside rather than overlaid.
   ─────────────────────────────────────────────────────────────── */
body[data-menu-rail="pinned"][data-menu-position="left"] #appShell {
    grid-template-columns: var(--menu-rail-w) minmax(0, 1fr);
}

body[data-menu-rail="pinned"][data-menu-position="right"] #appShell {
    grid-template-columns: minmax(0, 1fr) var(--menu-rail-w);
}

/* Equally specific to the rule that widens the overlaying rail, so it has to come after it. */
body[data-menu-rail="pinned"]:is([data-menu-position="left"], [data-menu-position="right"]) #northLayout {
    position: relative;
    width: auto;
    box-shadow: none;
}

/* ── Rail pin toggle ──────────────────────────────────────────
   Rides in the utility pill, so it takes the same round box and colours as the pill's
   own buttons rather than placing itself against the rail's edge. */
body:is([data-menu-position="left"], [data-menu-position="right"]) .rail-pin-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    box-sizing: border-box;
    width: var(--up-btn-size, 36px);
    height: var(--up-btn-size, 36px);
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: var(--r-pill);
    background: transparent;
    color: var(--txt-color);
    cursor: pointer;
}

body:is([data-menu-position="left"], [data-menu-position="right"]) .rail-pin-toggle:hover {
    background: var(--hover);
    color: var(--menu-hover);
}

/* The glyph points the way the rail will move: outwards to open it, back towards its
   own edge to collapse it again. */
body[data-menu-position="right"]:not([data-menu-rail="pinned"]) .rail-pin-toggle svg,
body[data-menu-rail="pinned"][data-menu-position="left"] .rail-pin-toggle svg {
    transform: rotate(180deg);
}

} /* end @media (min-width: 769px) and (hover: hover) */
/* DARK THEME*/
body.dark {
    --ion-biscay:#0f1b38;
    --brand-soft:#1b2740;
    --east-bg: #262626;
    --context-menu-bg: var(--east-bg);
    --input-bg:#2a2a2a;
    --input-bg-required: #272727;
    --input-focus: #656565;
    --section-bg:#252525;
    --section-border: #292929;
    --card-border: var(--bg-border-light);
    --dialog-bg: var(--east-bg);
    --grid-header-bg: #262626;
    --menu-hover: var(--blue);
    --hover: #464646;
    --shaddow: #0000004d;
    --menu-active: #464646;
    --txt-color: #A8ABA7;
    --txt-color-muted: #72757b;
    --icon-bg: #A8ABA7;
    --header-bg: #222222;
    --bg: #222222;
    --bg-border: #383838;
    --bg-border-light: #383838;
    --weekend-bg: #424242;
    --public-holiday: #d0fe90d1;
    --green: #d0fe90d1;
    --blue: #6c97ff;
    --red: #e65054;
    --date-accent: #a78bfa;
    --date-accent-bg: rgba(167, 139, 250, 0.15);
    --ion-reef:#2f6af9;
}
.dark {
    background-color: var(--bg);
    color: var(--dark-bg-txt) !important;
}
body.dark input, body.dark select, body.dark textarea {
    color: var(--dark-bg-txt);
    background-color: var(--dark-bg-input-edit);
}

body.dark header {
    background: var(--dark-bg);
}
body.dark #mainMenu a:before {
    color: var(--dark-bg-txt);
}
body.dark #quickSearchHolder input, body.dark #myMenu .myPic{
    background-color: var(--icon-bg);
}
body.dark #quickSearchHolder input{
    color: var(--bg) !important;
}
body.dark .jqGridHolder:not(.chartGrid) {
    border: 1px solid var(--bg-border);
    color: var(--dark-bg-txt);
}
body.dark .ui-jqgrid-bdiv tr {
    border-bottom: 1px solid var(--bg-border);
    
}
/* A tile with its submenu open is excluded: it carries the panel's surface, not the bar's. */
body.dark #mainMenu .active:not(:has(> .btnSubMenu[aria-describedby])),
body.dark #mainMenu .activeSubmenu:not(:has(> .btnSubMenu[aria-describedby])) {
    background: var(--menu-active) !important;
}

body.dark .ui-menu-item-leveled:not(.ui-menu-item-parent) a span,
body.dark .ui-menu-item-parent:not(first-of-type):last-of-type a span {
    color: var(--dark-bg-txt) !important;
}
body.dark .dirty:not(.ionbiztinymce):not([readonly]) {
    color: var(--dark-bg) !important;
}

body.dark .ui-jqgrid-hdiv {
    border-bottom: solid 1px var(--bg-border);
}

body.dark .jqGridPager {
    border-top: solid 1px var(--bg-border);
}
body.dark .jqGridHolder .ui-jqgrid .ui-pg-input, body.dark .jqGridHolder select.ui-pg-selbox {
    border: solid 1px var(--bg-border);
}
body.dark tr.dirty > td {
    color: var(--dark-bg) !important;
}
body.dark .ui-tooltip {
    background: var(--dark-bg-dialog) !important;
}

body.dark ul.token-input-list-facebook {
    background-color: var(--dark-bg);
}
body.dark .boxDdls input {
    border-bottom: solid 0px var(--dark-bg-txt);
}
body.dark .boxStartStop {
    background-color: var(--dark-bg);
}
body.dark .mce-panel {
    background-color: var(--dark-bg) !important;
}
body.dark .toolbarContainerTextEditor .mce-container, body.dark .mce-btn button, body.dark .mce-btn, body.dark .mce-ico {
    background: var(--dark-bg);
    border: 0px;
    color: var(--dark-bg-txt);
}
body.dark #detailNameHolder {
    color: var(--dark-bg-txt);
}
body.dark .arrow:after {
    background-color: var(--dark-bg-dialog);
}
body.dark .darkHeader {
    color: var(--dark-bg-txt) !important;
}
body.dark .reportFilterCriteria .detailLabel {
    color: var(--dark-bg-txt);
}
    body.dark .mce-edit-focus:hover {
        background: var(--dark-bg);
        
    }
    body.dark .ui-dialog {
        background-color: var(--dark-bg-dialog);
    }
body.dark .ui-jqgrid .ui-jqgrid-htable {
    color: var(--dark-bg-txt);
}
body.dark .pItem {
    color: #e8e8e8;
}

body.dark .savedFilters {
    background: var(--east-bg);
}
body.dark .ui-autocomplete {
    background-color: var(--east-bg);
    border: solid 1px var(--bg-border);
}
body.dark input:not(.quickSearchAutocomplete, .qSearch, .dirty):required:invalid:not(:focus-visible),
body.dark select:not(.quickSearchAutocomplete, .qSearch, .dirty):required:invalid:not(:focus-visible) {
    border: 1px dashed var(--red) !important;
    background-color: #57222f !important;
}
body.dark .replayToNote, body.dark .replyToBox {
    background-color: transparent;
}

body.dark .jqGridHolder .ui-jqgrid .ui-pg-input, body.dark .jqGridHolder select.ui-pg-selbox {
    background-color: var(--dark-bg-input-edit);
    color: var(--dark-bg-txt);
}
body.dark .ui-icon-seek-prev, body.dark .ui-icon-seek-next, body.dark .pagination {
    background-color: #464646;
    color: var(--dark-bg-txt);
}
    body.dark .pagination .ddlPag, body.dark .pgBlue {
        color: var(--dark-bg-txt);
    }
body.dark .recoverPassword {
    color: var(--dark-bg-txt);
}
body.dark td.weekend, body.dark #gridPlanningsContainer .jqGridHolder .jqGrid tbody td.weekend {
    background-color: var(--weekend-bg) !important;
}
body.dark .bubble:after {
    border-color: transparent transparent var(--east-bg);
}
body.dark .holderNotification .notificationTitle, body.dark .holderNotification .notifVal {
    color: var(--dark-bg-txt);
}

/* The dark-theme datepicker cell rules that were here are all overridden by the redesigned
   `.ui-datepicker` block in Blue/Index.css, which sets background/colour with !important on
   the cell and its `> a`/`> span`. The cell rule also sat in the `td` bucket. */
body.dark .btnSubMenu:before {
    color: var(--dark-bg-txt) !important;
}
body.dark .btnSubMenu:hover::before {
    color: black !important;
}
body.dark .displayGrid .detailInput {
    /*background: var(--dark-bg-input-edit);*/
    border-color: var(--bg-border-light);
    color: var(--dark-bg-txt);
}
body.dark .ionbizdetails:not(.editMode) .detailInput input, body.dark .ionbizdetails:not(.editMode) .detailInput select, body.dark .ionbizdetails:not(.editMode) .detailInput textarea, body.dark .richTextEditorHolder textarea {
    color: var(--dark-bg-txt);
}
body.dark .quickSearchHolder input {
    background-color: transparent;
    color: var(--dark-bg-txt);
    border: 1px solid var(--bg-border);
}
body.dark .ionbizdetails.editMode .detailInput input:not([readonly]):not([data-checkbox]),
body.dark .ionbizdetails.editMode .detailInput select:not([readonly]),
body.dark .ionbizdetails.editMode .detailInput textarea:not([readonly]),
body.dark .reportFilterCriteria input:not([readonly]):not([type='file']):where(:nth-child(n+2 of :not(.jqGridHolder))):not(.jqGridHolder),
body.dark .reportFilterCriteria select:not([readonly]):where(:nth-child(n+2 of :not(.jqGridHolder))):not(.jqGridHolder),
body.dark .reportFilterCriteria textarea:not([readonly]),
body.dark .bubbleDialogHolder input:not([readonly]):not([data-checkbox]),
body.dark .bubbleDialogHolder select:not([readonly]),
body.dark .bubbleDialogHolder .detailInput textarea:not([readonly]) {
    background-color: var(--dark-bg-input-edit);
    color: var(--dark-bg-txt);
    height: 30px;
}
body.dark #treeviewAccordion h3, body.dark .submenuCol .colTitle {
    color: var(--dark-bg-txt);
}
    body.dark #treeviewAccordion h3{
        border-bottom: solid 1px var(--bg-border);
    }
body.dark .ui-datepicker {
    background: var(--east-bg);
}
body.dark .jqGrid:not(#gridDashboardComponents) input:not([data-checkbox], .dayCell),
body.dark .jqGrid:not(#gridDashboardComponents) select,
body.dark .jqGrid:not(#gridDashboardComponents) textarea,
body.dark .jqGrid:not(#gridDashboardComponents) button {
    background-color:var(--dark-bg-input-edit);
}
    body.dark .board .jqGridHolder .ui-state-default, body.dark .board .jqGridHolder .ui-widget-content .ui-state-default, body.dark .board .jqGridHolder .ui-widget-header .ui-state-default, body.dark .board div.frozen-bdiv, body.dark .jqGridHolder .ui-jqgrid-sdiv .ui-widget-content, body.dark .bubble, .pBubble {
    background-color: var(--east-bg);
    color: var(--txt-color);
}
body.dark .jqGridHolder #navigateDatePicker, body.dark .jqGridHolder tr.ui-jqgrid-labels th #navigateDatePicker input {
    background-color: var(--east-bg);
    color: var(--dark-bg-txt);
}
body.dark #gridTimesheets .jqGridHolder .ui-jqgrid.ui-widget {
    background-color: var(--east-bg);
    color: var(--dark-bg-txt);
}
body.dark .ui-layout-east > .ui-layout-content > * .jqGridHolder .ui-pg-table .ui-pg-button span,
body.dark .ui-layout-west > .ui-layout-content > * .jqGridHolder .ui-pg-table .ui-pg-button span,
body.dark .ui-dialog .jqGridHolder .ui-pg-table .ui-pg-button span,
body.dark .tooltipster-base .jqGridHolder .ui-pg-table .ui-pg-button span,
body.dark .ui-tooltip .jqGridHolder .ui-pg-table .ui-pg-button span {
    background: #464646 !important;
    color: var(--dark-bg-txt) !important;
    border: 0px !important;
}
body.dark #dashboardPlanning .dayWrapper, body.dark #dashboardPlanning .day, body.dark .sectionWrapper,
body.dark .sectionIssues, body.dark .sectionLeads, body.dark .sectionQuotes {
    border-bottom: solid 1px var(--bg-border);
}
body.dark .sectionLeads {
    border: solid 1px var(--bg-border);
}
body.dark .boxStartStop, body.dark #toolbar .ui-button {
    border: solid 1px var(--bg-border);
}
body.dark .boxMyDashboard {
    border: solid 1px var(--dark-bg);
}

body.dark .btnAction, body.dark .btnCancel {
    border: 1px solid #505050 !important;
}
body.dark .jqGridHolder tr.jqfoot[jqfootlevel="0"] td {
  
    color: var(--dark-bg-txt);
}
body.dark .time-selected {
    color: var(--dark-bg) !important;
}
body.dark #ResourceCVTab .sticky, body.dark #ResourceCVTab .note .body, body.dark #ResourceCVTab .note {
    background-color: var(--dark-bg);
}
    body.dark #ResourceCVTab .sticky .name {
        color: var(--dark-bg-txt) !important;
    }


body.dark .ui-layout-content > #navigateDatePicker input {
    background-color: var(--bg) !important;
}
body.dark #gridPlanningsContainer #gridPlanningDayScheduleGrid_frozen > tbody > tr.jqgrow td[aria-describedby="gridPlanningDayScheduleGrid_Name"] > div > div,
body.dark .jqGridHolder .frozen-bdiv,
body.dark .ui-jqgrid-hdiv.frozen-div {
    background-color: var(--east-bg) !important;
}
body.dark .ui-jqgrid td.jqgrid-rownum {
    background-color: var(--dark-bg) !important;
}
/*gantt*/
body.dark .x-toolbar-default, body.dark .x-grid-scrollbar-clipper > .x-grid-view, .x-grid-scrollbar-clipper > .x-tree-view {
    background-color: var(--dark-bg) !important;
}
body.dark .ui-dialog .ui-dialog-buttonpane button {
    border: 1px solid #505050;
    color: var(--dark-bg-txt);
}
body.dark #personInfoTag, #personInfoTagReadOnly {
    border-bottom: 1px solid var(--bg-border-light) !important;
}

/*board*/
body.dark .board .frozen-div.ui-state-default.ui-jqgrid-hdiv {
    border-right: 1px solid var(--bg-border) !important;
}
/*end board*/

body.dark .jqGridHolder .ui-jqgrid .loading{
    color: var(--bg) !important;
}
body.dark .ui-layout-resizer {
    background: var(--bg-border);
}
body.dark .ui-datepicker-current-day, body.dark .ui-datepicker-current-day a {
    color: var(--bg) !important;
}
g:not(.highcharts-data-label-color-undefined) > * > tspan, .highcharts-title > tspan, .highcharts-axis-labels > text{
    color: var(--txt-color) !important;
    fill: var(--txt-color) !important;
    font: var(--font) !important;
    stroke:none;
}
g.highcharts-data-label-color-undefined > * > tspan{
    font: var(--font) !important;
}
g.highcharts-data-label-color-undefined{
    text-shadow: none !important;
}

body.dark .jqGridHolder .jqgrow.ui-state-hover .selection, body.dark .ui-jqgrid tr.jqgrow td.selection:hover, body.dark .jqGridHolder .jqgrow.ui-state-highlight .selection {
    color: #d0fe90;
}
body.dark .icon-add-timeline:before{
    color: var(--txt-color);
}
body.dark input[data-checkbox="true"][type="checkbox"]:checked + label:before{
    color: var(--green) !important;
}
body.dark .ui-accordion-content:has(form.ionbizdetails.editMode) form.ionbizdetails.editMode{
    box-shadow: none !important;
}
body.dark .detailInput:has(> .icon-warning_1:only-child){
    color: black;
}
body.dark .rememberMe, body.dark .forgotPass {
    color: var(--menu-hover);
}
body.dark {
    --ion-sb-thumb: color-mix(in srgb, var(--bg-border-light) 50%, transparent);
    --ion-sb-thumb-hover: var(--bg-border-light);
}
/* END DARK THEME*/
#activeSubmenuContainer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
/* Native (non-webkit) scrollbars only.
   We intentionally do NOT define ::-webkit-scrollbar* rules: their mere
   presence forces Chromium onto the painted-scrollbar code path, which
   makes every hover over a scroll container hit the main thread.
   With only the standard `scrollbar-*` properties, Chromium 121+ uses
   the native scrollbar path and handles property changes on the compositor.
   Default state shows a subtle (half-strength) thumb; the `:hover` rule
   brings it to full strength.
   Full-width scrollbars everywhere except selects (datepicker selects
   keep their own thin rule in Index.css). */
:root {
    --ion-sb-thumb: color-mix(in srgb, var(--shaddow) 50%, transparent);
    --ion-sb-thumb-hover: var(--shaddow);
}
/* The universal subject is load-bearing: `scrollbar-color` is inherited and the whole
   ancestor chain up to <html> is always hovered, so this direct match on every element
   is what stops the hover colour below from leaking down into every scrollbar. */
* {
    scrollbar-color: var(--ion-sb-thumb) transparent;
}
/* Keyed to real scroll containers instead of `*:hover`, and spelled out as a plain
   comma-separated list rather than `:is(...)`. Blink indexes each comma-separated
   selector under its own rightmost class, but a heterogeneous `:is()` has no single
   bucket key, so it falls into the universal bucket and is tested against every
   element on the page -- measured at 117ms over 301,363 attempts for 102 matches,
   far worse than the `*:hover` rule it replaced. This form costs nothing measurable.
   Over-inclusion is harmless -- a listed element with no overflow simply has no
   scrollbar to colour -- and a container missing from the list only loses its hover
   emphasis, so prefer adding to it freely. Regenerate with:
     [...document.getElementsByTagName('*')].filter(e => /^(auto|scroll|overlay)$/
       .test(getComputedStyle(e).overflowY + getComputedStyle(e).overflowX)) */
/* jQuery UI + layout */
.ui-layout-content:hover, .ui-layout-pane:hover, .ui-dialog-content:hover,
.ui-accordion-content:hover, .ui-autocomplete:hover, .ui-menu:hover,
.ui-sortable:hover, .ui-tabs-panel:hover,
/* jqGrid */
.ui-jqgrid-bdiv:hover, .ui-jqgrid-hdiv:hover, .FormGrid:hover,
/* shell + navigation */
.psp-body:hover, .mob-drawer-nav:hover, .twr-badges:hover, #view-shortcuts:hover,
/* ribbon filter */
.ribbon-dd-scroll:hover, .ribbon-dd-list:hover, .ribbon-col-dropdown:hover,
.ribbon-col-list:hover, .ribbon-sf-popup-body:hover, .rce-select-opts:hover,
/* notes + editor */
.noteList:hover, .noteAiDialog:hover, .noteAiBody--rendered:hover, .addNoteBox:hover,
.replyToBox:hover, .ion-recents-body:hover, .ion-emoji-search:hover,
.ionbiztinymce:hover, .mce-edit-focus:hover,
/* dashboards + boards */
.boxMyDashboard:hover, .dashboardCell:hover, .kanban:hover, .bodyLeft:hover,
.bodyRight:hover,
/* legacy layouts */
.tableBodyScroll:hover, .scrollTableBody:hover, .modalContent:hover,
.tabHolderFull:hover, .schedule-table:hover, .inlineEditControl:hover,
.inlineEditLabel:hover, .inlineEditCostSheetControl:hover,
.inlineEditInvoiceControl:hover, .inlineEditCommentModal:hover, .l_detailColumn:hover,
.timesheetCellsRightSide:hover, .reportFilterCriteria:hover,
#detailSection:hover, #memoBox:hover, #taskMemoBox:hover, #yearViewControl:hover,
#timesheetMatrix:hover, #timsheetLinesDetailDiv:hover, #modalWindow:hover,
#loginActivity:hover, #contactDetailForm:hover,
/* misc */
.tooltipster-content:hover, .timepickr-wheel:hover, textarea:hover, pre:hover {
    scrollbar-color: var(--ion-sb-thumb-hover) transparent;
}
select {
    scrollbar-width: thin;
}

@media print {
    table 
    {
        page-break-inside: auto;
    }

    tr {
        page-break-inside: avoid;
        page-break-before: auto;
    }
    
    body.printing {overflow: visible!important;}
    body.printing #gview_gridPlannings .frozen-bdiv {display: block!important;}    
    body.printing #workspace:not(.activePrintingHolder),
    body.printing #northLayout, body.printing #northLayout *, body.printing .btnResizeEast, body.printing .btnCloseWest, body.printing #centerHeader, 
     body.printing .ui-layout-resizer, 
    body.printing .gridMenu, body.printing .tabsHolder, body.printing .ui-accordion-header, body.printing .ui-accordion-content:not(.activePrintingHolder),
    body.printing .reportFilterCriteria,
    body.printing .ui-layout-pane:not(.activePrintingHolder),
    body.printing .ui-layout-pane .jqGridHolder:not(.activePrintingHolder), 
    body.printing .frozen-bdiv, body.printing .frozen-div, 
    body.printing .actionFooterPlacer, 
    body.printing .ui-dialog-titlebar, body.printing .ui-dialog-buttonpane, body.printing .ui-widget-overlay { display:none!important; } 
    
    body.printing #centerLayout.activePrintingHolder { top: 0px!important;bottom: auto!important;}
    body.printing .ui-layout-content > * .ui-jqgrid-hdiv { background-color:#E3E3E3;}
    body.printing .activePrintingHolder  { width: 100%!important; height: auto!important;box-sizing: border-box!important;overflow: visible!important;}
    body.printing .ui-dialog.activePrintingHolder {  width: 100%!important; height: auto!important;position: relative!important;float:left;left: 0px!important;top: 0px!important;background-image: none!important;box-shadow: none!important;}
    body.printing #eastPane.activePrintingHolder .layoutBtns {
        display: none;
    }
    body.printing .activePrintingHolder > #navigateDatePicker {
        display: none;
    }
    .tooltipster-ionBIZ, #mainMenu, #logo, #myPic, #myMenu, #gridToolbar, .btnCloseWest,
    .topbar-pill-slot, .mob-topbar { display: none !important;}
    /*page specific */
    /* Planning */

}

@page {
    size: auto;
    layout: landscape;
    page-break-after:always;    
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display:block
}

input, select, textarea {
    float: left;
    font: var(--font);
    font-size: 0.8rem;
    box-sizing: border-box;
    border-radius: var(--border-radius-xs);
    border: solid 1px var(--bg-border);
    color: var(--txt-color);
    text-indent: 5px;
    accent-color: var(--menu-hover);

}

    input:not(.datepicker.navigateDatePicker,input[name="SaveFilterDetail.Name"],.ribbon-filter-input,.mce-textbox,[readonly]):focus-visible, select:not([readonly]):focus-visible,select:not([readonly]):open, textarea:not([readonly]):focus-visible {
        outline-color: var(--input-focus);
        outline-width: thin;
        outline-style: solid;
        /* Inset so the ring lands exactly where the 1px border was; any margin here
           would shift the field sideways the moment it takes focus. */
        border: 1px solid transparent !important;
        outline-offset: -1px;
        box-shadow:none !important;
    }
    select:open,select:focus-visible{
        border-radius:var(--border-radius-xs) !important;
    }
    img {
        border: 0px;
        margin: 0px;
        padding: 0px;
        cursor: pointer;
    }

a {
    text-decoration: none;
    color: var(--txt-color);
    outline: none;
    font-size: 0.8rem;
}

a:hover {
    color: var(--txt-color);
}
.ionbiztinymce a,
.mce-content-body a,
.note .body a,
.note .comment .commentBody a {
    color: #2f6af9;
    color: var(--blue);
}

[ionbiz-type="copy-clipboard"] { margin-right:4px;  }
[ionbiz-type="copy-clipboard"]:before { font-family: 'ionbiz'; content: "\e62d"; }

#pageContent {
    float: left;
    width: 100%;
	box-sizing: border-box;
}

#workspace .ui-layout-west:not(.activePrintingHolder) {
    background:var(--bg);
    /*inset: 63px auto 0px 0px !important;*/
}
#workspace #eastPane:not(.activePrintingHolder) {
    background: var(--bg);
}
#workspace #centerLayout:not(.activePrintingHolder) {
    /*inset: 63px auto auto auto !important;*/
}

#workspace > .ui-layout-center > .ui-layout-content {
    padding: 0 6px 0px 6px !important;
    margin-bottom: 6px;
}

#workspace > #westLayout .ui-layout-content {
    padding: 0px;
    margin-bottom: 4px;
    box-sizing: border-box;
    border-radius: 0px 0px 0px 4px;
    /*border-right: 1px solid #ccc;*/
    
}

#workspace > .ui-layout-east > .ui-layout-content .ui-tabs-panel .gridMenu + .jqGridHolder {
    height: calc(100% - 39px);
    width: calc(100%);
    border: none;
    border-top: 1px solid var(--bg-border-light);
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}
#workspace > .ui-layout-east > .ui-layout-content .ui-tabs-panel .gridMenu + .jqGridHolder .ui-jqgrid-hdiv{
    border-radius: 0px;
}

#workspace > .ui-layout-east > .ui-layout-content .reportDataHolder .jqGridHolder {
    height: calc(100% - 40px);
}

#workspace > .ui-layout-east > .ui-layout-content #detailsContainer *:not(.reportFlexHolder) > .reportDataHolder .jqGridHolder {
    height: 100%;
}

#workspace > .ui-layout-east > .ui-layout-content > form:first-child, #workspace > .ui-layout-east > .ui-layout-content > #detailsContainer:first-child   { width: inherit;height: inherit;}
#workspace .ui-layout-center > .ui-layout-content > .ui-layout-center > .ui-layout-content { padding: 0px 0px 2px 0px!important;overflow: hidden;}
#workspace .ui-layout-center > .ui-layout-content > .ui-layout-south > .ui-layout-content { padding: 2px 0px 0px 0px!important;overflow: hidden;}
#workspace .ui-layout-center > .ui-layout-content {
   
   
}
.page_features #workspace .ui-layout-center > .ui-layout-content {
    overflow: auto !important;
}
.ui-layout-resizer-south { height: 4px!important;}
.ui-layout-resizer-east {
    width: var(--resizer-width, 2px) !important;    
}
body.classic .ui-layout-resizer-east {
    width: 3px !important;    
}
.ui-layout-resizer-east-open {
    border: none;
    background-color: var(--bg-border-light);
}
.ui-layout-resizer-east-open:hover {
        background-color: var(--menu-hover) !important;
}

.layoutBtns {
    position: absolute;
    top: 18px;
    width: 81px;
    z-index: 1;
    right: 0px;
    display: flex;
    flex-direction: row-reverse;
}

.leftHolder {
    float: left;
    width: 40%;
}

.rightHolder {
    float: left;
    width: 60%;
    padding: 0px 20px 0px 0px;
	box-sizing: border-box;        
}

::placeholder { font-style:normal;font-weight:normal;opacity: 0.9;}
::-ms-input-placeholder {
    font-style: normal;
    font-weight: normal;
    opacity: 0.9;
}

.mL3 { margin-left: 3px;}
.mL10 { margin-left: 10px;}
.mL18 { margin-left: 18px;}
.mL15 { margin-left: 15px;}
.mL20 { margin-left: 20px;}
.mL25 {margin-left: 25px;}
.mL30 { margin-left: 30px;}
.mL35 { margin-left: 35px}
.mL40 { margin-left: 40px;}
.mR40 { margin-right: 40px !important;}
.mT0 { margin-top: 0px !important;}
.minWidthAuto { min-width: auto !important;}
.minWidth180 { min-width: 180px !important;}
.minWidth250 { min-width: 250px !important;}
.minWidth120 { min-width: 120px !important;}
.dfCenter {display:flex; justify-content:center;}
.w60 {
    width: 60px !important;
    min-width: 60px !important;
    position:relative;
}
.w80 {
    width: 80px !important;
    min-width: 80px !important;
}
.w100 {
    width: 100px !important;
    min-width: 100px !important;
}
.h100 { height: 100px !important;}
.w90 {
    width: 90px !important;
    min-width: 90px !important;
}
.w120 {
    width: 120px !important;
    min-width: 120px !important;
}
.w20 { width: 20px !important;min-width: 20px !important;}
.w0 { width: 0px !important;}
.dB { display: block;}
.pdT3{ padding-top: 3px;}
.pdT6{ padding-top: 6px;}
.w20Percent{ width: 20%;}
.w100Percent{ width: 100%!important;}
.h100Percent{ height: 100%!important;}
.hAuto{ height: auto!important;}
.w60Percent{ width: 60%!important;}
.w80Percent{ width: 80%!important;}
.w35Percent{ width: 35%!important;}
.maxWidth150, .maxWidth150 + span{ max-width: 150px!important;}
.maxHeight40Em { max-height: 40em; }
.collapse { visibility: collapse;}
form.editMode a.disabledOnEdit      
{
    font-style: italic;
    pointer-events: none;
    color: #666666;
    font-weight: normal;
}

/*******************************************************
    [1] Header + Menu
********************************************************/
header {
    width: 100%;
    /*height: 70px;*/
    font-size: 0.7rem;
    background-color: var(--header-bg);
}

header.ui-layout-pane {
    border: 0px;
    overflow: hidden;
}

#logo {
    float: left;
    /*width: 124px;
    height: 42px;
        */
    margin: 4px 0px 0px 5px;
    position: absolute;
    z-index: 1;
}
    #logo:hover {
        background: var(--bg);
        border-radius: var(--border-radius-sm);
    }

/*#logo img { height: 50px; }*/

#mainMenu {
    width: 100%;
    height: 64px;
    padding: 2px 250px 5px 155px;
    position: absolute;
    left: 0px;
    top: 0px;
    box-sizing: border-box;
    border-bottom: 1px solid var(--bg-border-light);
}


div.scrollingHotSpotLeft:before, div.scrollingHotSpotRight:before {
    font-family: "ionbiz";
    font-size: 10px;
    font-weight: normal;
    content: "\e64d";
    color: var(--txt-color);
    line-height: inherit;
    width: 14px;
    float: left;
    text-align: center;
}
div.scrollingHotSpotLeft:before{ transform: rotate(180deg);}
.gridMenu div.scrollingHotSpotLeft:before, .gridMenu div.scrollingHotSpotRight:before{
    border-left: 1px solid var(--bg-border-light);
}
.ui-layout-content .gridMenu div.scrollingHotSpotLeft:before, .ui-layout-content .gridMenu div.scrollingHotSpotRight:before {
    box-shadow: none;
    border-left: 1px solid var(--bg-border-light);
}
#innerMainMenu div.scrollingHotSpotLeft:before, #innerMainMenu div.scrollingHotSpotRight:before, 
#innerMainMenu div.scrollingHotSpotLeft:before, #innerMainMenu div.scrollingHotSpotRight:before {line-height: 51px;}

#mainTabs div.scrollingHotSpotLeft:before, #mainTabs div.scrollingHotSpotRight:before {
    color:var(--txt-color);
    line-height: 30px !important;
    border-left: 1px solid var(--bg-border-light);
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

#mainTabs div.scrollingHotSpotLeft, #mainTabs div.scrollingHotSpotRight {
    opacity: 1;
}
.ui-tabs-panel div.scrollingHotSpotLeft:before, .ui-tabs-panel div.scrollingHotSpotRight:before {
    line-height: 20px !important;
}

#mainMenu a 
{
    float: left;
    text-align: center;
    color: var(--icon-bg);
    font-weight:500;
}

    #mainMenu a:before {
        font-family: "ionbiz";
        font-weight: normal;
        font-size: 24px;
        color: var(--icon-bg);
        position: absolute;
        top: 0;
        width: 95px;
        left: 0px;
    }

    #mainMenu a:focus:before, #mainMenu a:hover, #mainMenu a:hover:before, #mainMenu .contentBox.active a:before, #mainMenu a:hover:after, #mainMenu .contentBox.active a:after, #mainMenu .contentBox.activeSubmenu a:after, #mainMenu .contentBox.activeSubmenu a:before {
        color: var(--menu-hover);
    }

#btnMySubMenu span, .btnSubMenu span,
.btnHome, .btnResources, .btnRelations, .btnProcurements, .btnItems, .btnProjects, .btnPlanning, .btnTimesheets, .btnCosts, .btnLeaves, .btnInvoicing, .btnLogout,
.btnTimeRegistration, .btnQuotes, .btnIssues {
    cursor: pointer;
    font-size: 11px;
    font-weight: 500;
    margin-bottom: 8px;
    padding: 29px 0 4px;
    /*width: 104px;*/
}
.btnLogout { display: inline;}


    /*#mainMenu .active:after,
    #mainMenu .activeSubmenu:after {
        border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #1f2532;
        border-style: none solid solid;
        border-width: 0 9px 9px;
        content: "";
        display: inline-block;
        position: absolute;
        border-bottom: 0 none;
        border-top: 9px solid #1f2532;
        bottom: -12px;
        left: 44px;
        z-index: 2;
    }*/

#mainMenu .active, #mainMenu .activeSubmenu {
    background-clip: padding-box;
    visibility: visible;
    background: var(--menu-active);
    border-radius: var(--border-radius-sm);
    width: 110px !important;
}


#innerMainMenu {

    position: relative;

}

#mainMenu > .toolbarMenuShadow {
    box-shadow: 0px 0px 3px black inset;
    border-color: transparent;
    border-radius: var(--border-radius-sm);
    margin-left:5px;
    margin-right:5px;
    height:55px;
}
body.light #mainMenu > .toolbarMenuShadow {
    box-shadow: 0px 0px 2px #c5c4c4 inset;
    background: var(--bg) !important;
}

body.light .toolbarMenuShadow .scrollableArea .contentBox.activeSubmenu,
body.light .toolbarMenuShadow .scrollableArea .contentBox.active,
body.light .toolbarMenuShadow .scrollableArea .contentBox:hover,
body.light #innerMainMenu > .contentBox:hover{
    box-shadow: none;
    /*background: var(--east-bg) !important;*/
}

div.scrollingHotSpotLeft {
    float: left;
    height: 100%;
    left: 0;
    position: relative;
    width: 14px;
    z-index: 0;
    border-radius: var(--border-radius-sm) 0px 0px 8px;
    opacity: 1;
    background-color: transparent;
}

div.scrollingHotSpotRight {
    background-color:transparent;
    height: 100%;
    width: 14px;
    position: relative;
    right: 0;
    z-index: 0;
    float: right;
    border-radius:0px 8px 8px 0px;
    opacity: 1;
}

.gridMenu:hover div.scrollingHotSpotLeft:before, .gridMenu:hover div.scrollingHotSpotRight:before, 
#mainTabs:hover div.scrollingHotSpotLeft:before, #mainTabs:hover div.scrollingHotSpotRight:before { color: var(--menu-hover)!important; }

#innerMainMenu div.scrollingHotSpotLeft, #innerMainMenu div.scrollingHotSpotRight {
    background-color: black;
}
body.light #innerMainMenu div.scrollingHotSpotRight, body.light #innerMainMenu div.scrollingHotSpotLeft {
    background-color: #ececec;
    
}

#innerMainMenu .contentBox {
    width: 90px;
    position: relative;
    float: left;
    display: block;
    padding: 5px;
    margin-right:3px;
    margin-top: 2px;
    margin-bottom: 2px;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}
    #innerMainMenu .contentBox:hover {
        background: var(--menu-active);
        border-radius: var(--border-radius-sm);
    }

    .gridMenu .scrollableArea > a {
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -o-user-select: none;
        user-select: none;
    }

#mainMenu div.scrollableArea .contentBox > a:first-of-type, #mainMenu #innerMainMenu > .contentBox > a:first-of-type  
{
    position: relative;
    display: block;
	float: left;
    width: calc(100% - 21px);
    white-space: nowrap;
}

    #mainMenu div.scrollableArea .contentBox > a:first-of-type:after, #mainMenu #innerMainMenu > .contentBox > a:first-of-type:after,
    #mainMenu #innerMainMenu > .more-menu > .dropdown-links > .contentBox > a:first-of-type:after{
        content: attr(data-text);
        white-space: nowrap;
        width: 95px;
        position: absolute;
        left: 0px;
        overflow: hidden;
        text-overflow: ellipsis;
    }
#mainMenu div.scrollableArea .contentBox.activeSubmenu > a:first-of-type:after,
#mainMenu #innerMainMenu > .contentBox.activeSubmenu > a:first-of-type:after,
#mainMenu div.scrollableArea .contentBox.active > a:first-of-type:after,
#mainMenu #innerMainMenu > .contentBox.active > a:first-of-type:after{
    width: 110px !important;
}
#mainMenu .contentBox.activeSubmenu a:not(.btnSubMenu):before,
#mainMenu .contentBox.active a:not(.btnSubMenu):before,
#mainMenu #innerMainMenu > .more-menu > .dropdown-links > .contentBox.active > a:first-of-type:after,
#mainMenu #innerMainMenu > .more-menu > .dropdown-links > .contentBox.activeSubmenu > a:first-of-type:after{
    width: 110px !important;
}

.btnSubMenu {
    display: none;
}
.btnSubMenu:hover {
  background: var(--submenu-hover);
}

.scrollableArea {
   min-width: 100%;
}
.scrollableArea .contentBox > .btnSubMenu, #innerMainMenu > .contentBox > .btnSubMenu
{
    border-radius: 50%;
    padding: 0px !important;
    width: 21px !important;
    height: 21px !important;
    margin-top: 2px;    
    color: #FFFFFF;
    position: relative;
    display: none;
    float: left;
}
@media (hover: hover) {
    .contentBox:hover .btnSubMenu {
        display:inline-block !important;
    }
}
.contentBox.active .btnSubMenu, .contentBox.activeSubmenu .btnSubMenu{
    display:inline-block !important;
}

.btnSubMenu:before {
    font-family: "ionbiz";
    content: "\e672";
    color: black !important;
    position: absolute;
    top: 7px !important;
    text-indent: -5px !important;
    left: 9px !important;
    font-size: 10px !important;
    border-radius: 50%;
    width: 8px !important;
    height: 8px !important;
    line-height: 9px;
}

.btnSubMenu:hover:before {  color: #192d5c!important; }

#innerMainMenu .contentBox .txt {
	font-size: 0.7rem;
}

.scrollWrapper {
    /*height: 135%;*/
    overflow: hidden;
    position: relative;
    margin: 0px;
    /*padding-bottom: 13px;
    padding:3px;*/
    
}

#pageTitle {
    float: left;
    clear: both;
    width: 100%;
    text-indent: 20px;
    /* padding: 3px 0px;
    text-transform: uppercase;
    margin-top: 5px;*/
    position: absolute;
    bottom: 0px;
}

#myMenuWrapper {
    position: relative;
}

#myMenu {
    position: absolute;
    width: auto;
    /*height: 70px;*/
    margin-right: 10px;
    top: 5px;
    right: 0px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* align-content: center; */
    flex-wrap: nowrap;
    flex-direction: row;
}

    #myMenu .myPic {
        float: left;
        width: 40px;
        height: 40px;
        background-size: cover;
        border-radius: 50%;
        box-shadow: 0px 0px 2px var(--txt-color) inset;
        background-repeat: no-repeat;
        background-position: center;
        margin: 8px;
        position: relative;
        cursor: pointer;
        display: inline;
        box-sizing: border-box;
        background-color: var(--bg);
    }
    #myMenu .txt {
        
        width: 0px;
        /*padding: 0px 10px 0px 0px;
        margin: 15px 0 0 5px;
        color: #C4C3C1;*/
        overflow: hidden;
        position: fixed;
        top:50px;
        right:10px;
        display: block;
    }

    #myMenu .txtName {
        float: left;
        clear: both;
        width: 85%;
        color: #000000;
        font-size: 12px;
        font-weight: bolder;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden !important;
    }
#btnMyStatus {
    border: 2px solid #9B9692;
    border-radius: 50%;
    float: left;
    height: 11px;
    left: 18px;
    position: absolute;
    top: 15px;
    width: 11px;
    left: 34px;
}

#btnMyStatus span {
    background-color: #FF0000;
    border: 3px solid #FFFFFF;
    border-radius: 50%;
    float: left;
    height: 5px;
    width: 5px;
}

#btnMyStatus.on span {
    background-color: green;
}

#btnMySubMenu {
    /*position: absolute;
    right: 50px;*/
    top: 25px;
    display: inline;
}    

.subMenuBubble:before {
    border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #FFFFFF rgba(0, 0, 0, 0);
    border-style: solid;
    border-width: 11px;
    content: "";
    display: inline-block;
    left: 12px;
    position: absolute;
    top: -22px;
}

.subMenuBubble.ui-tooltip {
    width: 490px !important;
    padding: 1px !important;
    color: #666666;
    background-color: var(--bg) !important;
    border-color: #FFFFFF !important;
    border-radius: 3px !important;
    opacity: 1 !important;
    box-shadow: 1px 3px 3px rgba(205, 205, 205, 0.6), 0px 3px 4px  rgba(205, 205, 205, 0.6), -3px 3px 4px  rgba(205, 205, 205, 0.6), 3px 3px 4px  rgba(205, 205, 205, 0.6) !important;
    z-index: 9999;
}

.subMenuBubble.ui-tooltip .ui-tooltip-content 
{
    padding: 20px;
    background-color: #ececec !important;
    background: -webkit-linear-gradient(#FFFFFF, #F0F0F0) !important; /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#FFFFFF, #F0F0F0) !important; /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#FFFFFF, #F0F0F0) !important; /* For Firefox 3.6 to 15 */
    background: linear-gradient(#FFFFFF, #F0F0F0) !important; /* Standard syntax */
	box-sizing: border-box;
}

.btnSubmenuClose {float: right;}

#sortable.ui-sortable {
    list-style-type: none;
    margin: 20px 0px 5px 0px;
    padding: 0px;
    text-indent: 30px;
    vertical-align: middle;
    overflow:auto;
    max-height: 26rem;
    line-height: 24px;
    background: var(--bg);
    border-radius: var(--border-radius-sm);
    border: 1px solid var(--bg-border-light);
}

    #sortable.ui-sortable li {
        cursor: move;
        min-height: 30px;
        margin-top: -1px;
        display: flex;
        line-height: 30px;
        border-radius: var(--border-radius-xs);
        padding-left: 3px;
        background-repeat: no-repeat;
        background-position: left center;
        background-size: 2px 0%;
        transition: background 0.1s;
        overflow:auto;

    }

#sortable.ui-sortable li:hover, .ui-selectable .ui-selectee:hover  {
    background-color: var(--hover);
    background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
    background-size: 2px 50%;
    background-repeat: no-repeat;
    background-position: left center;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
#sortable.ui-sortable li:hover label:before{
    background-color: var(--hover);
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
    #sortable.ui-sortable label {
        white-space: nowrap;
        float: left;
        display: inline-flex;
        line-height: 30px;
        align-items: center;
        width: calc(100% - 50px);
        overflow:hidden;
        text-overflow:ellipsis;
    }

#sortable.ui-sortable input[data-checkbox="true"][type="checkbox"] + label:before {
    margin: 0px 10px;
}

.ionbizdetails .manageChk ~ .toolbarContainerTextEditor, .ionbizdetails .manageChk ~ .ionbiztinymce, ionbizdetails .manageChk ~ .mce-tinymce { margin-left: 28px!important;}


.savedFilters {
    float: right;
    width: 180px;
    height: inherit;
    overflow: hidden;
    background: var(--east-bg);
    border-radius: var(--border-radius-sm);
    padding: 5px;
    margin-right:5px;
}
.savedFilters :not(#gridPlanningsContainer) > .jqGridHolder .ui-jqgrid.ui-widget{
        margin: 0px !important;
}
#SaveFilterDetail_Name, input[name="SaveFilterDetail.Name"] {
    width: 100% !important;
    height:30px;
    margin-top: 5px;
    font-size: smaller;
    background-color: var(--bg) !important;
    color: var(--txt-color) !important;
    border-radius: var(--border-radius-l);
    text-indent: 10px;
    border: 1px solid var(--bg-border) !important;
    outline: none;
}
.detailRow:has(#SaveFilterDetail_Name){
    border-left: none !important;
    margin: 0px !important;
}
.savedFilters .detailRow { min-width: 100%;
}
.savedFilters table { min-width: 100% !important}
.savedFilters .ui-jqgrid tr.jqgrow td {
    text-overflow:ellipsis;
}
.savedFilters .ui-jqgrid-bdiv tr {
    border-bottom-color: transparent !important;
}
    .savedFilters .detailLabel, .savedFilters .ui-jqgrid tr.jqgrow td a {
        font-size: 10px !important;
    }
   .ribbon-sf-popup-body .savedFilters .ui-jqgrid tr.jqgrow td a{
       font-size: 12px !important;
       font-weight:600;
   }
.minicolors-swatch {
    position: relative !important;
    display: block !important;
}
.savedFilters .detailRow .detailInput {
    width: 30%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    background: transparent;
}
.savedFilters .detailRow .detailInput .minicolors-input { border: 1px solid transparent !important; background: transparent; width: 21px !important; margin-right: 1px;padding:3px;}
.savedFilters .detailRow .detailInput .minicolors-input-swatch {
        top: 5px !important;
        width: 18px !important;
        height: 18px !important;
        left: 9px !important;
    }
.savedFilters .detailRow .detailLabel { min-width: 70%!important;padding-left:0px !important; }
.savedFilters .pickerRange { margin-left: -139px; position: fixed;}

#savedFiltersReportForm .savedFilters {border-left: none; padding-left: 0;float: none;}

#savedFiltersGridWest{
    width: 100% !important;
    border-collapse: separate;
    border-spacing: 0 4px;
}
#savedFiltersGridWest tr {
    transition: background-color .15s ease;
}
#savedFiltersGridWest tr:focus-visible {
    outline: 2px solid var(--menu-hover);
    outline-offset: -2px;
}
@media (prefers-reduced-motion: reduce) {
    #savedFiltersGridWest tr { transition: none; }
}
    #savedFiltersGridWest .number {
        padding: 1px 6px;
        border: solid 1px transparent;

        text-indent: 0 !important;
        background: var(--bg);
        color: var(--txt-color);
        border-radius: var(--border-radius-xl);
        border-top-right-radius: var(--border-radius-xs);
        border-bottom-right-radius: var(--border-radius-xs);
        font-variant-numeric: tabular-nums;
        font-size: 14px;
        line-height: 1.2;
        text-align: center;
        margin-left: 5px;
        min-width: 40px;
        flex: 0 0 auto;
        align-self: center;
    }
    #savedFiltersGridWest .savedFilterCell{
        margin-left: -2px;
    }
#savedFiltersGridWest .savedFilterCell .text {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
    margin-left: 5px;
}
#savedFiltersGridWest tr.ui-state-highlight .number {
    background: var(--bg);
    color: var(--txt-color) !important;
}
#savedFiltersGridWest tr.ui-state-highlight .savedFilterCell >div:before {
    color: var(--menu-hover) !important;
    opacity: 1 !important;
}
#westLayout .jqGridHolder .ui-jqgrid.ui-widget {
    margin: 0px !important;
}
/* `> #gbox_…` on purpose: jqGrid always wraps the grid in #gbox_<id> as the holder's direct
   child, so this checks one child instead of walking the whole grid subtree to prove absence. */
#westLayout .jqGridHolder:not(:has(> #gbox_savedFiltersGridWest)) { scrollbar-gutter: stable; }
#westLayout .jqGridHolder .ui-jqgrid-bdiv {
    scroll-behavior: smooth;
    overscroll-behavior: contain;
}
.savedFilterCell {
        padding: 0px;
        width: 100%;
        cursor: pointer;
        margin-left: -5px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        padding-top:5px;
        padding-bottom:5px;
}
.savedFilterCell > div:before {opacity: 0.2;}

.savedFilterCell > .icon-check_mark:not(.title),
.savedFilterCell > .icon-share:not(.title) {
    display: none;
}
.savedFilterCell > .icon-check_mark + .number::before {
    content: "\e601";
    font-family: 'ionbiz' !important;
    margin-right: 3px;
    margin-left: -2px;
    font-size: 11px;
}
.savedFilterCell > .icon-share + .number::before {
    content: "\e92a";
    font-family: 'ionbiz' !important;
    margin-right: 3px;
    margin-left: -2px;
    font-size: 11px;
}

.savedFilterCell .number {
    font-size: 16px;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    /* Border is always derived from --cell-color (set inline per saved-filter color, see
       formatChooseSavedFilterWest/Home). Falls back to transparent so the rule is harmless
       when no color is provided. !important ensures it overrides any inline border-color
       still emitted by legacy/non-CSS-color branches. */
    border-color: color-mix(in srgb, var(--cell-color, transparent), var(--bg) 80%) !important;
}

.savedFilterCell .text, .savedFilterCell .title {
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    width: inherit;
    padding-top: 5px;
    padding-bottom: 5px;
    font-weight:500;
}

.savedFilterCell .title {
    text-transform: uppercase;
    padding: 5px 0px 5px 0;
}

    .savedFilterCell .title:before {
        font-size: 12px;
        position: absolute;
        left: 0;
        margin-right: 5px;
    }

.savedFilterCell .text, .savedFilterCell .title, .savedFilterCell:hover:before, tr.ui-state-highlight .savedFilterCell > div:before {
    color: var(--txt-color);
}
#savedFiltersGridWest tr.ui-state-highlight {
    background: color-mix(in srgb, var(--menu-hover) 14%, transparent);
    box-shadow: inset 3px 0 0 var(--bg-border);
}
#savedFiltersGridWest tr.ui-state-highlight td, #savedFiltersGridWest tr.ui-state-hover td {
        border-radius:var(--border-radius-xs);
}  
tr.ui-state-highlight .savedFilterCell .text{
	font-weight:700;
}

.resetUserPreferenceHolder .detailRow
{
    min-width: 100px;
    width: 117px;
    margin-bottom: 10px;
    clear: none;
}

.resetUserPreferenceHolder .detailRow .detailInput { width: 20px; }

.resetUserPreferenceHolder .detailRow .detailLabel
{
    text-align: left;
    padding-left: 9px;
    font-size: 12px;
    line-height: 13px;
}

.resetUserPreferenceHolder .checkboxesHolder
{
    padding-left: 68px;
    text-align: center;
    height: 171px;
}

.resetUserPreferenceHolder .checkboxesHolder br
{
    clear: both;
}

.checkBoxLabel 
{
    padding-left: 25px;
    color: #999999;
    font-size: 12px;
}

.icons > select,
td.icons
 {
    font-family: ionbiz;
    font-size: 14px !important;
    color: #666666;
    padding-left: 4px;
}

/*******************************************************
    [2] Modal Details 
********************************************************/
[class*="icon-"].ui-dialog-titlebar:before {
    color: var(--txt-color);
    left: -10px;
    position: absolute;
    display:inline;
    top: 13px;
    z-index: 5;
    font-size: 15px;
}
.ui-dialog-titlebar:not([class*=" icon-"]):before{
    content:"\e93d";
    color: var(--txt-color);
    left: -10px;
    display:inline;
    position: absolute;
    top: 13px;
    z-index: 5;
    font-size: 15px;
    font-family: 'ionbiz' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.ionBizDialogDetails.ui-dialog-content .richTextEditorHolder {min-width: 624px; min-height: 120px;}
.ionBizDialogDetails.ui-dialog-content form.ionbizdetails:not(.editMode) .richTextEditorHolder {min-width: auto!important; min-height: auto!important;}
/*******************************************************
    [3] Color Picker
********************************************************/
.bgPicker {
    cursor: pointer;
    float: left;
    height: 22px;
    width: 22px;
    border-radius: 50%;
    border: 1px solid var(--bg-border-light);
    background: url("../Content/Themes/Blue/img/noBackground.png?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc");
    
}
.bgPicker:hover {
    text-decoration: none;
}

.pickerRange {position:absolute; margin-top:22px; width:168px; float:left; background-color:#fff; display:none; border:solid 1px #ccc;
              -moz-border-radius: 0px 5px 5px 5px; -webkit-border-radius: 0px 5px 5px 5px; border-radius: 0px 5px 5px 5px;z-index: 10;}
.pickerRange > a {float:left; margin:4px; text-decoration:none; width: 25px;height: 25px;border-radius: 4px;}
.pickerRange > a:hover{ opacity:1;}

 
/*******************************************************
    [4] Detail Layout
********************************************************/
.detailRow {
    position: relative;
    float: left;
    clear: both;
    width: calc(100% - 7px);
    margin: 2px;
    overflow: hidden;
    min-width: 300px;
    border-left: 2px solid transparent;
    align-items: center;
    border-radius:8px;
}
/* :hover must come BEFORE :not(:has(...)): Chromium tests a compound left to right, so this
   short-circuits on the cheap test and never runs the :has() unless the row is really hovered.
   Measured 101ms -> 1ms per 60 full recalcs on a 400-row form. Order carries no meaning in CSS. */
@media (hover: hover) {
   .detailRow:hover:not(:has( .detailRow, #SaveFilterDetail_Name, #AccessDuration, .leavesRotator, .lnkIconAdd, .itemData, input[name*="Recurr"], input[id^="chkScopeGroups"],.jqGridHolder)) .detailLabel {
        color:var(--menu-hover);
        opacity:1;
    }
}
   .detailRow:focus-within > .detailLabel{
        color:var(--menu-hover);
        opacity:1;
    }
.detailRow > .detailRow{
    margin-left: 0px;
    padding-left:0px;
    border-left:0px
}
.detailRow > .detailRow > .detailInput{
    margin-left: 3px;
}
/* a row nested as a field wrapper must not add its own margin/border offset */
.detailInput > .detailRow {
    margin: 0;
    border-left: 0;
}
.detailInput > .detailRow + .detailRow {
    margin-top: 4px;
}
.detailRow:hover:has(input[name*="Recurr"]){
    background: transparent !important;
}
.detailRow:hover:has(.itemData){
    background: color-mix(in srgb, var(--green) 50%, var(--bg)) !important;
}

    .detailMessage {
        font-size: 10px;
        text-indent: 2px;
        color: var(--txt-color);
        font-weight: 300;
        font-style: normal;
    }

.detailLabel {
    float: left;
    min-width: 47%;
    max-width: 47%;
    text-indent: 2px;
    color: var(--txt-color);
    font-size: 0.8rem;
    opacity: 0.8;
    min-height: 30px;
    line-height: 30px;
    display: flex;
    align-items: center;
    padding-top: 1px;
    padding-bottom: 1px;
    text-indent:3px;
    font-weight:400;
}

    .detailLabel a, .detailInput a {
        color: var(--menu-hover) !important;
        font-style: normal;
    }

a:hover {
    cursor: pointer;
}

.detailLabel a:hover, .detailInput a:hover {
    text-decoration: underline;
}

.detailInput span.attachments:empty ~ a.icon-trash, .detailInput span.attachments:empty ~ a.icon-download {
    display: none;
}

.detailInput span.attachments:not(:empty) ~ a.icon-upload,
.detailInput span.attachments:not(:empty) ~ a.icon-camera {
    display: none;
}

/* Camera capture is only useful on touch devices (mobile/tablet).
   Hide by default; reveal only when the primary input is touch (no hover, coarse pointer). */
a.icon-camera {
    display: none;
}

@media (pointer: coarse) {
    a.icon-camera {
        display: inline-block;
    }
}

.reportFilterCriteria .detailLabel {
    text-indent: 5px;
    color: var(--txt-color);
    overflow: hidden;
    padding: 4px 0px 0px 0px;
    margin: 0px;
    max-width: 85%;
    width: fit-content;
    word-wrap: break-word;
    white-space: nowrap;
    text-overflow: ellipsis;
    height: 30px;
    line-height: 30px;
}

.detailInput, .reportFilterCriteria .cell
 {
    float: left;
    width: 52%;
    font-weight: 500;
    font-size: 0.8rem;
    line-height: 33px;
    display: inline-block;
    text-indent: 2px;

}

.detailInput .bgPicker { margin-left:5px; }
.detailInput .twoElements60And40PercentWidth { width: 60%!important; }
.detailInput .twoElements60And40PercentWidth ~ .twoElements60And40PercentWidth { margin-left: 3px; width:calc(40% - 3px)!important; }
.detailInput .datepicker-inline > .twoElements60And40PercentWidth { margin-left: 3px; width:calc(100% - 3px)!important; }

.detailInput .threeElements40And30PercentWidth { width: 40% !important;}

.detailInput .threeElements40And30PercentWidth label{ font-weight : bold;  font-style :normal !important }
.detailInput .threeElements40And30PercentWidth ~ .threeElements40And30PercentWidth {margin-left: 3px;width: calc(20% - 3px) !important;}
.detailInput .threeElements40And30PercentWidth ~ .threeElements40And30PercentWidth ~ .threeElements40And30PercentWidth {margin-left: 15px;width: calc(40% - 15px) !important;}

.detailInput.fullWidthTextBox { width: 100%; }
.ionbizdetails.editMode .detailInput.fullWidthTextBox input:not([readonly]),
.ionbizdetails:not(.editMode) .detailInput.fullWidthTextBox input {
    height: 32px !important;
    line-height: 32px !important;
    font-weight: normal !important;
}

/* view mode */
.ionbizdetails:not(.editMode) .detailInput input, .ionbizdetails:not(.editMode) .detailInput select, .ionbizdetails:not(.editMode) .detailInput textarea, .richTextEditorHolder textarea {
    float: left;
    width: 100%;
    height: 30px;
    display: block;
    cursor: pointer;
    box-sizing: border-box;
    border-radius: var(--border-radius-xs);
    line-height: 30px !important;
    padding-left: 2px;
    text-indent:5px;
    min-height: 30px;
    color: var(--txt-color);
    font-style: normal;
    font-weight: 500;
    text-overflow: ellipsis;
    font-family: inherit;
    border: 1px dashed transparent;
    background-color: var(--input-bg);
    margin-top:1px;
}
.ionbizdetails:not(.editMode) .detailInput select{
    line-height: 22px !important;
}
/* ActionLinkFieldValuesFor renders the history link as the first child of .detailInput, so every
   control it affects follows it; same specificity as the :has() form, without its invalidation. */
.ionbizdetails:not(.editMode) .detailInput > a.icon-clock_3 ~ input, .ionbizdetails:not(.editMode) .detailInput > a.icon-clock_3 ~ * input,
.ionbizdetails:not(.editMode) .detailInput > a.icon-clock_3 ~ select, .ionbizdetails:not(.editMode) .detailInput > a.icon-clock_3 ~ * select{width: calc(100% - 1px);}
.ionbizdetails .detailInput input::placeholder  {font-weight: bold;font-style: inherit;color: var(--txt-color)!important;opacity: initial!important;}
.editMode input::placeholder { font-weight: normal!important;font-style: inherit;color: var(--txt-color)!important;opacity: initial!important;}
.bubbleDialogHolder input::placeholder { font-weight: inherit!important;}
.ionbizdetails:not(.editMode) .ionbiztinymce {
    border: 1px solid transparent;
    padding-left: 10px;
    visibility: visible !important;
    line-height: 1.5;
    background-color: var(--bg);
    border-radius:8px;
    width: calc(100% - 12px);
}
    .ionbizdetails:not(.editMode) .ionbiztinymce.mce-edit-focus:not(.tinymceNoToolbar) {
        border-top-left-radius: 0px;
    }
    .ionbizdetails .tinymceNoToolbar.managedCustomContainer {
        padding-top: 3px !important;
        width: calc(100% - 12px) !important;
    }
.detailInput .tinymceNoToolbar.managedCustomContainer {
        width: calc(100% - 10px) !important;
        border: solid 1px transparent;
        outline-color: var(--bg-border) !important;
        outline-style: solid;
        outline-width:thin;
        background: var(--input-bg);
    }
.ionbizdetails:not(.editMode) .detailInput .tinymceNoToolbar.managedCustomContainer {       
        outline: none;
}
.ionbizdetails:not(.editMode) .detailInput .tinymceNoToolbar.managedCustomContainer:hover {       
        outline-color: var(--bg-border) !important;
        outline-style: solid;
        outline-width:thin;
}
.ionbizdetails:not(.editMode) .detailInput input:not(:focus), .ionbizdetails:not(.editMode) .detailInput select:not(:focus),
.ionbizdetails:not(.editMode) .detailInput textarea:not(:focus) {
    background-image: none;
    resize: none;
    margin-left: 1px;
    margin-top: 1px;
    margin-bottom: 1px;
}

.ionbizdetails:not(.editMode) .detailInput textarea:not([readonly]):hover { /*.ionbizdetails:not(.editMode) .detailInput select:not([disabled]):hover, .ionbizdetails:not(.editMode) .detailInput input:not([readonly]):hover*/
    box-shadow: inset 0px 0px 1px 0px var(--txt-color);
    cursor:pointer;
    
}
.ionbizdetails:not(.editMode) .ionbiztinymce:not([readonly]):hover {
    cursor:pointer; 
}
@media (hover: hover) {
/* :where(:hover) first: a hovered child implies a hovered .detailInput, so :has() only runs on that one (no specificity change). */
.ionbizdetails:not(.editMode) .detailInput:where(:hover):has(input:not([readonly]):not(:focus, [type="checkbox"], [type="hidden"]):hover):after, .ionbizdetails:not(.editMode) .detailInput:where(:hover):has( select:not([disabled]):not(:focus):hover):after,
.ionbizdetails:not(.editMode) .detailInput:where(:hover):has( textarea:not([readonly]):not(:focus):hover):after {
        font-family: 'ionbiz' !important;
        content: "\e602";
        font-size: 12px;
        font-style: normal;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        display: table-cell;
        vertical-align: middle;
        right: 7px;
        position: absolute;
        z-index: 1;
        pointer-events: none;
        top: 0px;
        opacity: 0.8;
        line-height: 30px;
}
} /* end @media (hover: hover) */

.detailInput a { text-decoration: none;font-size: 0.8rem;font-weight: 600;text-indent:5px;}
.detailInput a:not(.filter-field,.icon-clock_3):first-child { float: left!important;}
.detailInput > span > span { text-indent:5px;float: left!important;}
.detailInput a:before { margin-left: 4px;font-size: 14px; }

.ionbiztinymce {
    color: var(--txt-color);
    font-weight: initial;
    font-style: initial;
    line-height: 1;
}

.mce-edit-focus, form.editMode .ionbiztinymce {
    min-height: 120px;
    height:100%;
    padding-left: 10px;
    padding-top: 10px;
    color: var(--txt-color);
    background: var(--bg);
    border-radius: var(--border-radius-md);
    border-top-left-radius:0px;
    outline: var(--bg-border-light) !important;
    outline-style: solid !important;
    outline-offset: -1px;
    outline-width: thin !important;
    width: calc(100% - 12px);
    margin-top: 1px;
    margin-bottom: 1px;
    
}
.mce-edit-focus.tinymceNoToolbar{
    padding-top: 3px !important;
}

.mce-edit-focus:not(.tinymceNoToolbar), form.editMode .ionbiztinymce:not(.tinymceNoToolbar) {
    max-height: 600px;
    overflow: auto;
}

div.mce-tinymce-inline {
    border-width: 0px!important;
}

.mce-pagebreak{ width: 99% !important;}

.toolbarContainerTextEditor .mce-container { border-bottom-width: 0px !important; background:var(--bg); border-radius:8px;}
.ionbiz-rich-text-editor.mce-tinymce,
.ionbiz-rich-text-editor .mce-edit-area {
    border-width: 0 !important;
    box-shadow: none;
}
.ionbiz-rich-text-editor .mce-container {
    border-bottom-width: 0 !important;
    background: var(--bg);
    border-radius: var(--border-radius-md);
}
/* Preserve single-line toolbar rows for iframe editors without changing content isolation. */
.mce-tinymce:not(.mce-tinymce-inline) .mce-toolbar > .mce-container-body.mce-flow-layout {
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
}
.mce-tinymce:not(.mce-tinymce-inline) .mce-toolbar > .mce-container-body.mce-flow-layout::-webkit-scrollbar {
    display: none;
}
/* end view mode */

/* edit mode */
.mce-btn button{
    background:var(--bg);
}
.mce-panel {
    background-color: var(--bg) !important;
}
.ionbizdetails.editMode .detailInput input.hasDatepicker:not(.navigateDatePicker), .ionbizdetails .detailInput input.hasDatepicker:not(.navigateDatePicker):focus,
.reportFilterCriteria input.hasDatepicker:not(.navigateDatePicker), .reportFilterCriteria input.hasDatepicker:not(.navigateDatePicker):focus,
.bubbleDialogHolder input.hasDatepicker:not(.navigateDatePicker), .bubbleDialogHolder input.hasDatepicker:not(.navigateDatePicker):focus {
    padding-right: 1px;
    background-repeat: no-repeat;
    background-color: var(--bg);
    text-indent: 0px;
    min-width:105px;
}
.detailInput:not(.detailInputFlex):has(.datepicker) {
    max-width: 232px;
}
/* value + "from" date per row: the 40% date slot is narrower than the date input's 105px minimum */
#updateMultipleResourcesForm .detailInput {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 6px;
    max-width: none;
}
#updateMultipleResourcesForm .detailInput > .twoElements60And40PercentWidth {
    flex: 1 1 0;
    min-width: 0;
    width: auto !important;
}
#updateMultipleResourcesForm .detailInput > .datepicker-inline {
    flex: 0 0 130px;
    margin-left: 0;
}
#updateMultipleResourcesForm .detailInput > .datepicker-inline > .datepicker {
    width: 100% !important;
    margin-left: 0;
}
#updateMultipleResourcesForm .detailInput > .field-validation-error {
    order: 1;
    flex-basis: 100%;
}
/* the dropdown chevron sits at the value input's right edge: row minus the 130px date and the 6px gap */
#updateMultipleResourcesForm .detailInput:has(> .ui-autocomplete-input)::after {
    left: calc(100% - 136px - 17px) !important;
}
.detailInput input[id^="TabRecurrence"], .detailInput select[id^="TabRecurrence"],
.detailInput input[id^="Recur"], .detailInput select[id^="Recur"] {
    width: 98%;
    color: var(--txt-color);
    font-style: normal;
    text-indent: 5px;
    float: left;
    position: relative;
    display: inline-block;
    text-align: left;
    height: 30px !important;
    margin-top: 1px;
    margin-bottom: 1px;
    margin-left: 1px;
    margin-right: 1px;
    background-color: var(--bg);
}
.ui-spinner:has(input[id^="TabRecurrence"]){
    width:65px;
    margin-right: 5px;
}
.detailInput input[id^="TabRecurrence"], .detailInput input[id^="Recur"]
{
    text-indent:10px;
    border: solid 1px var(--bg-border);
    padding-right:10px;
}
.detailInput  select[id^="TabRecurrence"], .detailInput select[id^="Recur"]{
    text-align: center;
}
.detailInput:has(select[id^="TabRecurrence"]):after, .detailInput:has(select[id^="Recur"]):after {
    top: 2px !important;
}
 #InvoiceScheduleGeneralTab select[id^="Recur"]{
     width: 100% !important;
     text-align:left;
 }
 #InvoiceScheduleGeneralTab .detailInput:has(select[id^="Recur"]):after{
     top:0px !important;
 }
.detailInput:has(input[id^="TabRecurrence"]):before, .detailInput:has(select[id^="TabRecurrence"]):before {
    top: 0px !important;
}
.ionbizdetails.editMode .detailInput input:not([readonly]):not([data-checkbox]):not([id^="TabRecurrence"]):not([id^="Recur"]), .ionbizdetails.editMode .detailInput select:not([readonly]):not([id^="TabRecurrence"]):not([id^="Recur"]),
.ionbizdetails.editMode .detailInput textarea:not([readonly]), .reportFilterCriteria input:not([readonly],.ribbon-filter-input):not([type='file'],[type='search']):where(:nth-child(n+2 of :not(.jqGridHolder))):not(.jqGridHolder), .reportFilterCriteria select:not([readonly]):where(:nth-child(n+2 of :not(.jqGridHolder))):not(.jqGridHolder), .reportFilterCriteria textarea:not([readonly]),
.bubbleDialogHolder input:not([readonly],.ribbon-filter-input):not([data-checkbox]),.w33Procent input:not([readonly]):not([data-checkbox]), .bubbleDialogHolder select:not([readonly],.manageChk), .bubbleDialogHolder .detailInput textarea:not([readonly]) {
    border-radius: var(--border-radius-xs);
    border: 1px solid transparent;
    width: 100%;
    color: var(--txt-color);
    font-style: normal;
    font-weight: 500;
    text-indent: 5px;
    float: left;
    position: relative;
    display: inline-block;
    height: 30px !important;
    background-color: var(--input-bg);
    margin-left: 0px;
    margin-top: 1px;
    margin-bottom: 1px;
    outline: var(--bg-border);
    outline-style: solid;
    outline-offset: -1px;
    outline-width: thin;
}
.bubbleDialogHolder input:not([readonly]):not([data-checkbox]), .bubbleDialogHolder select:not([readonly],.manageChk), .bubbleDialogHolder .detailInput textarea:not([readonly]) {
    
    margin-left: 2px !important;
}
.bubbleDialogHolder select:not([readonly],.manageChk), .ionbizdetails.editMode .detailInput select:not([readonly]):not([id^="TabRecurrence"]):not([id^="Recur"]){
    text-indent:6px !important;
}
.detailInput:has( .minicolors-input, .colorautocomplete-color, .ionbiz-color-autocomplete):not(:has(.datepicker-inline, .timepicker, #SaveFilterDetail_Color)) {
    min-width: 155px !important;
    max-width: 42%;
}
#SaveFilterDetail_Color, #SaveFilterDetail_Color:hover {
    background-color: transparent !important;
    border-color: transparent !important;
    outline: none !important;
}
#SaveFilterDetail_Color:focus-visible{
    outline-color: transparent !important;
}
/* rare positive :has() before the negated one, which always walks the whole subtree */
.detailInput:has(input.timepicker,input[data-val-regex-pattern="^((-?)([0-9,.:]+))$"],input[data-val-decimalrange-stoprange="100"],input[data-val-number]:not([data-val-number=""]), input[id="General_HourlyCost"], input[id="General_IntercompanyCostPrice"]):not(.detailInputCost,:has(select,.timepicker-inline, .datepicker, .currency)),.detailInput:has(input[data-val-regex-pattern="^[0-9,.:]+$"]):not(:has(select,#UnitCost,.datepicker)) { /*number and time fields*/
    width: 169px !important;
}
.ionbizdetails:not(.editMode) .detailInputCost{
    box-shadow: none !important;
}
/* taC/taR are whole classes on the cell, so match them as classes: [class*=] cannot key
   the rule and Chromium then tests it against every td on the page. */
td.taC[title^="-"]:not(.no-red), td.taR[title^="-"]:not(.no-red), td.taR[title^="-"]:not(.no-red) > input,
td.taR[title^="€"][title*="-"]:not(.no-red), td.taR[title^="$"][title*="-"]:not(.no-red),   
input[value^="-"]:not(.no-red), span[title^="-"]:not(.no-red), span[title^="€"][title*="-"]:not(.no-red), span[title^="$"][title*="-"]:not(.no-red) {
    color: var(--red) !important;
}

.bubbleDialogHolder #personInfoTag {
    height: 100px;
}

.bubbleDialogHolder #resourceNameHolder {
    min-width: 400px;
    padding: 10px 0px 4px 16px;
    background: var(--bg) !important;
}
.columChooser > .bubbleDialogHolder {
    max-height: 27rem!important;
    font-size: 13px;
}

.ui-jqgrid-btable tr td input[readonly], .ionbizdetails input[readonly], .ionbizdetails select[disabled], .ionbizdetails select[readonly], form.ionbizdetails textarea[readonly], .ionbizdetails .ionbiztinymce[readonly] {
    color: var(--txt-color) !important;
    font-weight: normal !important;
    font-style: normal !important;
    cursor: not-allowed !important;
    border-color: transparent !important;
    resize: none;
    background: transparent;
    outline: none;
}
.ionbizdetails input[readonly], .ionbizdetails select[disabled], .ionbizdetails select[readonly] {
    width: 100%;
    height: 30px !important;
}

.ionbizdetails select[readonly] {
    pointer-events: none;
}

.ionbizdetails.editMode .hideOnEditMode {
    display: none !important;
}

.ionbizdetails:not(.editMode) .hideOnViewMode {
    display: none!important;
}

form.ionbizdetails {
    width:auto;
    height:auto;
}


.bubbleDialogHolder .detailInput { text-indent: 0px!important; overflow:hidden; text-overflow:ellipsis;background: transparent;}
.bubbleDialogHolder .detailInput input:not([data-checkbox]),
.bubbleDialogHolder select:not(.manageChk), 
.bubbleDialogHolder .detailInput textarea {
    width: 90% !important;
}

.reportFilterCriteria .cell input,
.reportFilterCriteria .cell select,
.reportFilterCriteria .cell textarea {
    width: 93% !important;
}

.dirty:not(.ionbiztinymce):not([readonly]) {
    background-color: var(--green) !important;
}

.dirty.highlight:not(.ionbiztinymce):not([readonly]) {
    animation: highlight;
    animation-duration: 1s;
}

/*.dirty:not(.ionbiztinymce):not(.input-validation-error):not([readonly]) {
    border: 1px solid #ccc!important;
}*/

.dirty.ionbiztinymce.input-validation-error:not([readonly]) {
    border: 1px solid Red !important;
}

.rowColorImportExcel { background-color:red !important; }

.ionbizdetails .detailInput label.ionbizLabel {
    width: 80px!important;
}

.ionbizdetails  .detailInput > input[data-checkbox="true"] + label.ionbizLabel ~ select, .ionbizdetails  .detailInput > input[data-checkbox="true"] + label.ionbizLabel ~ input[type="text"], 
.ionbizdetails .detailInput > input[data-checkbox="true"] + label.ionbizLabel ~ .lblQuickEdit {
    width: calc(100% - 93px);
}

/* :has(+ label) instead of "+ label ~": a tag-only sibling step made Chrome restyle every text input on any DOM insert/remove. */
.ionbizdetails  .detailInput > input[data-checkbox="true"]:has(+ label) ~ select, .ionbizdetails  .detailInput > input[data-checkbox="true"]:has(+ label) ~ input[type="text"],
.ionbizdetails  .detailInput > input[data-checkbox="true"] + label.ionbizLabel { width: calc(100% - 23px)!important;max-width: 100%;}
/* a full-width label pushes the floated colour picker that follows it onto the next line */
.ionbizdetails .detailInput > input[data-checkbox="true"] + label.ionbizLabel.withColorPicker { width: auto !important; margin-right: 10px; }

h2 input[data-checkbox="true"][type="checkbox"] + label {
    margin-top: -1px;
}

/*.twoElements { position:absolute!important;}*/
/* Children listed by tag rather than `> *`: a universal subject lands in Blink's universal
   bucket and is tested against every element in the document. `*:first-of-type` already meant
   "first sibling of its own tag", so the per-tag expansion below is exactly equivalent. */
.twoElements > input, .twoElements > select, .twoElements > textarea,
.twoElements > div, .twoElements > span, .twoElements > label, .twoElements > a,
.twoElements > button, .twoElements > p {
    width: calc(93%/2) !important;
    float: left;
}
.detailInput.twoElements, .detailInput:has(input.twoElements60And40PercentWidth):has(select.twoElements60And40PercentWidth){
    display: flex;
    align-items: center;
    justify-content: space-between;
    background:transparent;
}
.twoElements > input:first-of-type, .twoElements > select:first-of-type,
.twoElements > textarea:first-of-type, .twoElements > div:first-of-type,
.twoElements > span:first-of-type, .twoElements > label:first-of-type,
.twoElements > a:first-of-type, .twoElements > button:first-of-type,
.twoElements > p:first-of-type { background:var(--section-bg);}
.threeElements > input, .threeElements > select, .threeElements > textarea,
.threeElements > div, .threeElements > span, .threeElements > label, .threeElements > a,
.threeElements > button, .threeElements > p {
    width: calc(93%/3)!important;float: left;
}
.twoElementsFirst64PercentWidth > input:first-of-type {width:64%!important;float: left;}
.twoElementsFirst64PercentWidth > input:first-of-type ~ select {width:calc(36% - 4px) !important;margin-left: 3px !important;}
.detailInput.twoElementsFirst64PercentWidth{background:transparent;}

/* Date picker + timepicker same row */
.detailInput > .datepicker:not(:last-of-type) { width: 64% !important;}
.detailInput > .datepicker ~ .timepicker { width:calc(36% - 2px) !important;margin-left: 2px;float: left;background-repeat: no-repeat;}
.detailInput > .datepicker ~ .timepicker[readonly] { background-image: none;}

/* input and translate icon on same row */
.detailInput:has(.translateButton) > input[data-translate-property] { max-width: calc(100% - 22px) !important; }

/* currency + input/select */
.detailInput > span.currency {
    font-size: 12px;
    font-weight: 600 !important;
    color: var(--menu-hover);
    white-space: nowrap;
    width: 14px;
    box-sizing: border-box;
    height: inherit;
    text-align: left;
    line-height: 30px;
    float: left;
    min-height: 30px;
    font-weight:500;
}

.detailInput > .currency + .d_track {
    width: calc(100% - 24px) !important;
}

.detailInput > .sign {
    text-indent: 3px;
    text-align: left;
    width: 20px;
    box-sizing: border-box;
    line-height: 30px;
    float: left;
    min-height: 30px;
}

.detailInput > .sign + span.currency + .d_track {
    width: calc(100% - 44px) !important;
}

.detailInput > span.currency + span {
    width: calc(100% - 25px) !important;
    text-indent: 3px;
    text-align: left;
    line-height: 30px;
    float: left;
    min-height: 30px;
    font-weight:500;
}


form.editMode .required:not(.dirty):not([readonly]), form.editMode .required-field:not(.dirty):not([readonly]), .editable .required:not(.dirty):not([readonly]), .editable .required-field:not(.dirty):not([readonly]), .editable.required:not(.dirty):not([readonly]),.editable.required-field:not(.dirty):not([readonly]),
form.editMode [data-val-required]:not(.dirty):not([readonly]), form.editMode [data-val-requiredifempty]:not(.dirty):not([readonly]), form.editMode [data-val-requiredifallempty]:not(.dirty):not([readonly]),
/* No [type="hidden"] before "~" (only hidden bool flags render value="True"; doubled attribute keeps the specificity): any [type] there merges with every "[type] + span" rule and Chrome restyles ~25k grid elements on each DOM insert/remove. */
form.editMode input[data-val-required][data-val-required][value="True"] ~ [data-val-requiredif]:not(.dirty), form.editMode [data-val-requiredifothernotexists]:not(.dirty):not([readonly]),
form.editMode .detailInput[data-ionbiz-required="true"] [data-val-requiredif]:not(.dirty), td.required > .editable > input {
    background-color: var(--input-bg-required) !important;
}

/*input:not(.quickSearchAutocomplete, .qSearch, .dirty):required:invalid:not(:focus-visible),
select:not(.quickSearchAutocomplete, .qSearch, .dirty):required:invalid:not(:focus-visible) {
    border: 1px dashed var(--red) !important;
    background-color: #fbe6eb !important;
    box-shadow: none !important;
}*/

.ionbizdetails .detailInput textarea {
    min-height: 8em !important;
    padding: 5px;
}

.ionbizdetails .detailInput a.navigateHiperlink {
    width: auto;
    height: 30px;
    z-index: 1;
    text-indent: 5px;
    padding-left:3px;
    white-space: nowrap;
    display: block;
    text-overflow: ellipsis;
    position: absolute;
    overflow: hidden;
    max-width: 90%;
    line-height: 30px;
    top: 0px;
}

.bubbleDialogHolder .ionbizdetails .detailInput a.navigateHiperlink {
    max-width: calc(23% - 15px) !important;
    width: auto;
    display: inline-table;
}

.ionbizdetails:not(.editMode) .detailInput input[data-ionbizlink]:not(:focus), .ionbizdetails:not(.editMode) .detailInput input[data-link]:not(:focus),
.ionbizdetails:not(.editMode) .detailInput input[data-ionbizlink][readonly], .ionbizdetails:not(.editMode) .detailInput input[data-link][readonly] {
    text-indent: -10000px;
    float: right;
}

.ionbizdetails .detailInput input[data-ionbizlink]:not([readonly]):focus ~ a.navigateHiperlink, .ionbizdetails .detailInput input[data-link]:not([readonly]):focus ~ a.navigateHiperlink, 
.ionbizdetails.editMode .detailInput input[data-ionbizlink] ~ a.navigateHiperlink, .ionbizdetails.editMode .detailInput input[data-link] ~ a.navigateHiperlink   {
    display:none!important;
}

.ionbizdetails .detailInput .d_track[readonly="readonly"] ~ .displayIconActionFor {
    display:none;
}

.ionbizdetails .detailInput .displayIconActionFor {
    float: left;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

/* cursor logic */
a[readonly] {
    cursor: default !important;
}

input:not([type="button"],[readonly],.mce-textbox,.datepicker.navigateDatePicker, input[name="SaveFilterDetail.Name"],.ribbon-col-search, .rce-input, .ribbon-filter-input, .filter-autocomplete-input):focus, textarea:not([readonly]):focus, .ionbiztinymce:not([readonly]):focus {
    cursor: text!important;
    outline-color: var(--input-focus) !important;
    outline-width: thin !important;
    outline-style: solid !important;
    /* Inset so the ring lands exactly where the 1px border was; any margin here
       would shift the field sideways the moment it takes focus. */
    border: 1px solid transparent !important;
    outline-offset: -1px;
    box-shadow:none !important;
}
.ionbiztinymce:not([readonly]):focus{outline-offset: -1px !important;margin-left: 0px !important; outline-style: solid !important; outline-color: var(--bg-border-light) !important}

input[readonly], textarea[readonly], select[readonly], .ionbiztinymce[readonly] {
    cursor: default !important;
    outline: none !important;
    box-shadow: none !important;
}

#toggleHierarchy {
    display: block;
    line-height: inherit;
    text-indent: 0px;
    width: 0;
    margin-left: -20px;
}

/* flow-root, not the inherited table-cell: that shrinks the span to the input's default
   width so width:100% never reaches the column; flow-root also contains the floated input. */
.jqGrid tr span.editable {width:100%; position:relative; display:flow-root;}

tr[editable="1"] #toggleHierarchy {
    margin-left: 0px;
    z-index: 1;
    border-right: 1px solid var(--bg-border);
    position: absolute;
    width: 21px;
} 
.ionbizdetails #toggleHierarchy:hover:before,
.ionbizdetails.editMode #toggleHierarchy:before,
tr[editable="1"] #toggleHierarchy:before
{   width: inherit;
    display: inline-block;
    text-align: center;
    color: var(--menu-hover);
    content: "\e915";
    font-family: ionbiz;
    font-weight: 300;
    margin-left: 0px;
    line-height: 30px;
}
.ionbizdetails.editMode #toggleHierarchy:before {
    margin-left: -3px !important;
}
tr[editable="1"] #toggleHierarchy:before{
    line-height: 30px !important;
}

body.autocomplete-hierarchy .ionbizdetails #toggleHierarchy:hover:before,
body.autocomplete-hierarchy .ionbizdetails.editMode #toggleHierarchy:before,
body.autocomplete-hierarchy tr[editable="1"] #toggleHierarchy:before {
    content: "\e914";   
}

body.autocomplete-hierarchy-with-childs .ionbizdetails #toggleHierarchy:hover:before,
body.autocomplete-hierarchy-with-childs .ionbizdetails.editMode #toggleHierarchy:before,
body.autocomplete-hierarchy-with-childs tr[editable="1"] #toggleHierarchy:before {
    content: "\e914";
    color: #ff6600;
}

body.autocomplete-hierarchy ul.hierarchical li:not(.ui-state-disabled) {
    font-weight: bold;
}

body.autocomplete-hierarchy-with-childs ul.hierarchical li:not(.ui-state-disabled) {
    font-weight: bold;
}

.ionbizdetails #toggleHierarchy:hover:before
{
    color: #999999!important;
}

tr[editable="1"] #toggleHierarchy ~ .ui-autocomplete-input {text-indent: 0px;padding-left: 26px; z-index:0; } 

tr:not([editable="1"]) .show-when-editable { display: none; } 
tr[editable="1"] .hide-when-editable { display: none; }
.ionbizdetails.editMode .hide-when-editable { display: none;} 
tr .icon-search:hover { cursor: pointer; } 

.ui-selectable .ui-text-ionbiz:before
{
    content: attr(data-text);
    color: var(--menu-hover);
    position: absolute;
    float: right;
    RIGHT: 20px;
    width: auto;
    text-align: right;
}

.ionbizdetails.editMode .detailInput .fiedlValueLink { display: none;}

.ionbizdetails .detailRow .bottomBorder  
{
    border-bottom: 1px solid var(--bg-border-light);
    margin-bottom: 12px;
    padding-bottom: 15px;
    height: 30px;
    width: 97%;
}

/*******************************************************
    [5] Grid 
********************************************************/

.ionBiz-progressbar
{
    position: relative;
    /* Own stacking context, so the fill can be pushed behind the label with a
       negative z-index and still paint on top of the track. */
    z-index: 0;
    display: block;
    height: 18px;
    line-height: 18px;
    text-align: center;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    border-radius: var(--r-pill);
    background: color-mix(in srgb, currentColor 12%, transparent);
    overflow: hidden;
}

.jqGrid .ionBiz-progressbar
{
    margin-right: 12px;
    margin-left: 12px;
}

.ionBiz-progressbar span
{
    position: absolute;
    inset: 0 auto 0 0;
    height: auto !important;
    z-index: -1;
    /* Fallback for the dashboard bars, whose spans carry a width but no colour. */
    background-color: currentColor;
    opacity: 0.3;
    /* progressbar.js and the jqGrid formatter inline a square radius, a top margin
       and a border that repaints the fill colour under the background. */
    border-radius: var(--r-pill) !important;
    border-bottom: 0 !important;
    margin-top: 0 !important;
    transition: width var(--dur-base) var(--ease-out);
}

.detailInput .ionBiz-progressbar
{
    width: 67px;
    margin-top: 8px;
}

.detailInput .ionBiz-progressbar.loading
{
    line-height: 1px;
    padding-top: 10px;
    background-image: url(/Lib/gantt/ext-6.5.0/build/classic/theme-triton/resources/images/loadmask/loading.gif?v=tXc9Pra_I9xp0Lez8XSvw0d1ADI);
    background-repeat: no-repeat;
    background-position-x: 50px
}

.jqGrid input.ui-autocomplete-input::placeholder {
    font-weight: normal !important;
    font-style: inherit;
    color: var(--txt-color) !important;
    opacity: initial !important;
}
 input.dirty.ui-autocomplete-input::placeholder {
    font-weight: normal !important;
    font-style: inherit;
    color: var(--dark-bg) !important;
    opacity: initial !important;
}

.ui-jqgrid-firstgroupedcells
{
    border-left: 1px solid var(--bg-border) !important;
}

.ui-jqgrid-lastgroupedcells
{
    border-right: 1px solid var(--grid-header-bg) !important;
}

.ui-jqgrid-lastgroupedcells + .ui-jqgrid-firstgroupedcells
{
    border-left: 0 !important;
}

.jqg-second-row-header th:not(:empty) {
    border-right: 1px solid var(--bg-border) !important;
}
.frozen-div table.ui-jqgrid-htable:has(.jqg-second-row-header th:not(:empty)):has(#navigateDatePicker) .jqg-second-row-header th:not(:empty) { /*hide extra border on the right on the frozen div*/
    border-right: 1px solid transparent !important;
}
.page_timesheetschedule .jqg-second-row-header th:not(:empty) {
    border-right: 1px solid var(--east-bg) !important;
}

.icon-followLeft:before {
  content: "\e67c";
  transform: rotate(-180deg);
  padding-right: 37%;
}

th.taL > div { text-align:left;}
th.taC > div { text-align:center;}
th.taR > div { text-align:right;}

/*******************************************************
    [6] Projects 
********************************************************/
.ionbizdetails .tblFinancial
{
    display: table!important;
    
}

.ionbizdetails .tblFinancial thead td
{
    text-transform: uppercase;
    padding-bottom: 10px;
    padding-top: 7px;
    line-height: 23px;
}

.ionbizdetails .tblFinancial thead td.tblFinancialBase
{
    white-space: nowrap;
    padding-right: 2%;
}

.ionbizdetails .tblFinancial td.total, .tblFinancial td.total a
{
    font-size: 1em;
}

.ionbizdetails .tblFinancial .marginRow td:first-child
{
    font-size: 0.9em;
}

.ionbizdetails .tblFinancial td
{
    padding-right: 3%;
    padding-bottom: 2px;
    padding-top: 2px;
    border-right: 1px solid #eee!important;
    font-style: normal;
}

.ionbizdetails .tblFinancial .marginRow td
{
    padding-bottom: 10px;
}

.ionbizdetails .tblFinancial td:first-child, .ionbizdetails .tblFinancial td:last-child
{
    border: 0;
}

.ionbizdetails .tblFinancial tr
{
    border-right: 1px solid #000;
}

.ionbizdetails .tblFinancial .tblFinancialBudgetDivide td
{
    padding-bottom: 25px;
}

.ionbizdetails .tblFinancial .icon-edit
{
    width: 72px!important;
    border: 0;
}

.ionbizdetails .tblFinancial .icon-edit:before
{
    padding-left: 0px;
}

.ionbizdetails .tblFinancial td > span
{
    float: right;
}
.ionbizdetails .tblFinancial td input
{
    float: right!important;
    text-align:right;
    width: 68px!important;
}

.ionbizdetails.editMode .tblFinancial td input, .ionbizdetails .tblFinancial td input:focus
{
    width: 70px!important;
    text-align:left!important;
}

.ionbizdetails .tblFinancial .lockIcon {
    display:none;
}

.ionbizdetails .tblFinancial .lockIcon + label 
{
    background: none !important;
    margin: -1px 0 0 0 !important;
    width: 13px !important;
    font-size: 17px;
}
 
.ionbizdetails .tblFinancial .lockIcon + label:before
{
    font-family: 'ionbiz';
    content: "\e638";
}

.ionbizdetails .tblFinancial .lockIcon:checked + label:before
{
    font-family: 'ionbiz';
    content: "\e639";
}

/*******************************************************
    [7] Send Email 
********************************************************/
.sendEmailForm .head {
    display: block;
    width: 100%;
    background-color: var(--bg);
    border-radius: 2px;
    border: 1px solid var(--bg-border-light);
    border-bottom-width: 0px;
    min-height: 40px;
    height: auto;
    overflow: hidden;
}

.sendEmailForm .lastHead {
    border-bottom-width: 1px!important;
}

.sendEmailForm .hInfo {
    width: calc(100% - 110px);
    float: right;
    display: inline-block;
    line-height: 40px;
}

.sendEmailForm .avatar {
        width: 32px;
    height: 32px;
    margin: 3px 0px 0px 3px;
    line-height: 40px;
}

.sendEmailForm span.username {
    font-size: 13px;
    color: var(--blue);
    font-weight: bold;
    margin-left: 7px;
}

.sendEmailForm .head .ndate {
    width: auto;
    height: 22px;
    margin-right: 10px;
    color: var(--txt-color-muted);
    font-size: 10px;
    float: right;
}

.sendEmailForm .head  .token-input-list-facebook, .sendEmailForm .emailSubject {
    border: 1px solid transparent !important;
    margin-top: 5px !important;
    width: calc(100% - 120px)!important;
    float: right!important;
    margin-right: 5px;
    min-height: 28px;
    box-sizing: content-box;
    padding: 0px;
    border-radius: var(--border-radius-xs);
    border-top-right-radius:0px;
    background: var(--east-bg);
}
.sendEmailForm .head  .token-input-list-facebook.input-validation-error {border: 1px solid red!important;}

.sendEmailForm:not(.editMode) .head  .token-input-list-facebook, .sendEmailForm:not(.editMode) ul.token-input-list-facebook li input#token-input-emailTo, 
.sendEmailForm:not(.editMode) .emailSubject {
    border-color: transparent!important;
    background-color:transparent!important;
}

.sendEmailForm  ul.token-input-list-facebook:before {
    content: '@';
    float: left;
    height: 20px;
    line-height: 29px;
    color: var(--txt-color);
    opacity:0.8;
    margin-left: 4px;
}

.sendEmailForm  ul.token-input-list-facebook:after {
     margin-top: 0px!important;
    margin-right: 12px;
    line-height: 26px;    
}

.sendEmailForm  li.token-input-token-facebook {
     margin: 5px 3px 0px 3px!important;
}

.sendEmailForm span.lblEmail {
        color: var(--txt-color-muted);
    margin-left: 15px;
    line-height: 40px;
    float: left;
}

.sendEmailForm .uploadimage-dragndrop {
    margin-top: 12px;
    margin-bottom: 6px;
    width: 100%;
}

.sendEmailForm .uploadimage-dragndrop a {
    text-decoration: underline;
}

.sendEmailForm #previews {
    width: calc(100% - 15px);
    margin-top: 6px;
}

.sendEmailForm #previews .uploadimage-upload {
    width: auto;
}

.sendEmailForm #previews .uploadimage-fileinfo {
    width: calc(100% - 6px);
}

.sendEmailForm a#sendAttachements {
    position: absolute;
    width: 24px;
    height: inherit;
    right: 0px;
    text-decoration: none;
}

.sendEmailForm a#sendAttachements:before {
    font-family: "ionbiz";
    font-size: 12px;
    content: "\e600";
    color: var(--txt-color);
    position: inherit;
    right: 16px;
}

.btnTemplatePreview {
    height: 21px;   
    background-position: 0px -492px;
    float: left;
    width: 21px;
    border: 0px;
    background-color: transparent;
    margin: 5px;
    outline: none;
    cursor: pointer;
}

.btnTemplatePreview:hover {
    background-position: 0px -513px;
}

/*******************************************************
    [8] Shared
********************************************************/
.userEditAccountTop #personInfoTag,
.userEditAccountTop #personInfoTagReadOnly {
    min-height: 0px;
    border-bottom: none;
    float: left;   
    width: 67px;
    height: 67px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    margin: 0px 35px 0px 0px;
}

#personInfoTag,
#personInfoTagReadOnly {
    border-bottom: 1px solid var(--bg-border);
    cursor: default;
    border-color: var(--bg-border);
    margin-bottom: 8px;
    margin-right: 12px;
    height: fit-content;
    min-height:90px;
}

#personInfoTag .photoContainer,
#personInfoTagReadOnly .photoContainer
{
    height: 85px;
    float: left;
}

#personInfoTag .photoContainer > div, 
#personInfoTagReadOnly .photoContainer > div
{
    height: inherit;
    display: inline-block;
    position: relative;
    float: left;
}

#personInfoTag .photoContainer .uploadBar, 
#personInfoTagReadOnly .photoContainer .uploadBar
{
    font-style: normal;
    line-height: 25px;
    display: block;
    bottom: 0;
    position: absolute;
    width: 101%;
    height: 23px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    -webkit-transition: background 0.25s linear;
    -moz-transition: background 0.25s linear;
    -ms-transition: background 0.25s linear;
    -o-transition: background 0.25s linear;
    transition: background 0.25s linear;
}

#personInfoTag .photoContainer .uploadBarDelete, 
#personInfoTagReadOnly .photoContainer .uploadBarDelete
{
    font-style: normal;
    line-height: 25px;
    display: block;
    bottom: 23;
    position: absolute;
    width: 101%;
    height: 23px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    -webkit-transition: background 0.25s linear;
    -moz-transition: background 0.25s linear;
    -ms-transition: background 0.25s linear;
    -o-transition: background 0.25s linear;
    transition: background 0.25s linear;
}

#personInfoTag.personInfoTagCompanyAddress .photoContainer .uploadBar,
#personInfoTagReadOnly.personInfoTagCompanyAddress .photoContainer .uploadBar
{
    border-radius: 0;
}

#personInfoTag.personInfoTagCompanyAddress .photoContainer .uploadBarDelete,
#personInfoTagReadOnly.personInfoTagCompanyAddress .photoContainer .uploadBarDelete
{
    border-radius: 0;
}

#personInfoTag .photoContainer .uploadBar span,
#personInfoTagReadOnly .photoContainer .uploadBar span
{
    opacity: 0;
    -webkit-transition: opacity 0.25s linear;
    -moz-transition: opacity 0.25s linear;
    -ms-transition: opacity 0.25s linear;
    -o-transition: opacity 0.25s linear;
    transition: opacity 0.25s linear;
}

#personInfoTag .photoContainer .uploadBarDelete span,
#personInfoTagReadOnly .photoContainer .uploadBarDelete span
{
    opacity: 0;
    -webkit-transition: opacity 0.25s linear;
    -moz-transition: opacity 0.25s linear;
    -ms-transition: opacity 0.25s linear;
    -o-transition: opacity 0.25s linear;
    transition: opacity 0.25s linear;
}

#personInfoTag .photoContainer > div:hover .uploadBar span,
#personInfoTagReadOnly .photoContainer > div:hover .uploadBar span
{
    opacity: 1;
}

#personInfoTag .photoContainer > div:hover .uploadBarDelete span,
#personInfoTagReadOnly .photoContainer > div:hover .uploadBarDelete span
{
    opacity: 1;
}

#personInfoTag .photoContainer > div:hover .uploadBar,
#personInfoTagReadOnly .photoContainer > div:hover .uploadBar
{
    background-color: #000;
    opacity: 0.7;
}

#personInfoTag .photoContainer > div:hover .uploadBarDelete,
#personInfoTagReadOnly .photoContainer > div:hover .uploadBarDelete
{
    background-color: #000;
    opacity: 0.8;
}

#personInfoTag .photoContainer .uploadBar:before,
#personInfoTagReadOnly .photoContainer .uploadBar:before
{
    font-family: 'ionbiz';
    content: "\e68e";
    font-style: normal;
    line-height: 22px;
    margin-left: 5px;
}

#personInfoTag .photoContainer .uploadBarDelete:before,
#personInfoTagReadOnly .photoContainer .uploadBarDelete:before
{
    font-family: 'ionbiz';
    content: "\e606";
    font-style: normal;
    line-height: 22px;
    margin-left: 5px;
}

#personInfoTag .photoContainer img,
#personInfoTagReadOnly .photoContainer img
{
    height: 85px;
    max-width: 115px;
    border-radius: var(--border-radius-md);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.detailInput #personInfoTag .photoContainer img,
.detailInput #personInfoTagReadOnly .photoContainer img 
{
    height: 63px;
}

#personInfoTag.personInfoTagCompanyAddress .photoContainer img,
#personInfoTagReadOnly.personInfoTagCompanyAddress .photoContainer img
{
    min-height: 85px;
    height: auto;
    border-radius: 0;
}

#personInfoTag .name,
#personInfoTagReadOnly .name {
    font-size: 18px;
    text-indent: 10px;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#personInfoTag .lblTo,
#personInfoTagReadOnly .lblTo {
    line-height: 23px;
    padding: 0px;
    text-indent: 10px;
}

#personInfoTag .skill,
#personInfoTagReadOnly .skill {
    font-size: 9px;
    line-height: 25px;
    text-indent:10px;
}

#personInfoTag .detail,
#personInfoTagReadOnly .detail
{
    height: 26px;
    font-size: 12px;
    text-indent:10px;
}

#personInfoTag .detail span:first-child,
#personInfoTagReadOnly .detail span:first-child
{
    width: 100px;
    float: left;
    line-height: 25px;
    font-size: 10px;
}

#personInfoTag .detail span:last-child,
#personInfoTagReadOnly .detail span:last-child
{

}

#personInfoTag .detail span:last-child span,
#personInfoTagReadOnly .detail span:last-child span
{
    width: 128px;
    font-weight: bold;
}

#personInfoTag .detail span:last-child input,
#personInfoTagReadOnly .detail span:last-child input
{
    width: 128px;
    height: 25px;
}

#personInfoTag .token-input-token-facebook, #personInfoTag .token-input-input-token-facebook {
    margin: 3px 0px 0px 4px;    
    line-height: 12px;
}

#personInfoTag ul.token-input-list-facebook li input {
    padding: 0px;
    height: inherit;
}

#personInfoTag .token-input-list-facebook {
    width: initial;
    background-color: inherit;
}

#personInfoTag .token-input-list-facebook:after {
    margin-top: 7px;
}

[for="chkUpdateOnlyTaskWithDateDefined0"] span {
    width: 220px;
}

.plainTextEditorHolder iframe, .plainTextEditorHolder .tinymceSimplest {
    min-height: 32px!important;
    height: 32px!important;
    line-height: 32px!important;
    width: 98%;
}

select.manageChk {
    /* ionbiz first renders the PUA glyph; letters fall back to the app UI font */
    font-family: 'ionbiz', var(--font-body);
    padding: 0;
    border: 0 !important;
    background-image: none;
    text-align: left;
    background-color: inherit !important;
    text-indent: -2px!important;
    font-size: 14px !important;
    line-height: inherit;
    vertical-align: middle;
}

.manageChkShow {
    color: var(--dark-green) !important;
}

.manageChkNotShow {
    color: #ff5200 !important;
}

/*******************************************************
    [9] Page Specific 
********************************************************/
/* Quote Line Detail */
#quoteLineDetailForm[linetype="1"] .hideWhenLineTypeIsCost,
#quoteLineDetailForm[linetype="4"] .hideWhenLineTypeIsItem { display: none; }
#quoteLineDetailForm[linetype="1"] .fullWidthWhenLineTypeIsCost,
#quoteLineDetailForm[linetype="4"] .fullWidthWhenLineTypeIsItem,
#quoteLineDetailForm[linetype="0"] .fullWidthWhenLineTypeIsTask { width: inherit!important; }
#quoteLineDetailForm[linetype="0"] .hideWhenLineTypeIsNotCostOrItem,
#quoteLineDetailForm[linetype="2"] .hideWhenLineTypeIsNotCostOrItem,
#quoteLineDetailForm[linetype="3"] .hideWhenLineTypeIsNotCostOrItem { display: none; }
#quoteLineDetailForm:not([linetype="4"]) .hideWhenLineTypeIsNotItem { display: none; }
#quoteLineDetailForm:not([linetype="0"]) .hideWhenLineTypeIsNotTask { display: none; }
#quoteLineDetailForm[linetype="2"] .hideWhenLineTypeIsParent { display: none; }
#quoteLineDetailForm:not([linetype="2"]) .hideWhenLineTypeIsNotParent { display: none; }
#quoteLineDetailForm:not([linetype="3"]) .hideWhenLineTypeIsNotAdvancedTask { display: none; }
#quoteLineDetailForm[linetype="3"] .hideWhenLineTypeIsAdvancedTask { display: none; }
#quoteLineDetailForm[billable="false"]:not([linetype="1"]) .hideWhenNotBillable { display: none; }
.leaveImportFromOfficient .detailRow:not(.officientHolder) {
    display: none;
}
/*******************************************************
    [9.1] To Plan
********************************************************/

#planningBarPanel,
#timesheetScheduleBarPanel {
    padding: 0px;
}

#planningBarPanel:not(.hide) ~ #detailsContainer,
#timesheetScheduleBarPanel:not(.hide) ~ #detailsContainer {
    display: none;
}

#planningBarPanel .ui-jqgrid-bdiv:not(.frozen-bdiv),
#timesheetScheduleBarPanel .ui-jqgrid-bdiv:not(.frozen-bdiv) {
    height: calc(100% - 1px) !important;
    margin-left: 5px;
    width: calc(100% - 10px) !important;
}

.ui-layout-east #planningBarPanel .ui-accordion-content,
.ui-layout-east #timesheetScheduleBarPanel .ui-accordion-content {
    width: 90% !important;
}

#planningBarPanel .sticky,
#timesheetScheduleBarPanel .sticky {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 8px;
    padding: 8px 12px 8px 18px;
    margin-top: 5px;
    margin-bottom: 0px;
    width: auto;
    height: 100px;
    border: 1px solid var(--bg-border-light);
    border-radius: var(--border-radius-l);
    font-weight: 500;
    box-sizing: border-box;
    background: var(--bg);
    overflow: hidden;
    position: relative;
    transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

/*
 * --card-bar: per-sticky status color, set inline from JavaScript.
 *   Sources:
 *     ionBiz/Modules/Core/wwwroot/Scripts/Planning/index.js
 *         (formatPlanningBarTask / formatPlanningBarIssue)
 *     ionBiz/Modules/Core/wwwroot/Scripts/TimesheetSchedule/index.js
 *         (formatPlanningBarTask / formatPlanningBarIssue)
 *     style="--card-bar:{rowObject.Color};"
 *   Used by the .sticky::before inset bar and the :hover border color.
 *   Falls back to var(--bg-border) when not provided.
 */
#planningBarPanel .sticky::before,
#timesheetScheduleBarPanel .sticky::before {
    content: "";
    position: absolute;
    left: 7px;
    top: 12px;
    bottom: 12px;
    width: 3px;
    border-radius: 999px;
    background: var(--card-bar, var(--bg-border));
    pointer-events: none;
}

#planningBarPanel .sticky:hover,
#timesheetScheduleBarPanel .sticky:hover {
    border-color: var(--card-bar, var(--bg-border));
    box-shadow: 0 2px 4px var(--bg-border-light), 0 14px 26px -12px var(--shaddow);
}

/* The card is flex driven; the legacy float/percentage widths are cleared here. */
#planningBarPanel .sticky > span,
#timesheetScheduleBarPanel .sticky > span {
    float: none;
    min-width: 0;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

/* line 1 - due date, customer and the progress bar */
#planningBarPanel .sticky > .leftCol,
#timesheetScheduleBarPanel .sticky > .leftCol {
    order: 1;
    flex: 0 1 auto;
    width: auto;
}

#planningBarPanel .sticky > .customer.singleCol,
#timesheetScheduleBarPanel .sticky > .customer.singleCol {
    order: 2;
    flex: 1 1 0%;
    width: auto;
    height: 18px;
    color: var(--txt-color);
    opacity: 0.6;
    font-size: 10px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    line-height: 18px;
}

#planningBarPanel .sticky > .rightCol,
#timesheetScheduleBarPanel .sticky > .rightCol {
    order: 3;
    flex: 0 0 auto;
    width: auto;
    max-width: 52%;
    margin-right: 0;
    text-align: end;
    font-size: 10.5px;
}

#planningBarPanel .sticky > .rightCol > .ionBiz-progressbar,
#timesheetScheduleBarPanel .sticky > .rightCol > .ionBiz-progressbar{
    margin: 0;
    padding: 0 10px;
}

/* line 2 - task name / assigned resource, doubles as the divider above the footer */
#planningBarPanel .sticky > .singleCol:not(.customer),
#timesheetScheduleBarPanel .sticky > .singleCol:not(.customer) {
    order: 4;
    flex: 0 0 100%;
    width: 100%;
    height: 32px;
    box-sizing: content-box;
    margin: 4px 0 0;
    padding: 0 0 6px;
    border-bottom: 1px solid var(--bg-border-light);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
    word-wrap: break-word;
    color: var(--txt-color);
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
}

/* line 3 - project / issue reference and the priority badge */
#planningBarPanel .sticky > .idName,
#timesheetScheduleBarPanel .sticky > .idName {
    order: 5;
    flex: 0 0 auto;
    max-width: 45%;
    color: var(--menu-hover);
}

/* on ticket cards the ticket name is the title and the resource drops to the footer */
#planningBarPanel .sticky:has(> .issueName) > .issueName,
#timesheetScheduleBarPanel .sticky:has(> .issueName) > .issueName {
    order: 4;
    flex: 0 0 100%;
    width: 100%;
    height: 32px;
    box-sizing: content-box;
    margin: 4px 0 0;
    padding: 0 0 6px;
    border-bottom: 1px solid var(--bg-border-light);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
    word-wrap: break-word;
    color: var(--txt-color);
    opacity: 1;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
}

#planningBarPanel .sticky:has(> .issueName) > .singleCol:not(.customer),
#timesheetScheduleBarPanel .sticky:has(> .issueName) > .singleCol:not(.customer) {
    order: 6;
    flex: 1 1 0%;
    width: auto;
    height: 18px;
    box-sizing: border-box;
    margin: 5px 0 0;
    padding: 0;
    border-bottom: none;
    display: block;
    white-space: nowrap;
    color: var(--txt-color);
    opacity: 0.7;
    font-size: 11.5px;
    font-weight: 500;
    line-height: 18px;
}

#planningBarPanel .sticky > .idName:hover,
#timesheetScheduleBarPanel .sticky > .idName:hover {
    cursor: pointer;
    text-decoration: underline;
}

#planningBarPanel .sticky > .projectName,
#planningBarPanel .sticky > .issueName,
#timesheetScheduleBarPanel .sticky > .projectName,
#timesheetScheduleBarPanel .sticky > .issueName {
    order: 6;
    flex: 1 1 0%;
    width: auto;
    opacity: 0.7;
}

#planningBarPanel .sticky > .status,
#timesheetScheduleBarPanel .sticky > .status {
    order: 7;
    flex: 0 0 auto;
    width: auto;
    max-width: 40%;
    height: 14px;
    margin: 5px 0 0;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-align: center;
    text-indent: 0px;
    line-height: 14px;
}

#planningBarPanel .sticky > .idName, #planningBarPanel .sticky > .projectName, #planningBarPanel .sticky > .issueName,
#timesheetScheduleBarPanel .sticky > .idName, #timesheetScheduleBarPanel .sticky > .projectName, #timesheetScheduleBarPanel .sticky > .issueName {
    height: 18px;
    margin-top: 5px;
    font-size: 11.5px;
    line-height: 18px;
}

#planningBarPanel .sticky > .dueDate,
#timesheetScheduleBarPanel .sticky > .dueDate {
    width: auto;
    height: 18px;
    color: var(--txt-color);
    opacity: 0.6;
    font-size: 10.5px;
    line-height: 18px;
}

#planningBarPanel .sticky > .dueDate:before,
#timesheetScheduleBarPanel .sticky > .dueDate:before {
    color: var(--txt-color);
    padding-right: 4px;
    vertical-align: middle;
    font-size: 12px;
}

/*******************************************************
    Detail card hover tooltip
********************************************************/
/*
 * Compact two column rendering of the shared .halfSizeLeft/.halfSizeRight +
 * .detailRow > .detailLabel/.detailInput tooltip partials. Opt in per tooltip by
 * adding `tooltipster-detail-card` to the tooltipster `theme` option, so the
 * generic detailRow styling stays untouched everywhere else.
 *   Consumers: Scripts/IssueKanban/kanban.js, Scripts/Planning/index.js
 */
.tooltipster-ionBIZ.tooltipster-detail-card {
    padding: 14px 18px !important;
    border-radius: var(--border-radius-l);
    max-width: 720px;
}
/* the halves are direct children of .tooltipster-content or of a wrapping form */
.tooltipster-detail-card .tooltipster-content:has(> .halfSizeLeft),
.tooltipster-detail-card .tooltipster-content > form:has(> .halfSizeLeft) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin: 0;
    line-height: 18px;
}
.tooltipster-detail-card .tooltipster-content .halfSizeLeft,
.tooltipster-detail-card .tooltipster-content .halfSizeRight {
    width: auto !important;
    min-width: 0 !important;
    float: none !important;
    margin: 0 !important;
    padding: 0;
    background: none !important;
    border: none !important;
    border-radius: 0;
}
.tooltipster-detail-card .tooltipster-content .halfSizeLeft {
    padding-right: 22px;
}
.tooltipster-detail-card .tooltipster-content .halfSizeRight {
    padding-left: 22px;
    border-left: 1px solid var(--bg-border-light) !important;
}
/*
 * Flex rather than grid: tooltipster sizes the tooltip after the content is
 * injected and grid tracks do not re-resolve against the final width.
 */
.tooltipster-detail-card .detailRow {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: 12px;
    /* the shared .detailRow floats, which shrink-wraps the rows outside the two columns */
    float: none !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 5px 0 !important;
}
.tooltipster-detail-card .detailRow:has(> .detailInput) {
    border-bottom: 1px solid var(--bg-border-light);
}
.tooltipster-detail-card .detailRow:last-child {
    border-bottom: none;
}
.tooltipster-detail-card .detailLabel {
    display: block !important;
    flex: 0 0 40%;
    float: none !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    /* the shared .detailLabel carries a form-field min-height */
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    color: var(--txt-color);
    opacity: 0.6;
    font-size: 10px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    line-height: 16px;
}
.tooltipster-detail-card .detailInput {
    flex: 1 1 0%;
    float: none !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    color: var(--txt-color);
    font-size: 12.5px;
    font-weight: 500;
    line-height: 16px;
    overflow-wrap: break-word;
}
.tooltipster-detail-card .detailInput:empty:before {
    content: "\2014";
    opacity: 0.35;
}
/* PlanningBarTooltip.cshtml absolutely positions its links from an inline script */
.tooltipster-detail-card .detailInput a {
    position: static !important;
    display: inline;
    min-width: 0 !important;
    text-indent: 0;
    font-size: inherit;
    line-height: inherit;
}
.tooltipster-detail-card .detailInput .ionBiz-progressbar {
    margin-top: 0;
}
/* memo / embedded grid rows sit outside the two columns and span the full width */
.tooltipster-detail-card .detailRow > .w100Percent {
    flex: 1 1 100%;
    min-width: 0;
    font-size: 12.5px;
    line-height: 16px;
}
.tooltipster-detail-card .detailRow:has(.jqGridHolder) {
    display: block;
    padding: 10px 0 0 !important;
}
/* jqGrid hard codes its measured width inline; stretch it over the whole tooltip */
.tooltipster-detail-card .jqGridHolder .ui-jqgrid,
.tooltipster-detail-card .jqGridHolder .ui-jqgrid-view,
.tooltipster-detail-card .jqGridHolder .ui-jqgrid-hdiv,
.tooltipster-detail-card .jqGridHolder .ui-jqgrid-bdiv,
.tooltipster-detail-card .jqGridHolder .ui-jqgrid-htable,
.tooltipster-detail-card .jqGridHolder table.ui-jqgrid-btable {
    width: 100% !important;
}

#planningBarPanel #gview_gridStickyBar,
#timesheetScheduleBarPanel #gview_gridStickyBar {
    height: 100% !important;
}

    #planningBarPanel #gview_gridStickyBar .ui-jqgrid-bdiv,
    #timesheetScheduleBarPanel #gview_gridStickyBar .ui-jqgrid-bdiv {
        height: 100% !important;
    }

#planningBarPanel #mainTabs1,
#timesheetScheduleBarPanel #mainTabs1 {
    height: 40px;
    padding-top:5px;
}

#planningBarPanel .ui-tabs-panel,
#timesheetScheduleBarPanel .ui-tabs-panel {
    width: 100%;
    height: calc(100% - 45px);
}

/*******************************************************
    [--] Utils 
********************************************************/
.fl { float: left !important;}
.fr { float: right !important;}
.fn { float: none !important;}
.clearBoth { clear: both;}
.halfWidth {
    width: 50% !important;
    float: left !important;
    grid-column-start: 1;
    grid-column-end: 1;
}
.halfWidth + .halfWidth {
    grid-column-start: 2;
    grid-column-end: 2;
}

/* Colored buttons      */ 
.btnAction, .btnCancel 
{
    float: left;
    border: 1px solid #192d5c!important;
    color: var(--txt-color);
    background-color:transparent;
    text-transform: none;
    font-size: 0.8em;
    font-weight: bolder;
    border-radius: var(--border-radius-sm);
    cursor: pointer;
    border: 0px;
    line-height: 27px; 
    padding-right: 10px;
    padding-left: 10px;
}
    .btnAction:hover, .btnCancel:hover {
        color: #ffffff !important;
        background-color: #192d5c;
    }

.btnCancel 
{
    background-color: #bfc0be;
    margin-left: 5px;
}

.ionbiz-button {
    border: solid 1px #192d5c;
    border-radius: var(--border-radius-xl);
    background-color: transparent;
    padding: 5px 15px;
    text-transform: none !important;
    color: #192d5c;
    font-weight: 500;
    min-width: 60px;
    cursor: pointer;
    margin-right: 10px;
}


.ionbiz-button:disabled { opacity: 0.5;cursor: auto!important;}

.selectAllColumnsButton { position: absolute; left: 12px; padding: 0px!important; width: 16px; height: 16px; background-color: initial!important; border: 0!important; font-weight: normal!important;}
.selectAllColumnsButton > span {
    padding: 0px !important;
    height: inherit;
    width: 30px;
    cursor: pointer;
    font-family: 'ionbiz';
    font-size:16px;
    font-weight:bold;
    margin-top:0px;
    margin-left:3px;
}
.selectAllColumnsButton > span:after{
    content: "All";
    position: absolute;
    font-weight: normal;
    font-size: 12px !important;
    font: var(--font);
    margin-left: 5px;
}
.selectAllColumnsButton:not(.checked) > span:before {
        content: "\e93e";
        color: var(--txt-color);
        display: inline-block;
        border-radius: 4px;
}
.selectAllColumnsButton.checked > span:before {
    content: "\e640";
    color: var(--dark-green);
}

.noPad {padding: 0px !important;}
.noBorder { border: 0px !important;}
.bold { font-weight: bold !important;}
.bold:before { font-weight: bold !important;}
.pdR20 { padding-right: 20px;}
.mR10 { margin-right: 10px;}

.maxWidth { float: left;width: 100%;}
.inheritWidth {width: inherit;}
.inheritHeight { height: inherit;}
.procentFullHeight { height: 100%!important;}

.ui-dialog-content[id^="btnFilterIonBizDialog"] .halfWidth, .ui-dialog-content[id^="btnFilterIonBizDialog"] .halfSizeLeft, .ui-dialog-content[id^="btnFilterIonBizDialog"] .halfSizeRight {
    width: 450px !important;
    /*float: left;*/
}
.ui-dialog-content[id^="btnFilterIonBizDialog"] .detailLabel {
    font-size:smaller;
    padding-left:5px;
    min-width: calc(47% - 5px);
}

.ui-dialog-content[id^="btnFilterIonBizDialog"] .halfWidthNoQuickFilter {
    width: 45% !important;
    float: left;
}

#contactDetailForm #ContactLoginTab {
    height: inherit;
    position: relative;
    overflow: auto;
    outline: var(--bg-border-light);
    outline-style:solid;
    outline-width: thin;
    outline-offset:0px;
    border-radius: var(--border-radius-sm);
    background: var(--bg);
    align-items: flex-start;
    padding: 5px !important;
}
#contactDetailForm:has(#RelationsContactsNotesTab[aria-hidden="false"]){
    overflow: auto;
    height: calc(100% - 40px);
}
#contactDetailForm:has(#RelationsContactsNotesTab[aria-hidden="false"]) .noteHolder{
    height: 100% !important;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"] form{
    width: 100% !important;
    height: inherit;
    position: relative;
    overflow: auto;
    align-items: flex-start;
    padding-top: 1px;
    padding-bottom: 1px;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"] form .halfWidth, .ui-dialog-content[id^="btnFilterIonBizDialog"] form .halfSizeLeft, .ui-dialog-content[id^="btnFilterIonBizDialog"] form .halfSizeRight {
    height: inherit;
    position: relative;
    overflow: auto;
    outline: var(--section-border);
    outline-style:solid;
    outline-width: thin;
    outline-offset:0px;
    border-radius: var(--border-radius-sm);
    background: var(--bg);
    align-items: flex-start;
    margin-right: 5px;
    margin-left: 5px !important;
    padding-top: 5px;
    padding-bottom: 5px;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"] form:has(.halfWidth, .halfSizeLeft){
    display: flex;
    
}
.ui-dialog-content form#contractFiltersForm .detailRow{
    min-width:440px;
}
.ui-accordion .ui-accordion-content:has(form.ionbizdetails) form.ionbizdetails{
    box-shadow: none !important;
    border-color: transparent !important;
    background: transparent !important;
}
#contactDetailForm #ContactLoginTab{ /*Contancts > Login form*/
    margin: 5px;
    width: calc(100% - 30px) !important;
}
 .ui-dialog-content[id^="btnQuickInsertIonBizDialog"],  .ui-dialog-content[id^="btnImportPlanningIonBizDialog"],  .ui-dialog-content[id^="btnAssignResourceIonBizDialog"], .ui-dialog-content[id^="btnOrderByIonBizDialog"] {
    
    height: inherit;
    position: relative;
    overflow: auto;
    box-shadow: inset var(--shaddow) 0px 0px 2px 0px;
    background: var(--bg) !important;
    align-items: flex-start;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-left: 5px;
    margin-right: 5px;
}
 .ui-dialog-content[id^="btnOrderByIonBizDialog"]{
     overflow: hidden;
 }

.twoThirdsWidth {
    width: 66%!important;
    float: left!important;
}

.w24Procent { width: 24% !important; }
.w25Procent { width: 25% !important; }
.w33Procent { width: 33% !important; }

.taC { text-align: center !important;}
.tcRed { color: var(--red)!important; }
.tcOrange { color: orange!important; }
.tcGreen { color: var(--dark-green)!important; }
.tcBlue { color: #0000ff!important; }
.redCircle {
    border-radius: 50%;
    width: 17px;
    height: 17px;
    background-color: var(--red);
    display: inline-block;
    margin-top: 4px;
}
/* \Colored buttons      */
.row { float: left;clear: both;width: 100%;}
.hidden, .hide { display: none!important;visibility: hidden;}
.clearfix:after {content: ".";}
.clearfix { display: block; clear: both; visibility: hidden; line-height: 0px; height: 0px;}
html[xmlns] .clearfix {display: block;}
* html .clearfix {height: 1%;}
.pF { position: fixed;}
.disabled {opacity: 0.7;cursor: none;}
.btnAction.disabled { cursor: default; }

/* Status Colors */
.ui-menu-item.colorautocomplete-item { border-bottom: 0px!important;}
.ui-menu-item.colorautocomplete-item .icon-ok:before {
    color: var(--menu-hover);
    font-size: 15px;
    line-height: 1;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0px;
    display: flex;
    align-items: center;
    padding-right:5px;
    padding-left:5px;
    visibility: visible;
}
/* the label stops short of the check-mark instead of being masked by an opaque check */
.ui-menu-item.colorautocomplete-item > a.icon-ok:last-of-type {
    width: calc(100% - 55px);
}
.ui-menu-item.colorautocomplete-item > a:first-of-type, .colorautocomplete-color {
    position: relative!important;
    width: 17px;
    height: 0;
    text-indent: 24px!important;
    float: left;
    visibility: collapse;
}
td[role="gridcell"] .colorautocomplete-color + span { float: left; margin-left: 26px;}
/* jqGrid gives the label span an inline line-height of 26px, and that span sets the
   cell's line box. Match it so the generic calc(1lh/2) centring below lands on the
   text rather than on the td's own 18px line-height. */
td[role="gridcell"] .colorautocomplete-color { line-height: 26px; }

.detailInput .colorautocomplete-color ~ span, .detailInput .colorautocomplete-color ~ .ionbiz-color-autocomplete { text-indent: 26px!important;float: left; }
.ui-menu-item.colorautocomplete-item > a:first-of-type:after, .colorautocomplete-color:after {
    height: 12px;
    width: 12px;
    content: " ";
    position: absolute;
    background: inherit;
    border-radius: 50%;
    box-sizing: border-box;
    /* Positioned by its CENTRE (not a corner), so it stays put at any dot size.
       13px = middle of the 26px gutter reserved before the label by the
       text-indent/margin-left rules above; the container itself is only 17px wide
       and 0 tall, with its top on the text line box, so half a line centres it
       vertically without the per-context top offsets this used to need. */
    left: 13px;
    top: 9px;
    top: calc(1lh / 2);
    transform: translate(-50%, -50%);
    z-index: 1;
    visibility: visible;
}
/* In a detail form the container starts at the input's left edge (in a grid cell it
   is already inset by 3px), so it needs its own centre to land on the same 16px as
   the minicolors swatch. The row's inherited 33px line-height would put calc(1lh/2)
   half a pixel below the centre of the 32px field, so match the field height. */
.detailInput .colorautocomplete-color { line-height: 32px; }
.detailInput .colorautocomplete-color:after { left: 16px; }

.ui-menu-item.colorautocomplete-item > a, .ionbiz-color-autocomplete { text-transform: uppercase;}
.ionbiz-color-autocomplete.no-uppercase { text-transform: none; }
.ui-autocomplete.no-uppercase .colorautocomplete-item > a { text-transform: none; }
.ui-menu-item.colorautocomplete-item > a:last-of-type {
    height: 30px;
    padding: 0px!important;
    display: inline-block;
    font-size: 12px;
    color: inherit;
    width: calc(100% - 30px);
    overflow: hidden;
    text-overflow: ellipsis;
}

.sBlue:not(.pItem), .ui-jqgrid-bdiv div.pItem.sBlue, .ui-jqgrid-bdiv div.pItem.sBlue:before  {background:#a6cdf4; background-color: #a6cdf4;}

.sOrange:not(.pItem), .ui-jqgrid-bdiv div.pItem.sOrange, .ui-jqgrid-bdiv div.pItem.sOrange:before  {background: Orange; background-color: Orange;}

.sGreenVivid:not(.pItem), .ui-jqgrid-bdiv div.pItem.sGreenVivid, .ui-jqgrid-bdiv div.pItem.sGreenVivid:before {background: #c8ecc9; background-color: #c8ecc9; }

.sYellow:not(.pItem), .ui-jqgrid-bdiv div.pItem.sYellow, .ui-jqgrid-bdiv div.pItem.sYellow:before {background: #fcfcca; background-color: #fcfcca; }

.sPink:not(.pItem), .ui-jqgrid-bdiv div.pItem.sPink, .ui-jqgrid-bdiv div.pItem.sPink:before {background: #f4c4c4; background-color: #f4c4c4; }

/* The last two of the timesheet-status family. They used to exist only scoped to the cells grid, so
   anything else emitting the class ColorCodes.GetTimesheetStatusBackgroundClass returns got no
   background at all. The cells page's own rules are more specific and !important, so they win there. */
.sGreenClosed:not(.pItem) {background: var(--weekend-bg); border: 1px solid var(--bg-border); }

.sGreenInvoiced:not(.pItem) {background: var(--dark-green); background-color: var(--dark-green); color: #fff; }
 
.sRedVivid:not(.pItem), .ui-jqgrid-bdiv div.pItem.sRedVivid, .ui-jqgrid-bdiv div.pItem.sRedVivid:before {background: #fa5c5c; background-color: #fa5c5c; }
   
.sGreen {background: linear-gradient(0deg, rgb(0, 154, 105) 0%, rgb(0, 224, 149) 90%);background-color: rgb(0, 154, 105);  }    

.sLime {background: linear-gradient(0deg, rgb(86, 133, 32) 0%, rgb(158, 227, 73) 90%);background-color: rgb(86, 133, 32);  }  

.sOrange {background: linear-gradient(0deg, rgb(184, 117, 2) 0%, rgb(255, 166, 0) 90%);background-color: rgb(255, 166, 0);}   

.sCyan {background: linear-gradient(0deg, rgb(0, 139, 160) 0%, rgb(3, 201, 227) 90%);background-color: rgb(0, 139, 160);}  

.sRed {background: linear-gradient(0deg, #cc0033 0%, rgb(255, 0, 0) 90%);background-color: rgb(255, 0, 0);} 

/* End Status Colors */

.filter-field {
    font-style: normal !important;
    font-weight: normal !important;
    display: inline-block;
    width: fit-content;
    height: fit-content;
    position: absolute;
}
.cell > .filter-field {
    right: 15px;
    top: 3px;
}
.detailInput > .filter-field {
    right: 0px;
}
/* For checkbox/toggle rows the .detailInput is sized to fit the toggle
   label, so the right-aligned reset X overlaps the toggle. Render the
   reset inline after the toggle label instead, with a small left margin
   so it sits next to the toggle rather than on top of it. */
.detailInput > input[data-checkbox="true"] ~ .filter-field {
    position: static;
    margin-left: 6px;
    vertical-align: middle;
}
.filter-field:hover {
    text-decoration: none !important;
}
    .filter-field:after {
        font-family: 'ionbiz';
        content: "\e622";
        font-size: 9px;
        color: var(--txt-color);
        opacity: 0.6;
    }

.ajaxLoading {
  position: relative;
}
    .ajaxLoading:after {
        content: '';
        background: transparent;
        width: 110%;
        height: 110%;
        position: absolute;
        border-radius: 100%;
        top: -5%;
        left: -5%;
        opacity: 0.8;
        box-shadow: var(--menu-hover) -4px -5px 0px -4px;
        animation: rotate 0.5s infinite linear;
    }

.ajaxLoadingModal {
    animation: rotate 1.5s infinite linear;
}

/* Overlays the top of #workspace without taking a row; z-index stays under the unpinned rail's 30. */
#ajaxBar {
    grid-area: body;
    align-self: start;
    position: relative;
    z-index: 20;
    height: 2px;
    overflow: hidden;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.4s;
}
    /* The show delay keeps fast calls from flickering it. */
    #ajaxBar.on {
        opacity: 1;
        transition-delay: 0.25s;
    }
    /* Two segments of varying length chasing each other; translate+scale (compositor) instead of left/right (layout every frame). */
    #ajaxBar::before,
    #ajaxBar::after {
        content: '';
        position: absolute;
        inset: 0;
        background: var(--menu-hover);
        border-radius: 999px;
        transform-origin: left;
        transform: scaleX(0);
    }
    #ajaxBar::before {
        animation: ajaxBarLong 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
    }
    #ajaxBar::after {
        animation: ajaxBarShort 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) 1.15s infinite;
    }
    #ajaxBar:not(.on)::before,
    #ajaxBar:not(.on)::after {
        animation: none;
    }

/* Rails only: the top and bottom bars already show the avatar spinner where the eye goes. */
body:not([data-menu-position="left"], [data-menu-position="right"]) #ajaxBar {
    display: none;
}
@media (max-width: 768px) {
    #ajaxBar {
        display: none;
    }
}

/* translateX = left edge, scaleX = width (100% - left - right). */
@keyframes ajaxBarLong {
    0%   { transform: translateX(-35%) scaleX(0.35); }
    60%  { transform: translateX(100%) scaleX(0.9); }
    100% { transform: translateX(100%) scaleX(0.9); }
}
@keyframes ajaxBarShort {
    0%   { transform: translateX(-200%) scaleX(2); }
    60%  { transform: translateX(107%) scaleX(0.01); }
    100% { transform: translateX(107%) scaleX(0.01); }
}

@media (prefers-reduced-motion: reduce) {
    #ajaxBar::before,
    #ajaxBar::after { animation-duration: 6s; }
}
.float-right{
    float:right;
    margin-right:5px;
}



@media (max-width: 1024px), (orientation: portrait) {
    #workspace > .ui-layout-east .btnMaxPanel, #workspace > .ui-layout-east .btnMinPanel { display: none!important;}
    .layoutBtns { width: 45px!important;  max-height: 28px; overflow: hidden;}
    #workspace > .ui-layout-east { width: 100%!important;}     
    #workspace > .ui-layout-resizer.ui-layout-resizer-east-open { right: 100%!important;} 
    #eastToolbar {margin-right: 50px!important;width: calc(100% - 50px)!important;max-width: 100% !important;}
    .ui-dialog:not(.contextMenuPlugin):not(.bubbleDialog)
    {
        width: 100%!important;
        max-width: 100%!important;
        height: 100%!important;
        max-height: 100%!important;
        left:0px!important;
        top:0px!important;
    }
    
    .ui-dialog:not(.contextMenuPlugin):not(.bubbleDialog) .ui-dialog-content {
        width:inherit!important; 
        max-width: 100%!important;
        height: calc(100% - 100px)!important;
        max-height: calc(100% - 100px)!important;
        box-sizing:border-box;
    }
    .ui-dialog .ui-dialog-content {
        min-height: 90px !important;
    }
    .ui-dialog .ui-dialog-content:has(div[style="float:left; width:50%;"]){ /*forms like the Settings > Resources > Departments*/
    display: flex;
    }
    #btnMaxModal {display:none!important;}   

    #detailNameHolder { display: none!important;}   
    #quickSearchHolder input { width: 110px!important;}
    #quickSearchHolder ~ #gridDetailName, #quickSearchHolder ~ #breadcrumbForm {max-width: calc(100% - 260px)!important;}
    
    .reportFilterCriteria .submitReport {display: none!important;}
    .ui-dialog .reportFilterCriteria .submitReport {display: block!important;}
    /* inline-flex, not block: these are .extraToolbar buttons whose glyph and caption need
       the flex centering and gap, otherwise they align on the baseline at mismatched sizes. */
    #eastToolbar #btnGenerate, #eastToolbar #btnReset { display: inline-flex!important;}
    .gridMenu .extraToolbar.btnReset, .gridMenu .extraToolbar.btnGenerate { padding: 0 16px 0 20px; width:auto;}
    .tooltipster-ionBIZ{
        min-width: auto !important;
    }
    .ui-jqgrid .ui-jqgrid-bdiv{
        overflow: auto !important;

    }
}

@media (max-width: 600px)
{
    #eastToolbar { width: calc(100% - 50px)!important;margin-right: 50px!important;max-width: 100% !important;}
    #logo {
        width: 45px !important;
        overflow: hidden;
        margin: 4px 0px 0px 5px;
    }

    #mainMenu { padding-left: 48px!important; padding-right:50px !important; }
    #mainMenu:has(~ #myMenu #quickSearchHolder){
        height:95px !important;
    }
     .dropdown-links .contentBox, #mainMenu #innerMainMenu > .more-menu > .dropdown-links > .contentBox > a:first-of-type:after,
     #mainMenu .dropdown-links a:before,
     #innerMainMenu .dropdown-links .contentBox
    {
        width:110px !important;
    }
    #innerMainMenu .dropdown-links{ right: 3px;}
    #mainMenu > .toolbarMenuShadow{width: 85% !important}
    #mainMenu div.scrollableArea .contentBox.activeSubmenu > a:first-of-type:after, #mainMenu div.scrollableArea .contentBox.active > a:first-of-type:after,
    #mainMenu .contentBox.activeSubmenu a:not(.btnSubMenu):before, #mainMenu .contentBox.active a:not(.btnSubMenu):before,
    #innerMainMenu .contentBox{
        width: 50px !important;
    }
    #mainMenu #innerMainMenu > .more-menu > .dropdown-links > .contentBox.active > a:first-of-type:after,
    #mainMenu #innerMainMenu > .more-menu > .dropdown-links > .contentBox.activeSubmenu > a:first-of-type:after,
    #mainMenu #innerMainMenu > .more-menu > .dropdown-links > .contentBox.activeSubmenu a:not(.btnSubMenu):before, 
    #mainMenu #innerMainMenu > .more-menu > .dropdown-links > .contentBox.active a:not(.btnSubMenu):before{
        width: 110px !important;
    }
    #mainMenu div.scrollableArea .contentBox > a:first-of-type:after, #mainMenu #innerMainMenu > .contentBox > a:first-of-type:after,
    #mainMenu #innerMainMenu > .contentBox.active > a:first-of-type:after,
    #mainMenu #innerMainMenu > .contentBox.activeSubmenu > a:first-of-type:after{
        width: 50px !important;
    }
    #mainMenu a:before {
        width: 50px !important;
    }
    #mainMenu a.btnSubMenu:before {
        width: 30px !important;
        top: 10px !important;
    }
    .ui-dialog .dropdown-links{
        right: 10px;
    }
    .scrollableArea .contentBox > .btnSubMenu, #innerMainMenu .contentBox > .btnSubMenu {
        width: 30px !important;
        height: 30px !important;
        left: 35px !important;
        top: -45px !important;
    }
    .btnSubMenu:before {
        left: 3px !important;
        top: 4px !important;
        font-size: 10px !important;
    }
    span.breadcrumb {display: none;}
    #myMenu { top: 57px!important; width:99% !important;margin-right:2px;margin-left:2px;display:flex; flex-direction:row-reverse;justify-content:flex-end;}
    #myMenu .myPic{
        position: fixed !important;
        right: 0px;
        top: 1px;
        z-index: 1 !important;
    }
    span.btnShowNotes.icon-notes {
        position: fixed !important;
        right: 11px;
        top: 46px;
        z-index: 2;
        height: 30px;
        transform: rotate(0deg);
    }

    .ui-dialog .ui-dialog-buttonpane {
        display: flex !important;
        justify-content: center !important;
    }
    .columChooser > .ui-dialog-buttonpane{
        border-top: solid 1px var(--bg-border) !important;
    }
    .darkFooter > .actionsAndMsg {
        display: flex !important;
        justify-content: center !important;
    }
    .reportFilterCriteria {
        height: auto !important;
    }
    .ui-dialog-content[id^="btnFilterIonBizDialog"] .halfWidth, .halfSizeLeft, .halfSizeRight {
        width: 100% !important;
    }
    .maxWidth, .detailsContainer, .threeColumns  {
        display: flex !important;
        flex-direction: column !important;
    }
    .halfWidth, .thirdWidth, .ui-dialog-content .halfWidth {
        width: 100% !important;
    }
    span.unreadNotes{
        top: 0px !important;
    }
    span.unreadNotes:before {
        margin-left: -6px !important;
        min-width: 12px !important;
        height: 8px !important;
        line-height: 8px !important;
        border-radius: 4px !important;
    }
    .replyToBox{
        display:flex;
    }
    .ui-dialog-content[id^="btnFilterIonBizDialog"] form{
        width:auto !important;
    }
    .detailRow {
        width: calc(100% - 10px);
    }
    #quickSearchHolder input {
        width: calc(90vw - 62px) !important;
        box-shadow: none !important;
        border: 0px !important;
        border-radius: var(--border-radius-sm) !important;
        min-height: 32px !important;
        margin-top: 4px !important;
        margin-left: 50px !important;
    }
    body.dark #quickSearchHolder input {
        color: var(--txt-color) !important;
        background: var(--input-bg) !important;
    }
    /*resize the layout to 1 column*/
    .displayGrid .halfSizeRight {
        grid-column-start: 1 !important;
        margin-left: 0px !important;
        margin-top: 5px !important;
    }
    .displayGrid {
        grid-template-columns: 1fr !important;
        min-width:85vw !important;
    }
    .ionbizdetails.editMode .detailInput > .halfWidth:has(.ui-autocomplete-input.iconAC:not(.hide)):after {
        left: calc(100% - 20px) !important;
    }
    .ui-dialog-content .reportFilterCriteria{
        width: 99%;
    }
    #addDialog, #addDialog .addBox{ width: 100vw !important;}
    /* #twrBadges is excluded: the full-width, 55vh treatment suits the big forms, but the Time
       registration badge list is a short list that should stay anchored to the button it opened from. */
    .ui-tooltip.userSubMenu:not(:has(#twrBadges)) {
        position: absolute;
        width: 100vw !important;
        height: 55vh !important;
        max-width: 100vw !important;
        left: 0 !important;
        box-sizing: border-box;
        padding: 10px 20px;
        overflow-x: auto;
    }
    .userSubMenuHolder, .userSubMenuHolder > .halfWidth, .changePassHolder, .userEditAccountTop {
        width: 80vw !important;
        padding: 5px !important;
        z-index: 1 !important;
        background: var(--bg);
        position: sticky;
    }
    #timesheetCellsWidget .ui-jqgrid-view .frozen-bdiv.ui-jqgrid-bdiv:not(.ui-jqgrid-bdiv-clone),
    #timesheetCellsWidget .ui-jqgrid-bdiv-clone,
    #timesheetCellsWidget .ui-jqgrid-view .frozen-div.ui-jqgrid-hdiv {
        width: 210px !important;
        overflow-x: hidden !important;
    }
    td > span:has(.ui-autocomplete-input.iconAC):has(.shortcut-autocomplete):after {
        left: calc(100% - 56px) !important;
    }
    .reportFilterCriteria .cell{
        width: 49%;
    }
    .ui-dialog-content[id^="btnFilterIonBizDialog"] form .halfWidth, .ui-dialog-content[id^="btnFilterIonBizDialog"] form .halfSizeLeft, .ui-dialog-content[id^="btnFilterIonBizDialog"] form .halfSizeRight{
        overflow:visible !important;
        margin-top: 5px;
        margin-left: 1px !important;
        width: calc(100% - 3px) !important;
        margin-right: 0px;
        height:auto;
    }
    /*CHAT BUBBLE*/
    .ui-tooltip:has(#chat-window){
        left: 0px !important;
        width: 100vw !important;
        height: 82vh !important;
    }
    #ionChat:before{
        z-index:99999;
        position:fixed;
        bottom:45px;
        right:20px;
        background:var(--bg);
        border-radius:50%;
    }
    /*END CHAT BUBBLE*/
}
@media (max-width: 1024px), (orientation: portrait){
    #northLayout {
        z-index: auto !important;
    }
    #timesheetCellsWidget .ui-jqgrid-view .frozen-bdiv.ui-jqgrid-bdiv:not(.ui-jqgrid-bdiv-clone),
    #timesheetCellsWidget .ui-jqgrid-bdiv-clone,
    #timesheetCellsWidget .ui-jqgrid-view .frozen-div.ui-jqgrid-hdiv {
        width: 210px !important;
        overflow-x: hidden !important;
    }
    #sortable.ui-sortable{
        
        overflow:scroll;
    }
}

@media (max-width: 800px), (orientation: portrait)
{
    .loginBody { background-image: none!important;}
    .loginBox { left: 0%!important; margin: auto!important; right: 0px!important; }
    
    .ui-dialog:not(.contextMenuPlugin)
    {
        width: 100%!important;
        max-width: 100%!important;
        height: 100%!important;
        max-height: 100%!important;
        left:0px!important;
        margin-left: 0px !important;
        top:0px!important;
        border-radius: 0px !important;
    }

        .ui-dialog:not(.contextMenuPlugin) .ui-dialog-content {
            max-width: 100% !important;
            /*height: calc(100% - 100px)!important;*/
            max-height: calc(100% - 100px)!important;
        }
    .ui-dialog-content[id^="btnFilterIonBizDialog"] form {
        display: flex;
        flex-direction: column;
    }
    .savedFilters{
        padding-top: 10px;
        width: 96% !important;
        height:auto;
        min-height:300px;
        margin-top: 5px;
        margin-right: 0px;
        display:inline-block;
        overflow:visible;
    }
     #sortable.ui-sortable{
        
        max-height: calc(100%) !important;
        overflow:scroll;
    }
}
@media (max-width: 1024px){
    .gridMenu #submitLines {
        float: none !important;
        margin-left: 10px !important;
        align-items: center;
        position: fixed !important;
        background: var(--east-bg);
        border-radius: 0px;
        border-left: 1px solid var(--bg-border);
        padding-left: 5px;
        right: 18px !important;
        backdrop-filter: blur(2px);
        z-index: 1;
    }
}

@keyframes rotate {
  0% {
    transform: rotateZ(0deg);
  }
  100% {
    transform: rotateZ(360deg);
  }
}

@keyframes blinker {  
  50% { opacity: 0.2; }
}

@keyframes highlight {  
  0% {
      box-shadow: 0 0 5px rgba(81, 203, 238, 1);
  }
    100% {
    }
}

/********************************************************
    Ribbon-style Filter Dialog
********************************************************/
.ribbon-filter-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    padding: 6px 0px 3px 0px;
    border: 1px solid transparent;
    border-radius: var(--border-radius-md);
    min-height: 36px;
    cursor: text;
    transition: border-color 0.15s, box-shadow 0.15s;
    margin: 0px;
}
/* Read-only filter chips — form-control look (rectangular, subtle border,
   type-specific trailing affordance icon). Click the chip to edit the value
   inline. Used in every ribbon mode (inline, dialog, reportFilterCriteria). */
.ribbon-filter-chip {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 100px;
    height: 32px;
    /* Right padding reserves a fixed actions zone for the absolutely
       positioned .chip-remove (and any trailing type-affordance icon),
       matching the editor's `padding-right: 32px`. Keeping both right
       paddings identical is what lets the X stay in exactly the same
       screen position when the chip swaps to the editor and back. */
    padding: 0 32px 0 8px;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    flex-shrink: 0;
    user-select: none;
    cursor: pointer;
    box-sizing: border-box;
    border-radius: var(--border-radius-xs, 3px);
    border: 1px solid var(--bg-border-light, #b6bcc4);
    background: var(--bg, #fff);
    color: var(--txt-color);
    box-shadow: none;
    transition: border-color 0.12s ease, box-shadow 0.12s ease, background-color 0.12s ease;
}
.ribbon-filter-chip:hover {
    border-color: var(--menu-hover, #2563eb);
    background: var(--east-bg, #fff);
    box-shadow: none;
    transform: none;
}
.ribbon-filter-chip:focus-within,
.ribbon-filter-chip:active {
    border-color: var(--menu-hover, #2563eb);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--menu-hover, #2563eb) 18%, transparent);
}
/* No legacy hover pencil — affordance lives in the trailing type icon. */
.ribbon-filter-chip::after { display: none; }

/* Brief border flash applied when a chip is freshly added,
   so the user can see where the new filter landed in the bar. */
@keyframes ribbon-chip-flash {
    0%, 40% { border-color: var(--menu-hover); }
    100%    { border-color: var(--bg-border, #b6bcc4); }
}
.ribbon-filter-chip.ribbon-filter-chip-new {
    animation: ribbon-chip-flash 1.1s ease-out;
}
/* Drag-and-drop reordering states. The whole chip is draggable. While
   dragging, the chip is moved live in the DOM so the other chips slide
   aside to make room; the dragged chip itself renders as a muted dashed
   placeholder marking the slot it will drop into. */
.ribbon-filter-chip[draggable="true"] {
    cursor: grab;
}
/* The value text isn't a drag origin — keep the normal pointer there. */
.ribbon-filter-chip[draggable="true"] .chip-value {
    cursor: pointer;
}
/* Chips ease into their new positions as the dragged chip is moved
   between them, so the "make room" shift reads as a smooth slide. */
.ribbon-chips-reordering .ribbon-filter-chip {
    transition: transform 0.15s ease, margin 0.15s ease;
}
.ribbon-filter-chip.ribbon-filter-chip-dragging {
    cursor: grabbing;
    opacity: 0.6;
    background: var(--menu-hover-bg, rgba(0, 0, 0, 0.04));
    border-style: dashed;
    border-color: var(--menu-hover);
    box-shadow: none;
}
/* Every chip child class must be listed here -- a `> *` subject would be tested against
   every element in the document. Chip children are built in Utils.js buildChip(). */
.ribbon-filter-chip.ribbon-filter-chip-dragging > .chip-favorite,
.ribbon-filter-chip.ribbon-filter-chip-dragging > .chip-required-marker,
.ribbon-filter-chip.ribbon-filter-chip-dragging > .chip-label,
.ribbon-filter-chip.ribbon-filter-chip-dragging > .chip-sep,
.ribbon-filter-chip.ribbon-filter-chip-dragging > .chip-value,
.ribbon-filter-chip.ribbon-filter-chip-dragging > .chip-remove,
.ribbon-filter-chip.ribbon-filter-chip-dragging > .chip-lock {
    visibility: hidden;
}
/* Favorite (star) toggle at the leading edge of the chip. Persists per
   page+form to localStorage; favorited chips re-appear on the next
   visit even when their field has no value. Uses flex `order: -2` so it
   precedes the date/type leading icon (which is at order: -1).
   Mirrored on the chip editor so the star stays in place when the user
   enters edit mode (no left-edge content shift). */
.ribbon-filter-chip .chip-favorite,
.ribbon-chip-editor .chip-favorite {
    order: -2;
    flex-shrink: 0;
    border: none;
    padding: 0;
    margin: 0 2px 0 -2px;
    cursor: pointer;
    width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--txt-color-muted, #9ca3af);
    opacity: 0.45;
    background: center/12px 12px no-repeat
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='%239ca3af' stroke-width='1.2' stroke-linejoin='round' d='M8 1.8l1.95 3.95 4.35.63-3.15 3.07.74 4.32L8 11.74l-3.89 2.04.74-4.32L1.7 6.38l4.35-.63z'/></svg>");
    transition: opacity 0.12s ease, transform 0.12s ease;
}
/* Inside the editor, drop the chip's negative margin-left on the star so
   it sits within the editor's content box (the editor has overflow:hidden
   removed, but the chip's -2px would still nudge the star against the
   editor border and visually clip it). */
.ribbon-chip-editor .chip-favorite,
.ribbon-chip-editor .chip-favorite-locked {
    margin: 0 4px 0 0 !important;
}
/* Editor is in focus the entire time it's open, so don't gate the
   star's visibility on hover \u2014 keep it readable at the same opacity
   as a hovered chip's star. */
.ribbon-chip-editor .chip-favorite {
    opacity: 0.7;
}
.ribbon-filter-chip:hover .chip-favorite {
    opacity: 0.7;
}
.ribbon-filter-chip .chip-favorite:hover,
.ribbon-chip-editor .chip-favorite:hover {
    opacity: 1;
    transform: scale(1.1);
}
.ribbon-filter-chip.rce-favorite .chip-favorite,
.ribbon-chip-editor.rce-favorite .chip-favorite {
    /* Filled gold star for the active state. */
    opacity: 1;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='%23f59e0b' stroke='%23d97706' stroke-width='1' stroke-linejoin='round' d='M8 1.8l1.95 3.95 4.35.63-3.15 3.07.74 4.32L8 11.74l-3.89 2.04.74-4.32L1.7 6.38l4.35-.63z'/></svg>");
}
/* Required-field placeholder rendered in the leading slot instead of the
   favorite star. Non-interactive — purely a visual cue that the filter is
   permanent. Inherits the favorite's sizing/positioning so the actions zone
   stays visually consistent across favoritable and required chips. */
.ribbon-filter-chip .chip-favorite.chip-favorite-locked,
.ribbon-chip-editor .chip-favorite.chip-favorite-locked {
    cursor: default;
    pointer-events: none;
    opacity: 0.55;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='%236b7280' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round' d='M4.5 7.5h7v6h-7zM6 7.5V5a2 2 0 0 1 4 0v2.5'/></svg>");
}
.ribbon-filter-chip:hover .chip-favorite.chip-favorite-locked,
.ribbon-chip-editor .chip-favorite.chip-favorite-locked:hover {
    opacity: 0.55;
    transform: none;
}
.ribbon-filter-chip .chip-label {
    font-size: 12px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    opacity: 0.8;
    color: var(--txt-color, #1f2937);
    background: transparent;
    padding: 0;
}
.ribbon-filter-chip .chip-sep {
    width: auto;
    height: auto;
    background: transparent;
    margin: 0;
    color: var(--txt-color-muted, #9ca3af);
    font-weight: 400;
}
.ribbon-filter-chip .chip-sep::before {
    content: ":";
    font-size: 12px;
}
.ribbon-filter-chip .chip-value {
    font-size: 12px;
    font-weight: 500;
    color: var(--txt-color, #1f2937);
    text-align: left;
    margin-left: 0;
    max-width: 200px;
    min-width: 0;
    flex: 0 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ribbon-filter-chip .chip-remove {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    color: var(--txt-color, #1f2937);
    opacity: 0.4;
    /* Hide the textual × glyph — it sits off-center in Firefox because
       U+00D7 is laid out at x-height. We draw the cross geometrically
       with two centered pseudo-element bars instead. */
    font-size: 0;
    /* Pulled out of the flex flow and pinned to the chip's right edge
       at the same offset as the editor's .rce-close (`right: 6px`).
       Two consequences:
         1. The X stays in the exact same screen position when the chip
            swaps to the editor and back — no horizontal bouncing.
         2. Trailing type-affordance icons (chevron / pencil / check)
            no longer share the flex slot with the X, so their position
            is independent of whether the X is present (e.g. required
            chips that lack a .chip-remove). */
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 16px;
    width: 16px;
    z-index: 2;
}
.ribbon-filter-chip .chip-remove::before,
.ribbon-filter-chip .chip-remove::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 9px;
    height: 1.5px;
    background: currentColor;
    border-radius: 1px;
    transform-origin: center;
}
.ribbon-filter-chip .chip-remove::before {
    transform: translate(-50%, -50%) rotate(45deg);
}
.ribbon-filter-chip .chip-remove::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}
.ribbon-filter-chip .chip-remove:hover {
    color: var(--menu-hover, #2563eb);
    opacity: 1;
}
/* When the × means "remove the chip from the ribbon" (chip already
   has no value), give it a slightly stronger baseline opacity so the
   intent reads as more permanent. */
.ribbon-filter-chip .chip-remove.chip-remove-dismiss {
    opacity: 0.6;
    color:var(--red);
}
/* Pinned (cleared-value) chip — keep the slot visible but de-emphasize
   it so it's clear no value is currently filtering. */
.ribbon-filter-chip.rce-pinned {
    background: var(--bg, #f9fafb);
    border-style: dashed;
}
.ribbon-filter-chip.rce-pinned .chip-value:empty::before {
    content: "\2014"; /* em dash placeholder */
    color: var(--txt-color-muted, #9ca3af);
    opacity: 0.6;
}

/* Active chip — same shape, value gains accent color */
.ribbon-filter-chip.rce-has-value {
    background: var(--bg, #fff);
    border-color: var(--bg-border-light, #b6bcc4);
}
/* User-edited chip — subtle accent tint so the user can distinguish
   chips they've actively changed from values restored by a saved filter
   / page-default load. Applied only after a chip-editor commit. */
.ribbon-filter-chip.rce-user-edited {
    background: color-mix(in srgb, var(--menu-hover, #2563eb) 8%, var(--east-bg, #fff));
    border-color: color-mix(in srgb, var(--menu-hover, #2563eb) 30%, var(--bg-border, #b6bcc4));
}
.ribbon-filter-chip.rce-has-value .chip-value {
    color: var(--menu-hover, #2563eb);
    font-weight: 600;
}

/* Required marker — red asterisk after the favorite icon */
.ribbon-filter-chip.rce-required .chip-required-marker,
.ribbon-chip-editor .chip-required-marker {
    color: var(--red);
    font-weight: 700;
    font-size: 14px;
    line-height: 1;
    margin-right: -2px;
    align-self: center;
    position: relative;
    top: 3px;
}
/* Lock indicator — appears in the right-edge actions zone (same slot
   the × normally occupies) on required chips that can't be removed.
   Provides a clear "permanent / locked" affordance instead of leaving
   that area visually empty. Positioned identically to .chip-remove so
   the icon lines up with the X on neighbouring removable chips. */
.ribbon-filter-chip .chip-lock {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 16px;
    width: 16px;
    pointer-events: none;
    color: var(--txt-color-muted, #6b7280);
    opacity: 0.55;
    background: center/12px 12px no-repeat
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='%236b7280' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round' d='M4.5 7.5h7v6h-7zM6 7.5V5a2 2 0 0 1 4 0v2.5'/></svg>");
}

/* ── Type-specific trailing affordance icons ──────────────────────────── */
.ribbon-filter-chip::before {
    content: "";
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-left: 4px;
    order: 99;            /* push to the very end (after chip-remove if absent) */
    flex-shrink: 0;
    align-self: center;
    color: var(--txt-color-muted, #6b7280);
    opacity: 0.7;
    background: center/contain no-repeat;
    vertical-align: middle;
}
.ribbon-filter-chip:hover::before { opacity: 1; }
/* Select / multiselect / autocomplete / resource chips: render the dropdown
   chevron via ::after using the ionbiz icon font (\e944), matching the
   existing toolbar/detail-input chevron styling so the glyph is consistent
   across the app. */
.ribbon-filter-chip.rce-select::after,
.ribbon-filter-chip.rce-multiselect::after,
.ribbon-filter-chip.rce-autocomplete::after,
.ribbon-filter-chip.rce-resource::after {
    font-family: 'ionbiz' !important;
    content: "\e944";
    font-size: 9px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-flex;
    align-items: center;
    margin-left: auto;
    margin-right: 0;
    order: 50;
    flex-shrink: 0;
    color: var(--txt-color-muted, #6b7280);
    opacity: 0.6;
    pointer-events: none;
}
.ribbon-filter-chip.rce-select:hover::after,
.ribbon-filter-chip.rce-multiselect:hover::after,
.ribbon-filter-chip.rce-autocomplete:hover::after,
.ribbon-filter-chip.rce-resource:hover::after {
    opacity: 1;
}
/* Suppress the generic SVG chevron for the chip types we render via ::after. */
.ribbon-filter-chip.rce-select::before,
.ribbon-filter-chip.rce-multiselect::before,
.ribbon-filter-chip.rce-autocomplete::before,
.ribbon-filter-chip.rce-resource::before {
    content: none;
}
.ribbon-filter-chip.rce-date::before {
    order: -1;
    margin-left: 0;
    margin-right: 6px;
    font-family: 'ionbiz' !important;
    content: "\e943";
    font-size: 12px;
}
.ribbon-filter-chip.rce-checkbox::before {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><rect x='2.5' y='2.5' width='11' height='11' rx='2' fill='none' stroke='%236b7280' stroke-width='1.2'/><path d='M5 8.2l2.2 2.2L11 6.5' fill='none' stroke='%236b7280' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}
/* Mirror the chip-editor's right-aligned toggle: in read-only toggle
   chips push the Yes/No value (and its preceding ":" separator) to the
   chip's trailing edge so the layout reads "<icon> <label> ........ Yes". */
.ribbon-filter-chip.rce-checkbox .chip-sep {
    margin-right: auto;
}
.ribbon-filter-chip.rce-text::before {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='%236b7280' stroke-width='1.2' stroke-linejoin='round' d='M2.5 13.5l3-1 7-7-2-2-7 7-1 3z'/></svg>");
}
.ribbon-filter-input {
    border: 1px solid var(--menu-hover);
    border-radius: var(--border-radius-sm);
    outline: none;
    font-size: 12px;
    font-weight: 500;
    color: var(--txt-color);
    background-color: var(--bg)!important;
    width: 400px;
    height:40px !important;
    min-width: 300px;
    max-width: 400px;
    flex: 0 0 auto;
    flex-shrink: 0;
    font-family: inherit;
    padding: 5px 8px 5px 10px;
    white-space: nowrap;
    transition: border-color 0.15s;
}
.ribbon-filter-input::placeholder {
    color: var(--menu-hover);
    opacity: 1; /* Firefox dims placeholders by default; reset so the color is honoured */
    font-weight: 500;
}
/* Override the global `.ionbizdetails .detailInput input::placeholder` rule
   (which uses !important) so the ribbon search input still reads in the
   ribbon's accent color on reportFilterCriteria pages. */
.reportFilterCriteria .ribbon-filter-input::placeholder,
.ionbizdetails .ribbon-filter-input::placeholder {
    color: var(--menu-hover) !important;
    opacity: 1 !important;
    font-weight: 500 !important;
}
.ribbon-filter-input:focus {
    border-color: var(--menu-hover);
    outline: none;
    margin-top:unset !important;
    margin-bottom: unset !important;
    margin-left: unset !important;
}
.reportFilterCriteria .ribbon-filter-input{
    width: 120px !important;
    min-width: 120px !important;
}
.ribbon-filter-actions {
    display: flex;
    gap: 5px;
    align-items: center;
    margin-left: auto;
    flex-shrink: 0;
}
.reportFilterCriteria .ribbon-filter-actions{
    margin-left:unset;
}
.ribbon-filter-actions .ribbon-divider {
    width: 1px;
    height: 16px;
    margin-right: 7px;
    background: var(--bg-border-light);
}
/* Ribbon dropdown (appended to body, tooltip-style).
   The outer dropdown is a transparent positioning wrapper so the floating
   edit popup (a child) can extend outside its right/left edge without being
   clipped. Visual styling (background, shadow, scroll, rounded corners) lives
   on the inner .ribbon-dd-items container. */
.ribbon-filter-dropdown {
    position: absolute;
    z-index: 10000;
    min-width: 200px;
    max-width: 400px;
}
.ribbon-filter-dropdown .ribbon-dd-items {
    background: var(--bg);
    border-radius: 10px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12);
    border: 1px solid var(--bg-border-light);
    overflow: hidden;
    max-height: 400px;
    min-height: 40px;
    display: flex;
    flex-direction: column;
}
.ribbon-filter-dropdown .ribbon-dd-scroll {
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}
/* On mobile the dropdown spans the full viewport width (overrides JS-set inline left). */
@media (max-width: 700px) {
    .ribbon-filter-dropdown {
        left: 0 !important;
        right: 0 !important;
        min-width: 100vw !important;
        max-width: 100vw !important;
        width: 100vw !important;
    }
    .ribbon-filter-dropdown .ribbon-dd-items {
        border-radius: 0;
        /* Use the dynamic viewport height so the dropdown shrinks when the
           on-screen keyboard appears, keeping the inline chip editor / input
           visible above the keyboard. The 120px allowance covers the filter
           bar above the dropdown plus a small safety gap. */
        max-height: calc(100dvh - 120px);
    }
}
.ribbon-filter-dropdown .ribbon-dd-section-label {
    font-size: 9px;
    font-weight: 700;
    color: var(--txt-color);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    padding: 8px 14px 3px;
    opacity:0.8;
}
.ribbon-filter-dropdown .ribbon-dd-divider {
    height: 1px;
    background: var(--bg-border-light);
    margin: 4px 0;
}
.ribbon-filter-dropdown .ribbon-dd-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 7px 14px 7px 17px;
    margin: 5px;
    cursor: pointer;
    transition: background 0.1s;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 2px 0%;
}
.ribbon-filter-dropdown .ribbon-dd-item:hover {
    background-color: var(--hover);
    background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
    background-size: 2px 50%;
    background-repeat: no-repeat;
    background-position: left center;
    border-radius: var(--border-radius-xs);
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.ribbon-filter-dropdown .ribbon-dd-item .dd-item-left {
    display: flex;
    align-items: center;
    gap: 8px;
}
.ribbon-filter-dropdown .ribbon-dd-item .dd-item-left span.dd-item-label {
    font-size: 12px;
    color: var(--txt-color);
    font-weight: 500;
}
.ribbon-filter-dropdown .ribbon-dd-item .dd-item-right {
    display: flex;
    align-items: center;
    gap: 5px;
}
.ribbon-filter-dropdown .ribbon-dd-item .dd-item-right .dd-item-active {
    font-size: 10px;
    color: var(--blue);
    background: var(--bg);
    border:1px solid var(--bg-border-light);
    border-radius: 4px;
    padding: 1px 6px;
    font-weight: 600;
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ribbon-filter-dropdown .ribbon-dd-item .dd-item-right:after {
    /* Chevron removed — clicking an item now adds the chip directly,
       there's no longer an inline expand/popup, so the › arrow is misleading. */
    content: none;
}
/* In mobile inline-edit mode, swap the chevron for the ionbiz "down/expand"
   glyph (\e944) to indicate the row has expanded inline. */
@media (max-width: 700px) {
    .ribbon-filter-dropdown .ribbon-dd-item.ribbon-dd-item-editing .dd-item-right:after {
        content: "\e944";
        font-family: 'ionbiz' !important;
        font-size: 6px;
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
    }
}
/* Edit popup floating next to the dropdown. The popup is positioned in JS with
   a small gap on either side of the dropdown items wrapper so the rounded
   corners stay fully visible. .rfep-inline switches to the in-flow mobile
   layout. JS only toggles classes — no inline style writes for borders/radii. */
.ribbon-filter-edit-popup {
    position: absolute;
    z-index: 10000;
    background: var(--bg);
    box-shadow: 7px 8px 20px var(--shaddow);
    min-width: 230px;
    max-width: 420px;
    min-height: 86px;
    padding: 8px 10px 10px;
    /* Force header / body / footer to always stack vertically so the Apply button
       never lands beside the input, regardless of nested form layout rules. */
    display: flex;
    flex-direction: column;
    align-items: stretch;
    border: 1px solid var(--bg-border-light);
    border-radius: 10px;
    /* --rfep-arrow-top is set by JS to the vertical center of the source item,
       relative to the popup's top edge. */
    --rfep-arrow-top: 20px;
}
/* Speech-bubble arrow connecting the popup to the source item.
   Two layered pseudo-elements: ::before is the border, ::after is the fill,
   offset by 1px so the arrow inherits the popup's border color cleanly. */
.ribbon-filter-edit-popup.rfep-arrow-left::before,
.ribbon-filter-edit-popup.rfep-arrow-left::after,
.ribbon-filter-edit-popup.rfep-arrow-right::before,
.ribbon-filter-edit-popup.rfep-arrow-right::after {
    content: "";
    position: absolute;
    top: var(--rfep-arrow-top);
    width: 0;
    height: 0;
    border-style: solid;
    pointer-events: none;
}
/* Popup sits to the RIGHT of the dropdown — arrow points left toward the item. */
.ribbon-filter-edit-popup.rfep-arrow-left::before {
    left: -9px;
    transform: translateY(-9px);
    border-width: 9px 9px 9px 0;
    border-color: transparent var(--bg-border-light) transparent transparent;
}
.ribbon-filter-edit-popup.rfep-arrow-left::after {
    left: -8px;
    transform: translateY(-8px);
    border-width: 8px 8px 8px 0;
    border-color: transparent var(--bg) transparent transparent;
}
/* Popup sits to the LEFT of the dropdown — arrow points right toward the item. */
.ribbon-filter-edit-popup.rfep-arrow-right::before {
    right: -9px;
    transform: translateY(-9px);
    border-width: 9px 0 9px 9px;
    border-color: transparent transparent transparent var(--bg-border-light);
}
.ribbon-filter-edit-popup.rfep-arrow-right::after {
    right: -8px;
    transform: translateY(-8px);
    border-width: 8px 0 8px 8px;
    border-color: transparent transparent transparent var(--bg);
}
.ribbon-filter-edit-popup .rfep-body {
    width: 100%;
    min-width: 0;
}
.ribbon-filter-edit-popup .rfep-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
}
.ribbon-filter-edit-popup .rfep-label {
    font-size: 11px;
    color: var(--txt-color);
    font-weight: 600;
}
.ribbon-filter-edit-popup .rfep-close {
    background: transparent;
    border: 0;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    color: var(--txt-color);
    padding: 2px 6px;
    opacity: 0.7;
    margin-left: auto;
}
.ribbon-filter-edit-popup .rfep-close:hover {
    opacity: 1;
}
/* The autocomplete suggestion menu is appended to <body> with z-index 999 by default,
   which puts it BELOW the edit popup (z-index 10000). While the popup is open, body
   gets the .ribbon-rfep-open class so we can lift any autocomplete menu above the popup. */
body.ribbon-rfep-open > .ui-autocomplete {
    z-index: 10010;
}
.ribbon-filter-edit-popup .rfep-footer {
    display: flex;
    justify-content: flex-end;
    gap: 6px;
    margin-top: 8px;
}
.ribbon-filter-edit-popup .rfep-apply {
    background: var(--east-bg);
    color: var(--txt-color);
    border: 1px solid var(--bg-border-light);
    border-radius: var(--border-radius-md);
    padding: 4px 12px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
}
.ribbon-filter-edit-popup .rfep-apply:hover {
    filter: brightness(0.95);
}
/* Mobile inline mode \u2014 popup is injected inside the dropdown right after the item.
   All overrides live here so JS only needs to toggle this class (no inline styles). */
.ribbon-filter-edit-popup.rfep-inline {
    position: static;
    width: auto;
    background: var(--hover);
    border: 0 !important;
    border-radius: var(--border-radius-xs) !important;
    box-shadow: none !important;
    clip-path: none !important;
    margin: 0 5px 5px;
    padding: 8px 10px 10px;
    min-width: 0;
    max-width: none;
}
/* No speech-bubble arrow when the popup is rendered inline (mobile mode). */
.ribbon-filter-edit-popup.rfep-inline::before,
.ribbon-filter-edit-popup.rfep-inline::after {
    display: none !important;
}
/* The dropdown item already shows the field label, so hide the duplicate header label */
.ribbon-filter-edit-popup.rfep-inline .rfep-label {
    display: none;
}
.ribbon-filter-dropdown .ribbon-dd-item.ribbon-dd-item-editing {
    background-color: var(--hover);
    border-radius: var(--border-radius-xs);
}
.ribbon-dd-multi-tag {
    font-size: 9px;
    color: var(--txt-color);
    opacity:0.7;
    background: var(--east-bg);
    border-radius: 3px;
    padding: 1px 4px;
    margin-left: 4px;
}
.ribbon-dd-empty {
    padding: 16px 14px;
    font-size: 11px;
    color: var(--txt-color);
    opacity:0.7;
    text-align: center;
}

/* Dialog and reportFilterCriteria override when ribbon is active */
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active {
    overflow: hidden !important;
    min-height: 50px !important;
    display: flex !important;
    flex-direction: column !important;
}
.reportFilterCriteria.ribbon-filter-active {
    overflow: visible !important;
    min-height: 50px !important;
}
.ui-dialog-content.ribbon-filter-active {
    padding: 2px !important;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active {
    padding: 2px !important;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active form,
.reportFilterCriteria.ribbon-filter-active form:not(.ui-accordion-content) {
    position: relative;
    display: block !important;
    overflow: visible !important;
    width: auto !important;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active form {
    flex: 1 1 auto;
    min-height: 0;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active .halfWidth,
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active .halfSizeLeft,
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active .halfSizeRight,
.reportFilterCriteria.ribbon-filter-active form[id*="filter" i] .halfWidth,
.reportFilterCriteria.ribbon-filter-active form[id*="filter" i] .halfSizeLeft,
.reportFilterCriteria.ribbon-filter-active form[id*="filter" i] .halfSizeRight {
    display: none !important;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active .savedFilters,
.reportFilterCriteria.ribbon-filter-active .savedFilters {
    display: block;
    float: none;
    width: 100% !important;
    height: auto;
    border: none;
    margin: 0;
    padding: 0;
    background: transparent;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active .ribbon-filter-wrapper,
.reportFilterCriteria.ribbon-filter-active .ribbon-filter-wrapper {
    width: 100%;
    max-width: 100%;
    position: relative;
    margin: 0;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active .ribbon-filter-wrapper {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.ui-dialog:has(.ui-dialog-content.ribbon-filter-active) .arrow.left:after,
.ui-dialog:has(.ui-dialog-content.ribbon-filter-active) .arrow.right:after {
    background-color: var(--bg);
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active {
    min-width: min(720px, 100vw - 40px);
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active form {
    min-width: min(720px, 100vw - 40px);
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active .ribbon-filter-wrapper{
    max-width:1100px;
    min-width:0;
    width: 100%;
    margin-left:10px;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active .ribbon-filter-bar {
    margin: 0;
    flex: 1 1 auto;
    min-height: 0;
    flex-direction: column;
    flex-wrap: nowrap;
    overflow: hidden;
    align-items: stretch;
}
.ui-dialog .ui-dialog-buttonpane.ribbon-buttonpane-hidden {
    display: none !important;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active .ribbon-chips-container {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    padding-right:10px;
    padding-left:5px;
    padding-top:5px;
    overflow-y: auto;
    overflow-x: hidden;
    flex: 1 1 auto;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active .ribbon-filter-chip,
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active .ribbon-chip-editor {
    width: 96%;
    max-width: none;
    margin-bottom:3px;
}
/* Trailing footer group — sits on its own row at the bottom of the
   ribbon bar (sibling of `.ribbon-chips-container`), holding the Clear
   button and the action buttons (Apply / Save). Static position so the
   actions don't move as chips are added/removed above. */
.ribbon-filter-bar-footer {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex: 0 0 auto;
    border-left: 1px solid var(--bg-border);
    padding-left: 8px;
}
.ribbon-filter-bar-footer .ribbon-filter-actions {
    flex-shrink: 0;
    margin-left: auto;
    border-left: none;
    padding-left: 0;
}
/* In reportFilterCriteria the footer aligns inline with the last chip
   (no full-width separator) — border-left replaces border-top. */
.reportFilterCriteria .ribbon-filter-bar-footer {
    width: auto;
    margin-top: 0;
    padding-top: 0;
    border-top: none;
    border-left: 1px solid transparent;
    padding-left: 8px;
    align-self: center;
}
/* Container that keeps the "+ add filter" input and the Apply button
   together as a single flex item so they always wrap to a new row as a unit. */
.ribbon-input-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
}
/* Compact "+ add filter" input — sits at the end of the chip list as a
   small chip-sized item (just before the footer). Narrow so it doesn't
   dominate the row; grows on focus only via the dashed → solid border
   treatment. */
.ribbon-filter-input-chip,
.ribbon-chips-container > .ribbon-filter-input {
    flex: 0 0 auto;
    width: 110px;
    min-width: 110px;
    max-width: 160px;
    height: 30px !important;
    border-radius: var(--border-radius-xs);
    border-style: dashed;
    background: transparent !important;
    align-self: center;
}
.ribbon-filter-input-chip:focus,
.ribbon-chips-container > .ribbon-filter-input:focus {
    border-style: solid;
    background: var(--bg) !important;
}
/* Classic view toggle button in the titlebar */
.ribbon-classic-view-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--txt-color);
    opacity: 0.5;
    font-size: 14px;
    padding: 6px 4px;
    line-height: 1;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    transition: opacity 0.15s, color 0.15s;
    border-radius: var(--border-radius-xs);
    float: right;
    position: relative;
}
.ribbon-classic-view-btn:hover {
    opacity: 1;
    color: var(--menu-hover);
    background: var(--hover);
}

.reportFilterCriteria.ribbon-filter-active .ribbon-filter-bar {
    border: none;
}
.reportFilterCriteria.ribbon-filter-active > form > .cell,
.reportFilterCriteria.ribbon-filter-active > form > div > .cell,
.reportFilterCriteria.ribbon-filter-active .submitReport {
    display: none !important;
}
/* Inside the chip editor, .cell is treated identically to .detailRow — see
   the unified .ribbon-filter-inline / .reportFilterCriteria editor block. */
.reportFilterCriteria.ribbon-filter-active .cell{
    width:100% !important;
    max-width:100% !important;
}

/* Ribbon - inline chip editor (wraps detailRow inside the bar) */
.ribbon-chip-editor {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border-radius: var(--border-radius-sm);
    /* Reserve space on the right for the absolutely-positioned .rce-close
       (16px button + 6px gap from edge + 8px breathing room so the inner
       input/select doesn't visually crowd the × as it grows). */
    padding: 3px 32px 3px 10px;
    background: var(--bg);
    position: relative;
    /* Persistent focus ring — the editor only exists while the user is
       entering a value, so the blue outline stays visible the entire time
       the chip is being edited (regardless of which inner control currently
       owns the browser focus) and clears the moment the editor closes and
       the read-only chip is rebuilt. */
    border: 1px solid var(--menu-hover, #2563eb);
    flex: 0 1 auto;
    min-width: 120px;
    max-width: 480px;
    box-sizing: border-box;
    min-height: 40px;
    /* No transition on box-shadow — the user must see the focus ring as a
       solid, persistent indicator (it was visibly fading before). Padding /
       sizing transitions are kept for the appear animation only. */
    transition: padding 0.18s ease,
                width 0.18s ease,
                min-width 0.18s ease,
                max-width 0.18s ease;
    animation: rceAppear 0.18s cubic-bezier(0.2, 0.8, 0.2, 1);
    transform-origin: left center;
}
/* reportFilterCriteria chip editor inherits the unified compact styles
   from the .ribbon-filter-inline rule block below (selectors include
   .reportFilterCriteria .ribbon-chip-editor). No mode-specific width
   caps — the editor sizes to fit the locked chip width. */
/* Backgrounds for inputs / selects in the move-row editor path
   (multiselect / autocomplete) where the original .filter-field row is
   re-parented into the chip. Clone-path inputs (text / date) intentionally
   do NOT inherit this so they blend into the chip like .rce-select-button. */
.ribbon-chip-editor .filter-field select,
.ribbon-chip-editor .filter-field input{
    background-color:var(--weekend-bg) !important;
    border: 1px solid transparent !important;
    outline: none !important;
}
/* Editor body wrapper for the simple-editor (clone) path. Holds the fresh
   input / select-button that replace the original form row. */
.ribbon-chip-editor .rce-body {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex: 1 1 auto;
    min-width: 0;
}
/* Plain text / date input rendered in the editor body \u2014 blend into the
   chip (no field box, only the persistent chip focus ring). */
.ribbon-chip-editor input.rce-input {
    background: transparent !important;
    border: 1px solid transparent !important;
    box-shadow: none !important;
    /* Match the read-only chip's typography (.ribbon-filter-chip uses
       font-size: 12px; weight: 500) so the input text doesn't visually
       jump in size when the chip enters/leaves edit mode. */
    font-size: 12px !important;
    font-weight: 500;
    font-family: inherit;
    color: var(--txt-color);
    padding: 0;
    margin: 0;
    width: 100%;
    box-sizing: border-box;
    field-sizing: content;
    outline: none !important;
}
@keyframes rceAppear {
    from { opacity: 0; transform: translateY(-2px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
.ribbon-chip-editor .rce-label {
    font-size: 11px;
    font-weight: 700;
    color: var(--txt-color);
    text-transform: capitalize;
    letter-spacing: 0.3px;
    white-space: nowrap;
    flex-shrink: 0;
}
/* Date field chip */
/* Date field chip — keep the per-type accent on the LABEL only.
   Background and border stay neutral so the persistent blue focus ring
   reads consistently across all field types and host modes (inline ribbon,
   dialog, reportFilterCriteria). */
.ribbon-chip-editor.rce-date .rce-label {
    color: var(--date-accent);
}
/* Mirror the read-only chip's leading calendar glyph
   (.ribbon-filter-chip.rce-date::before) so the date type affordance
   stays visible while the chip is in edit mode. */
.ribbon-chip-editor.rce-date::before {
    display: inline-block;
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    align-self: center;
    margin-right: 8px;
    font-family: 'ionbiz' !important;
    content: "\e943";
    font-size: 12px;
    opacity: 0.7;
}
.ribbon-chip-editor.rce-date .detailInput input:focus,
.ribbon-chip-editor.rce-date .detailInput select:focus {
    border-color: var(--date-accent) !important;
}
/* Resource field chip */

.ribbon-chip-editor.rce-resource .rce-label {
    color: var(--menu-hover);
}
.ribbon-chip-editor.rce-resource .detailInput input:focus,
.ribbon-chip-editor.rce-resource .detailInput select:focus {
    border-color: var(--menu-hover) !important;
}
.ribbon-chip-editor .rce-close {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--txt-color);
    opacity: 0.8;
    /* Match .chip-remove dimensions and use a drawn cross so the glyph
       stays geometrically centered across browsers. Pulled out of the
       flex flow with absolute positioning so the inner row's min-width
       (180px on .detailInput) can't push us outside the editor box —
       we always sit pinned to the editor's right edge.

       Right offset chosen so the cross's screen position matches the
       read-only chip's .chip-remove. Math:
         chip-remove right edge   = 1px border + 6px padding + 2px margin = 9px from chip outer right
         editor visible right edge = outer border + 2px focus ring (box-shadow)
         rce-close right edge     = 1px border + N px from outer right
       For the X to sit 9px inside the *visible* edge in both states,
       rce-close right edge must be 9 - 2 (ring) = 7px from outer border
       → right: 6px (since border adds 1px). Without this the X visibly
       jumps inward by 2px when the chip enters edit mode. */
    font-size: 0;
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 16px;
    width: 16px;
    padding: 0;
    line-height: 1;
    flex-shrink: 0;
    z-index: 2;
}
.ribbon-chip-editor .rce-close::before,
.ribbon-chip-editor .rce-close::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 9px;
    height: 1.5px;
    background: currentColor;
    border-radius: 1px;
    transform-origin: center;
}
.ribbon-chip-editor .rce-close::before { transform: translate(-50%, -50%) rotate(45deg); }
.ribbon-chip-editor .rce-close::after  { transform: translate(-50%, -50%) rotate(-45deg); }
.ribbon-chip-editor .rce-close:hover {
    color: var(--red);
}

/* Custom <select> replacement: trigger button + body-anchored popover.
   Used in place of native <select> inside .ribbon-chip-editor because
   HTMLSelectElement.showPicker() mispositions when the element was just
   relocated (Chromium reads a stale layout rect → menu lands at viewport
   origin). Styled to match the autocomplete-style input neighbours. */
.rce-select-button {
    appearance: none;
    -webkit-appearance: none;
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: 3px;
    color: var(--txt-color);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font: inherit;
    padding: 0;
    min-height: 0;
    min-width: 0;
    text-align: left;
    outline: none;
}
.rce-select-text {
    flex: 0 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    /* Match .ribbon-filter-chip .chip-value so the value doesn't visibly
       change typeface/weight when entering edit mode. */
    font-size: 12px;
    font-weight: 600;
    color: var(--menu-hover, #2563eb);
    margin-left: 1px;
}
/* Constrain the select button to its container so long option labels
   ellipsize via .rce-select-text instead of pushing past the chip
   editor's right edge. Without an upper bound the button auto-sizes
   to the widest option text and overflows the chip border. */
.ribbon-chip-editor .rce-select-button {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
/* Range fields render two selects side-by-side inside .w60 wrappers;
   the rule above already covers them, kept here for clarity. */
.ribbon-chip-editor .w60 .rce-select-button {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.rce-select-popover {
    position: absolute;
    z-index: 10020;
    background: var(--bg);
    border: 1px solid var(--border-color, rgba(0, 0, 0, 0.12));
    border-radius: var(--border-radius-sm);
    box-shadow: 0 4px 12px -4px var(--shaddow), 0 1px 3px -1px var(--shaddow);
    padding: 4px 0;
    min-width: 60px;
    /* Show more options before the list scrolls. The previous 260px cap was just below
       a 9-item list (~270px), so a small overflow forced an unnecessary scrollbar.
       Use a viewport-relative cap so very long lists still don't run off-screen. */
    max-height: min(60vh, 360px);
    overflow-y: auto;
    overflow-x: hidden;
}
.rce-select-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.rce-select-item {
    padding: 6px 10px;
    cursor: pointer;
    white-space: nowrap;
    color: var(--txt-color);
    user-select: none;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 2px 0%;
    transition: background 0.1s;
    border-radius: var(--border-radius-xs);
    margin-left: 5px;
    margin-right: 5px;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    height: 18px;
}
.rce-select-item:hover,
.rce-select-item-hl {
    background-color: var(--hover);
    background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
    background-size: 2px 50%;
    background-repeat: no-repeat;
    background-position: left center;
}
.rce-select-item-active {
    font-weight: 600;
    background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
    background-size: 2px 50%;
}

/* detailRow / cell inside chip editor.
   reportFilterCriteria wraps the input in a .cell (not .detailRow / .detailInput),
   so the same flex+sizing rules are applied to both wrappers to keep all three
   host modes (inline ribbon, dialog, reportFilterCriteria) visually identical. */
.ribbon-chip-editor .detailRow,
.ribbon-chip-editor .cell {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    border-left: none !important;
    overflow: visible !important;
    float: none !important;
    clear: none !important;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 !important;
    background: transparent !important;
    height: auto !important;
}
.ribbon-chip-editor .detailLabel {
    display: none !important;
}
.ribbon-chip-editor .detailInput,
.ribbon-chip-editor .cell {
    width: auto !important;
    min-width: 180px;
    flex: 1 1 auto;
    margin-left: auto;
    line-height: 30px;
    text-indent: 0;
    overflow: visible !important;
    background: transparent !important;
}
.ribbon-chip-editor .detailInput {
    float: right !important;
}
.ribbon-chip-editor .detailInput .filter-field,
.ribbon-chip-editor .cell .filter-field {
    display: none !important;
}
/* Suppress the global calendar glyph (.cell:has(.hasDatepicker…):before
   defined in Blue/Index.css) when the cell is hosted inside a chip
   editor — the chip editor is a compact pill where the icon would
   overlap the input. */
.ribbon-chip-editor .cell:has(.hasDatepicker:not(.navigateDatePicker)):before,
.ribbon-chip-editor .detailInput:has(.datepicker, .hasDatepicker:not(.navigateDatePicker)):before {
    content: none !important;
}
/* Drop the 22px text-indent that Blue/Index.css applies to datepicker
   inputs to make room for the calendar glyph — we removed the glyph
   inside chip editors above, so the indent is just dead space. */
.ribbon-chip-editor .hasDatepicker:not(.navigateDatePicker),
.ribbon-chip-editor .datepicker,
.ribbon-chip-editor  select:not([readonly]),
.ribbon-chip-editor  input:not([readonly]) {
    text-indent: 0px !important;
    margin-left: 1px !important;
}
.ribbon-chip-editor .detailInput input:not([type="hidden"]):not([data-checkbox]):not(.minicolors-input),
.ribbon-chip-editor .detailInput select,
.ribbon-chip-editor .cell input:not([type="hidden"]):not([data-checkbox]):not(.minicolors-input),
.ribbon-chip-editor .cell select {
    /* Let the input/select size to its actual content (placeholder, current
       value, or selected option text) rather than stretching to fill the
       container — this lets the chip editor itself grow wide enough that
       the value is fully visible. `field-sizing` handles text inputs;
       selects fall back to `width: auto` which sizes to the longest option. */
    width: auto !important;
    min-width: 80px;
    max-width: 100%;
    field-sizing: content;
    border: 1px solid transparent !important;
    border-radius: var(--border-radius-xs);
    background: var(--input-bg) !important;
    box-sizing: border-box;
    font-size: 12px;
    outline: none !important;
    transition: box-shadow 0.15s ease, background-color 0.15s ease;
}
.ribbon-chip-editor .detailInput:has(.ui-autocomplete-input),
.ribbon-chip-editor .cell:has(.ui-autocomplete-input) {
    margin-left: auto !important;
    min-width: 220px;
}
.ribbon-chip-editor .detailInput .ui-autocomplete-input,
.ribbon-chip-editor .cell .ui-autocomplete-input {
    width: auto !important;
    min-width: 120px;
    max-width: 100%;
    field-sizing: content;
    margin-left: auto !important;
    text-align:end;
}
.ribbon-chip-editor .detailInput .minicolors {
    position: relative;
}
.ribbon-chip-editor .detailInput .minicolors-panel {
    z-index: 10001;
}
.ribbon-chip-editor .detailInput input:focus,
.ribbon-chip-editor .detailInput select:focus,
.ribbon-chip-editor input:focus,
.ribbon-chip-editor select:focus{
    border-color: transparent !important;
    outline: none !important;
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--bg-border) 35%, transparent) !important;
    background-color: var(--bg) !important;
}

.ribbon-chip-editor .detailInput:after,
.ribbon-chip-editor .detailInput:before,
.ribbon-chip-editor .detailInput:has(select):after,
.ribbon-chip-editor .detailInput:has(select):before,
.ribbon-chip-editor .detailInput .w60:has(select):after,
.ribbon-chip-editor .detailInput .w60:has(select):before,
.ribbon-chip-editor .cell:has(select):after,
.ribbon-chip-editor .cell:has(select):before,
.ribbon-chip-editor .cell:has(.ui-autocomplete-input):after,
.ribbon-chip-editor .cell:has(.ui-autocomplete-input):before {
    display: none !important;
    content: none !important;
}
.ribbon-chip-editor .detailInput .token-input-list-facebook {
    border: 1px solid var(--bg-border) !important;
    border-radius: var(--border-radius-xs);
    background: var(--bg);
    min-height: 24px;
    box-sizing: border-box;
    padding: 1px 2px;
    width: auto !important;
    min-width: 120px;
}

/* Mirror the chip-editor rules for the floating edit popup body so the
   detailRow / detailInput render with the same compact, clean styling
   instead of inheriting the original wide form layout.
   Also covers .cell rows where the input is a direct child (no .detailInput wrapper). */
.ribbon-filter-edit-popup .rfep-body .detailRow,
.ribbon-filter-edit-popup .rfep-body > .cell {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    border-left: none !important;
    overflow: visible !important;
    float: none !important;
    clear: none !important;
    display: flex;
    align-items: center;
    justify-content: stretch;
    padding: 0 !important;
    background: transparent !important;
}
.ribbon-filter-edit-popup .rfep-body .detailLabel {
    display: none !important;
}
.ribbon-filter-edit-popup .rfep-body .detailInput,
.ribbon-filter-edit-popup .rfep-body > .cell {
    width: 100% !important;
    min-width: 0;
    flex: 1 1 auto;
    margin: 0 !important;
    float: none !important;
    line-height: 30px;
    text-indent: 0;
    overflow: visible !important;
    background: transparent !important;
    padding: 0 !important;
    /* Force block layout so direct-child <input>/<select> stretch to full width
       and any sibling Apply footer sits below, never beside. */
    display: block !important;
    height: auto !important;
    max-width: none !important;
    position: static !important;
}
.ribbon-filter-edit-popup .rfep-body > .cell > select,
.ribbon-filter-edit-popup .rfep-body > .cell > input:not([type="hidden"]) {
    display: block;
}
.ribbon-filter-edit-popup .rfep-body .detailInput .filter-field,
.ribbon-filter-edit-popup .rfep-body > .cell > .filter-field {
    display: none !important;
}
.ribbon-filter-edit-popup .rfep-body .detailInput input:not([type="hidden"]):not([data-checkbox]):not(.minicolors-input),
.ribbon-filter-edit-popup .rfep-body .detailInput select,
.ribbon-filter-edit-popup .rfep-body > .cell > input:not([type="hidden"]):not([data-checkbox]):not(.minicolors-input),
.ribbon-filter-edit-popup .rfep-body > .cell > select {
    width: 100% !important;
    min-height: 30px;
    border: 1px solid var(--bg-border-light) !important;
    border-radius: var(--border-radius-xs);
    background: var(--east-bg) !important;
    box-sizing: border-box;
    margin-left: 1px;
    margin-top: 1px;
    font-size: 12px;
    outline: none !important;
}
.ribbon-filter-edit-popup .rfep-body .detailInput input:focus,
.ribbon-filter-edit-popup .rfep-body .detailInput select:focus,
.ribbon-filter-edit-popup .rfep-body > .cell > input:focus,
.ribbon-filter-edit-popup .rfep-body > .cell > select:focus {
    outline: none !important;
}
.ribbon-filter-edit-popup .rfep-body .detailInput .ui-autocomplete-input,
.ribbon-filter-edit-popup .rfep-body > .cell > .ui-autocomplete-input {
    width: 100% !important;
    margin: 0 !important;
    text-align: start;
}
.ribbon-filter-edit-popup .rfep-body .detailInput .token-input-list-facebook,
.ribbon-filter-edit-popup .rfep-body > .cell .token-input-list-facebook {
    border: 1px solid var(--bg-border-light) !important;
    border-radius: var(--border-radius-xs);
    background: var(--bg);
    min-height: 24px;
    box-sizing: border-box;
    padding: 1px 2px;
    width: 100% !important;
    min-width: 0;
}
.ribbon-filter-edit-popup .rfep-body .detailInput:not(:has(.datepicker, .hasDatepicker:not(.navigateDatePicker))):after,
.ribbon-filter-edit-popup .rfep-body .detailInput:not(:has(.datepicker, .hasDatepicker:not(.navigateDatePicker))):before,
.ribbon-filter-edit-popup .rfep-body .detailInput:has(select):after,
.ribbon-filter-edit-popup .rfep-body .detailInput:has(select):before,
.ribbon-filter-edit-popup .rfep-body .cell:has(select):after,
.ribbon-filter-edit-popup .rfep-body .cell:has(select):before,
.ribbon-filter-edit-popup .rfep-body .cell:has(.ui-autocomplete-input):after,
.ribbon-filter-edit-popup .rfep-body .cell:has(.ui-autocomplete-input):before {
    display: none !important;
    content: none !important;
}
/* Re-enable the calendar icon :before for date fields inside the popup
   (mirrors the rule in Blue/Index.css scoped to the edit popup). */
.ribbon-filter-edit-popup .rfep-body .detailInput:has(.datepicker, .hasDatepicker:not(.navigateDatePicker)):not(:has(.halfSizeRight)):not(:has(.datepicker-inline)):before,
.ribbon-filter-edit-popup .rfep-body .cell:has(.hasDatepicker:not(.navigateDatePicker)):before {
    font-family: 'ionbiz' !important;
    content: "\e943" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: table-cell !important;
    vertical-align: middle;
    left: 2px !important;
    line-height: 31px;
    text-indent: 5px;
    position: absolute;
    z-index: 1;
    pointer-events: none;
    opacity: 1;
}
/* The .cell layout has the input as a direct child (no .detailInput wrapper),
   so the calendar icon needs a different offset and line-height to align vertically. */
.ribbon-filter-edit-popup .rfep-body .cell:has(.hasDatepicker:not(.navigateDatePicker)):before {
    left: 12px !important;
    line-height: 28px;
}
.ribbon-filter-edit-popup .rfep-body .detailInput .minicolors-panel {
    z-index: 10001;
}
/* Ensure the jQuery UI datepicker (appended to body) renders above the edit popup */
body.ribbon-rfep-open > #ui-datepicker-div {
    z-index: 10010 !important;
}
/* Autocomplete suggestion list and its close-list overlay must render above the edit popup */
body.ribbon-rfep-open ul.ui-autocomplete + .closeList {
    z-index: 10020 !important;
}
.ribbon-filter-edit-popup .rfep-body input[data-checkbox="true"][type="checkbox"] + label {
    line-height: normal;
    float: none !important;
}
/* Keyboard-focused dropdown item */
.ribbon-filter-dropdown .ribbon-dd-item.ribbon-dd-item-focused {
    background-color: var(--hover);
    background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
    background-size: 2px 50%;
    background-repeat: no-repeat;
    background-position: left center;
    border-radius: var(--border-radius-xs);
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

/* Ribbon - Saved Filters button */
.ribbon-filter-actions .ribbon-saved-filters-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--txt-color);
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    padding: 2px 4px;
    font-family: inherit;
}
.ribbon-filter-actions .ribbon-saved-filters-btn:before {
    content: "\e927";
    font-family: 'ionbiz';
    font-size: 12px;
}
.ribbon-filter-actions .ribbon-saved-filters-btn:hover {
    color: var(--blue);
}

/* Ribbon - Clear filters button (sits after the Save dropdown). The glyph
   is rendered via the ionbiz icon font on a ::before pseudo so the button
   stays a single, child-less element. */
.ribbon-clear-filters-btn {
    background: none;
    border: 1px solid transparent;
    border-radius: var(--border-radius-md, 3px);
    border-color:var(--bg-border, #e3e5e8);
    cursor: pointer;
    color: var(--txt-color);
    opacity: 0.6;
    height: 25px;
    width: auto;
    padding: 0 8px;
    gap: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 12px;
    line-height: 1;
    margin-left: 2px;
    min-width: 65px;
    transition: opacity 0.15s, color 0.15s, border-color 0.15s, background-color 0.15s;
}
.ribbon-clear-filters-btn .ribbon-clear-filters-label {
    font-size: 12px;
    line-height: 1;
    text-transform: none;
    white-space: nowrap;
    font-weight: 600;
}
.ribbon-clear-filters-btn:hover {
    opacity: 1;
    border-color: var(--bg-border-light, #e3e5e8);
    background: var(--bg, #fff);
}
.ribbon-clear-dropdown {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.ribbon-clear-caret-btn {
    background: none;
    border: 1px solid var(--bg-border, #e3e5e8);
    border-left: 1px solid var(--bg-border);
    border-radius: 0 var(--border-radius-md, 3px) var(--border-radius-md, 3px) 0;
    cursor: pointer;
    height: 25px;
    width: 25px;
    padding-right: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 0.6;
    transition: opacity 0.15s, background-color 0.15s;
}
.ribbon-clear-caret-btn:hover {
    opacity: 1;
    background: var(--bg, #fff);
}
.ribbon-clear-dropdown .ribbon-clear-filters-btn {
    border-radius: var(--border-radius-md, 3px) 0 0 var(--border-radius-md, 3px);
    border-right: none;
}
.ribbon-clear-caret {
    font-size: 8px;
    line-height: 8px;
    opacity: 0.6;
    color: var(--txt-color);
}
.ribbon-clear-caret:before {
    font-family: 'ionbiz';
    content: "\e944";
}
.ribbon-clear-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    min-width: 100%;
    background: var(--bg, #fff);
    border: 1px solid var(--bg-border-light, #e3e5e8);
    border-radius: var(--border-radius-md, 3px);
    box-shadow: 0 2px 8px rgba(0,0,0,0.12);
    padding: 4px;
    margin-top: 2px;
}
.ribbon-clear-dropdown-item {
    display: block;
    width: 100%;
    background: none;
    border: none;
    padding: 5px 12px;
    font-size: 12px;
    font-weight: 600;
    color: var(--txt-color);
    text-align: left;
    cursor: pointer;
    white-space: nowrap;
}
.ribbon-clear-dropdown-item:hover {
    background: var(--hover, #f0f1f3);
}
.ribbon-clear-dropdown-delete {
    color: var(--red, #d32f2f);
    border-radius: var(--border-radius-sm);
}

/* Inline-edit overlay editor: when the editor is mounted on top of an
   existing chip we override the legacy editor's heavy padding/animation so
   it doesn't visually shift the layout. The base style is invisible (single
   control fields, opacity:0) — the picker still anchors on the inner input.
   The .ribbon-chip-editor-overlay-visible variant (dual-selects, checkboxes)
   renders normally because there's no popup to anchor on. */
.ribbon-chip-editor-overlay {
    /* Animation/transition would visibly slide the overlay into place on a
       layout the user is not supposed to notice. */
    transition: none !important;
    animation: none !important;
    box-shadow: none !important;
}
.ribbon-chip-editor-overlay:not(.ribbon-chip-editor-overlay-visible) {
    /* Invisible but interactive — the underlying chip is the visible chrome. */
    background: transparent !important;
    border-color: transparent !important;
}
.ribbon-chip-editor-overlay-visible {
    /* Match the read-only chip's outer dimensions so swapping in/out doesn't
       change the row height. Allow the editor to grow horizontally to fit
       its inner control(s). */
    background: var(--bg, #fff) !important;
    border: 1px solid var(--menu-hover, #2563eb) !important;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--menu-hover, #2563eb) 18%, transparent) !important;
    padding: 0 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px;
}
/* While a chip is being edited (overlay covering it), keep it visible so
   the overlay's invisible variant can rely on it as visible chrome. The
   class is set/cleared by JS purely as a marker hook for any future visual
   tweak; no rule is needed today. */

/* Ribbon - Report Generate / Reset buttons (moved from .submitReport) */
.ribbon-filter-actions .lnkSaveDetails,
.ribbon-filter-actions .lnkCancelDetails {
    float: none;
    margin-right: 0;
}
/* Ribbon - Saved Filters popup (appended to body, tooltip-style) */
.ribbon-saved-filters-popup {
    position: absolute;
    background: var(--east-bg);
    border: 1px solid var(--bg-border-light);
    border-radius: 10px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12);
    z-index: 10000;
    min-width: 300px;
    max-width: 420px;
    max-height: 500px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.ribbon-saved-filters-popup .savedFilters .jqGridHolder .ui-jqgrid.ui-widget{
    background:var(--bg) !important;
}
.ribbon-saved-filters-popup .jqGridHolder{
    border-color:transparent !important;
}
.ribbon-sf-popup-body {
    overflow-y: auto;
    flex: 1;
    padding: 6px;
    border-radius: var(--border-radius-sm);
    margin-right:10px;
}
.ribbon-sf-popup-body .savedFilters {
    float: none !important;
    width: 100% !important;
    height: auto !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    overflow: visible !important;
}
.ribbon-sf-popup-body .savedFilters .jqGridHolder {
    margin: 0 !important;
}
.ribbon-sf-popup-body .savedFilters .ui-jqgrid {
    width: 100% !important;
}
.ribbon-sf-popup-body .savedFilters .ui-jqgrid-bdiv {
    max-height: 50vh;
    overflow-y: auto !important;
}
.ribbon-sf-popup-body .savedFilters table {
    width: 100% !important;
}
.ribbon-sf-popup-body .ui-jqgrid .ui-jqgrid-htable th div {
    text-transform: uppercase;
    opacity: 0.55;
}

/* Ribbon - Saved Filters panel as inline column inside the wrapper */
.ribbon-filter-wrapper.ribbon-sf-panel-open {
    display: flex !important;
    flex-direction: row !important;
}
.ribbon-filter-wrapper.ribbon-sf-panel-open > .ribbon-filter-bar {
    flex: 1 1 auto;
    min-width: 0;
}
.ribbon-filter-wrapper .ribbon-saved-filters-popup {
    position: static;
    box-shadow: none;
    border-radius: 0 var(--border-radius-sm) var(--border-radius-sm) 0;
    border: none;
    border-left: 1px solid var(--bg-border-light);
    max-height: none;
    z-index: auto;
    flex: 0 0 200px;
    max-width: 300px;
    min-width: 200px;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active .ribbon-filter-wrapper.ribbon-sf-panel-open {
    max-width: 1100px;
}
.ui-dialog-content[id^="btnFilterIonBizDialog"].ribbon-filter-active .ribbon-filter-wrapper.ribbon-sf-panel-open > .ribbon-filter-bar {
    flex-direction: column;
    flex-wrap: nowrap;
    overflow: hidden;
}

/* ─────────────────────────────────────────────────────────────────────── */
/* Inline filter ribbon — host placed under .gridMenu, holds the relocated */
/* .ribbon-filter-wrapper. Chips lay out horizontally on a single row with */
/* horizontal scroll when overflowing.                                     */
/* ─────────────────────────────────────────────────────────────────────── */

/* Split-button group: btnFilter (icon + caret) + SHOW toggle as one pill */
.btnFilter-split-group {
    display: inline-flex;
    /* Children set an explicit height, so stretch degrades to flex-start and leaves the
       slack as a gap under their backgrounds. */
    align-items: center;
    border: none;
    box-shadow: inset 0 0 0 1px var(--bg-border-light, #e3e5e8);
    border-radius: 20px;
    overflow: hidden;
    background: var(--bg, #fff);
    float: left;
    line-height: inherit;
    height: auto;
    margin-right: 10px;
    align-self: center;
}
.btnFilter-split-group a#btnFilter:hover {
    background: transparent !important;
}
.btnFilter-split-group a .path1 {
    margin-left: 0 !important;
    float: none !important;
}
.btnFilter-split-group a .path2 {
    float: none !important;
}
.btnFilter-split-group a#btnFilter {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 8px !important;
    margin-left:8px;
    /* .gridMenu a's 3px would push SHOW's hover fill off the divider. */
    margin-right: 0;
    gap: 2px;
    height: calc(100% - 2px);
    width: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    border: none !important;
    border-right: 1px solid var(--bg-border-light, #e3e5e8) !important;
    border-radius: 0 !important;
    background: transparent;
    flex: 0 0 50px;
}
.btnFilter-split-group a:before {
    float: none !important;
    padding-left: 0 !important;
}
.btnFilter-split-group a#btnFilter:after {
    font-family: 'ionbiz';
    content: "\e944";
    font-size: 8px;
    opacity: 0.6;
    float: none !important;
    padding-left: 0 !important;
}
/* Needs the type selector to outrank `.gridMenu a.btnFilterInlineRibbon`, whose 40px would
   otherwise make the hover fill 2px taller than the divider next to it. */
.btnFilter-split-group a.btnFilterInlineRibbon {
    padding: 0 14px !important;
    height: calc(100% - 2px);
    border-radius: 0 !important;
    border: none;
    flex: 0 0 auto;
    justify-content: center;
}
.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .btnFilter-split-group {
    height: auto;
}
.btnFilter-split-group .btnFilterInlineRibbon:before {
    content: none;
}
.btnFilter-split-group a.icon-gear_3:before {
    margin-left: 0;
}
.btnFilter-split-group .btnFilterInlineRibbon:hover {
    border-radius: 0 !important;
}
/* Sibling toolbar trigger button — clone of btnFilter that opens (and
   toggles) the inline ribbon. Rendered as a text-only pill labelled with
   the original button's tooltip so the toggle reads as an explicit action
   rather than another anonymous icon. */
.gridMenu a.btnFilterInlineRibbon,
.btnFilterInlineRibbon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 14px 0 14px !important;
    /* Override .gridMenu a's fixed width (73px / 50px in dialogs) so the
       text label fits comfortably. Match the toolbar's icon row height so
       the pill aligns with neighbouring icon-only buttons. */
    width: auto !important;
    min-width: 0 !important;
    height: 40px;
    line-height: 26px;
    color: var(--txt-color);
    text-decoration: none;
    box-sizing: border-box;
    border-radius: 20px;
    font-size: 15px;
}
.btnFilterInlineRibbon .btnFilterInlineRibbon-label {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 1;
    text-indent: 0;
    color: var(--txt-color);
    white-space: nowrap;
}
.btnFilterInlineRibbon:before {
    font-family: 'ionbiz';
    content: "\e60c";
    font-size: 16px;
    color: var(--txt-color);
    line-height: 1;
    display: inline-flex;
    align-self: center;
    padding-left: 15px !important;
    padding-right: 5px;
}
.btnFilterInlineRibbon.active:before{
    color: var(--menu-hover);
}
.btnFilterInlineRibbon:hover {
    background: var(--menu-active, rgba(37, 99, 235, 0.08));
    border-radius: 20px;
}
.btnFilterInlineRibbon:hover .btnFilterInlineRibbon-label {
    color: color-mix(in srgb, var(--menu-hover, #2563eb) 90%, black);
}
.btnFilterInlineRibbon.active {
    background: color-mix(in srgb, var(--menu-hover, #2563eb) 8%, transparent);
    border-radius: 20px;
}
.btnFilterInlineRibbon.active .btnFilterInlineRibbon-label {
    color: color-mix(in srgb, var(--menu-hover, #2563eb) 90%, black);
}
.ribbon-filter-inline-host {
    display: flex;
    align-items: center;
    width: 100%;
    margin: 2px 0;
    padding: 2px 0;
    background: transparent;
    border-radius: var(--border-radius-md, 6px);
    box-sizing: border-box;
    min-height: 32px;
}
/* A dialog body is a flex column whose children all shrink, and .gridMenu's
   overflow:hidden gives it a zero automatic minimum — so adding the ribbon row
   collapses the toolbar and clips its buttons instead of shortening the grid. */
.ui-dialog-content > .gridMenu,
.ui-dialog-content > .ribbon-filter-inline-host {
    flex: 0 0 auto;
}
.ribbon-filter-inline-host .ribbon-filter-inline-placeholder {
    /* Skeleton-chips loader: the placeholder is a flex row containing
       fake .ribbon-filter-chip elements that share the real chip's
       outer styling (border, radius, padding, height). The inner
       skeleton bars pulse via a shared shimmer animation so the loading
       state visually matches what's about to mount. */
    flex: 1 1 auto;
    align-self: stretch;
    min-height: 32px;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    color: transparent;
    font-size: 0;
}
.ribbon-filter-inline-host .ribbon-filter-inline-placeholder .ribbon-filter-chip-skeleton {
    /* Inherit the real .ribbon-filter-chip box (border, radius, height,
       background) but the inner content is two animated skeleton bars. */
    cursor: default;
    pointer-events: none;
    overflow: hidden;
    /* Override the chip's right-padding-for-X-button reservation \u2014 no X
       in skeletons. */
    padding: 0 8px;
    gap: 6px;
}
.ribbon-filter-inline-host .ribbon-filter-inline-placeholder .chip-skeleton-label,
.ribbon-filter-inline-host .ribbon-filter-inline-placeholder .chip-skeleton-value {
    display: inline-block;
    height: 10px;
    border-radius: 4px;
    background-color: color-mix(in srgb, var(--bg-border-light, #b6bcc4) 35%, transparent);
    background-image: linear-gradient(
        90deg,
        transparent 0%,
        color-mix(in srgb, var(--input-focus, #2563eb) 22%, transparent) 50%,
        transparent 100%
    );
    background-size: 200% 100%;
    background-repeat: no-repeat;
    background-position: -100% 0;
    animation: ribbon-inline-shimmer 1.4s linear infinite;
}
.ribbon-filter-inline-host .ribbon-filter-inline-placeholder .chip-skeleton-label {
    width: 32%;
    min-width: 24px;
}
.ribbon-filter-inline-host .ribbon-filter-inline-placeholder .chip-skeleton-value {
    flex: 1 1 auto;
    min-width: 30px;
}
@keyframes ribbon-inline-shimmer {
    0%   { background-position: -100% 0; }
    100% { background-position: 200% 0; }
}
@media (prefers-reduced-motion: reduce) {
    .ribbon-filter-inline-host .ribbon-filter-inline-placeholder .chip-skeleton-label,
    .ribbon-filter-inline-host .ribbon-filter-inline-placeholder .chip-skeleton-value {
        animation: none;
        background-image: none;
    }
}
/* Loading-failed fallback: stop the shimmer, drop the gradient, and
   restore readable text styling for the "no filters" / error message. */
.ribbon-filter-inline-host .ribbon-filter-inline-placeholder.ribbon-filter-inline-placeholder-failed {
    animation: none;
    background-image: none;
    background-color: transparent;
    color: var(--txt-color-muted, #888);
    font-size: 11px;
    font-style: italic;
    display: flex;
    align-items: center;
    padding: 0 8px;
}
.ribbon-filter-inline-host .ribbon-filter-wrapper.ribbon-filter-inline {
    flex: 1 1 auto;
    min-width: 0;
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
}
/* The dialog's <form> element is moved into the inline host (with the
   wrapper still inside it) so every input — including .detailRow controls
   parked into chip editors — stays a native form descendant. That keeps
   FormData / form.submit() / jQuery-validate / Save & Apply working
   reliably without manual value sync. The form is layout-transparent so
   chips render exactly as before, and every form child other than the
   ribbon wrapper (legacy .savedFilters layout, hidden inputs, etc.) is
   hidden in this inline view. */
.ribbon-filter-inline-host > form {
    display: contents;
}
/* Spelled out by tag instead of a bare `:not()` subject, which would be tested against every
   element in the document. Covers what a detail form can hold directly: legacy layout divs,
   hidden inputs, and stray inline nodes. */
.ribbon-filter-inline-host > form > div:not(.ribbon-filter-wrapper),
.ribbon-filter-inline-host > form > input,
.ribbon-filter-inline-host > form > span,
.ribbon-filter-inline-host > form > table,
.ribbon-filter-inline-host > form > fieldset,
.ribbon-filter-inline-host > form > label,
.ribbon-filter-inline-host > form > a,
.ribbon-filter-inline-host > form > select,
.ribbon-filter-inline-host > form > textarea,
.ribbon-filter-inline-host > form > button,
.ribbon-filter-inline-host > form > p {
    display: none !important;
}
.ribbon-filter-inline .ribbon-filter-bar {
    display: flex;
    align-items: center;
    gap: 6px;
}
.ribbon-filter-inline .ribbon-chips-container {
    display: flex !important;
    flex-wrap: wrap !important;
    overflow: visible;
    align-items: center;
    gap: 5px 5px;
    flex: 1 1 auto;
    min-width: 0;
}
/* Bar wraps too so the action group can move to a new row gracefully. */
.ribbon-filter-inline .ribbon-filter-bar {
    flex-wrap: wrap;
    row-gap: 5px;
}
.ribbon-filter-inline .ribbon-filter-actions {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 0px;
}
/* The footer is now an inline-flex group inside the chips container in
   every mode — no per-mode override needed. */

/* Inline "+ add filter" reads as a subtle ghost button */
.ribbon-filter-inline .ribbon-filter-input {

    padding: 0 10px;
    border-radius: var(--border-radius-xs, 3px);
    border: 1px dashed var(--menu-hover, #b6bcc4);
    font-size: 12px;
    margin: 0;
    min-width: 140px;
    background: transparent;
}
.ribbon-filter-inline .ribbon-filter-input:focus {
    border-style: dashed;
    border-color: var(--menu-hover, #2563eb);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--menu-hover, #2563eb) 18%, transparent);
}

/* ─── Compact chip editor — shared by inline ribbon AND reportFilterCriteria ──── */
/* When a chip is clicked it becomes a .ribbon-chip-editor. Both the inline   */
/* ribbon (under .gridMenu) and the reportFilterCriteria section render the   */
/* editor as a tight, pill-shaped chip that matches the read-only chip's      */
/* dimensions exactly so the chip → editor swap is visually seamless.         */
.ribbon-filter-inline .ribbon-chip-editor,
.reportFilterCriteria .ribbon-chip-editor {
    /* When the editor replaces an existing chip, JS pins inline
       min-/max-/width to the outgoing chip's outerWidth so the swap is
       visually seamless. When the editor is opened from “+ add filter”
       there is no source chip, so the rules below provide a sensible
       starting size. */
    min-width: 171px;
    max-width: none;
    width: auto;
    height: 32px;
    min-height: 32px;
    /* Match chip padding exactly (chip is 0 6px 0 8px). */
    padding: 0 6px 0 6px;
    gap: 4px;
    border-radius: var(--border-radius-xs, 3px);
    /* 1px border to match the chip exactly so the chip → editor swap doesn't shift layout. */
    border: 1px dashed var(--menu-hover, #2563eb);
    background: var(--east-bg, #fff);
    box-sizing: border-box;
    align-items: center;
    flex-shrink: 0;
    /* Disable the parent transition so we don't see the size animate. */
    transition: none !important;
    animation: none !important;
    padding-right: 25px;
    /* Establish positioning context for the absolutely-positioned .rce-close. */
    position: relative;
}
.ribbon-filter-inline .ribbon-chip-editor.rce-date,
.ribbon-filter-inline .ribbon-chip-editor.rce-resource,
.reportFilterCriteria .ribbon-chip-editor.rce-date,
.reportFilterCriteria .ribbon-chip-editor.rce-resource {
    background: var(--east-bg, #fff);
    border-color: var(--menu-hover, #2563eb);
}
.ribbon-filter-inline .ribbon-chip-editor .rce-label,
.reportFilterCriteria .ribbon-chip-editor .rce-label {
    font-size: 12px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    color: var(--txt-color, #1f2937);
    opacity: 0.8;
}
.ribbon-filter-inline .ribbon-chip-editor .rce-label::after,
.reportFilterCriteria .ribbon-chip-editor .rce-label::after {
    content: ":";
    color: var(--txt-color-muted, #9ca3af);
    margin-left: 6px;
    font-weight: 400;
}
.ribbon-filter-inline .ribbon-chip-editor .detailRow,
.ribbon-filter-inline .ribbon-chip-editor .cell,
.reportFilterCriteria .ribbon-chip-editor .detailRow,
.reportFilterCriteria .ribbon-chip-editor .cell {
    line-height: 1;
    align-items: center;
    height: 100%;
    /* Override the dialog editor's flex-end justification so the input sits
       flush with the label (no rightward push). */
    justify-content: flex-start !important;
}
.ribbon-filter-inline .ribbon-chip-editor .detailInput,
.ribbon-filter-inline .ribbon-chip-editor .cell,
.reportFilterCriteria .ribbon-chip-editor .detailInput,
.reportFilterCriteria .ribbon-chip-editor .cell {
    line-height: 1;
    min-width: 80px;
    /* Cancel inherited float + 30px line-height from the dialog editor — they
       break vertical centering inside the compact 32px flex chip. */
    float: none !important;
    margin-left: 0 !important;
    height: 100%;
    /* `!important` is required to beat the inline `style="display: block"`
       jQuery's `.show()` adds when we re-display the originally-hidden
       reportFilterCriteria `.cell` to mount it inside the chip editor.
       Without it the cell becomes a block and the input wraps above the
       chip row. */
    display: inline-flex !important;
    align-items: center;
    /* Allow the inner row to shrink within the editor's reserved content
       area (padding-right: 25px keeps clearance for the absolute .rce-close).
       Without flex:1 + min-width:0 the .rce-select-button sizes to its
       intrinsic content (longest option text) and the value visually
       overlaps the × in edit mode. */
    flex: 1 1 0;
    min-width: 0 !important;
    overflow: hidden;
}
.ribbon-filter-inline .ribbon-chip-editor .detailInput input:not([type="hidden"]):not([data-checkbox]):not(.minicolors-input),
.ribbon-filter-inline .ribbon-chip-editor .detailInput select,
.ribbon-filter-inline .ribbon-chip-editor .cell input:not([type="hidden"]):not([data-checkbox]):not(.minicolors-input),
.ribbon-filter-inline .ribbon-chip-editor .cell select,
.reportFilterCriteria .ribbon-chip-editor .detailInput input:not([type="hidden"]):not([data-checkbox]):not(.minicolors-input),
.reportFilterCriteria .ribbon-chip-editor .detailInput select,
.reportFilterCriteria .ribbon-chip-editor .cell input:not([type="hidden"]):not([data-checkbox]):not(.minicolors-input),
.reportFilterCriteria .ribbon-chip-editor .cell select {
    height: 24px !important;
    min-height: 24px !important;
    line-height: 24px !important;
    margin: 0 !important;
    margin-top: 1px !important;
    font-size: 12px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: var(--menu-hover, #2563eb) !important;
    font-weight: 600 !important;
    text-align: left !important;
    vertical-align: middle;
}
/* Multiselect placeholder ("N items selected") in chip-edit mode — render
   it with the same accent color / weight as .ribbon-filter-chip.rce-has-value
   .chip-value so the count stays visible while the user picks options.
   reportFilterCriteria wraps the input in `.cell` instead of `.detailInput`,
   so both wrappers are matched here. */
.ribbon-filter-inline .ribbon-chip-editor .detailInput input[data-ismultiselect="True"]::placeholder,
.ribbon-filter-inline .ribbon-chip-editor .cell input[data-ismultiselect="True"]::placeholder,
.reportFilterCriteria .ribbon-chip-editor .detailInput input[data-ismultiselect="True"]::placeholder,
.reportFilterCriteria .ribbon-chip-editor .cell input[data-ismultiselect="True"]::placeholder {
    color: var(--menu-hover, #2563eb) !important;
    font-weight: 600 !important;
    opacity: 1 !important;
    font-size: 12px !important;
}
/* Let the multiselect input shrink/grow to fit its placeholder (or typed
   value) so the chip doesn't reserve a fixed slot wider than the visible
   text. `field-sizing: content` is supported in modern Chromium + Safari;
   `min-width: 0` removes the input's default intrinsic width and `width:
   auto` lets the browser auto-size to content. */
.ribbon-filter-inline .ribbon-chip-editor .detailInput input[data-ismultiselect="True"],
.ribbon-filter-inline .ribbon-chip-editor .cell input[data-ismultiselect="True"],
.reportFilterCriteria .ribbon-chip-editor .detailInput input[data-ismultiselect="True"],
.reportFilterCriteria .ribbon-chip-editor .cell input[data-ismultiselect="True"] {
    field-sizing: content;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
}
/* Multiselect chip editor: let it grow with the input so the
   "N items selected" placeholder isn't clipped. JS sets an inline
   width/min-width/max-width on $editor at create-time; override with
   !important so the chip resizes to fit its content. */
.ribbon-filter-inline .ribbon-chip-editor.rce-multiselect,
.reportFilterCriteria .ribbon-chip-editor.rce-multiselect {
    width: auto !important;
    max-width: none !important;
}
.ribbon-filter-inline .ribbon-chip-editor.rce-multiselect .detailRow,
.ribbon-filter-inline .ribbon-chip-editor.rce-multiselect .detailInput,
.ribbon-filter-inline .ribbon-chip-editor.rce-multiselect .cell,
.reportFilterCriteria .ribbon-chip-editor.rce-multiselect .detailRow,
.reportFilterCriteria .ribbon-chip-editor.rce-multiselect .detailInput,
.reportFilterCriteria .ribbon-chip-editor.rce-multiselect .cell {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    overflow: visible !important;
}
/* Checkbox edit-chip exception: the inline-host rule above sets the moved
   `.detailInput` to `overflow: hidden; min-width: 0; flex: 1 1 0`, which
   clips the empty `<label for="...">` (and thus its `:before` toggle
   glyph) the CustomCheckBox markup relies on. Restore visibility +
   give the toggle enough breathing room to render. */
.ribbon-filter-inline .ribbon-chip-editor .detailInput:has(input[data-checkbox="true"][type="checkbox"]),
.reportFilterCriteria .ribbon-chip-editor .detailInput:has(input[data-checkbox="true"][type="checkbox"]) {
    overflow: visible !important;
    min-width: 24px !important;
    flex: 0 0 auto !important;
}
/* Push the toggle's host row to the trailing edge of the chip editor.
   The row itself is the chip-editor's direct flex child (siblings:
   .chip-favorite, .rce-label, .rce-close), so the auto-margin lands the
   row — and therefore the toggle inside it — flush against .rce-close.
   We also override the base `.detailRow` min-width / overflow so the row
   shrinks to its content; without these the row keeps its 300px min and
   gets clipped by the editor, which previously hid the right-aligned
   toggle entirely in edit mode (locked-width editor case). */
.ribbon-filter-inline .ribbon-chip-editor .detailRow:has(input[data-checkbox="true"][type="checkbox"]),
.reportFilterCriteria .ribbon-chip-editor .detailRow:has(input[data-checkbox="true"][type="checkbox"]) {
    margin-left: auto !important;
    min-width: 0 !important;
    width: auto !important;
    overflow: visible !important;
    flex: 0 0 auto !important;
}
.ribbon-filter-inline .ribbon-chip-editor .detailInput input[data-checkbox="true"][type="checkbox"] + label,
.reportFilterCriteria .ribbon-chip-editor .detailInput input[data-checkbox="true"][type="checkbox"] + label {
    /* Ensure the empty toggle label has a click target large enough to
       surface its `:before` glyph (font-size: 16px from the global rule).
       Without this it can collapse to 0×0 inside the compact flex chip. */
    display: inline-block !important;
    min-width: 20px;
    min-height: 20px;
    line-height: 20px;
}
.ribbon-filter-inline .ribbon-chip-editor .rce-close,
.reportFilterCriteria .ribbon-chip-editor .rce-close {
    /* Inherits drawn-cross sizing from the base rule; just override the
       baseline opacity/color to match .chip-remove in these hosts. */
    opacity: 0.4;
    color: var(--txt-color, #1f2937);
}
.ribbon-filter-inline .ribbon-chip-editor .rce-close:hover,
.reportFilterCriteria .ribbon-chip-editor .rce-close:hover {
    opacity: 1;
    color: var(--red);
}

/* Saved-filters panel is not part of the inline ribbon UX (the trigger
   button is hidden on relocation; this hides the panel itself in case
   it ever opens while inline-hosted). */
.ribbon-filter-inline .ribbon-saved-filters-popup,
.ribbon-filter-inline-host .ribbon-saved-filters-popup {
    display: none !important;
}

/* Inline-hosted dialog stays in DOM but is invisible. The visibility:hidden */
/* + offscreen positioning is set inline by JS; this rule is a defensive    */
/* fallback in case those styles get cleared by a re-render.                */
.ui-dialog.ribbon-inline-hosted-dialog {
    visibility: hidden !important;
    pointer-events: none !important;
}

/* While an inline ribbon is being re-mounted (e.g. after a saved-filter is
   applied from the west panel and the bubbleDialog is destroyed + reopened),
   suppress every transient btnFilter dialog so it never visibly flashes
   between open and the relocate hand-off. The flag is set/cleared by JS
   around the polled re-open in `_swapInlineRibbonInPlace`. */
body.ribbon-suppress-filter-dialog .ui-dialog:has(> .ui-dialog-content[id^="btnFilterIonBizDialog"]) {
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Ribbon - Save dropdown button */
.ribbon-save-dropdown {
    display: inline-flex;
    position: relative;
}
.ribbon-save-as-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--txt-color);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    padding: 0px 6px 2px 6px;
    font-family: inherit;
}
.ribbon-save-as-btn:hover, .ribbon-save-as-btn:hover .ribbon-save-caret:before {
    color: var(--bg);
    background-color: var(--menu-hover) !important;
}
.ribbon-save-as-btn:before {
    content: none;
}
.ribbon-save-caret {
    font-size: 8px;
    line-height: 8px;
    margin-left: 1px;
    margin-top: 2px;
}
.ribbon-save-caret:before {
    font-family: 'ionbiz';
    content: "\e944";
    color: var(--menu-hover, #2563eb);
}
.ribbon-sf-inline-open .ribbon-save-caret:before {
    color: var(--bg);
}
/* Save dropdown wrapper (single Save button — toggles inline panel) */

/* Ribbon buttons when in the dialog's titlebar */
.ui-dialog-titlebar .ribbon-saved-filters-btn {
    float: right;
    position: relative;
    cursor: pointer;
    color: var(--txt-color);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    padding: 6px 8px;
    font-family: inherit;
    background: none;
    text-transform: uppercase;
    font-weight: 700;
    opacity:0.9;
    border: none;
    margin-right: 2px;
}
.ui-dialog-titlebar .ribbon-saved-filters-btn:before {
    content: "\e927";
    font-family: 'ionbiz';
    font-size: 14px;
}
.ui-dialog-titlebar .ribbon-saved-filters-btn:hover {
    color: var(--blue);
}
/* Ribbon - SaveFilterDetail panel ($sfInline). Mounted inside
   `.ribbon-filter-bar` as a sibling of `.ribbon-chips-container`.
   Hidden by default; the Save button toggles it on. When shown it
   takes the full bar width and wraps onto its own line below the
   chips, holding the Name/Color/Show on home/Save columns/Save
   grouping rows + a Save & Apply submit button. */
.ribbon-sf-inline {
    position: relative;
    /* Shrink to content width, but force onto its own row by reserving
       a full-width line break before it (via order/wrap below). */
    flex: 0 0 auto;
    width: max-content;
    max-width: 100%;
    align-self: flex-start;
    margin-top: 6px;
    padding: 8px 10px;
    background: var(--bg);
    border: 1px solid var(--bg-border, #e3e5e8);
    border-radius: var(--border-radius-md);
    box-shadow: 4px 2px 19px var(--shaddow);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}
/* Force the panel to start on its own line: the chips container above
   it claims the full row, pushing the panel to wrap below. */
.ribbon-filter-bar:has(.ribbon-sf-inline-open) > .ribbon-chips-container {
    flex: 1 1 100%;
    width: 100%;
}
/* Upward-pointing arrow visually anchoring the panel to the Save
   button. Horizontal position is set by JS via --sf-arrow-left to
   match the Save button center. */
.ribbon-sf-inline::before,
.ribbon-sf-inline::after {
    content: '';
    position: absolute;
    left: var(--sf-arrow-left, calc(100% - 60px));
    width: 0;
    height: 0;
    pointer-events: none;
}
.ribbon-sf-inline::before {
    /* Outer triangle = border color */
    top: -8px;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid var(--bg-border, #e3e5e8);
    margin-left: -8px;
}
.ribbon-sf-inline::after {
    /* Inner triangle = background color, slightly smaller and lower */
    top: -7px;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid var(--bg);
    margin-left: -7px;
}
.ribbon-sf-inline > div {
    /* SaveFilterDetail container wrapper rendered by the partial. */
    display: contents;
}
.ribbon-sf-inline .detailRow {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 8px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--bg-border, #b6bcc4);
    border-radius: var(--border-radius-xs, 3px);
    background: var(--east-bg, #fff);
    color: var(--txt-color);
    box-sizing: border-box;
    flex: 0 0 auto;
    clear: none !important;
    float: none !important;
    overflow: visible !important;
    transition: border-color 0.12s ease;
}
.ribbon-sf-inline .detailRow:hover,
.ribbon-sf-inline .detailRow:focus-within {
    border-color: var(--menu-hover, #2563eb);
}
.ribbon-sf-inline .detailLabel {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    color: var(--txt-color);
    white-space: nowrap;
    background: transparent !important;
}
.ribbon-sf-inline .detailLabel:after {
    content: ":";
    margin-left: 1px;
    opacity: 0.6;
}
.ribbon-sf-inline .detailInput {
    width: auto !important;
    float: none !important;
    padding: 0;
    margin: 0;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.ribbon-sf-inline .detailInput input[type=text],
.ribbon-sf-inline .detailInput input[type=number],
.ribbon-sf-inline .detailInput select {
    height: 22px;
    line-height: 22px;
    margin: 0;
    padding: 0 4px;
    font-size: 12px;
    font-weight: 600;
    border: none;
    background: transparent;
    box-shadow: none;
    min-width: 100px;
    max-width: 220px;
}
.ribbon-sf-inline .detailInput input[type=text]:focus {
    outline: none;
}
/* Minicolors swatch alignment inside the chip row. */
.ribbon-sf-inline .detailInput .minicolors {
    display: inline-flex;
    align-items: center;
    margin: 0;
}
.ribbon-sf-inline .detailInput .minicolors-input {
    width: 70px !important;
    height: 22px;
    margin: 0;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
}
/* Constrain the Color row's input wrapper width. */
.ribbon-sf-inline .detailInput:has( .minicolors-input, .colorautocomplete-color, .ionbiz-color-autocomplete):not(:has(.datepicker-inline, .timepicker, #SaveFilterDetail_Color)) {
    max-width: 100px !important;
    min-width: 100px !important;
}
.ribbon-sf-inline .detailInput .minicolors-input:focus {
    outline: none !important;
    box-shadow: none !important;
}
.ribbon-sf-inline .detailInput .minicolors-input-swatch {
    margin-left: 2px;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%);
}
/* SaveFilterDetail.Name in this ribbon context: render as a borderless
   placeholder-only input — no chip border/background on the row, no
   input border/background. */
.ribbon-sf-inline .detailRow:has(input[name="SaveFilterDetail.Name"]) {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
}
.ribbon-sf-inline .detailRow:has(input[name="SaveFilterDetail.Name"]) .detailLabel,
.ribbon-sf-inline .detailRow:has(input[name="SaveFilterDetail.Name"]) .detailLabel:after {
    display: none !important;
}
.ribbon-sf-inline .detailInput input[name="SaveFilterDetail.Name"] {
    outline: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 4px !important;
    color: var(--txt-color);
    border: var(--bg-border);
    height: 30px;
}
/* Hide validation message blocks inline (they still render outside via
   the form's validation summary if present). */
.ribbon-sf-inline .field-validation-error,
.ribbon-sf-inline .field-validation-valid {
    display: none !important;
}
/* Save & Apply button sits inline after the last detailRow chip. */
.ribbon-sf-inline .ribbon-sf-submit {
    flex: 0 0 auto;
    width: auto !important;
    min-width: 0 !important;
    margin: 0;
    padding: 2px 14px;
    font-size: 11px;
    line-height: 22px;
    height: 28px;
    border-radius: var(--border-radius-xl);
    color: var(--bg);
    border: 1px solid var(--menu-hover, #2563eb);
    background: var(--menu-hover, #2563eb);
    font-weight: 700;
    cursor: pointer;
    text-align: center;
}
.ribbon-sf-inline .ribbon-sf-submit:hover {
    background: var(--menu-hover, #2563eb) !important;
    color: var(--bg) !important;
    border-color: var(--menu-hover, #2563eb);
}

/* Apply button — sits as a chip in the chips container */
.ribbon-apply-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    line-height: 1;
    border: solid 1px var(--menu-hover);
    border-radius: var(--border-radius-xl);
    background-color: var(--menu-hover);
    color: var(--bg);
    padding: 7px 13px 7px 10px;
    font-weight: 700;
    font-size: 11px;
    min-width: 60px;
    cursor: pointer;
    margin-right: 4px;
    font-family: inherit;
    white-space: nowrap;
    align-self: center;
}
.ribbon-apply-btn .icon-apply {
    font-family: 'ionbiz';
    font-style: normal;
    font-weight: normal;
    font-size: 10px;
    color: var(--bg);
}
.ribbon-apply-btn .icon-apply:before {
    content: "\e901";
}
.ribbon-apply-btn:hover .icon-apply {
    color: var(--menu-hover);
}
.ribbon-apply-btn:hover {
    background-color: var(--bg) !important;
    color: var(--menu-hover) !important;
}
.ribbon-apply-btn .ui-button-text {
    padding: 0 !important;
    font-size: inherit;
    font-weight: inherit;
}
.ribbon-filter-actions .ribbon-save-dropdown {
    border: solid 1px var(--menu-hover);
    border-radius: var(--border-radius-xl);
    padding: 0 3px 0 6px;
    height: 25px;
}
.ribbon-filter-actions .ribbon-save-dropdown:hover,
.ribbon-filter-actions .ribbon-save-dropdown.ribbon-sf-inline-open {
    background-color: var(--menu-hover) !important;
    color: var(--bg) !important;
}
.ribbon-filter-actions .ribbon-save-dropdown:hover .ribbon-save-as-btn,
.ribbon-filter-actions .ribbon-save-dropdown.ribbon-sf-inline-open .ribbon-save-as-btn {
    color: var(--bg) !important;
    background-color: var(--menu-hover) !important;
}
.ribbon-filter-actions .ribbon-save-as-btn {
    font-weight: 700;
    font-size: 11px;
    text-transform: none;
    color:var(--menu-hover);
    border-radius: var(--border-radius-md);
}

/********************************************************
    Ribbon-style Column Chooser
********************************************************/
.columChooser:has(.ribbon-col-wrapper),
.ui-dialog[aria-describedby^="btnPlanningSelectTextsIonBizDialog"]:has(.ribbon-col-wrapper) {
    width: auto !important;
}
/* The holder keeps a definite height so only the list scrolls. */
.columChooser:has(.ribbon-col-wrapper) > .bubbleDialogHolder,
.ui-dialog[aria-describedby^="btnPlanningSelectTextsIonBizDialog"]:has(.ribbon-col-wrapper) .bubbleDialogHolder {
    max-height: min(32rem, 70vh) !important;
    overflow: hidden;
}
/* The search / All bar shares the button pane with Submit. */
.ui-dialog-buttonpane:has(> .ribbon-col-wrapper) {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
}
.ui-dialog-buttonpane > .ribbon-col-wrapper {
    flex: 1 1 auto;
    min-width: 0;
}
.ui-dialog-buttonpane:has(> .ribbon-col-wrapper) > .ui-dialog-buttonset {
    flex: 0 0 auto;
    float: none;
    margin: 0;
}
/* Out here the bar needs no box of its own, and the pane's generic button styling would
   otherwise turn the All toggle into a second Submit-like pill. */
.ui-dialog-buttonpane > .ribbon-col-wrapper .ribbon-col-bar {
    padding: 0;
    gap: 0;
    min-height: 0;
    border: none;
    border-radius: 0;
    background: none;
    cursor: default;
}
.ui-dialog-buttonpane > .ribbon-col-wrapper .ribbon-col-search {
    height: 28px;
    line-height: 18px;
}
/* The pane's generic button styling outranks .ribbon-col-select-all, so the toggle has to
   be un-pilled from here or it reads as a second Submit. */
.ui-dialog-buttonpane > .ribbon-col-wrapper .ribbon-col-select-all {
    margin: 0;
    padding: 0 8px;
    font-size: 11px;
    border: 1px solid transparent;
    border-radius: var(--border-radius-sm);
    background: none;
}
/* Column chooser checklist. The original #sortable list keeps the DOM order that Submit
   turns into the column order - checked rows are only lifted above unchecked ones
   visually, via flex order. */
.bubbleDialogHolder:has(> ul#sortable.ribbon-col-list) {
    flex-direction: column;
}
.bubbleDialogHolder:has(> ul#sortable.ribbon-col-list) > .ribbon-col-list-empty {
    flex: 0 0 auto;
}
ul#sortable.ui-sortable.ribbon-col-list {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 4px;
    text-indent: 0;
    /* Bounded by the holder instead - the responsive rules set an !important percentage
       that resolves to nothing here, because the list is a flex item. */
    max-height: none !important;
    min-height: 0;
    flex: 1 1 auto;
    overflow-y: auto;
}
ul#sortable.ui-sortable.ribbon-col-list > li {
    order: 0;
    padding-left: 4px;
    overflow: visible;
    cursor: grab;
}
ul#sortable.ui-sortable.ribbon-col-list > li:active {
    cursor: grabbing;
}
/* Drag handle, same glyph as the tickets Ranking column (.drag-handle-icon). The whole
   row stays draggable, so this only has to read as one. */
ul#sortable.ui-sortable.ribbon-col-list > li::before {
    content: "\e951";
    font-family: "ionbiz";
    font-size: 18px;
    line-height: 30px;
    color: var(--bg-border);
    flex: 0 0 auto;
    width: 16px;
    text-align: center;
    text-indent: 0;
}
ul#sortable.ui-sortable.ribbon-col-list > li:hover::before {
    color: var(--txt-color);
}
ul#sortable.ui-sortable.ribbon-col-list > li.ui-sortable-placeholder::before {
    content: none;
}
ul#sortable.ui-sortable.ribbon-col-list > li > label {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
}
/* Freeze toggle: a pin that stays out of the way until the row is hovered, unless the
   column is already frozen. */
ul#sortable.ui-sortable.ribbon-col-list > li > .stick-handle {
    visibility: hidden;
}
ul#sortable.ui-sortable.ribbon-col-list > li:hover > .stick-handle {
    visibility: visible;
}
ul#sortable.ui-sortable.ribbon-col-list > li > .stick-handle::before,
ul#sortable.ui-sortable.ribbon-col-list > li > .unstick-handle::before {
    content: "\e955" !important;
}
ul#sortable.ui-sortable.ribbon-col-list > li.ribbon-col-hidden {
    order: 2;
}
ul#sortable.ui-sortable.ribbon-col-list > li.hide,
ul#sortable.ui-sortable.ribbon-col-list > li.ribbon-col-filtered {
    display: none;
}
/* Group captions. Pseudo-elements act as flex items, so unlike a divider <li> they can
   never be picked up by the sortable or counted into the submitted column order. */
ul#sortable.ui-sortable.ribbon-col-list::before,
ul#sortable.ui-sortable.ribbon-col-list::after {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.08em;
    line-height: normal;
    text-transform: uppercase;
    opacity: 0.55;
    padding: 6px 0 4px 10px;
    pointer-events: none;
}
ul#sortable.ui-sortable.ribbon-col-list::before {
    content: attr(data-active-label);
    order: -1;
}
ul#sortable.ui-sortable.ribbon-col-list::after {
    content: attr(data-hidden-label);
    order: 1;
}
ul#sortable.ui-sortable.ribbon-col-list:not(:has(> li:not(.hide, .ribbon-col-filtered, .ribbon-col-hidden)))::before,
ul#sortable.ui-sortable.ribbon-col-list:not(:has(> li.ribbon-col-hidden:not(.hide, .ribbon-col-filtered)))::after {
    display: none;
}
.ribbon-col-list-empty {
    padding: 14px;
    font-size: 11px;
    color: var(--txt-color);
    text-align: center;
    opacity: 0.7;
}
/* On narrow/portrait screens the dialog goes full screen, so let the checklist fill it
   the same way the responsive rules above intend. */
@media (max-width: 800px), (orientation: portrait) {
    .columChooser:has(.ribbon-col-wrapper) > .bubbleDialogHolder,
    .ui-dialog[aria-describedby^="btnPlanningSelectTextsIonBizDialog"]:has(.ribbon-col-wrapper) .bubbleDialogHolder {
        max-height: calc(100% - 100px) !important;
    }
}
.ribbon-col-bar {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 5px;
    padding: 6px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: var(--east-bg);
    min-height: 36px;
    cursor: text;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.ribbon-col-chips {
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: flex-start;
    max-height:50vh;
    overflow:auto;
}
.ribbon-col-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border-radius: var(--border-radius-xs);
    padding: 8px 6px 8px 10px;
    font-size: 12px;
    font-weight: 500;
    min-width: 240px;
    white-space: nowrap;
    flex-shrink: 0;
    user-select: none;
    cursor: grab;
    background: var(--bg);
    border:1px solid var(--bg-border-light);
    color: var(--txt-color);
    transition: border-color 0.15s, opacity 0.15s;
}

.ribbon-col-chip .ribbon-col-chip-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.2px;
}
.ribbon-col-chip-remove {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0 1px 0 2px;
    line-height: 1;
    color: inherit;
    font-size: 15px;
    opacity: 0.5;
    margin-right: 2px;
}
.ribbon-col-chip-remove:hover {
    color: var(--red);
    opacity: 1;
}
.ribbon-col-search {
    border: none;
    background: transparent;
    outline: none;
    font-size: 12px;
    font-family: inherit;
    color: var(--txt-color);
    width: 100%;
    padding: 4px 6px;
    line-height: 20px;
    box-sizing: border-box;
    background-color: var(--bg) !important;
    outline: 1px dashed transparent !important;
    border-radius: var(--border-radius-sm) !important;
}
.ribbon-col-search::placeholder {
    color: var(--txt-color);
    font-weight: 500;
}
/* Column chooser bar footer (Select All + search input) */
.ribbon-col-bar-footer {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}
.ribbon-col-bar-footer .ribbon-col-search {
    flex: 1 1 auto;
    min-width: 0;
    background-color: var(--east-bg) !important;
}
/* Select All toggle button */
.ribbon-col-select-all {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 28px;
    margin: 0;
    padding: 0 8px;
    background: none;
    border: 1px solid transparent;
    border-radius: var(--border-radius-sm);
    cursor: pointer;
    font-family: inherit;
    font-size: 11px;
    font-weight: 500;
    color: var(--txt-color);
    flex-shrink: 0;
    transition: color 0.15s;
}
.ribbon-col-select-all:hover {
    color: var(--menu-hover);
    background: var(--hover);
}
.ribbon-col-select-all-icon {
    font-family: 'ionbiz';
    font-size: 16px;
    line-height: 1;
    font-weight: bold;
}
.ribbon-col-select-all:not(.checked) .ribbon-col-select-all-icon:before {
    content: "\e93e";
    color: var(--txt-color);
}
.ribbon-col-select-all.checked .ribbon-col-select-all-icon:before {
    content: "\e640";
    color: var(--menu-hover);
}
.ribbon-col-select-all-label {
    font-size: 11px;
    font-weight: 500;
}
/* Column chooser dropdown (appended to body) */
.ribbon-col-dropdown {
    position: absolute;
    background: var(--bg);
    border: 1px solid var(--bg-border-light);
    border-radius: 10px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12);
    z-index: 10000;
    overflow-y: auto;
    max-height: 260px;
    min-width: 200px;
    padding: 5px;
}
.ribbon-col-dd-item {
    display: flex;
    align-items: center;
    padding: 7px 14px 7px 17px;
    margin: 2px 0;
    cursor: pointer;
    transition: background 0.1s;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 2px 0%;
    border-radius: var(--border-radius-xs);
}
.ribbon-col-dd-item:hover,
.ribbon-col-dd-item.ribbon-col-dd-item-focused {
    background-color: var(--hover);
    background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
    background-size: 2px 50%;
    background-repeat: no-repeat;
    background-position: left center;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.ribbon-col-dd-label {
    font-size: 12px;
    font-weight: 500;
    color: var(--txt-color);
}
.ribbon-col-dd-empty {
    padding: 10px 14px;
    font-size: 11px;
    color: var(--txt-color);
    text-align: center;
}
/* Ribbon Group By Chooser */
.gridGroupByList:has(.ribbon-groupby-wrapper) > .bubbleDialogHolder {
    max-height: none !important;
}
.gridGroupByList:has(.ribbon-groupby-wrapper) .bubbleDialogHolder > ul.ui-selectable {
    display: none !important;
}
.ribbon-groupby-wrapper {
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.ribbon-groupby-section {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
}
.ribbon-groupby-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--txt-color);
    opacity:0.8;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding-left: 2px;
    white-space: nowrap;
    flex-shrink: 0;
    min-width: 70px;
}
.ribbon-groupby-bar {
    min-width: 120px;
    flex: 1 1 auto;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 4px;
    padding: 0px 6px;
    min-height: 30px;
    border: 1px solid var(--bg-border-light);
    border-radius: var(--border-radius-sm);
    background: var(--bg);
    cursor: text;
    position: relative;
}
.ribbon-groupby-bar .ribbon-col-chips {
    flex-direction: row;
    flex-wrap: nowrap;
    max-height: none;
    overflow: visible;
    flex: 1 1 auto;
    gap: 4px;
}
.ribbon-groupby-bar .ribbon-col-search {
    flex: 1 1 auto;
    min-width: 60px;
    width: auto;
    padding: 2px 0px;
    line-height: 22px;
    outline-color: transparent !important;
}
.ribbon-groupby-bar:has(.ribbon-groupby-chip) .ribbon-col-search {
    min-width: 0;
    width: 0 !important;
    padding: 0 2px;
    flex: 0 1 auto;
    opacity: 0;
    position: absolute;
}

.ribbon-groupby-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: default;
    padding: 8px 6px 8px 10px;
    border-radius: var(--border-radius-xs);
    border-color: transparent;
    font-size: 12px;
    flex-shrink: 0;
    width: 100%;
    min-width: auto;
}
.ribbon-groupby-chip .ribbon-col-chip-label {
    flex: 1;
}

/* PWA install banner */
#pwa-install-banner {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 99999;
    background: var(--menu-hover);
    color: var(--bg);
    padding: 12px 16px;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    box-shadow: 0 -2px 8px var(--shaddow);
}
#pwa-install-banner img {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    flex-shrink: 0;
}
#pwa-install-banner > span {
    flex: 1;
}
#pwa-ios-msg {
    display: none;
}
#pwa-install-btn {
    display: none;
    background: var(--bg);
    color: var(--menu-hover);
    border: none;
    border-radius: var(--border-radius-xl);
    padding: 7px 16px;
    font-weight: 600;
    cursor: pointer;
    font-size: 14px;
}
#pwa-dismiss-btn {
    background: transparent;
    border: none;
    color: var(--bg);
    font-size: 20px;
    cursor: pointer;
    line-height: 1;
    padding: 0 4px;
}

/* Standalone PWA pull-to-refresh indicator */
.ionbiz-pwa-pull-refresh-indicator {
    --ionbiz-pull-translate: -140%;
    --ionbiz-pull-opacity: 0;
    position: fixed;
    left: 50%;
    top: 8px;
    transform: translate(-50%, var(--ionbiz-pull-translate));
    z-index: 99999;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    color: var(--bg);
    background: var(--menu-hover);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    pointer-events: none;
    transition: transform 0.12s ease-out, opacity 0.12s ease-out;
    opacity: var(--ionbiz-pull-opacity);
}

/* Ribbon - Mobile: stack the saved filters popup below the filter bar */
@media (max-width: 768px) {
    .ribbon-filter-wrapper.ribbon-sf-panel-open {
        flex-direction: column !important;
    }
    .ribbon-filter-wrapper .ribbon-saved-filters-popup {
        flex: 0 0 auto;
        max-width: none;
        min-width: 0;
        border-left: none;
        border-top: 1px solid var(--bg-border-light);
        border-radius: 0 0 var(--border-radius-sm) var(--border-radius-sm);
        max-height: 300px;
    }
    .reportFilterCriteria .ribbon-filter-actions{
        display:none;
    }
}
/* ── Glittering stars ────────────────────────────────────
       No connecting edges this time — just floating points
       that twinkle independently. Each star has TWO layers:

         .star      — the small dot (currentColor)
         .star::after — a 4-pointed cross-shaped glint that
                        scales + rotates on the same beat to
                        give the classic "twinkle / glitter"
                        sparkle look.

       Stars are positioned with inline left/top % (top-half
       only). Each has its own --d (delay) and --dur (duration)
       inline vars so the whole field never pulses in unison.

       A vertical fade overlay dissolves the bottom of the
       field so the form area stays clean.                    */
    .stars-bg {
      position: fixed;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      overflow: hidden;
      color: var(--menu-hover);   /* drives currentColor */
    }
    .stars-bg::after {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background: linear-gradient(
        180deg,
  color-mix(in oklab, var(--bg) 0%, transparent) 0%,
  color-mix(in oklab, var(--bg) 0%, transparent) 28%,
  color-mix(in oklab, var(--bg) 90%, transparent) 50%,
  var(--bg) 65%
      );
    }

    /* ── Glitter v2: "lens flare" ────────────────────────────
         .star       — the core dot, slow breathing fade
         .star::before — a soft radial halo that blooms
         .star::after  — a 4-point diffraction spike (CSS
                         conic-gradient mask) that GROWS in
                         length, then retracts. No rotation —
                         reads as zen / luxury, not arcade. */
    .stars-bg .star {
      position: absolute;
      width: 3px;
      height: 3px;
      margin: -1.5px 0 0 -1.5px;
      border-radius: 999px;
      background: currentColor;
      animation: twinkle var(--dur, 9s) ease-in-out infinite;
      animation-delay: var(--d, 0s);
      opacity: 0;
      transform-origin: center;
    }
    /* soft halo */
    .stars-bg .star::before {
      content: "";
      position: absolute;
      left: 50%; top: 50%;
      width: 22px; height: 22px;
      margin: -11px 0 0 -11px;
      border-radius: 999px;
      background: radial-gradient(circle,
        color-mix(in oklab, currentColor 55%, transparent) 0%,
        transparent 65%);
      animation: halo var(--dur, 9s) ease-in-out infinite;
      animation-delay: var(--d, 0s);
      opacity: 0;
    }
    /* 4-point diffraction spike, built from two perpendicular
       gradients. Grows length on a separate keyframe.        */
    .stars-bg .star::after {
      content: "";
      position: absolute;
      left: 50%; top: 50%;
      width: 40px; height: 40px;
      margin: -20px 0 0 -20px;
      background:
        linear-gradient(90deg,
          transparent 0%,
          transparent 30%,
          currentColor 50%,
          transparent 70%,
          transparent 100%) center / 100% 1px no-repeat,
        linear-gradient(0deg,
          transparent 0%,
          transparent 30%,
          currentColor 50%,
          transparent 70%,
          transparent 100%) center / 1px 100% no-repeat;
      animation: spike var(--dur, 9s) ease-in-out infinite;
      animation-delay: var(--d, 0s);
      opacity: 0;
      transform-origin: center;
      transform: scale(0.2);
    }

    /* Bigger, slower, the brand accent */
    .stars-bg .star.reef {
      width: 4px;
      height: 4px;
      margin: -2px 0 0 -2px;
      background: var(--ion-reef);
      box-shadow: 0 0 22px var(--ion-reef);
    }
    .stars-bg .star.reef::before {
      width: 36px; height: 36px;
      margin: -18px 0 0 -18px;
      background: radial-gradient(circle,
        color-mix(in oklab, var(--ion-reef) 70%, transparent) 0%,
        transparent 65%);
    }
    .stars-bg .star.reef::after {
      width: 60px; height: 60px;
      margin: -30px 0 0 -30px;
      background:
        linear-gradient(90deg,
          transparent 0%, transparent 25%,
          var(--ion-reef) 50%,
          transparent 75%, transparent 100%) center / 100% 1.5px no-repeat,
        linear-gradient(0deg,
          transparent 0%, transparent 25%,
          var(--ion-reef) 50%,
          transparent 75%, transparent 100%) center / 1.5px 100% no-repeat;
    }

    /* Minor stars — small, no halo, no spike */
    .stars-bg .star.minor {
      width: 2px;
      height: 2px;
      margin: -1px 0 0 -1px;
      opacity: 0;
    }
    .stars-bg .star.minor::before,
    .stars-bg .star.minor::after { display: none; }

    /* Slow breathing of the core dot */
    @keyframes twinkle {
      0%, 100% { opacity: 0;   transform: scale(0.8); }
      40%      { opacity: 0.6; transform: scale(1);   }
      50%      { opacity: 1;   transform: scale(1.1); }
      60%      { opacity: 0.6; transform: scale(1);   }
    }
    /* Halo blooms slightly after the core peaks */
    @keyframes halo {
      0%, 100% { opacity: 0;    transform: scale(0.4); }
      45%      { opacity: 0.35; transform: scale(0.8); }
      55%      { opacity: 0.6;  transform: scale(1);   }
      70%      { opacity: 0.25; transform: scale(1.15);}
    }
    /* Diffraction spike: grows long at peak, no rotation */
    @keyframes spike {
      0%, 100% { opacity: 0;   transform: scale(0.2); }
      40%      { opacity: 0.5; transform: scale(0.7); }
      50%      { opacity: 0.9; transform: scale(1);   }
      62%      { opacity: 0.4; transform: scale(1.1); }
      78%      { opacity: 0;   transform: scale(0.6); }
    }

    @media (prefers-reduced-motion: reduce) {
      .stars-bg .star { animation: none; opacity: 0.85; }
      .stars-bg .star::before, .stars-bg .star::after { animation: none; opacity: 0; }
    }
    /* End of stars CSS */
/* ============================================================
   ionBIZ Design System — Core Tokens (new design)
   Separate from legacy tokens in base.css — do not merge.
   ============================================================ */
:root {
  /* Colours */
  --ion-white:           #FFFFFF;
  --ion-mercury:         #E0E0E0;
  --ion-alabaster:       #F8F8F8;
  --ion-blue-ribbon:     #2F6AF9;
  --ion-biscay:          #192D5C;
  --ion-dove-gray-900:   #141414;
  --ion-dove-gray-600:   #555555;
  --ion-reef:            #D0FE90;
  --ion-havelock-blue:   #96C5FE;
  --bg-brand-soft:       #EAF0FE;
  --ion-avatar-bg:       #f1ece4;

  /* Shadows */
  --shadow-xs: 0 1px 2px rgba(25, 45, 92, 0.05);
  --shadow-lg: 0 16px 40px rgba(25, 45, 92, 0.10), 0 4px 10px rgba(25, 45, 92, 0.06);
  --shadow-xl: 0 24px 60px rgba(25, 45, 92, 0.14), 0 8px 16px rgba(25, 45, 92, 0.08);

  /* Radii */
  --r-pill: 999px;

  /* Motion */
  --dur-fast: 120ms;
  --dur-base: 200ms;
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);

  /* Typography */
  --font-body: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* ============================================================
   Utility Pill — desktop styles
   ============================================================ */

/* #quickSearchHolder — hidden; only its data-attributes are used by the unified search popover */
.up-search-holder { display: none !important; }

/* Pill container — uses existing theme tokens so light/dark/classic all work */
.utility-pill {
  /* Also read by .rail-pin-toggle in base.css, which sits inside the pill. */
  --up-btn-size: 36px;
  display: inline-flex;
  align-items: center;
  height: 42px;
  padding: 3px 6px;
  position: relative;
  border-radius: var(--r-pill);
  background: var(--bg);
  border: 1px solid var(--bg-border);
  box-shadow: var(--shadow-xs);
  gap: 0;
}

/* Icon buttons */
.up-btn {
  position: relative;
  width: var(--up-btn-size); height: var(--up-btn-size);
  border-radius: var(--r-pill);
  border: 0;
  background: transparent;
  color: var(--txt-color);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out),
              color    var(--dur-fast) var(--ease-out);
  flex-shrink: 0;
}
.up-btn svg        { width: 18px; height: 18px; pointer-events: none; }
/* Override legacy #ionChat rules from overrides.css (width/height/margin/::before glyph) */
#ionChat { width: var(--up-btn-size) !important; height: var(--up-btn-size) !important; margin-left: 0 !important; margin-right: 0 !important; }
#ionChat::before { content: none !important; }
.up-btn:hover,.up-btn.is-active     { background: var(--hover, #f5f5f5); color: var(--menu-hover, #2F6AF9); }

.up-btn:focus-visible { outline: 2px solid var(--ion-blue-ribbon); outline-offset: 2px; }

/* Notification: replace bell icon with count circle when unread > 0.
   The existing span.unreadNotes has position/size from Index.css (specificity 0,0,1,1).
   We use .utility-pill .unreadNotes (0,0,2,0) and :has() to win. */

/* When count > 0: hide the bell SVG, show count circle instead */
.utility-pill .up-btn:has(.unreadNotes:not([data-unread="0"])) > svg {
  display: none !important;
}

/* Count circle fills the button slot when count > 0 */
.utility-pill .unreadNotes:not([data-unread="0"]) {
  position: absolute !important;
  left: 2px !important; right: 2px !important;
  top: 2px !important; bottom: 2px !important;
  width: auto !important; height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--green) !important;
  border-radius: 50% !important;
  border: none !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #141414 !important;
  z-index: 2;
  pointer-events: none;
}
/* Override Index.css ::before which also renders the count as its own mini-circle */
.utility-pill .unreadNotes:not([data-unread="0"])::before {
  content: attr(data-unread-label) !important;
  position: static !important;
  display: block !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  min-width: auto !important;
  height: auto !important;
  line-height: normal !important;
  margin-left: 0 !important;
  font-size: 11px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  color: inherit !important;
}

/* When count = 0: keep span hidden */
.utility-pill .unreadNotes[data-unread="0"],
.utility-pill .up-badge[data-unread="0"] { display: none !important; }

/* Divider between bell and avatar */
.up-divider {
  width: 1px; height: 22px;
  background: var(--bg-border);
  margin: 0 4px;
  flex-shrink: 0;
}

/* Avatar */
.up-avatar {
  width: 30px; height: 30px;
  border-radius: var(--r-pill);
  background-color: var(--ion-avatar-bg);
  background-size: cover;
  background-position: center;
  cursor: pointer;
  overflow: hidden;
  margin: 0;
  flex-shrink: 0;
}
.up-avatar a { display: block; width: 100%; height: 100%; }

/* Ajax loading ring (.ajaxLoading:after in base.css) is drawn at 110% around the
   avatar, so it needs a positioning context and must escape the clip. */
.up-avatar.ajaxLoading { position: relative; overflow: visible; }

/* ============================================================
   Pill slot — single render point, positioned per breakpoint
   ============================================================ */

/* Desktop: mirror the old #myMenu absolute anchor (top-right of north header).
   #northLayout is position:relative (the app-shell header), so this lands top-right.
   The side rails re-anchor it to the foot of the rail. */
.topbar-pill-slot {
  position: absolute;
  top: 5px;
  right: 10px;
  display: flex;
  align-items: center;
  z-index: 1000; /* raised so popover appears above page content */
  overflow: visible;
}

/* A maximized dialog fills the viewport and lands its restore/close controls in this
   exact corner. The pill sits above dialogs (z-index 1000 vs .ui-front's 100), so it
   has to be hidden rather than out-stacked. Navigation is unreachable in that state
   anyway, which is why the print stylesheet hides the toolbar for the same reason. */
body.hasMaximizedModal .topbar-pill-slot {
  display: none;
}

/* Same breakpoint as the base.css rule that forces every dialog full-screen. In this
   range a dialog is maximized by viewport size rather than by the maximize button, so
   modalMaximized is never set and the flag above cannot catch it. Any open dialog owns
   the whole viewport here, so the pill goes. At <= 768px the slot also drops to
   z-index 20 and would be covered anyway; hiding it is consistent and harmless. */
@media (max-width: 1024px), (orientation: portrait) {
  body.hasOpenDialog .topbar-pill-slot {
    display: none;
  }
}

/* ============================================================
   Vertical rail (body[data-menu-position="left"|"right"])
   The rail is only offered from 769px up; below that the mobile topbar owns the pill.
   ============================================================ */
@media (min-width: 769px) {
  /* An open rail is 180px wide, which a row of 36px buttons overflows, so the row steps
     the buttons down to the avatar's 30px. */
  body:is([data-menu-position="left"], [data-menu-position="right"]) .utility-pill {
    --up-btn-size: 30px;
    width: auto;
    height: auto;
    padding: 3px 5px;
  }

  body:is([data-menu-position="left"], [data-menu-position="right"]) .up-divider {
    height: 20px;
    margin: 0 3px;
  }

  /* The popover is viewport-fixed, so it has to be told about the rail rather than
     following the button. Beside a rail it would sit in the bottom corner, furthest from
     where the eye is, so it is centred on the viewport instead. */
  body:is([data-menu-position="left"], [data-menu-position="right"]) .psp {
    top: 50%;
    bottom: auto;
    left: 50%;
    right: auto;
    transform: translate(-50%, -50%);
  }
}

/* Stacked only while the rail is collapsed to icons. The rail never collapses without
   hover, which is why this is guarded the same way. */
@media (min-width: 769px) and (hover: hover) {
  body:not([data-menu-rail="pinned"]):is([data-menu-position="left"], [data-menu-position="right"]) #northLayout:not(.rail-hover, .rail-open) .utility-pill {
    --up-btn-size: 36px;
    flex-direction: column;
    width: 42px;
    padding: 6px 3px;
  }

  body:not([data-menu-rail="pinned"]):is([data-menu-position="left"], [data-menu-position="right"]) #northLayout:not(.rail-hover, .rail-open) .up-divider {
    width: 22px;
    height: 1px;
    margin: 4px 0;
  }
}

/* ============================================================
   Utility Pill — mobile overrides (≤ 768px)
   ============================================================ */
@media (max-width: 768px) {
  /* On mobile: fix the pill slot to the top-right of the viewport,
     aligned with the mob-topbar (height 63px). This keeps it visible
     without being inside the hidden #myMenu or the flex mob-topbar. */
  .topbar-pill-slot {
    position: fixed;
    top: 10px;
    right: 12px;
    z-index: 20;
  }

  .utility-pill {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
    height: 44px;
  }
  .up-btn {
    width: 44px;
    height: 44px;
  }
  .up-divider { display: none; }
  #ionChat { width: 44px !important; height: 44px !important; }
  .utility-pill .unreadNotes:not([data-unread="0"]) {
    width: 30px !important;
    height: 30px !important;
    left: 50% !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%);
  }
  .up-avatar {
    width: 40px;
    height: 40px;
    margin: 0;
  }

  /* Follows the bar it belongs to when the nav is docked at the bottom. */
  body[data-menu-position="bottom"] .topbar-pill-slot {
    top: auto;
    bottom: calc(10px + var(--mob-bar-pad-b, 0px));
  }
}

/* Fixed to the viewport, so the strip #appShell reserves for the iOS status bar has to be
   added here by hand. */
@media (display-mode: standalone) and (max-width: 768px) {
  body:not([data-menu-position="bottom"]) .topbar-pill-slot {
    top: calc(10px + var(--pwa-top-gap, 16px));
  }

  body:not([data-menu-position="bottom"]) .psp {
    top: calc(58px + var(--pwa-top-gap, 16px));
  }
}

/* ============================================================
   Pill Search Popover (.psp)
   ============================================================ */
.psp {
  display: none;
  position: fixed;
  top: 58px;
  right: 10px;
  width: 460px;
  font-size: 14px !important; /* override header { font-size: 0.7rem } from base.css */
  color: var(--txt-color); /* use existing theme token — works in light/dark/classic */
  background: var(--bg);
  border: 1px solid var(--bg-border-light);
  border-radius: var(--border-radius-md);
  box-shadow: var(--shadow-xl);
  flex-direction: column;
  overflow: hidden;
  z-index: 100;
}
.psp.is-open { display: flex; }

/* Mobile: full-width popover below the 63px topbar. Placed immediately after base .psp rules
   so source order wins the cascade — no !important needed. */
@media (max-width: 768px) {
  .psp {
    top: 63px;
    left: 0;
    right: 0;
    width: auto; /* overrides base width: 460px */
    border-radius: 0 0 var(--border-radius-md) var(--border-radius-md);
    max-height: calc(100vh - 63px);
  }

  body[data-menu-position="bottom"] .psp {
    top: auto;
    bottom: calc(63px + var(--mob-bar-pad-b, 0px));
    border-radius: var(--border-radius-md) var(--border-radius-md) 0 0;
  }
}

/* Input header */
.psp-head {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 54px;
  padding: 0 16px;
  border-bottom: 1px solid var(--bg-border-light);
  flex-shrink: 0;
}
.psp-search-ico { flex-shrink: 0; color: #888; }
.psp-input {
  flex: 1;
  border: 0;
  background: transparent;
  font-size: 15px !important;
  font-weight: 500;
  color: var(--txt-color) !important;
  outline: none;
  height: 30px;
}
.psp-input::placeholder { color: #888; font-weight: 400; }
#pillSearchInput:focus {
  outline: 2px solid var(--bg-border);
  outline-offset: 0px;
}
.psp-esc {
  font-size: 11px !important;
  font-weight: 600;
  color: #888 !important;
  background: var(--bg);
  border: 1px solid var(--bg-border);
  border-radius: 6px;
  padding: 2px 6px;
  flex-shrink: 0;
}
.psp-close {
  width: 28px; height: 28px;
  border: 0; background: transparent;
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  color: #888 !important;
  flex-shrink: 0;
}
.psp-close:hover { background: var(--hover, #f5f5f5); color: var(--txt-color) !important; }

/* Body */
.psp-body { overflow-y: auto; max-height: 420px; padding: 8px 0; }

.psp-results { list-style: none; margin: 0; padding: 0; }

/* "Recent [Type]" section title — larger, with clock icon */
.psp-section-header {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 12px 16px 6px;
  font-size: 13px !important;
  font-weight: 600;
  color: var(--txt-color) !important;
}
.psp-section-header svg { flex-shrink: 0; opacity: 0.6; }

/* Date group separator — compact gray uppercase (psp-group-header is alias for Id=0 items) */
.psp-date-header,
.psp-group-header {
  padding: 8px 16px 3px;
  font-size: 10px !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #888 !important;
}

.psp-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  cursor: pointer;
  font-size: 13px !important;
  color: var(--txt-color) !important;
}
.psp-item:hover, .psp-item:focus, .psp-item.is-selected { background: var(--hover, #f5f5f5) !important; outline: none; }
.psp-item-ico {
  width: 16px; height: 16px;
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
/* Icon font — mirrors .ui-autocomplete li a > .IconClass:before rules in Index.css */
.psp-item-ico.no-icon { display: none; }
.psp-item-ico::before {
  font-family: "ionbiz";
  font-style: normal;
  font-weight: normal;
  font-size: 11px;
  color: #96938E;
}
.psp-item-ico.RelationIcon::before  { content: "\e618"; color: var(--blue); }
.psp-item-ico.ItemIcon::before      { content: "\e928"; color: var(--blue); }
.psp-item-ico.LeadIcon::before      { content: "\e68c"; color: var(--blue); }
.psp-item-ico.QuoteIcon::before     { content: "\e616"; color: var(--dark-green); }
.psp-item-ico.ContactIcon::before   { content: "\e620"; color: #D2691E; }
.psp-item-ico.ResourceIcon::before  { content: "\e620"; color: #FFA500; }
.psp-item-ico.PhoneIcon::before     { content: "\e661"; color: var(--blue); }
.psp-item-ico.ActivityIcon::before  { content: "\e920"; color: var(--blue); }
.psp-item-ico.ProjectIcon::before   { content: "\e615"; color: var(--blue); }
.psp-item-ico.ContractLineIcon::before      { content: "\e682"; color: var(--blue); }
.psp-item-ico.ContractExtraLineIcon::before { content: "\e682"; color: #CC9D05; }
.psp-item-ico.InvoiceIcon::before   { content: "\e611"; }
.psp-item-ico.IssueIcon::before     { content: "\e61a"; }
.psp-item-ico.TicketIcon::before    { content: "\e61a"; }

/* Colored status indicator (from localStorage item.color) */
.psp-item-color {
  width: 8px;
  height: 8px;
  border-radius: 3px;
  flex-shrink: 0;
  align-self: center;
}

/* New-tab indicator on localStorage recent items */
.psp-item-newtab {
  margin-left: auto;
  flex-shrink: 0;
  opacity: 0.35;
  color: #888;
}

/* Short ID prefix (e.g. "FreID") — gray, before the blue name */
.psp-item-id {
  color: var(--txt-color) !important;
  opacity: 0.8;
  font-weight: 600;
  font-size: 11px !important;
  flex-shrink: 0;
  white-space: nowrap;
}

/* Label — matches existing autocomplete link color */
.psp-item-label {
  flex: 1;
  white-space: nowrap;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--blue) !important;
}

/* Closed records: server sends "tcRed" as the item's colour class — beats the !important on the spans */
.psp-item.tcRed .psp-item-id,
.psp-item.tcRed .psp-item-label { color: var(--red) !important; }

.psp-empty {
  padding: 28px 16px;
  text-align: center;
  color: var(--txt-color) !important;
  font-size: 13px !important;
  line-height: 1.5;
}
.psp-empty strong {
  display: block;
  color: var(--txt-color) !important;
  font-size: 14px !important;
  margin-bottom: 4px;
}

/* Footer */
.psp-foot {
  padding: 10px 16px;
  border-top: 1px solid var(--bg-border-light);
  background: var(--bg);
  text-align: right;
  font-size: 12px !important;
  font-weight: 500;
  color: var(--txt-color) !important;
  flex-shrink: 0;
}
.psp-foot strong { color: var(--txt-color) !important; font-weight: 700; }


/* ============================================================
   Mobile navigation — topbar + slide-in drawer
   Only active at ≤ 768px. Desktop layout is unaffected.
   ============================================================ */

/* ── Mobile topbar ──────────────────────────────────────────── */
.mob-topbar {
  display: none; /* shown by media query below */
  align-items: center;
  /* height set to 63px by the ≤768px media query below */
  padding: 0 12px;
  gap: 8px;
  background: var(--bg);
  border-bottom: 1px solid var(--bg-border-light);
  position: relative;
  z-index: 10;
}

/* Hamburger button */
.mob-ham {
  width: 44px; height: 44px;
  border: 0;
  background: transparent;
  border-radius: 10px;
  color: var(--txt-color);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: background var(--dur-fast) var(--ease-out);
}
.mob-ham:hover { background: var(--hover, #F8F8F8); }
.mob-ham svg { width: 22px; height: 22px; }

/* Logo link */
.mob-logo-link { display: flex; align-items: center; }
.mob-logo-img  { height: 28px; display: block; }

/* ── Recent menu items ──────────────────────────────────────── */
.mob-recent {
  display: flex;
  align-items: center;
  /* Takes the rest of the row and spreads the tiles across it. The pill is fixed over the
     right end rather than laid out here, so its width has to be reserved by hand. */
  flex: 1 1 auto;
  min-width: 0;
  margin-right: 172px;
  justify-content: space-evenly;
}
.mob-recent:empty { display: none; }

.mob-recent-item {
  display: flex;
  align-items: center;
  /* Grows into the spare width up to a comfortable tile, never below a thumb's worth. */
  flex: 0 1 62px;
  min-width: 44px;
  height: 44px;
  border-radius: var(--border-radius-sm);
  color: var(--txt-color);
  transition: background var(--dur-fast) var(--ease-out);
}
.mob-recent-item:hover { background: var(--hover, #F8F8F8); }
.mob-recent-item.is-active { background: var(--bg-brand-soft, #EAF0FE); }
body.dark .mob-recent-item.is-active,
body.classic .mob-recent-item.is-active { background: var(--hover); }

.mob-recent-link {
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: inherit;
}
.mob-recent-link:hover { text-decoration: none; }

/* The shared icon classes carry the desktop tile's own padding and label spacing. */
.mob-recent-item .mob-drawer-ico {
  width: auto; height: auto;
  padding: 0;
  margin: 0;
  font-size: 20px;
}

/* Its own target, so tapping the glyph can go straight to the section instead. */
.mob-recent-sub {
  position: relative;
  flex: 0 0 18px;
  height: 100%;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
}
.mob-recent-sub::before {
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  width: 5px; height: 5px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translate(-50%, -65%) rotate(45deg);
  opacity: 0.55;
}

/* The logo is the stand-in, so it steps aside once the strip has tiles. */
.mob-topbar:has(.mob-recent-item) .mob-logo-link { display: none; }

/* Right slot (holds the pill) */
.mob-right {
  margin-left: auto;
  display: flex;
  align-items: center;
}

/* ── Scrim ──────────────────────────────────────────────────── */
.mob-scrim {
  position: fixed;
  inset: 0;
  background: rgba(25, 45, 92, 0.40);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--dur-base) var(--ease-out);
  z-index: 200;
}
.mob-scrim.is-open {
  opacity: 1;
  pointer-events: auto;
}

/* ── Nav drawer ─────────────────────────────────────────────── */
.mob-drawer {
  /* Single horizontal inset for the drawer. The header close button and the row
     chevrons both hang off this, which is what keeps them on one vertical line. */
  --mob-drawer-gutter: 16px;
  position: fixed;
  top: 0; bottom: 0; left: 0;
  width: 86%;
  max-width: 340px;
  background: var(--bg);
  box-shadow: var(--shadow-xl);
  display: flex;
  flex-direction: column;
  transform: translateX(-104%);
  transition: transform var(--dur-base) var(--ease-out);
  z-index: 201;
}
.mob-drawer.is-open { transform: translateX(0); }

/* Drawer header — height matches mobile topbar (63px) so logo aligns visually */
.mob-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--mob-drawer-gutter);
  height: 63px;
  border-bottom: 1px solid var(--bg-border);
  flex-shrink: 0;
  box-sizing: border-box;
}
.mob-drawer-logo-link { display: flex; align-items: center; }
.mob-drawer-logo      { height: 50px; display: block; }

.mob-drawer-close {
  width: 32px; height: 32px;
  min-height: 0;
  line-height: 1;
  border-radius: var(--r-pill);
  border: 0;
  background: var(--hover, #F8F8F8);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--txt-color);
  flex-shrink: 0;
  transition: background var(--dur-fast) var(--ease-out);
}
.mob-drawer-close:hover { background: var(--bg-border); }
.mob-drawer-close svg { width: 16px; height: 16px; }

/* Nav items */
.mob-drawer-nav {
  flex: 1;
  overflow-y: auto;
  padding: 8px 0;
}
.mob-drawer-ico {
  width: 20px; height: 20px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  line-height: 1;
  padding: 10px 0 0 0;
}
/* Icon font — same font as #mainMenu a:before, applied to the span */
.mob-drawer-ico::before {
  font-family: "ionbiz";
  font-style: normal;
  font-weight: normal;
  display: flex;
  align-items: center;
  justify-content: center;
  speak: never;
  -webkit-font-smoothing: antialiased;
  line-height: 1;
}
.mob-drawer-ico svg { width: 20px; height: 20px; }

/* ── Responsive switch ──────────────────────────────────────── */
@media (max-width: 768px) {
  /* Show mobile topbar at 63px — removes double border and unused space */
  .mob-topbar { display: flex; height: 63px; }

  /* Hide the desktop toolbar content */
  #myMenu { display: none !important; }
}

/* ── Bottom dock ────────────────────────────────────────────── */
/* The menu-position preference applies on a phone too, where a bar within thumb reach is
   the whole point. Left and right have no mobile form and fall back to the top bar. */
@media (max-width: 768px) {
  body[data-menu-position="bottom"] {
    /* Clears the home indicator and the screen's rounded corners, which would otherwise
       cut into the bar and put its controls at the very edge of thumb reach. */
    --mob-bar-pad-b: calc(12px + env(safe-area-inset-bottom, 0px));
  }

  body[data-menu-position="bottom"] #appShell {
    grid-template-rows: minmax(0, 1fr) auto;
    grid-template-areas: "body" "menu";
  }

  body[data-menu-position="bottom"] .mob-topbar {
    border-bottom: 0;
    border-top: 1px solid var(--bg-border-light);
    /* content-box so the inset adds to the bar's 63px row instead of eating into it. */
    box-sizing: content-box;
    padding-bottom: var(--mob-bar-pad-b);
  }

  /* A sheet rather than a side panel, so it rises out of the bar that opened it. */
  body[data-menu-position="bottom"] .mob-drawer {
    top: auto;
    right: 0;
    width: auto;
    max-width: none;
    max-height: 86%;
    border-radius: var(--border-radius-md) var(--border-radius-md) 0 0;
    transform: translateY(104%);
  }

  body[data-menu-position="bottom"] .mob-drawer.is-open { transform: translateY(0); }
}

/* Fixed to the viewport, so the strip #appShell reserves for the iOS status bar has to be
   added here by hand. */
@media (display-mode: standalone) and (max-width: 768px) {
  body:not([data-menu-position="bottom"]) .mob-drawer {
    top: var(--pwa-top-gap, 16px);
  }
}

@media (min-width: 769px) {
  /* Ensure drawer/scrim never show on desktop even if JS fires */
  .mob-drawer,
  .mob-scrim { display: none !important; }
}

/* ── Level 3: very narrow screens (≤ 370px) — hide topbar logo ─ */
/* Logo stays visible in the drawer header, so home navigation is preserved */
@media (max-width: 370px) {
  .mob-topbar .mob-logo-link { display: none; }
}

/* The strip shares its row with the hamburger and the fixed pill; below this width a
   tile would be pushed under the pill, so it drops the oldest one instead. */
@media (max-width: 371px) {
  .mob-recent-item:nth-child(n+3) { display: none; }
}

/* ── Accordion drawer rows ─────────────────────────────────── */
.mob-drawer-row {
  display: flex;
  align-items: center;
  /* Same inset as the header, so the chevron lands under the close button.
     Padding rather than a margin on the chevron, so the row background and the
     hover/active highlight still run the full width of the drawer. */
  padding-right: var(--mob-drawer-gutter);
  transition: background var(--dur-fast) var(--ease-out);
}
.mob-drawer-row:hover { background: var(--hover, #F8F8F8); }
.mob-drawer-row.is-active { background: var(--bg-brand-soft, #EAF0FE); }
body.dark .mob-drawer-row.is-active,
body.classic .mob-drawer-row.is-active { background: var(--hover); }

/* Main link within row — grows to fill space, min 48px touch target */
.mob-drawer-item {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 0 0 0 16px;
  min-height: 48px;
  text-decoration: none;
  color: var(--txt-color);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  transition: color var(--dur-fast) var(--ease-out);
}
.mob-drawer-row.is-active .mob-drawer-item {
  color: var(--menu-hover, #2F6AF9);
  font-weight: 600;
}
.mob-drawer-item:hover { text-decoration: none; }

/* Chevron expand button */
.mob-drawer-chevron {
  /* Matches .mob-drawer-close exactly: same size + same gutter means the two
     circles share a centre line and a right edge. */
  width: 32px; height: 32px;
  border-radius: 50%;
  border: 1px solid var(--bg-border-light);
  background: var(--bg);
  color: var(--txt-color);
  cursor: pointer;
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  transition: background var(--dur-fast) var(--ease-out),
              border-color var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out);
}
.mob-drawer-chevron svg {
  transition: transform var(--dur-base) var(--ease-out);
}
.mob-drawer-chevron:hover {
  border-color: var(--menu-hover, #2F6AF9);
  color: var(--menu-hover, #2F6AF9);
}
.mob-drawer-chevron.is-expanded {
  background: var(--menu-hover);
  border-color: var(--menu-hover);
  color: var(--bg, #192D5C);
}
.mob-drawer-chevron.is-expanded svg { transform: rotate(180deg); }

/* Accordion submenu — CSS grid-template-rows animation */
.mob-submenu {
  display: grid;
  grid-template-rows: 0fr;
  margin-left: 24px;
  padding-left: 14px;
  border-left: 1px solid var(--bg-border);
  transition: grid-template-rows var(--dur-base) var(--ease-out),
              border-color var(--dur-fast) var(--ease-out);
}
.mob-submenu.is-open {
  grid-template-rows: 1fr;
  border-left-color: var(--bg-border, #96C5FE);
}

.mob-submenu-inner {
  overflow: hidden;
  min-height: 0;
}

/* Submenu sections */
.mob-submenu-section { padding: 6px 0; }

.mob-sub-heading {
  display: block;
  padding: 4px 14px 2px;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--menu-hover, #2F6AF9);
}

.mob-sub-item {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0 14px;
  border-radius: 10px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  color: var(--txt-color);
  text-decoration: none;
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.mob-sub-item:hover {
  background: var(--hover, #F8F8F8);
  color: var(--blue, #2F6AF9);
  text-decoration: none;
}


/* Declare Custom Fonts */

/* DM Sans */
@font-face {
    font-family: 'DM Sans';
    src: url('../Content/Themes/Blue/fonts/DMSans-Regular.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    src: url('../Content/Themes/Blue/fonts/DMSans-Italic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    src: url('../Content/Themes/Blue/fonts/DMSans-Medium.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    src: url('../Content/Themes/Blue/fonts/DMSans-MediumItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    src: url('../Content/Themes/Blue/fonts/DMSans-Bold.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    src: url('../Content/Themes/Blue/fonts/DMSans-BoldItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

/* Source Sans Pro */
@font-face {
    font-family: Source Sans Pro;
    src: url('../Content/Themes/Blue/fonts/SourceSansPro-Regular.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
}

/* Graphik Light */
@font-face {
    font-family: Graphik Light;
    src: url('../Content/Themes/Blue/fonts/Graphik-Light.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
}


/* Graphik Medium */
@font-face {
    font-family: Graphik Medium;
    src: url('../Content/Themes/Blue/fonts/Graphik-Medium.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
}

/* Human */
@font-face {
    font-family: Human;
    src: url('../Content/Themes/Blue/fonts/Human-Regular.otf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('opentype');
}

@font-face {
    font-family: Human;
    src: url('../Content/Themes/Blue/fonts/Human-Bold.otf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('opentype');
    font-weight: bold;
}

@font-face {
    font-family: Human;
    src: url('../Content/Themes/Blue/fonts/Human-BoldItalic.otf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('opentype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: Human;
    src: url('../Content/Themes/Blue/fonts/Human-Italic.otf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('opentype');
    font-style: italic;
}

@font-face {
    font-family: Human;
    src: url('../Content/Themes/Blue/fonts/Human-Light.otf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('opentype');
    font-weight: 300;
}

@font-face {
    font-family: Human;
    src: url('../Content/Themes/Blue/fonts/Human-Medium.otf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('opentype');
    font-weight: 500;
}

@font-face {
    font-family: Human;
    src: url('../Content/Themes/Blue/fonts/Human-MediumItalic.otf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('opentype');
    font-style: italic;
    font-weight: 500;
}

/* Liberator */
@font-face {
    font-family: Liberator;
    src: url('../Content/Themes/Blue/fonts/liberator.ttf?v=scWauvHJyNkotIxSpk5Z0AH9sPw') format('truetype');
}

/* Nexa */
@font-face {
    font-family: Nexa;
    src: url('../Content/Themes/Blue/fonts/Nexa Light.otf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('opentype');
}

@font-face {
    font-family: Nexa;
    src: url('../Content/Themes/Blue/fonts/Nexa Bold.otf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('opentype');
    font-weight: bold;
}

/* WorkSans */
@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-Regular.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-Italic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-style: italic;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-Thin.ttf?v=scWauvHJyNkotIxSpk5Z0AH9sPw') format('truetype');
    font-weight: 100;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-ThinItalic.ttf?v=scWauvHJyNkotIxSpk5Z0AH9sPw') format('truetype');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-ExtraLight.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 200;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-ExtraLightItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-Light.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 300;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-LightItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-Medium.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 500;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-MediumItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-SemiBold.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 600;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-SemiBoldItalic.ttf?v=scWauvHJyNkotIxSpk5Z0AH9sPw') format('truetype');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-Bold.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: bold;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-BoldItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-ExtraBold.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 800;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-ExtraBoldItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 800;
    font-style: italic;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-Black.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 900;
}

@font-face {
    font-family: WorkSans;
    src: url('../Content/Themes/Blue/fonts/WorkSans-BlackItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 900;
    font-style: italic;
}

/* Montserrat */
@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-Regular.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-Italic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-style: italic;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-Thin.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 100;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-ThinItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-ExtraLight.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 200;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-ExtraLightItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-Light.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 300;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-LightItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-Medium.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 500;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-MediumItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-SemiBold.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 600;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-SemiBoldItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-Bold.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: bold;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-BoldItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-ExtraBold.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 800;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-ExtraBoldItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 800;
    font-style: italic;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-Black.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 900;
}

@font-face {
    font-family: Montserrat;
    src: url('../Content/Themes/Blue/fonts/Montserrat-BlackItalic.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 900;
    font-style: italic;
}

/* Onest */
@font-face {
    font-family: Onest;
    src: url('../Content/Themes/Blue/fonts/Onest-Regular.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: Onest;
    src: url('../Content/Themes/Blue/fonts/Onest-Thin.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 100;
    font-display: swap;
}

@font-face {
    font-family: Onest;
    src: url('../Content/Themes/Blue/fonts/Onest-ExtraLight.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 200;
    font-display: swap;
}

@font-face {
    font-family: Onest;
    src: url('../Content/Themes/Blue/fonts/Onest-Light.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: Onest;
    src: url('../Content/Themes/Blue/fonts/Onest-Medium.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: Onest;
    src: url('../Content/Themes/Blue/fonts/Onest-SemiBold.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: Onest;
    src: url('../Content/Themes/Blue/fonts/Onest-Bold.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: bold;
    font-display: swap;
}

@font-face {
    font-family: Onest;
    src: url('../Content/Themes/Blue/fonts/Onest-ExtraBold.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 800;
    font-display: swap;
}

@font-face {
    font-family: Onest;
    src: url('../Content/Themes/Blue/fonts/Onest-Black.ttf?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc') format('truetype');
    font-weight: 900;
    font-display: swap;
}

/* Keep inserted/pasted images inside their container in every rich-text editor
   (general description, mail, notes, replies) both while editing (inline or the
   iframe .mce-content-body) and when viewing the readonly .ionbiztinymce markup. */
.ionbiztinymce img,
.mce-content-body img {
    max-width: 100%;
    height: auto;
}

/* TinyMCE icon fonts, moved here from skins/lightgray/skin.min.css: that skin is added on the first editor init,
   and a @font-face added to a big page makes Chrome relayout everything (~1.6s next to a 5000-row grid). */
@font-face {
    font-family: 'tinymce';
    src: url('/Lib/tinymce_4.3.13/tinymce/js/tinymce/skins/lightgray/fonts/tinymce.eot?v=tXc9Pra_I9xp0Lez8XSvw0d1ADI');
    src: url('/Lib/tinymce_4.3.13/tinymce/js/tinymce/skins/lightgray/fonts/tinymce.eot?v=tXc9Pra_I9xp0Lez8XSvw0d1ADI&#iefix') format('embedded-opentype'), url('/Lib/tinymce_4.3.13/tinymce/js/tinymce/skins/lightgray/fonts/tinymce.woff?v=tXc9Pra_I9xp0Lez8XSvw0d1ADI') format('woff'), url('/Lib/tinymce_4.3.13/tinymce/js/tinymce/skins/lightgray/fonts/tinymce.ttf?v=tXc9Pra_I9xp0Lez8XSvw0d1ADI') format('truetype'), url('/Lib/tinymce_4.3.13/tinymce/js/tinymce/skins/lightgray/fonts/tinymce.svg#tinymce') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'tinymce-small';
    src: url('/Lib/tinymce_4.3.13/tinymce/js/tinymce/skins/lightgray/fonts/tinymce-small.eot?v=tXc9Pra_I9xp0Lez8XSvw0d1ADI');
    src: url('/Lib/tinymce_4.3.13/tinymce/js/tinymce/skins/lightgray/fonts/tinymce-small.eot?v=tXc9Pra_I9xp0Lez8XSvw0d1ADI&#iefix') format('embedded-opentype'), url('/Lib/tinymce_4.3.13/tinymce/js/tinymce/skins/lightgray/fonts/tinymce-small.woff?v=tXc9Pra_I9xp0Lez8XSvw0d1ADI') format('woff'), url('/Lib/tinymce_4.3.13/tinymce/js/tinymce/skins/lightgray/fonts/tinymce-small.ttf?v=tXc9Pra_I9xp0Lez8XSvw0d1ADI') format('truetype'), url('/Lib/tinymce_4.3.13/tinymce/js/tinymce/skins/lightgray/fonts/tinymce-small.svg#tinymce') format('svg');
    font-weight: normal;
    font-style: normal;
}

/********************************************************/
/*  Project:        iONBIZ
/*  Created by:     Ovidiu Burciu
/*  Creation Date:  17.apr.2014
/********************************************************/
/* TABLE OF CONTENTS                                    */
/********************************************************
    [1] Top Menu 
    [2] General Layout 
    [3] Note control
    [4] Settings menu 
    [6] Notes 
    [7] Resources 
    [8] Projects 
    [9] Grid
    [10] Shared
    [--] Utils 
********************************************************/


/*******************************************************
    [1] Top Menu
********************************************************/

#btnMySubMenu {
    /*width: 130px;
    height: 45px;*/
    padding: 0px;
    cursor: pointer;
    color: #9f9b92;
    float: right;
    font-family: "ionbiz";
    height: 40px;
    padding: 0;
    width: 40px;
    font-size: 36px;
}

    #btnMySubMenu span {
        color: #9f9b92;
        float: right;
        font-family: "ionbiz";
        height: 40px;
        padding: 0;
        width: 40px;
        font-size: 36px;
    }

        #btnMySubMenu span:before {
            color: inherit;
            /*content: "\e690"; this will overlay the profile picture */
        }   
#btnMySubMenu:hover, #btnMySubMenu:hover span { color: black;} 

.btnHome:before { content: "\e610";}
.btnResources:before { content: "\e648";}
.btnRelations:before { content: "\e618";}
.btnProcurements:before { content: "\e93a";}
.btnItems:before { content: "\e935";}
.btnProjects:before { content: "\e934";}
.btnPlanning:before { content: "\e936";}
.btnTimesheets:before { content:  "\e939";}
.btnCosts:before { content: "\e60b";}
/* sheet-with-clock glyph: distinct from the Timesheets stopwatch (\e939) */
.btnTimeRegistration:before { content: "\e663";}
.btnIssues:before { content: "\e937";}
.btnIssues[data-text='Kanban']:before { content: "\e94a";}
.btnLeaves:before { content: "\e612";}
.btnInvoicing:before { content: "\e611";}

#myMenu .btnLogout {
    float: left;
    /*margin: 8px 0px;*/
    border-left: solid 1px #D0D0D0;
    cursor: pointer;
    width: 44px;
    /* height: 54px;*/
    margin-bottom: 0px !important;
    padding: 0px;
    font-family: "ionbiz";
    font-size: 20px;
    text-align: center;
}

span.unreadNotes {
    position: absolute;
    line-height: 16px;
    font-size: 12px;
    left: 36px;
    top: -5px;
    text-align: center;
    color: #141414;
    cursor: pointer;
    width: 0px;
    height: 0px;
}
    span.unreadNotes:before {
        content: attr(data-unread);
        box-shadow: 0 0 20px var(--shaddow);
        position: absolute;
        font-weight:normal;
        font-size: 10px;
        margin-left: -5px;
        color: black;
        background: var(--green);
        min-width: 18px;
        height: 18px;
        line-height:18px;
        border-radius: 50%;
        border: 1px solid var(--bg-border);
        z-index: 1;
        padding: 2px;
    }
    span.unreadNotes:after { /*content: attr(data-unread);*/
        left: 4px;
        font-size: 10px;
        position: absolute;
    }
span.unreadNotes[data-unread="0"] { display: none; }

.btnLogout:before { content: "\e645";position: relative; color: #FD0101;float: inherit;margin-top: 50%;width: 100%;}
.btnLogout:hover:before { color: #C81814; }

#pageTitle 
{
    color: #96938E;
    background-color: white;
    border-bottom: solid 1px #eee;
    font-weight: bold;
    line-height: 30px;
    min-height: 28px;
    z-index: 0;
}

#pageTitle .btnShowNotes { float: right;margin-right: 36px;cursor: pointer;color: #192d5c;}
#pageTitle .btnShowNotes:before { margin-right: 3px;}

#quickSearchHolder {
    float: right;
    width: auto;
    text-indent: 7px;
}


    #quickSearchHolder input {
        float: left;
        width: 130px;
        min-height: 40px;
        border: 0px;
        padding: 3px;
        background-color: var(--bg);
        border-radius: 40px;
        border: 1px solid var(--bg-border);
        text-align: center;
        color: var(--txt-color);
    }

#quickSearchHolder input:focus 
{
    text-indent: 15px;
    text-align:left;
    width:150px;
}

.quickSearchHolder {
    float: left;
    width: 100%;
    color: #666666;  
    margin: 20px 0px;
    line-height: 60px;
      
}
    .quickSearchHolder input {
        border: 1px solid #e7e7e7;
        border-radius: 20px;
        padding: 10px;
        font-size: 13px;
        clear: both;
        width: 100%;
        /*box-shadow: 0px 0px 6px rgba(205, 205, 205, 1) inset;
    box-sizing: border-box;*/
    }

    .quickSearchHolder:before, #quickSearchHolder:before { /* font-family: "ionbiz";content: "\e649";color: #96938e;font-weight: lighter;  font-size: 12px;*/
    }
.quickSearchHolder:before { left: 30px; position: absolute;line-height: 40px; font-size: 14px;}

.btnCancelSearch 
{
    float: left;
    width: 16px;
    height: 20px;
    margin: 30px 0px -20px -30px;
    /*position: relative;*/
    background-image: url("../Content/Themes/Blue/img/mainMenu.png?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc");
    background-repeat: no-repeat;
    background-position: -120px -128px;
    text-indent: -9999px;
    font-size: 0px;
}

.submenuCol {
    float: left;
    box-sizing: content-box;
    width: fit-content;
    margin: 4px 0px 0px 0px;
    padding: 6px 20px;
}

    .submenuCol .innerBorder {
        min-width: fit-content;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: flex-start;
    }

    /* equal side padding keeps the rule centred in the gutter */
    .submenuCol + .submenuCol {
        border-left: 1px solid var(--bg-border-light);
    }

    .submenuCol .colTitle {
        float: left;
        font-size: 0.7rem;
        line-height: 1.2;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        width: 100%;
        padding: 0px 0px 12px 10px;
        color: color-mix(in srgb, #192d5c 55%, #ffffff);
        font-weight: 600;
    }

    .submenuCol > :not(.gridMenu):not(.jqGridHolder) a {
        float: left;
        width: 100%;
        padding: 7px 10px;
        margin-bottom: 1px;
        border-radius: var(--border-radius-xs);
        background-repeat: no-repeat;
        background-position: left center;
        background-size: 2px 0%;
        transition: background-color var(--dur-fast) var(--ease-out), background-size var(--dur-fast) var(--ease-out);
        font-size: 0.82rem;
        line-height: 1.45;
    }
    .submenuCol > :not(.gridMenu):not(.jqGridHolder) a:hover {
        background-color: var(--hover);
        background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
        background-size: 2px 55%;
        background-repeat: no-repeat;
        background-position: left center;
        color: var(--txt-color);
        font-weight: normal;
    }
.submenuCol a:last-child {
    margin-bottom: 0px;
}

/* The default .jqGridHolder height of calc(100% - 50px) only leaves room for a toolbar;
   here the column title and its links sit above the grid too, so the grid ran past the
   bottom of the column and over the quick search below it. */
.submenuCol > .jqGridHolder {
    float: none;
    height: auto;
}

.btnHolder {
    float: left;
    clear: both;
    width: auto;
    margin: 0px 0px 10px 0px;
}
.submenuHolder .btnHolder {
    float: left;
    clear: both;
    width: auto;
    margin: 0px 0px 10px 0px;
}
.userSubMenuHolder {
    width: 530px;
    height: fit-content;
    /* background-color: #1f2532!important;*/
    display: block;
    box-sizing: border-box;
    padding: 30px;
    font-size: 12px;
    box-sizing: border-box;
}
.submenuColContainer {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
}

#passwordIsExpired {
    /* background: linear-gradient(#ffffff, #f7f7f7) repeat scroll 0 0 rgba(0, 0, 0, 0);
  width:      100%;
  height:     100%; 
  z-index:    10;
  top:        0; 
  left:       0; 
  position:   fixed; */
}

#passwordIsExpired .btnCloseSubmenu { display: none;}

#passwordIsExpired .userSubMenuHolder { 
    position:fixed;
    margin-left: -265px;
    margin-top: -185px;
    top: 50%;
    left: 50%;
    background: var(--dialog-bg);
    border-radius: var(--border-radius-md);
    box-shadow: 0px 1px 20px var(--shaddow);
}

.userEditAccountTop {
    float: left;
    width: 100%;
    border-bottom: solid 1px var(--bg-border);
    padding: 0px 0px 30px 0px;
}

.userImageHolder {
    float: left;
    border: solid 3px #fff;
    border-radius: 3px;
    box-shadow: 0px 0px 2px #000;
    width: 67px;
    height: 67px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    margin: 0px 35px 0px 0px;
}

.userNameHolder {
    float: left;
    width: 340px;
    padding: 15px 0px 0px 0px;
    font-size: 18px;
}

.userShortNameHolder {
    float: left;
    width: 340px;
    padding: 5px 0px 0px 0px;
    color: var(--txt-color);
    font-weight: bold;
}

.userSubMenuHolder .lbl {
    float: left;
    clear: both;
    width: 100%;
    color: var(--txt-color);
    margin-top: 30px;
    font-weight: bold;
    margin-bottom:5px;
    margin-left:5px;
}

form .userSubMenuHolder .val input, form .userSubMenuHolder .val select {
    float: left;
    clear: both;
    width: 100%;
    font-weight: 500 !important;
    background: var(--input-bg);
    min-height: 35px;
}

form .userSubMenuHolder .val input:not([readonly]):focus, form .userSubMenuHolder .val select:not([readonly]):focus {
    background-color: var(--bg)!important;
    color: var(--txt-color)!important;
}

form .userSubMenuHolder .val input:not([readonly]):hover, form .userSubMenuHolder .val select:not([readonly]):hover {
    cursor: pointer;
}

.userSubMenuHolder .halfWidth:last-child {
    padding-left: 20px;
    width: calc(50% - 20px) !important;
}

.userSubMenu {
    padding: 0px;
    border: 0px;
}

/*******************************************************
    [2] General Layout 
********************************************************/
.holderNotification {
    float: left;
    clear: both;
    box-sizing: border-box;
    padding: 10px 10px 10px 15px;
    color: var(--txt-color);
    margin: 1em 0 1em 0;
    font-size: 12px;
    display: flex;
    align-items: center;
    border: 1px solid var(--bg-border-light);
    border-radius: var(--border-radius-xl);
    background: #FFF7E6;
    margin-left: 4px;
}
    .holderNotification:before {
        font-family: 'ionbiz' !important;
        font-size: 14px;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        content: "\e666";
        color: var(--txt-color);
        margin-right:5px;
    }
.holderNotification .notificationTitle {float: left;clear: both;width: auto;box-sizing: border-box;font-weight: bold;padding:0 0.5em 0 0;color: #000000;}
.holderNotification .notifVal {color: #000000;font-weight: bold;}
.holderNotification .notifVal {color: #000000;font-weight: bold;}
.holderNotification:has(.notifVal[ionbiz-type="Days"]){
    background: var(--east-bg);
}

.reportFilterCriteria { width: calc(100% - 32px); min-height: 100px;height: auto; overflow: visible; flex-shrink: 0; align-self: flex-start; overflow: auto!important; }
 #detailSection { width: calc(100% - 32px); min-height: 100px;height: auto; overflow: visible; flex-shrink: 0; align-self: flex-start; overflow: auto!important; }
 #reportDetailsHolder{overflow:visible;}
.reportDataHolder.ui-accordion-content:not(#modalWindow > .reportDataHolder.ui-accordion-content) {
    padding-bottom: 0px !important;
}
.reportFilterCriteria.twoSections,
.reportFilterCriteria.twoSections~.reportFilterCriteria
 { width: inherit; min-height: 60px;overflow: auto!important; }

.reportDataHolder {
    min-height: calc(100% - 355px) !important;
    flex-grow: 1;
    overflow-y: auto;
}

.reportFlexHolder {
    display: flex;
    flex-direction: column;
    height: inherit;
}

.reportFlexHolder > .reportFilterCriteria {
    min-height: 78px;   
}

.reportFlexHolder > .reportDataHolder {
    flex: 1; /* Fill remaining space */
    overflow-y: auto;
    height: auto;
}

.ui-dialog-content div:not(.reportFlexHolder) > .reportDataHolder {
    height: calc(100% - 236px) !important;
}

.ui-dialog-content .reportFilterCriteria {
    width: calc(100%);
    height: auto !important;
}
/* As a card pane the inset is 5px margin + 7px padding + 1px border per side,
   not the 32px the standalone rules above assume. */
.reportFilterCriteria.ui-accordion-content,
/* Outranks the .twoSections sibling rule above, whose width:inherit resolves to auto and
   shrink-wraps the pane against its flex-start alignment. */
.reportFilterCriteria.twoSections ~ .reportFilterCriteria.ui-accordion-content,
#detailSection.ui-accordion-content {
    width: calc(100% - 26px);
}

.reportFilterCriteria.twoSections~.reportFilterCriteria~.reportDataHolder { height: calc(100% - 253px)!important;overflow-y: hidden!important;}
h2:first-of-type:not(.ui-accordion-header-active)~.reportDataHolder  { height: calc(100% - 66px)!important;}
h2:first-of-type:not(.ui-accordion-header-active)~h2:nth-of-type(2).ui-accordion-header-active~.reportDataHolder   { height: calc(100% - 66px)!important;}
h2:first-of-type.ui-accordion-header-active~h2:nth-of-type(2):not(.ui-accordion-header-active)~.reportDataHolder { height: calc(100% - 155px)!important;}
h2:first-of-type:not(.ui-accordion-header-active)~h2:nth-of-type(2):not(.ui-accordion-header-active)~.reportDataHolder  { height: calc(100% - 95px)!important;}

/* The section headers above are taller since they became the top of the card, so the
   offsets are short by both header heights and the gap between the two cards. */
.ui-tabs-panel > h2:first-of-type:not(.ui-accordion-header-active) ~ .reportDataHolder,
.ui-tabs-panel > h2:first-of-type:not(.ui-accordion-header-active) ~ h2:nth-of-type(2).ui-accordion-header-active ~ .reportDataHolder {
    height: calc(100% - 101px) !important;
}
.ui-dialog-content .reportDataHolder > .jqGridHolder { height: calc(100%) !important;}
.ui-dialog-content .reportDataHolder > .gridMenu ~ .jqGridHolder  { height: calc(100% - 40px)!important;}
.ui-dialog-content .reportDataHolder .tabContainer ~ .ui-tabs-panel > .jqGridHolder { height: 100% !important; border-top-left-radius: 0px; border-top-right-radius:0px;}


.lblWarnIcon {float:left; width:20px; height:16px; background-image: url("../Content/Themes/Blue/Img/notification.png?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc");
             background-position:center; background-repeat:no-repeat; margin:3px 0px 0px 10px;}
             
.reportFilterCriteria .submitReport 
{
    clear: both;
    width: 95%;
    padding-top: 10px;
}
.reportFilterCriteria .submitReport a { margin: 0 0.5em 0 0;}
.reportFilterCriteria .cell {
    height: 65px !important;
    max-width: 200px !important;
    position: relative;
    float: left;
    display: block;
    margin-left: 1px;
    margin-bottom: 1px;
}
.detailInput {
    color: var(--txt-color);
    font-weight: 400;
    font-style: normal;
    position: relative;
    min-height: 30px;
    border-radius:var(--border-radius-xs);
    background: var(--input-bg);
}
.detailInput:has(input[name*="Recurr"]){
    min-height: 26px !important;
    height: 30px !important;
    line-height:30px !important;
    padding-bottom: 2px !important;
    background: transparent;
}
.detailInput:has(.halfSizeLeft, span.halfWidth, span.currency){
    background: transparent;
    line-height:30px;
}
/* The input itself carries the marker class, so it is matched directly rather than through an
   ancestor :has(); the other inputs in these fields are type=hidden or invisible radios. */
.detailInput:has(.minicolors-input, .colorautocomplete-color, .ionbiz-color-autocomplete),
.detailInput input.minicolors-input, .detailInput input.ionbiz-color-autocomplete
{
    border-radius:20px !important;
}
.detailInput:not(:has(input, select, textarea)), .detailInput:has(input[readonly]), .detailInput:has(input[type="hidden"]):not(:has(input:nth-of-type(2))){
    background: transparent !important;
    text-indent: 5px;
}
.detailInput:has(.datepicker):has(.timepicker-inline), .ionbizdetails.editMode .detailInput{
    background: transparent !important;
}
/* The date helpers render the date input as a direct child with .timepicker-inline after it, so
   both inputs are reachable without an ancestor :has(); same specificity as before. */
.ionbizdetails:not(.editMode) .detailInput > input.datepicker:has(~ .timepicker-inline),
.ionbizdetails:not(.editMode) .detailInput > .datepicker ~ .timepicker-inline input{
    background: var(--input-bg) !important;
    color: var(--txt-color) !important;
}
.displayGrid .detailInput input.minicolors-input, .displayGrid .detailInput input.ionbiz-color-autocomplete{
    min-width:155px !important;
}
.detailRow:has(.minicolors-input, .colorautocomplete-color, .ionbiz-color-autocomplete){
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}
.tooltipster-content .detailInput {
    min-height: 0px !important;
    font-weight:normal;
}
.tooltipster-content .detailInput:not([style*="width:"]){
	width: 52% !important;
	text-indent: 0px;
}
.tooltipster-content .detailLabel {
    font-weight:normal;
}
.displayGrid .detailInput {
    color: var(--txt-color);
    font-weight: 400;
    font-style: normal;
    position: inherit;
}
.detailInput:has(input[data-checkbox="true"][type="checkbox"]:not([id*="SaveFilterDetail"])), .detailInput:not([style*="width:"],[name="LeaveStatusName"]):not(:has(*)), .detailInput:not([style*="width:"]):has(> span:only-child) {
    width: fit-content !important;
    background: transparent !important;
    text-indent: 5px;
}
.displayGrid .detailInput:hover:has(input[data-checkbox="true"][type="checkbox"]) {
    background: transparent !important;
}
    /*.detailInput.currency { display: table;}*/
    .translateButton:before {
        font-family: "ionbiz";
        font-size: 19px;
        content: "\e692";
        color: var(--dark-green);
        margin-left: -2px;
    }
.translateButton:hover:before { color: #9E9E9E;cursor: pointer;}

.status {
    box-shadow: none;
    font-size: 11px;
    border-radius: var(--border-radius-xl);
    border-top-right-radius: var(--border-radius-xs);
    border-bottom-right-radius: var(--border-radius-xs);
    padding: 1px 6px 1px 6px;
    font-weight: 600;
    border: 1px solid;
    background-image: linear-gradient(var(--bg), var(--bg));
    color: var(--txt-color);
    /* Border derives from --status-color (slightly lighter) when set by JS; falls back to --txt-color. */
    border-color: color-mix(in srgb, var(--status-color, var(--txt-color)), white 70%);
    display: inline-flex;
    align-items: center;
}
.status::before {
    content: none;
}
span.status::before {
    content: '\e654';
    font-family: 'ionbiz' !important;
    font-size: 11px;
    color: var(--status-color, currentColor);
    margin-left: -11px;
    margin-right: -6px;
}
div .sectionIssues span.status::before {
    margin-left: -2px;
    margin-right: 5px;
}
/* The sticky card renders .status as a small pill, so the dot has to shrink with it. */
#planningBarPanel .sticky > .status::before,
#timesheetScheduleBarPanel .sticky > .status::before  {
    margin-left: 0;
    margin-right: 5px;
    font-size: 8px;
    line-height: 1;
}

.cRed{ color: var(--red);}

.colorBar {height: 16px; overflow: hidden; position: relative;width: 80px;margin: 0px auto; border-radius: 5px;padding: 1px;}
.colorBar > span {float: left;height: 14px; border: solid 1px #fff;text-shadow: #999 0px -1px 2px;width: 78px;display: block;font-size: 0.9em;text-align: center;border-radius: 5px;color: #fff;line-height: 12px;}

/* bg colors from picker */
.bgCyan {background-color:#008CA0;}
.bgYellow {background-color:#FFE311;}
.bgRed {background-color:var(--red);}
.bgPink {background-color:#873787;}
.bgBlue {background-color:#0072A1;}
.bgGreen {background-color:#009D92;}
.bgLime {background-color:#81BA3E;}
.bgMaroon {background-color:#614B3A;}
.bgGray {background-color:#6D6D6F;}
.bgOrange {background-color:#FF7B00;}
.bgNavy {background-color:#191B57;}
.bgOlive {background-color:#697F7E;}
.bg13 {background-color:#C2BB95; }
.bg14 {background-color:#E39E55;}
.bg15 {background-color:#FFF69B;}
.bg16 {background-color:#BBB089;}
.bg17 {background-color:#F2957B;}
.bg18 {background-color:#FFFFFF;}
.bg19 {background-color:#A96E79;}
.bg20 {background-color:#ED6291;}
.bg21 {background-color:#B27AAA;}
.bg22 {background-color:#5E5280;}
.bg23 {background-color:#1C4C75;}
.bg24 {background-color:#009A69;}
.bg25 {background-color:#30252A;}
.bg26 {background-color:#B7C227;}
.bg27 { background-color: #EEEEEE;}
.bg27, .bgNull {border: 1px solid #ccc; width: 23px!important; height: 23px!important;}
.bgNull {background-image:url("../Content/Themes/Blue/img/noBackground.png?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc");}
.bgLocked{background-color: var(--red) !important;}
th.bgLocked, td.bgLocked{
    background-color: transparent !important;
    
}
th.bgLocked.sticky-cell, td.bgLocked.sticky-cell{
    background-color: var(--bg) !important;
    
}
th.bgLocked > div:first-of-type:after, td[title*=" "].bgLocked:after{ /*title should contain space*/
    font-family: 'ionbiz' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
     content: "\e639";
     color: var(--red);
     display:inline-block;
}
.bgLocked #eastToolbar.gridMenu a:before,
.bgLocked #eastToolbar.gridMenu a:after,
.bgLocked #eastToolbar.gridMenu .path1:before,
.bgLocked #eastToolbar.gridMenu .path2:before,
.bgLocked #eastToolbar.gridMenu a, 
/* .tbLabel sets its own colour, so inheriting white from the anchor is not enough. */
.bgLocked #eastToolbar.gridMenu a.tbLabeled .tbLabel,
.bgLocked .layoutBtns a,.bgLocked .layoutBtns a:hover,
/* Every child of #detailNameHolder is a span (.path1, .path2, .uniqueId, #detailNameHolderText);
   `> *` would put this rule in the universal bucket. */
.bgLocked #detailNameHolder > span,
.bgLocked #detailNameHolder:before{
    color: white !important;
}
.bgLocked #btnLock{
outline: white;
    outline-style: dashed;
    outline-width: thin;
    outline-offset: -1px;
    border-radius: 20px;

}
.bgLocked #eastToolbar.gridMenu a:hover:before,
.bgLocked #eastToolbar.gridMenu a:hover:after,
.bgLocked #eastToolbar.gridMenu a:hover .path1:before,
.bgLocked #eastToolbar.gridMenu a:hover .path2:before,
.bgLocked #eastToolbar.gridMenu a.tbLabeled:hover .tbLabel,
.bgLocked .btnClosePanel:hover:before{
    color: var(--txt-color) !important;

}
.gridMenu {
    float: left;
    width: 100%;
    height: 40px;
    line-height: 40px;
    padding: 0px;
    margin: 5px 0px;
    overflow: hidden;
    box-sizing: border-box;
    text-indent: 0px;
}

.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu, .ui-dialog .gridMenu, .dashboardCell .gridMenu {
    margin: 4px 0px 5px 0px;
    height:30px;
    line-height: 30px;
}
.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu{
    padding-top: 4px !important;
}
#ionBizPopupLayer > .ui-tooltip > .ui-tooltip-content .gridMenu {margin: 0 0 0 3px;height: 26px;line-height:1;}

.ui-dialog-content .reportDataHolder > .tabContainer ~ .ui-tabs-panel {
    height: calc(100% - 50px) !important;
}

.ui-tabs-panel .ui-tabs-loading {

    border: 2px solid var(--bg);
    border-top: 2px solid var(--menu-hover);
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
    position: absolute;
    top: 40%;
    left: 45%;
    transform: translate(-50%, -50%);
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.gridMenu a {
    float: left;
    overflow: hidden;
    cursor: pointer;
    font-family: "ionbiz", Helvetica, Arial, sans-serif;
    font-size: 15px;
    text-align: center;
    white-space: nowrap;
    display: table;
    line-height: inherit;
    box-sizing: border-box;
}

#ionBizPopupLayer > .ui-tooltip > .ui-tooltip-content .gridMenu a {
    font-size: 14px;
    padding: 0;
    line-height: 26px;
    height: 26px;
    border: 0;
    width: 28px;
    min-width: 28px;
    /* Flex so the glyph gets its own line box and lands on the row's optical centre. */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: unset;
    margin: 0;
    color: transparent;
}
#ionBizPopupLayer > .ui-tooltip > .ui-tooltip-content .gridMenu a > .path1 { margin-left: 5px;text-indent: 0;}
#ionBizPopupLayer > .ui-tooltip > .ui-tooltip-content .gridMenu a > .path2 { text-indent: 0;margin: 0;}
#ionBizPopupLayer > .ui-tooltip > .ui-tooltip-content .gridMenu .lnkSaveDetails:before {
    content: "\e601";
    color: var(--dark-green);
    font-family: ionBiz;
    text-indent: 0;
}
#ionBizPopupLayer > .ui-tooltip > .ui-tooltip-content .gridMenu .lnkCancelDetails:before {
    content: "\e62e";
    color: var(--red);
    font-family: ionBiz;
    text-indent: 0;
}

.gridMenu #btnHideGrid label { 
    width: inherit;
    margin: 0px !important;
    height: inherit;
    padding: 0px;
}

.gridMenu #btnHideGrid label:before {
    font-size: 16px;
    float: left;
    position: relative;
    width: inherit;
}

.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu a, .ui-dialog .gridMenu a, .dashboardCell .gridMenu a,
.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu a > span, .ui-dialog .gridMenu a > span, .dashboardCell .gridMenu a > span { font-size: 11px;line-height: 19px; }
.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu a:before, .ui-dialog .gridMenu a:before, .dashboardCell .gridMenu a:before,
.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu a > span:before, .ui-dialog .gridMenu a > span:before,
.dashboardCell .gridMenu a > span:before, .ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu #btnHideGrid > .manageChk + label:before {
    font-size: 14px;
    line-height: 22px;
}

.gridMenu a:before, .gridMenu a:after { float: left; line-height: inherit; padding-left:5px;}
.ui-layout-east .gridMenu .icon-add:before, .ui-dialog .gridMenu .icon-add:before{font-size: 17px !important; content:"\e600" !important;}

a:hover .path1:before, a:hover:before, a:hover:after { /*color: #9E9E9E;*/
}

.gridMenu a  { width:73px; height:auto;  }
.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu a, .ui-dialog .gridMenu a, .dashboardCell .gridMenu a { width:50px; height:22px; }
.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu a .path1, .ui-dialog .gridMenu a .path1, .dashboardCell .gridMenu a .path1 { margin-left: 15px;}
.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu a .path2, .ui-dialog .gridMenu a .path2, .dashboardCell .gridMenu a .path2 { margin-right: 2px;}
.resetFilterDefault  {
    height: 12px;
    margin-left: 7px;
    margin-top: 7px;
    position: absolute;
    width: 12px;
    border: 0px;
}  

.bigLabel
{
    float:left;
    font-family: "ionbiz", Helvetica, Arial, sans-serif;
    font-size: 15px;
    text-align: left;   
    white-space: nowrap;
    display: table;
    color: var(--menu-hover);
    font-weight: bold;
}

.extraToolbar { font-weight: bold; text-transform: uppercase; padding: 0px 15px;}
.extraToolbar:before { font-weight: normal;color: var(--txt-color); }
.gridMenu .extraToolbar { font-size: 11px; padding: 0 14px; margin: 0 3px; }
#gridToolbar .extraToolbar { font-size: 11px; padding: 0 14px; }
.gridMenu .extraToolbar:before { 
    float: none;
    flex: 0 0 auto;
    font-size: 18px;
    margin-left: 0;
    padding-left: 0;
    padding-right: 0; }
/* The caret is a flex item now. Out of flow it would sit at the flex container's
   static position, which justify-content:center puts in the middle of the button. */
.gridMenu .extraToolbar:after {
    position: static;
    flex: 0 0 auto;
    margin-left: 0;
    padding-left: 0;
}
/* The .path1/.path2 layer spans never render on extraToolbar buttons (the glyph
   comes from ::before), but as flex items they would still take a gap each. */
.gridMenu a.extraToolbar > .path1,
.gridMenu a.extraToolbar > .path2 { display: none; }

.gridMenu #submitLines {
    margin-left: 10px;
    display: flex;
    align-items: center;
    position: relative;
    background: transparent;
    border-radius: 0px;
    padding-left: 5px;
}
.ui-accordion-content .gridMenu #submitLines {
    background: var(--section-bg);
    
}
#centerLayout .gridMenu #submitLines {
    height: 40px;
    background: var(--bg);
}
.gridMenu .lnkSaveDetails, .gridMenu .lnkExtraDetails, .gridMenu .lnkCancelDetails {
    font-size: 11px;
    padding: 0px 10px;
    display: inline-block;
    box-sizing: border-box;
    width: auto;
    text-align: center;
    height: 22px !important;
    line-height: 18px !important;
}
#centerLayout .gridMenu .lnkSaveDetails, #centerLayout .gridMenu .lnkExtraDetails, #centerLayout .gridMenu .lnkCancelDetails {
    height: 25px !important;
    line-height: 22px !important;
}
/* Restated here because the east/dialog `.gridMenu a { width: 50px }` rule outranks
   the generic .extraToolbar sizing below. */
.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu .extraToolbar,
.ui-dialog .gridMenu .extraToolbar { padding-top: 0px !important; display:inline-flex; width: fit-content; min-width:50px; line-height:20px;color: var(--txt-color);}
/* Flex rather than a floated icon: as a float the glyph was left out of the
   shrink-to-fit width, so the caption got clipped by roughly the icon's width. */
.gridMenu a.extraToolbar  {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 0 !important;
    width: fit-content;
}
.gridMenu .btnDots.extraToolbar {
    min-width: 250px !important;
    width: fit-content;
}
.gridMenu .path1 { float: left;margin-left: 30px;}
.gridMenu .path2 { float: left;margin-right: 10px;}
/* On *WithArrowData buttons the layer spans never render (the composed class no
   longer matches the base .icon-* rules that supply their content), yet their
   float margins still eat ~40px of the 73px button and push the dropdown arrow
   onto a second line that .gridMenu's overflow:hidden clips away.
   Spelled out rather than [class*="WithArrowData"]: a class-attribute selector in an
   ancestor compound makes every class change in the document walk the whole subtree
   (~11ms per hover in/out of a 5000-row grid). Keep in sync with the ToolbarButton
   class names in JqGridInit.cs and ionBiz.jqGrid.js. */
.gridMenu a:is(.btnAddWithArrowData, .btnReminderWithArrowData, .btnCreateInvoicesWithArrowData, .icon-doc_pdfWithArrowData, .icon-doc_zipWithArrowData) > .path1,
.gridMenu a:is(.btnAddWithArrowData, .btnReminderWithArrowData, .btnCreateInvoicesWithArrowData, .icon-doc_pdfWithArrowData, .icon-doc_zipWithArrowData) > .path2 { display: none; }
.icon-follow, .icon-followLeft {
    color: var(--dark-green);
}
.icon-add,.icon-add:before{
    color: var(--menu-hover);
    font-size: 22px;
}
.btnAddWithArrowData:after {content: "\e672"; font-size: 8px; font-weight:bold; }

/* --- Modernised grid toolbar buttons -------------------------------------
   The line icons read lighter than the old solid set, so toolbar glyphs are
   scaled up and every button gets a real hover/press affordance. Icon colours
   are deliberately left untouched to preserve the per-action colour coding
   (add=blue, edit=orange, refresh=red, follow=green). */
.gridMenu a:not(.extraToolbar) {
    /* Matches the hover radius in overrides.css so the shape never changes. */
    border-radius: var(--border-radius-md);
    transition: background-color .18s ease, color .18s ease, transform .12s ease;
}
.gridMenu a:not(.extraToolbar):before,
.gridMenu a:not(.extraToolbar) > span:before { font-size: 17px; transition: color .18s ease; }
.gridMenu a.icon-add:before { font-size: 20px; }

.gridMenu a:not(.extraToolbar):hover { background-color: var(--hover); }
.gridMenu a.icon-add:hover {
    background-color: var(--hover);
    background-color: color-mix(in srgb, var(--menu-hover) 12%, transparent);
}
.gridMenu a:not(.extraToolbar):focus-visible {
    outline: 2px solid var(--menu-hover);
    outline-offset: -2px;
}

/* Icon buttons centre their glyph with flex instead of the legacy percentage
   padding, which was tuned to the 73px box and left ~26px of dead space on each
   side of a 17px icon. Text buttons keep their own geometry. */
.gridMenu a:not(.extraToolbar, .btnFilterInlineRibbon, .filter-resource-name, .lnkSaveDetails, .lnkExtraDetails, .lnkCancelDetails) {
    width: 46px;
    /* Flex, not block: as flex items the glyphs each get their own line box, whose
       symmetric half-leading centres them. Sharing the anchor's line box instead
       pins them to a strut baseline sitting well below the middle of a 40px row. */
    display: flex;
    align-items: center;
    justify-content: center;
    /* Pinned so the hover font-size bump and the caret can't grow the box. Not
       display:table, where height is only a minimum. */
    height: 40px;
    margin: 0 3px;
}
/* Both of these lose to a rule elsewhere that pins display for another context
   (#eastToolbar's inline-block, the dialog-scoped [id^="btnGroupBy"]), which would
   drop the button back into the mis-centred line-box flow. */
#eastToolbar.gridMenu a:not(.extraToolbar, .btnFilterInlineRibbon, .filter-resource-name, .lnkSaveDetails, .lnkExtraDetails, .lnkCancelDetails):not(.tbLabeled) { display: flex; }
.gridMenu a[id^="btnGroupBy"] { display: flex !important; }
.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu a:not(.extraToolbar, .btnFilterInlineRibbon, .filter-resource-name, .lnkSaveDetails, .lnkExtraDetails, .lnkCancelDetails),
.ui-dialog .gridMenu a:not(.extraToolbar, .btnFilterInlineRibbon, .filter-resource-name, .lnkSaveDetails, .lnkExtraDetails, .lnkCancelDetails),
.dashboardCell .gridMenu a:not(.extraToolbar, .btnFilterInlineRibbon, .filter-resource-name, .lnkSaveDetails, .lnkExtraDetails, .lnkCancelDetails) {
    width: 38px;
    /* Restates the legacy dense height, which the 40px above would otherwise push out
       of these 28px bars. */
    height: 22px;
    margin: 0 2px;
}
.gridMenu a:not(.extraToolbar, .btnFilterInlineRibbon, .filter-resource-name, .lnkSaveDetails, .lnkExtraDetails, .lnkCancelDetails):before,
.gridMenu a:not(.extraToolbar, .btnFilterInlineRibbon, .filter-resource-name, .lnkSaveDetails, .lnkExtraDetails, .lnkCancelDetails):after,
.gridMenu a:not(.extraToolbar, .btnFilterInlineRibbon, .filter-resource-name, .lnkSaveDetails, .lnkExtraDetails, .lnkCancelDetails) > .path1,
.gridMenu a:not(.extraToolbar, .btnFilterInlineRibbon, .filter-resource-name, .lnkSaveDetails, .lnkExtraDetails, .lnkCancelDetails) > .path2 {
    float: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.gridMenu a:not(.extraToolbar, .btnFilterInlineRibbon, .filter-resource-name, .lnkSaveDetails, .lnkExtraDetails, .lnkCancelDetails):after {
    padding-left: 2px !important;
    /* .icon-gear_3:after pins its caret out of flow with a negative margin, which
       hid it behind the glyph once the button stopped being 73px wide. */
    position: static;
}

/* Captioned primary actions, labelled from their tooltip by labelToolbarButtons() in
   Utils.js. Flex rather than the centred text flow above, so the icon, caption and
   caret line up on one row. */
.gridMenu a.tbLabeled {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: auto;
    height: 40px;
    padding: 0 14px;
}
/* The east bar's inline-block wins on ID specificity, so restate the flex row there. */
#eastToolbar.gridMenu a.tbLabeled { display: inline-flex; }
/* Fixed so the hover font-size bump on .icon-add can't resize the button. */
.gridMenu a.tbLabeled:before { width: 20px; text-align: center; }
.gridMenu a.tbLabeled .tbLabel {
    font-size: 11px;
    /*font-weight: bold;
    text-transform: uppercase;*/
    line-height: 1;
    white-space: nowrap;
    /* The icon classes tint the whole anchor, so captions would otherwise differ per button. */
    color: var(--txt-color);
}
.gridMenu a.tbLabeled:hover .tbLabel { color: inherit; }

/* Group separators, injected by markToolbarGroups() in Utils.js. The box matches the
   button height and the hairline is painted in its middle, so the two stay aligned
   without hand-tuned vertical margins. */
.gridMenu .tbGroupSep {
    float: left;
    width: 1px;
    height: 40px;
    margin: 0 6px;
    background: linear-gradient(var(--section-border), var(--section-border)) center / 1px 24px no-repeat;
}
.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu .tbGroupSep,
.ui-dialog .gridMenu .tbGroupSep,
.dashboardCell .gridMenu .tbGroupSep { height: 22px; margin: 0 4px; background-size: 1px 14px; }
/* The east bar floats its buttons right, so a left-floated separator would break away from them. */
#eastToolbar.gridMenu .tbGroupSep { float: right; }

/* East pane / dialog / dashboard use a denser 30px bar, so a smaller step up. */
.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu a:not(.extraToolbar):before,
.ui-dialog .gridMenu a:not(.extraToolbar):before,
.dashboardCell .gridMenu a:not(.extraToolbar):before,
.ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu a:not(.extraToolbar) > span:before,
.ui-dialog .gridMenu a:not(.extraToolbar) > span:before,
.dashboardCell .gridMenu a:not(.extraToolbar) > span:before { font-size: 15px; }
.ui-layout-east .gridMenu .icon-add:before,
.ui-dialog .gridMenu .icon-add:before { font-size: 18px !important; }
.icon-edit:before, .icon-link:before {
    color: #ff7800;
} 
.icon-link:before { color: inherit; } 
.btnMultiEditData:before, .icon-multiedit {content: "\e68d"; color: #ff7800;} 
.btnActionsData:before {content: "\e632"; color: var(--txt-color)}  
.icon-refresh:before, .icon-refresh-checkmark:before, .icon-refresh-checkmark .path1:before { color: #fb5405;}
.icon-refresh-checkmark .path2:before {color: var(--dark-green);}
.icon-refresh-checkmark .path2:before, .icon-refresh-checkmark .path1:before {animation: blinker 2s linear infinite;}
.btnCopyData:before {content: "\e62d"; color: var(--dark-green);}


.btnManageList:before { content: "\e915";}
.btnQuickInsert:before { content: "\e690";}
.btnQuickInsert:after { content: "\e672";color: var(--txt-color);}
.btnImportPlanning:before { content: "\e614";}
.btnImportPlanning, .btnImportPlanning:before, .icon-split { color: #ff6600 !important;}
.btnImportPlanning:after { content: "\e672";}
.btnConfirm:before { content: "\e601";}
.btnConfirm, .btnConfirm:before { color: var(--dark-green) !important;}
.btnConfirm:after { content: "\e672";}

.btnReset:before { content: "\e634";}
.btnGenerate:before { content: "\e601";color: var(--dark-green);}
.btnGenerate { color: var(--dark-green);}

.icon-make-group:before {color: var(--txt-color);}
.icon-make-group:after {content: "\e672"; color: var(--txt-color); font-size: 8px;  }

.icon-add-timeline:before {content: "\e621"; color: #192d5c; }
.icon-add-timeline:after {content: "\e672"; color: var(--txt-color); font-size: 8px; font-family: 'ionbiz'; }

.icon-sort-alpha-asc:before {color: var(--blue); padding-left:38% !important;}
.icon-sort-alpha-asc:after {content: "\e672"; color: var(--txt-color); font-size: 8px;  }

.icon-bell:before {content: "\e67d"; color: var(--blue);}

.icon-multiedit-timesheet .path1:before, .icon-multiedit-issue .path1:before { color: var(--txt-color);}    
.icon-multiedit-timesheet .path2:before, .icon-multiedit-issue .path2:before { color: #ff7800; }   

.icon-add-timesheet .path1:before { color: var(--txt-color);}    
.icon-add-timesheet .path2:before { color: var(--dark-green); }    

.icon-contract .path1:before { color: var(--txt-color);}  
.icon-contract .path2:before { color: #CC9D05; }

.icon-contact .path1:before {
    content: "\e620";
    color: var(--menu-hover);
}

.icon-email:before { color: darkorange;}
.icon-pause:before { color: #ffbb4d;}

.btnReminderWithArrowData:before {content: "\e67d"; color: var(--blue); padding-left:38% !important;}
.btnCreateInvoicesWithArrowData:before {content: "\e611"; color: var(--blue);}
.icon-doc_pdf:before { color: var(--red);}
.icon-doc_pdfWithArrowData:before {content: "\e633"; color:var(--red);}
.icon-doc_zipWithArrowData:before {content: "\e62c"; color: var(--red);}
.icon-read:before { color: #ff6600;}
.icon-printer:before { color: var(--txt-color);}
.icon-unread:before { color: var(--dark-green);}
.icon-like:before, .icon-unlike:before { color: #192d5c; }
.icon-check_mark:before,  .icon-share:before, .icon-check_4:before { color: var(--dark-green);}
.icon-clock_3:before { color: var(--txt-color); opacity:0.7;}
.icon-history:before { font-size: 12px; content: "\e621"; color: #192d5c; }
.icon-warning_3:before { color: #FF999A;}
.icon-warning_2:not(.importantStyleColor):before { color: #ff7800; position:relative}
.detailInput > a + label.icon-warning_2:before, .detailInput > a + div > label.icon-warning_2:before { margin-left: -43px!important;}
.icon-warning_1:before {  content: "\e666"; color: var(--red);}

.icon-excel:before, .icon-play:before { color: var(--dark-green);}
.icon-doc_word:before {color: #3399cc;}

.btnApprove:before,.btnDisapprove:before {cursor: hand; }
.btnApprove:before, .icon-assigned .path3:before {color: var(--dark-green); }
.btnDisapprove:before, .icon-unasign .path1:before { color: var(--red); } 
.icon-assigned { cursor: default;}
.icon-unasign .path2:before, .icon-assigned .path1:before, .icon-assigned:hover .path1:before { color: var(--txt-color)!important; }  
.icon-magnify-glas:before {content: "\e687"; color: var(--blue);}
.icon-magnify-glas:after {content: "\e672"; color: var(--txt-color); font-size: 8px;  }
.icon-workload:before,.icon-calculate:before  { color: var(--txt-color);}
.icon-search:before { color: var(--blue);}
.btnDots:before {content: "\e60a"; color: var(--dark-green);}
.btnImportFromExcel:before {content: "\e681"; color: var(--dark-green);}
.icon-gear_3:before {color: var(--txt-color);}
.icon-gear_3:after{content: "\e672"; color: var(--txt-color); font-size: 8px; margin-left: -10px; position: absolute;}
.icon-process:before {color: #a28629;}
.icon-process:after{content: "\e672"; color: var(--txt-color); font-size: 8px; margin-left: -10px; position: absolute;}
.icon-filter-checkmark:after {content: "\e672"; color: var(--txt-color); font-size: 8px; }
.icon-filter-checkmark .path1:before {color: var(--menu-hover);}
.icon-filter-checkmark .path2:before {color: var(--blue);}

.icon-filter-reset:before { color: var(--blue);}
.icon-filter-reset .path1:before {color: var(--blue);}
.icon-filter-reset .path2:before {color: var(--red);}

.icon-show-timesheet .path1:before {color: var(--txt-color);}
.icon-show-timesheet .path2:before {color: var(--dark-green);}
.icon-show-timesheet:hover .path2:before { color: var(--red);content: "\e69b";}

.icon-hide-timesheet .path1:before {color:  var(--txt-color);}
.icon-hide-timesheet .path2:before {color:  var(--red);}
.icon-hide-timesheet:hover .path2:before { color: var(--dark-green);content: "\e69a";}
.btnTransfer:before {content: "\e913"; color: var(--blue);}
.icon-expand-all:before
 { content: "\e672";}
  
 .icon-collapse-all:before
 { content: "\e670";}
 
#btnUpdateReimbursedOn.icon-invoice:after {content: "\e672"; color: var(--txt-color); font-size: 8px;  }
#btnUndo.icon-forward:before {content: "\e90f"; transform: rotateY(180deg);   padding-right: 37%;}
#btnInsertContact.icon-follow:before {content: "\e67c"; transform: rotateY(180deg);   padding-right: 37%;}
#btnInsert.icon-follow {transform: rotateY(180deg); transform-origin:right; margin-left:10px; width:20px;}

.icon-trash:before {color: var(--red);}
.icon-phone:before {color: var(--dark-green);}
.icon-activity:before {color: var(--blue);}
.icon-resource:before { color: #96938E; }
.icon-invoice:before{color: var(--dark-green);}
.icon-download:before, .icon-download-custom-fields:before {content: "\e609"; color: var(--dark-green);}
.icon-upload:before {color: var(--dark-green);}
.btnReplace:before { color: var(--red)}

/*.icon-quote:before, .icon-cost {color: var(--dark-green);}*/
.icon-purchase-quote:before {color: var(--red); content: "\e616";}
.icon-quote-contract:before {color: #cc9e05; content: "\e682";}

.icon-indent:before, .icon-outdent:before {color: #96938E;}

.btnInvoicingApprovalReleaseApprovalData:before {content: "\e638";color: var(--dark-green);}
.icon-lock_green:before {content: "\e638";color: var(--dark-green);}
.icon-lock_red:before {color: var(--red);}

.icon-add-remove:before, .icon-add-remove-item:before { color: var(--txt-color); padding-left: 24% !important; }
.icon-add-remove:after, .icon-add-remove-item:after { content: "\e672"; color: var(--txt-color); font-size: 8px; }

.btnReminderWithArrowData:after {content: "\e672"; color: var(--txt-color); font-size: 8px; }
.btnCreateInvoicesWithArrowData:after {content: "\e672"; color: var(--txt-color); font-size: 8px; }
.icon-doc_pdfWithArrowData:after {content: "\e672"; color: var(--txt-color); font-size: 8px; }
.icon-doc_zipWithArrowData:after {content: "\e672"; color: var(--txt-color); font-size: 8px; }
.btnYearBalance:before { content: "\e60f";margin-left: 10px;color: var(--txt-color); }
.btnYearBalance:after { content: "\e672";font-size: 10px;color: var(--txt-color);}
.btnSearchResource:before { content: "\e648";}
.btnAssignTaskResource:before, .btnAssignResource:before { content: "\e648";}
.btnAssignTaskResource:after { content: "\e672";color: var(--txt-color);font-size: 8px;font-style:normal;}
.btnAssignDepartment:before { content: "\e632";}
.btnAssignSupplier:before { content: "\e618";}
.icon-interface { color: var(--txt-color); opacity:0.7;}
.icon-grid-insert .path1:before, .icon-grid-quick-edit .path1:before {color: var(--menu-hover); font-style:normal;  }
.icon-grid-insert .path2:before {   color: var(--dark-green); }
.icon-grid-quick-edit .path2:before {  color: #CC9D05;  }
.icon-lookup:before{ color: var(--menu-hover);}
.icon-lookup.show-when-editable { cursor: pointer;}
.icon-planning-draft { cursor: pointer; }
.icon-optional:before { color: var(--dark-green); }

.btnShowGrid:before { color: var(--dark-green);content: "\e60c"; }
.btnHideGrid:before { color: #fb5405;content: "\e60d"; }

#btnPlanningDraftUpload:before { color: var(--dark-green); content: "\e60a"; font-size: 18px; overflow: hidden;}
.icon-planning-draft:after, #btnPlanningDraftUpload:after {
    content: "\e672";
    color: var(--txt-color);
    font-size: 8px;
}

.gridMenu .gt-autocomplete > input.ui-autocomplete-input.iconAC {
    float: none;
    border: 1px solid transparent;
    border-radius: var(--border-radius-md);
    background-color: inherit;
    max-width: 95px;
    width: fit-content !important;
    /* No chevron is drawn on toolbar buttons, so the 21px it reserves only clips the caption. */
    padding-right: 8px !important;
    padding-left: 8px;
    margin-right: 0;
    cursor: pointer !important;
    text-indent: 0;
    outline:none !important;
}
/* The input supplies its own padding, so the wrapper's gap and right padding would only
   stop the caption's hit/hover box short of the button's right edge. */
.gridMenu a.extraToolbar.gt-autocomplete {
    gap: 0;
    padding-right: 0;
}
.gridMenu .gt-autocomplete > input#QuickDelinkResourceId{
    width: 60px !important;
}
.gridMenu .gt-autocomplete > input#QuickDelinkResourceId:focus{
    outline-offset: -1px !important;
}

.shortcut-autocomplete:before {
    font-family: 'ionbiz';
    content: "\e649";
    color: var(--blue);
    font-size: 14px;
    vertical-align: -webkit-baseline-middle;
    cursor: pointer;
}

.gridMenu .gt-autocomplete {
    padding-right: 8px;
}

/* ionbiz icon colors */
.icon-duplicate, .icon-move, .icon-ok, .icon-leave { color: var(--dark-green);}
.icon-cut, .icon-transfer { color: var(--blue);}
.icon-no, .icon-error { color: var(--red);}
.icon-paste { color: #CC8945;}
.icon-calendar { color: var(--txt-color);}
.icon-reply, .icon-reply-all, .icon-forward { color:var(--txt-color);}
.icon-view:before { 
    font-size: 10px;
    color: var(--txt-color);
}

.resourceType.icon-project:before {
    content: "\e934";
    color: var(--dark-green);
}

.hasDatepicker:not(.navigateDatePicker), .datepicker, input[id*=ExchangeRateName] {
    background-repeat: no-repeat;
    text-indent: 22px !important;
}

.timepicker {
    background-repeat: no-repeat;
    padding-left: 2px;
    text-indent: 22px !important;
    border-radius:20px !important;
    min-width: 67px !important;
}

.ionbizdetails.editMode .detailInput:has(.timepicker):before, .detailInput:has(.timepicker):before {
    font-family: 'ionbiz' !important;
    /* clock_3 - a real clock face. \e61d is time_3, one of the quarter-pie icons. */
    content: "\e621";
    font-size: 15px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* Stretching to the pill and centring here; otherwise the glyph rides the inherited
       33px line box, which sits half a pixel below the input's own text. */
    display: flex;
    align-items: center;
    top: 0;
    bottom: 0;
    line-height: 1;
    left: 4px !important;
    text-indent: 0;
    position: absolute;
    text-indent: 5px;
    z-index: 1;
    opacity: 0.6;
}
/* Keeps the caption the same distance from the glyph after the 2px shift; the grid
   timepicker keeps the base 22px because its glyph is not shifted. */
.detailInput .timepicker {
    text-indent: 24px !important;
}
.ionbizdetails.editMode .detailInput:has(.datepicker):has(.timepicker) {
    min-width: 165px !important;
}
tr[editable="1"] td:has(.editable.timepicker):before, .timepicker-inline:before {
    font-family: 'ionbiz' !important;
    content: "\e621";
    font-size: 15px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: flex;
    vertical-align: middle;
    padding-top: 0px;
    text-indent: 0;
    position: absolute;
    text-indent: 9px;
    z-index: 1;
    width: 20px;
    line-height:25px;
    pointer-events: none;
    color: var(--txt-color-muted);
}

.detailInput:has(.timepicker-inline){
    display: flex;
}
.timepicker-inline, .datepicker-inline, .select-inline{
    margin-left:3px;
    display:flex;
    align-content:center;
    align-items:center;
}
tr[editable="1"] td:not(.ui-search-input):has(.hasDatepicker:not(.navigateDatePicker)):before {
    font-family: 'ionbiz' !important;
    content: "\e943";
    font-size: 15px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: flex;
    vertical-align: middle;
    padding-top: 3px;
    padding-left: 1px;
    text-indent: 0;
    left: auto;
    position: absolute;
    text-indent: 8px;
    z-index: 1;
    width: 20px;
    pointer-events: none;
    opacity: 1;
    color: var(--txt-color-muted);
}
/* Matches the 2px shift applied to the glyphs above. */
.jqGrid .timepicker,
.jqGrid .hasDatepicker:not(.navigateDatePicker) {
    text-indent: 24px !important;
}
/* Positioning the cell lets the glyph stretch to its full height and centre there, the same
   way the caret does, instead of depending on the editor's static position. */
.jqGrid tr[editable="1"] td:has(.editable.timepicker),
.jqGrid tr[editable="1"] td:not(.ui-search-input):has(.hasDatepicker:not(.navigateDatePicker)) {
    position: relative;
}
.jqGrid tr[editable="1"] td:has(.editable.timepicker):before,
.jqGrid tr[editable="1"] td:not(.ui-search-input):has(.hasDatepicker:not(.navigateDatePicker)):before {
    top: 0;
    bottom: 0;
    height: auto;
    line-height: 1;
    padding-top: 0;
    align-items: center;
}
.datepicker-inline:before {
    font-family: 'ionbiz' !important;
    content: "\e943";
    font-size: 15px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: table-cell;
    vertical-align: middle;
    top: 0px;
    left: 20px;
    position: relative;
    z-index: 1;
    pointer-events: none;
    opacity: 1;
    margin-left: 3px;
}
.datepicker-inline.threeElements40And30PercentWidth{
    float:left !important;
}
.datepicker-inline input {
    margin-left: 3px;
}
.timepicker:focus {

} #ui-datepicker-div {

} .ui-datepicker .ui-datepicker-header {
    padding: 0px;
    border: solid 1px var(--bg-border-light);
    margin: 0px;
    border-radius: var(--border-radius-md) var(--border-radius-md) 0px 0px;
    border-bottom: 0px;
    background-color: var(--weekend-bg);
    color: var(--txt-color);
} .ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
    border-left-width: 1px;
    border-top-left-radius: var(--border-radius-md);
    border-top-right-radius: var(--border-radius-md);
} .ui-datepicker .ui-datepicker-title select {
    text-transform: uppercase;
    padding-right: 8px !important;
    padding-left: 8px !important;
    border-radius: 0px;
    margin: 0px;
    margin-left: -1px;
    border: 0px;
    margin: 0px;
    line-height: 1.8em;
    font-weight:bold;
    /*border-right: solid 1px var(--bg-border);*/
    color: var(--txt-color);
    background: var(--weekend-bg);
    text-align:left;
} .ui-datepicker .ui-datepicker-title select.ui-datepicker-month {
        /*border-right: solid 1px var(--bg-border);*/
        margin-right:5px;
        line-height: 1.8em;
        color: var(--txt-color);
        background: var(--weekend-bg);
        
    } .ui-datepicker table {
    width: 232px;
    font-size: .9em;
    margin: 0px;
    background-color: var(--bg);
    border-collapse: separate;
    border-spacing: 0;
} .ui-datepicker-calendar thead {
    border: solid 1px var(--bg-border-light);
    display: table-caption;
} .ui-datepicker th {width: 35px;padding: 0.5em .3em;}
/* The `td`-keyed datepicker rules that were here are fully overridden by the redesigned
   block further down this file, and each one sat in the `td` bucket -- match-attempted
   against all 65k grid cells on every recalc. Change the block below instead. */
.ui-datepicker-calendar thead {
    font-size: 0.9em;
    margin-bottom: -1px;
    background: var(--bg);
} .ui-datepicker button.ui-datepicker-current {
    background-color: var(--weekend-bg) !important;
    border: 1px solid var(--bg-border) !important;
    font-size: x-small;
    font-weight: bold;
    color: var(--txt-color) !important;
} .ui-datepicker-today, .ui-datepicker-today a {
    background-color: var(--blue) !important;
    font-weight: bolder;
    color: white !important;
    border-radius: 3px;
}
.ui-datepicker-current-day, .ui-datepicker-current-day a {
    background-color: var(--submenu-hover) !important;
    font-weight: bolder;
    color: var(--txt-color) !important;
    border-radius:3px;
}
.ui-datepicker-today span, .ui-datepicker {
    font-weight: bold !important;
    color: var(--txt-color);
} .ui-datepicker-today span{
    font-weight: bold !important;
    /* text-shadow: 1px 1px 1px rgba(0,0,0, 0.5);*/
    color: var(--txt-color) !important;
} .ui-datepicker button.ui-datepicker-current {
    border: none;
    border-radius: var(--border-radius-sm);
    cursor: pointer;
    margin-left: calc(50% - 26px);
} .ui-datepicker .ui-datepicker-prev { padding-left: 10px;width: 1.4em;cursor: pointer;} .ui-datepicker .ui-datepicker-next {width: 1.4em;padding-left: 10px;cursor: pointer;} 
.ui-datepicker-prev:before,.ui-datepicker-next:before, .ui-datepicker-header:before {
	font-family: 'ionbiz';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
    color: var(--txt-color);
} .ui-datepicker-prev:before {content: "\e66e";line-height: 22px;cursor: pointer; font-size: 7px;} .ui-datepicker-next:before {content: "\e66f";line-height: 22px;cursor: pointer; font-size: 7px;} .ui-datepicker button.ui-datepicker-close {display: none;}​ .ui-datepicker dib.ui-datepicker-buttonpane {margin:0px !important; } .resetFilterDefault {background-position: -364px -297px;} .resetFilterDefault:hover {background-position: -364px -297px;} #eastHeaderWrapper {
    width: 100%;
    overflow: hidden;
    display:block;
    height: 48px;
} #detailNameHolder {
    color: var(--txt-color);
    font-size: 18px;
    height: 24px;
    text-indent: 0px;
    padding: 0px 0px 0px 15px;
    position: relative;
    text-overflow: ellipsis;
    font-weight: bold;
    white-space: nowrap;
    overflow: hidden;
    width: auto;
    margin: 16px 0px;
    line-height: 24px;
} #detailNameHolder .path1 {
    margin-left: 0px;
    padding-right: 5px;
} #detailNameHolder:hover {cursor: auto;} #detailNameHolder:before {
    color: var(--icon-bg);
    padding-right: 10px;
    font-family: ionbiz;
    font-size: 20px;
    margin-top: 1px;
    float: left;
} #detailNameHolder .uniqueId {
        margin-right: 10px;
        color: var(--blue);
        font-weight: normal;
} 
#eastPane > .ui-layout-content {
    border-color: var(--east-bg);
    background: var(--east-bg);
    border-width: 1px;
    border-style: solid;
    border-radius: var(--border-radius-md);
    box-sizing: content-box;
    margin-right: 8px;
    margin-left: 8px;
    margin-bottom: 7px;
    display: flex;
    flex-direction: column;
}
/* #planningBarPanel is a direct child here; the `>` keeps :has() from walking the east pane. */
#eastPane > .ui-layout-content:has(> #planningBarPanel){
    background: var(--bg);
}
 #eastPane > #mainTabs ~ .ui-layout-content {
    border-width: 0px 1px 1px;
    border-radius: 0px 0px var(--border-radius-md) var(--border-radius-md);
    margin-left:1px;
} #eastToolbar.gridMenu {
    float: right;
    margin-right: 100px;
    margin-bottom: 7px;
    max-width: calc(70% - 100px);
    width: auto;
} #eastToolbar.gridMenu a { float: right!important;display: inline-block; } 
  /* Same radius in both states so the hover pill doesn't change shape. */
  #eastToolbar.gridMenu a,
  #eastToolbar.gridMenu a:hover {
       border-radius: var(--border-radius-md);
   }

  #mainTabs {
        width: calc(100% - 16px); /*8px from margin left and 8 from right*/
        float: left;
        margin: 0px;
        margin-right: 8px;
        margin-left: 5px;
        margin-top: 4px;
        /* Sibling margins do not collapse here, so the first section header is trimmed
           below to keep the gap under the rail even across panels. */
        margin-bottom: 10px;
        border-radius: var(--border-radius-xl) var(--border-radius-xl) 0px 0px;
        box-sizing: border-box;
        padding: 0px 0px 0px 0px;
        /*background: var(--east-bg);*/
        font: 1rem "DM Sans", Onest, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    } #mainTabs2 {
    padding-top:5px;
    padding-left:5px;
}
/* Folder-tab frame until TabsControl fills the strip and stamps .tabsStrip. */
#mainTabs:not(.tabsStrip) {
    height: 35px;
    border-bottom: 1px solid var(--bg-border);
}
#mainTabs2:not(.tabsStrip) {
    height: 35px;
}
/* Detail tabs are a flat pill row: the strip has no rule or fill of its own and the
   active tab is a soft pill. TabsControl stamps .tabsStrip on every strip it fills. */
.tabsStrip {
    /* The list floats, so without a BFC it escapes and squeezes the detail form next to it. */
    display: flow-root;
}
.tabsHolder {
    float: left;
    box-sizing: border-box; /* Opera/IE 8+ */
    padding: 4px 0 !important;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 4px;
}
#mainTabs1{
    padding-left:5px;
}
.ui-helper-reset { line-height: 1;} .tabsHolder li {
    display: flex;
    align-items: center;
} .tabsHolder li a {
    display: flex;
    align-items: center;
    gap: 7px;
    float: none;
    height: 32px;
    padding: 0 13px;
    border-radius: var(--border-radius-sm);
    font-size: 0.8rem;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    color: color-mix(in srgb, var(--txt-color) 80%, var(--bg));
} .tabsHolder li a:before {
    margin: 0;
    color: inherit;
    font-size: 1.05em;
} .tabsHolder .ui-state-disabled a { opacity: 0.5;} .tabsHolder li:not(.ui-state-disabled) a:hover {
    background: var(--hover);
    color: var(--txt-color);
}
.tabsHolder li.ui-tabs-active a,
.tabsHolder li.ui-tabs-active:not(.ui-state-disabled) a:hover {
    background: color-mix(in srgb, var(--menu-hover) 8%, transparent);
    color: color-mix(in srgb, var(--menu-hover) 80%, var(--txt-color));
    /* Same weight as an inactive tab, otherwise the pill resizes on every switch. */
    font-weight: inherit;
}

/* Only #mainTabs sits directly on the red panel background when the record is
   locked; every other strip (#mainTabs2, in-section .tabContainer) is inside a
   panel that repaints its own background, so it keeps the normal colours. */
.bgLocked:not(.ionBizDialogDetails) #mainTabs .tabsHolder li a {
    color: color-mix(in srgb, white 82%, var(--red));
}

.bgLocked:not(.ionBizDialogDetails) #mainTabs .tabsHolder li:not(.ui-state-disabled) a:hover {
    background: rgba(255, 255, 255, 0.18);
    color: white;
}

.bgLocked:not(.ionBizDialogDetails) #mainTabs .tabsHolder li.ui-tabs-active a,
.bgLocked:not(.ionBizDialogDetails) #mainTabs .tabsHolder li.ui-tabs-active:not(.ui-state-disabled) a:hover {
    background: rgba(255, 255, 255, 0.24) !important;
    /* overrides.css forces the blue accent colour here */
    color: white !important;
}

.ui-tabs-panel {
    height: inherit;
    width: inherit;
    padding: 0 !important;
    /*padding-bottom: 5px !important;*/
} .more-menu .dropdown-links li a .tabCount, .jqgrow td .gridUnreadNotes {
    background-clip: padding-box;
    background-color: var(--green);
    border-radius: 11px;
    border: 1px solid var(--bg-border-light);
    box-shadow: 0 0 20px var(--shaddow);
    color: black;
    display: inline-block;
    float: left;
    font-family: var(--font-family);
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    height: 14px;
    line-height: 14px;
    margin-left: 1px;
    margin-top: -15px;
    padding: 0 0px 0 0;
    position: absolute;
    text-align: center;
    min-width: 14px;
    text-indent: 0px;
    z-index:1;
    
}
  .jqgrow td .gridUnreadNotes{
    margin-top: -8px !important;
  }
/* The tab count rides along as a chip in the pill's flex row. */
.tabsHolder li a .tabCount {
    background-clip: padding-box;
    background-color: var(--green);
    border-radius: 999px;
    color: black;
    display: inline-block;
    font-family: var(--font-family);
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    height: 17px;
    line-height: 17px;
    min-width: 17px;
    padding: 0 5px;
    text-align: center;
    text-indent: 0px;
    z-index: 1;
}
/* Utils.js leaves the previous badge behind when it refreshes a count. */
.tabsHolder li a .tabCount:has(~ .tabCount) {
    display: none;
}
.invoiceProposalApprovalComment {
    background-clip: padding-box;
    background-color: var(--dark-green);
    border-radius: 11px;
    color: #fff;
    display: inline-block;
    float: left;
    font-family: sans-serif;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    height: 15px;
    line-height: 15px;
    margin-left: 1px;
    margin-top: 4px;
    padding: 0 0px 0 0;
    position: absolute;
    text-align: center;
    width: 15px;
    text-indent: 0px;
} .jqgrow td .gridUnreadNotes {
    background-color: #ff6600;
    color: white;
} .jqgrow td .gridAttachments {
    background-color: var(--dark-green);
} .jqgrow td .gridUnreadNotes:after, .jqgrow td .gridAttachments:after { content: attr(data-unread); } .jqgrow td .gridUnreadNotes[data-unread="0"], .jqgrow td .gridAttachments[data-unread="0"] { display: none; } h2, h2.ui-accordion-header {
    cursor: pointer;
    position: relative;
    margin: 0px !important;
    margin-top: 5px !important;
    padding-left: 15px !important;
    height: 18px;
    text-indent: 0px;
    font-weight: bold;
    font-size: 13px !important;
    line-height: 18px;
    display: flex !important;
    align-items:center;
    white-space: nowrap;
    outline: none;
    color: var(--txt-color);
} .ionbizdetails h2, .note h2 {
    padding-top: 6.5px;
    padding-bottom: 6.5px;
} .ionbizdetails h2 + div {
    padding: 0px 0px 0px 16px;
    overflow:auto;
} .ui-dialog .ui-accordion-content {padding: 0px 0px 4px 16px;} .ui-dialog-content .halfWidth { width: 50%; float: left; box-sizing: border-box; } h2.ui-accordion-header:before {
    font-family: "ionbiz";
    font-weight: normal;
    content: "\e66f";
    position: absolute;
    left: 3px;
    font-size: 10px;
    color: var(--txt-color);
} .ui-dialog h2.ui-accordion-header:before { /*left: -2px;*/} h2.ui-accordion-header:hover:before { color: var(--txt-color); } h2.ui-accordion-header-active:before {visibility: hidden;  content: "\e672"; color: var(--txt-color); } h2.ui-accordion-header-active:hover:before { visibility: visible; } .ionbizdetails h2:after, h2.ui-accordion-header:after {
    
    content: "";
    display: block;
    float: left;
    height: 1px;
    margin-left: 10px;
    position: relative;
    top: 50%;
    width: 100%;
} h2.ui-accordion-header input[data-checkbox="true"][type="checkbox"] + label {
    width: 23px!important;
} h2.ui-accordion-header > a.icon-edit {
    padding-left: 10px;
    font-size: 1.3em;
    position: absolute;
    right: 30%;
}
/* A header holds a single a.icon-edit, so it can be matched directly rather than through an
   ancestor :has(), which re-matched every link below the header on each DOM change. */
.ui-accordion-header-active:has(a.icon-edit.disabled), .ui-accordion-header-active a.icon-edit.disabled:before {
    color: var(--menu-hover) !important;
}
h2.ui-accordion-header:hover:has(a.icon-edit){
    background: var(--bg);
}
a.disabled {
    pointer-events: none;
    cursor: default;
    opacity: 0.5;
} .thirdSizeLeft {float: left; width: 24.5%;margin: 10px 0.5% 0px 0px !important;clear: left; } .thirdSizeRight {float: right; width: 24.5%;margin: 10px 0.5% 0px 0px !important;clear: right; } .halfSizeLeft {
    float: left;
    width: 50%;
    margin: 0px !important;
} .halfSizeRight {
    float: none;
    width: auto;
    /*margin: 0 !important;*/
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
} .displayGrid {
    display: grid;
    grid-template-columns: 50% 50%;
    grid-template-rows: auto;
    min-width: 600px;
    background: var(--section-bg);
    border-radius: var(--border-radius-md);
    border: 1px solid var(--section-border);
    margin: 5px;
    padding: 10px !important;
}

/*******************************************************
    Detail form sections as a single card

    The h2 and its pane are siblings, so the h2 draws the top of the card
    (square bottom corners, no bottom margin) and the pane draws the rest.
    Horizontal margins must stay identical or a seam appears.

    The accordion root differs per module - the tab panel on Tickets, the form
    itself on Projects, the east pane on reports, the dialog content element for
    sections rendered after a form - so the pair is matched on its own shape
    instead of on any one of those roots.
********************************************************/
h2.ui-accordion-header:has(+ .ui-accordion-content) {
    display: flex !important;
    align-items: center;
    gap: 7px;
    height: auto;
    margin: 18px 5px 0 !important;
    /* left inset matches the pane's 7px padding plus .detailRow's 2px margin, 2px
       border-left and .detailLabel's 3px text-indent, so the accent bar starts
       exactly where the field label text does */
    padding: 14px 7px 13px 14px !important;
    box-sizing: border-box;
    border: 1px solid var(--card-border);
    border-bottom: 1px solid color-mix(in srgb, var(--bg-border-light) 25%, var(--section-bg));
    border-radius: var(--border-radius-l) var(--border-radius-l) 0 0;
    background: var(--section-bg);
    color: var(--txt-color);
    font-size: 9.5px !important;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

/* The display above is !important and outweighs .hide, which views use to drop a
   section conditionally and which initSections uses to collapse an empty one. */
h2.ui-accordion-header:has(+ .ui-accordion-content).hide {
    display: none !important;
}

/* The pane is hidden while collapsed, so the header has to close the card itself. */
h2.ui-accordion-header:has(+ .ui-accordion-content):not(.ui-accordion-header-active) {
    border-bottom-color: var(--card-border);
    border-radius: var(--border-radius-l);
}

h2.ui-accordion-header:has(+ .ui-accordion-content):first-child {
    margin-top: 4px !important;
}

/* These layout wrappers float, so a card inside one is not at the top of the form
   even when it is the wrapper's first child, and the header that follows the
   wrapper clears it flush with its own top margin absorbed. Both gaps therefore
   have to be restated here. */
:is(.maxWidth, .halfWidth, .halfSizeLeft, .halfSizeRight) > h2.ui-accordion-header:has(+ .ui-accordion-content):first-child {
    margin-top: 18px !important;
}

/* Tabs that render every section inside its own wrapper (RMA, the Info tabs, ...) make each
   header a :first-child, so they would all take the 4px reserved for the top of the panel.
   The wrapper of the first section has no preceding sibling, so it keeps the 4px.
   `* + *` made Chrome restyle the whole page on every DOM insert; :where(:not(:first-child))
   matches the same wrappers with the same (zero) specificity. */
.ui-tabs-panel > :where(:not(:first-child)) > h2.ui-accordion-header:has(+ .ui-accordion-content):first-child,
.ui-tabs-panel > :where(:not(:first-child)) > * > h2.ui-accordion-header:has(+ .ui-accordion-content):first-child {
    margin-top: 18px !important;
}

/* Spelled out per class rather than through :is() so each rule is indexed by that
   class; an :is() subject lands in the universal bucket and the :has() then runs
   against every element in the document. */
.maxWidth:has(> h2.ui-accordion-header + .ui-accordion-content),
.halfSizeLeft:has(> h2.ui-accordion-header + .ui-accordion-content),
.halfSizeRight:has(> h2.ui-accordion-header + .ui-accordion-content) {
    margin-bottom: 18px !important;
}

/* Project dashboard: Profit sits beside the stacked Factors and Averages cards. A float
   cannot match their combined height, so the row becomes a grid and Profit spans both. */
#dashboard div:has(> .halfSizeLeft):has(> .halfSizeRight) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
}

#dashboard div:has(> .halfSizeLeft) > .halfSizeLeft {
    grid-row: 1 / -1;
    float: none;
    width: auto;
    display: flex;
    flex-direction: column;
}

#dashboard div:has(> .halfSizeLeft) > .halfSizeRight {
    grid-column: 2;
}

/* The pane draws the card body, so it takes the height the shorter column gains. */
#dashboard div:has(> .halfSizeLeft) > :is(.halfSizeLeft, .halfSizeRight:last-child) > .ui-accordion-content {
    flex: 1 1 auto;
}

/* ::before is the expand/collapse chevron. Out of flow so it costs the title no
   indent, and only on hover so it never competes with the section name. */
h2.ui-accordion-header:has(+ .ui-accordion-content):before {
    left: auto;
    right: 12px;
    visibility: hidden;
}

h2.ui-accordion-header:hover:has(+ .ui-accordion-content):before {
    visibility: visible;
}

/* ::after is an invisible full-width spacer here, so reuse it as the accent keyline. */
h2.ui-accordion-header:has(+ .ui-accordion-content):after {
    order: -1;
    float: none;
    position: static;
    flex: 0 0 3px;
    width: 3px;
    height: 10px;
    margin: 0;
    border-radius: 999px;
    background: var(--blue);
}

h2.ui-accordion-header:has(+ .ui-accordion-content) .ui-accordion-header-icon {
    display: none;
}

h2.ui-accordion-header + .ui-accordion-content {
    margin: 0 5px;
    padding: 7px !important;
    border: 1px solid var(--card-border);
    border-top: none;
    border-radius: 0 0 var(--border-radius-l) var(--border-radius-l);
    background: var(--section-bg);
    box-shadow: 0 4px 12px -10px color-mix(in srgb, var(--shaddow) 45%, transparent);
}

/* jqGrid sizes itself from the pane's content box, so a grid pane must not inset it.
   ui.jqgrid_overrides.css paints toolbar-less grid panes with an --east-bg border. */
h2.ui-accordion-header + .ui-accordion-content:has(.jqGridHolder) {
    padding: 0 !important;
    border: 1px solid var(--card-border) !important;
    border-top: none !important;
    overflow: hidden;
}

/* Panes hosting nested tabs stay transparent, so the header must close itself.
   A tab strip wrapped around a grid is still grid content, so it keeps the card. */
h2.ui-accordion-header + .ui-accordion-content:has(.tabContainer):not(:has(.jqGridHolder)) {
    border-color: transparent;
    background-color: transparent;
    box-shadow: none;
}
h2.ui-accordion-header:has(+ .ui-accordion-content .tabContainer):not(:has(+ .ui-accordion-content .jqGridHolder)) {
    border-bottom-color: var(--card-border);
    border-radius: var(--border-radius-l);
    margin-bottom: 5px !important;
}

.displayGrid.threeColumns {
    grid-template-columns: 33.333% 33.333% 33.333%;
} .displayGrid.autoColumns {
    grid-template-columns: auto;
} .displayGrid form { display:inherit;} .displayGrid .halfSizeLeft {
    grid-column-start: 1;
    grid-column-end: 1;
    width: auto;
    overflow: hidden;
    height: fit-content;
} .displayGrid .halfSizeRight {
    grid-column-start: 2;
    grid-column-end: 2;
    width: auto;
    display: inline-block;
    overflow: hidden;
    height: fit-content;
    margin-left: 10px;
} .displayGrid .thirdWidth {
    float: left !important;
    grid-column-start: 1;
    grid-column-end: 1;
    height: fit-content;
} .displayGrid .thirdWidth + .thirdWidth {
    grid-column-start: 2;
    grid-column-end: 2;
} .displayGrid .thirdWidth + .thirdWidth + .thirdWidth {
    grid-column-start: 3;
    grid-column-end: 3;
} .displayGrid .halfSizeLeft .detailRow, .displayGrid .halfSizeRight .detailRow, .displayGrid .thirdWidth .detailRow {
    min-width: unset;
} .twoThirdsSizeRight {
    float: right;
    width: 74.5%;
    margin: 10px 0px 0px 0.5% !important;
    clear: right;
} .twoThirdsSizeLeft {float:left; width: 74.5%;margin: 10px 0px 0px 0.5% !important;clear: left; }
#generalSettingsForm .ui-accordion-content .halfSizeLeft:only-child{
    width:90%;
}
#generalSettingsForm .ui-accordion-content .halfSizeLeft:only-child .detailInput{
    max-width:400px;
}
#generalSettingsForm .halfSizeLeft { margin-left: 22px !important;} .btnCloseWest, .btnResizeEast {
    position: absolute;
    top: 0px;
    right: 240px;
    width: 24px;
    height: 30px;
    z-index: 2;
    cursor: pointer;
    background-color: var(--bg);
    border: 1px solid var(--bg-border-light);
    border-radius: 0px 0px 25px 25px;
    box-sizing: border-box;
    font-family: 'ionbiz';
    box-shadow: 0px 0px 5px 0px var(--bg-border);
} .btnCloseWest:before, .btnResizeEast:before {
        content: "\e670";
        color: var(--txt-color);
        height: 0;
        width: 0;
        display: block;
        margin: 0;
        font-size: 10px;
        position: relative;
        left: calc(50% - 5px);
        top: calc(50% - 5px);
        font-weight: 100;
    } .btnCloseWest:before, .btnResizeEast:before {
    content: "\e672";
} .btnCloseWest {
    top: -5px;
    left: 1px;
    transform: rotate(-90deg);
}
#gridPlanningsContainer ~ a.btnResizeEast,
#gridTimescheduleContainer ~ a.btnResizeEast {
    top: -4px;
    right:3px;
    transform: rotate(90deg);
} .btnCloseWest.open:before, .btnResizeEast.open:before {
    content: "\e670";
} .btnCloseSubmenu {
    width: 20px;
    height: 20px;
    border: 0px;
    cursor: pointer;
    position: absolute;
    top: 20px;
    right: 20px;
    background-image: url("../Content/Themes/Blue/img/mainMenu.png?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc");
    background-position: -253px -128px;
    background-repeat: no-repeat;
    text-indent: -9999px;
 } .btnCloseSubmenu:hover {
    background-position: -253px -184px;
} .footer {
    float: left;
    width: 100%;
    padding-right: 0px;
    box-sizing: border-box;
    height: 50px;
    display: block;
    padding-top: 2px;
} #submitDetailsControl {
    float: right;
    width: auto;
    padding: 5px 0px 0px 0px;
    height: 40px;
} .darkFooter {
    float: left;
    width: 100%;
    height: 41px;
} .actionsAndMsg {
    float: left;
    width: 100%;
}
#redMessageBottom, .detailLabel.cRed, .detailLabel:has(> .icon-warning_1:only-child) {
    font-size: 12px;
    color: var(--txt-color);
    padding: 10px 10px 10px 15px;
    width: auto;
    min-width: 150px;
    height: 50%;
    font-weight: 600;
    width: fit-content;
    border: 1px solid var(--bg-border-light);
    border-radius: var(--border-radius-md);
    background: #FFF7E6;
}
.detailInput:has(> .icon-warning_1:only-child) {
    font-size: 12px;
    color: var(--txt-color);
    padding: 5px 10px 5px 10px;
    width: auto;
    min-width: 150px;
    height: 50%;
    font-weight: 500;
    width: fit-content;
    border: 1px solid var(--bg-border-light);
    border-radius: var(--border-radius-xl);
    background: #FFF7E6 !important;
}
.detailInput:has(> .icon-warning_1:only-child) .icon-warning_1:before{
        margin-left: 0px !important;
}
#redMessageBottom {
    margin-left: 8px;
}
#redMessageBottom:before{
    font-family: 'ionbiz' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\e666";
    color: var(--txt-color);
}
body.dark #redMessageBottom, body.dark .holderNotification, body.dark .detailLabel.cRed {
    background: rgb(72 72 72);
}
#redMessage, #tabIsRestricted {
    font-size: 12px;
    color: var(--red);
    padding: 15px 10px 10px 15px;
    width: auto;
    min-width: 250px;
    font-weight: 600;
} .lnkSaveDetails, .lnkExtraDetails, .lnkExtraSaveDetails, .lnkThirdSaveDetails, .lnkFourthSaveDetails, .lnkSaveAndNewDetails {
    float: left;
    border-radius: var(--border-radius-sm);
    font-size: 0.8em;
    border: 1px solid var(--menu-hover);
    padding: 0.7em 1em;
    text-transform: none;
    text-align: center;
    color: var(--bg);
    font-weight: bold;
    min-width: 60px;
    width:fit-content !important;
    cursor: pointer;
    margin-right: 10px;
    background: var(--menu-hover);
}
.lnkExtraSaveDetails, .lnkThirdSaveDetails, .lnkFourthSaveDetails{
    background: var(--bg) !important;
    color: var(--txt-color) !important;
}
.lnkSaveDetails[disabled], .lnkExtraDetails[disabled], .lnkExtraSaveDetails[disabled], .lnkThirdSaveDetails[disabled], .lnkFourthSaveDetails[disabled], .lnkSaveAndNewDetails[disabled] {
    opacity: 0.7;
} .lnkSaveAndNewDetails, .lnkExtraSaveDetails, .lnkThirdSaveDetails, .lnkFourthSaveDetails {
   
    color: var(--bg);
} .ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu .lnkSaveDetails, .ui-dialog .gridMenu a, .ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu .lnkExtraDetails, .ui-dialog .gridMenu a { padding-top: 0; padding-bottom: 0; } 
  .lnkCancelDetails {
    float: left;
    font-size: 0.8em;
    text-align: center;
    border: solid 1px transparent;
    border-radius: 20px;
    background-color: var(--bg);
    padding: 0.7em 1em;
    color: var(--txt-color);
    opacity: 0.9;
    font-weight: bold;
    min-width: 60px;
    width: fit-content !important;
    cursor: pointer;
    margin-right: 8px;
    text-shadow: 0px 0px 4px var(--bg);
} .lnkCancelDetails:hover {
    background: var(--hover);
    color: var(--txt-color);
  }
  .lnkRejectDetails{
    float: left;
    border-radius: 20px;
    font-size: 0.8em;
    border: 1px solid #FF6666;
    padding: 0.7em 1em;
    text-transform: none;
    text-align: center;
    color: #FF6666;
    font-weight: bold;
    min-width: 60px;
    width: fit-content !important;
    cursor: pointer;
    margin-right: 8px;
    background: var(--bg);
  }
  .lnkRejectDetails:hover{
    color: white !important;
    background-color: #f75959;
  }
  .lnkSaveDetails:hover, .lnkSaveAndNewDetails:hover, .lnkExtraSaveDetails:hover {
    background: var(--bg) !important;
    color: var(--txt-color) !important;
    font-w
} .ui-layout-east > .ui-layout-content > *:not(.ui-layout-container) .gridMenu .lnkCancelDetails, .ui-dialog .gridMenu a {
    padding-top: 0;
    padding-bottom: 0;
} .lnkSaveDetails:hover, .lnkExtraDetails:hover, .lnkExtraSaveDetails:hover, .lnkThirdSaveDetails: hover, .lnkFourthSaveDetails: hover, .lnkSaveAndNewDetails:hover, .lnkCancelDetails:hover {
    color: #ececec;
}
/* end refactoring */
.gridFilter {padding: 0px;width: 500px;} .ui-tooltip.gridFilter { border: none;} .gridFilter .arrow.left { width: 10px;} .gridFilter .arrow:after {height: 15px;left: 3px;} .ui-dialog {
    padding: 0px;
    border-radius: 3px;
    max-width: 99.9%;
    margin-left: 5px;
    margin-right: 5px;
} .ui-dialog.bubbleDialog {
    margin-left: 0px;
    margin-right: 0px;
} .ui-dialog .ui-dialog-buttonpane {

        border-radius: 0px 0px var(--border-radius-xl) var(--border-radius-xl);
        padding: .3em 0.5em 0.5em 0.4em;
        background: var(--dialog-bg);
        position: relative;
    } .ui-dialog .ui-dialog-buttonpane button {
            border: 1px solid #192d5c;
            border-radius: var(--border-radius-sm);
            color: #192d5c;
            cursor: pointer;
            font-size: 0.7em;
            font-weight: bolder;
            margin: 1px 5px 1px 0;
            padding: 3px 5px;
        } .ionbiz-button:hover {
    background: #192d5c !important;
    color: white !important;
} .ui-dialog .ui-dialog-buttonpane button.ionbiz-button-confirm {
    border: 1px solid var(--menu-hover) !important;
    background: var(--bg) !important;
    border-radius: var(--border-radius-sm);
    color: var(--menu-hover) !important;
} .ui-dialog .ui-dialog-buttonpane button.ionbiz-button-confirm:hover {
            border: 1px solid var(--menu-hover);
            color: var(--bg) !important;
            background: var(--menu-hover) !important;
   } .ui-dialog .ui-dialog-buttonpane button.ionbiz-button-delete {
    border: 1px solid #FF6666;
    background: var(--bg);
    border-radius: var(--border-radius-sm);
    color: #FF6666;
} .ui-dialog .ui-dialog-buttonpane button.ionbiz-button-delete:hover {
        border: 1px solid #FF6666;
        background: #FF6666 !important;
        
        color: white !important;
    } .ui-dialog .ui-dialog-buttonpane button.ionbiz-button-cancel {
    border: 1px solid transparent;
    margin: 1px 1px 1px 0 !important;
    background: var(--bg);
    color: var(--txt-color);
    opacity: 0.9;
    text-transform: none;
    border-radius: var(--border-radius-sm);
    text-shadow: none;
} .ui-dialog .ui-dialog-buttonpane button.ionbiz-button-cancel:hover{
            background: var(--hover) !important;
            color: var(--txt-color) !important;
        } .ui-dialog.modalMaximized {
            width: 100% !important;
            max-width: 100% !important;
            height: 100% !important;
            max-height: 100% !important;
            border-radius: 0px !important;
            /* Pin full-screen so jQuery UI's inline re-centering (on refresh/resize) can't offset it */
            top: 0 !important;
            left: 0 !important;
            margin: 0 !important;
        } .ui-dialog.modalMaximized .ui-dialog-content {
    max-width: 100% !important;
    height: calc(100% - 120px) !important;
    max-height: calc(100% - 120px) !important;
} .ui-dialog .ui-dialog-buttonpane > .progress > .tasks {
    color: var(--txt-color);
    font-size: 10px;
} .ui-dialog .ui-dialog-buttonpane > .progress > .timeText {
    float: right;
    color: var(--txt-color);
    font-size: 10px;
} .ui-dialog .ui-dialog-buttonpane > .progress > .current {
    float: left;
    color: #FFB733;
    font-size: 10px;
} .ui-dialog .ui-dialog-buttonpane > .progress > .separator {
    float: left;
    margin: 0 2px 0 2px;
    font-size: 10px;
    color: #999999;
} .ui-dialog .ui-dialog-buttonpane > .progress > .count {
    float: left;
    color: var(--dark-green);
    font-size: 10px;
} .ui-dialog .ui-dialog-buttonpane > .progress > .time {
    float: right;
    color: var(--txt-color);
    font-size: 10px;
} .ui-dialog .ui-dialog-buttonpane > .progress > .ionBiz-progressbar {
    margin: 0px 40px 0px 40px;
    /* No label inside this one, so it is a slimmer rail; colour drives track + fill. */
    color: var(--dark-green);
    height: 8px;
} .ui-dialog .ui-dialog-buttonpane > .progress > .ionBiz-progressbar > .percent {
    width: 0%;
    opacity: 1;
} .gridFilter .header, .ui-dialog .ui-dialog-titlebar {
        background-color: var(--dialog-bg);
        height: 40px;
        color: var(--txt-color);
        text-indent: 20px;
        line-height: 27px;
        font-weight: bold;
        border-radius: 4px 4px 0px 0px;
        font-size: 0.8em;
    } 
 .ui-dialog #titleMarkupHolder a {
    position: relative;
    font-size: 14px;
    float: right;
    margin-right: 10px;
}
  .ui-dialog #titleMarkupHolder .icon-add:before{ font-size: 14px; content:"\e600";}
.ui-dialog #titleMarkupHolder {
    float: right;
    margin-right: 32px;
} .ui-dialog #titleMarkupHolder a:hover:before { 
    color:  #9E9E9E;
} .gridFilter .ui-tooltip, .arrow:after {
     background: none;
     background-color: var(--east-bg);
}
.userSubMenu .arrow:after, .ui-tooltip .arrow::after {
    background-color: var(--bg);
}
.bubbleDialogHolder .gridFilter .ui-tooltip, .arrow.left:after{
        background-color: var(--bg);
    } .ui-dialog .ui-dialog-titlebar {
        height: 25px;
        z-index: 1;
    } .ui-dialog .ui-button {
    border: 0px;
    background-color: var(--bg);
    cursor: pointer;    
} .ui-dialog-titlebar-close{
    background-color: transparent !important;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
} .ui-dialog .ui-dialog-titlebar-close .ui-button-text {
    display: none;
} .ui-dialog .ui-button .ui-icon-closethick {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    border: 0px;
    cursor: pointer;
    line-height: 1;
    overflow: visible;
    text-indent:0px;
} .ui-dialog .ui-button .ui-icon-closethick:before {
        font-family: 'ionbiz' !important;
        content: "\e622";
        font-size: 12px;
        display: block;
        line-height: 1;
        text-indent:0px !important;
        color: var(--txt-color);
        opacity: 0.7;
    }
  .ui-dialog .ui-button .ui-icon-closethick:hover:before, .btnClosePanel:hover:before{
      color: var(--red);
  }
  .ui-dialog .ui-dialog-content {
    padding: 8px 8px 8px 8px !important;
    background: var(--dialog-bg);
    border-radius: var(--border-radius-sm);
    display: flex;
    flex-direction: column;
}
.ui-dialog .ui-dialog-content:has(div[style="float:left; width:50%;"]){ /*forms like the Settings > Resources > Departments*/
    display: block;
}
[id^="btnGroupBy"] {
    flex-direction: row !important;
    display: inline-block !important;
} .btnMaxPanel, .btnMinPanel, .btnClosePanel {
    width: 104px;
    padding: 27px 0px 4px 0px;
    margin-bottom: 8px;
    /* background-image: url("../Content/Themes/Blue/img/mainMenu.png?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc");*/
    background-repeat: no-repeat;
    cursor: pointer;
} .btnMaxPanel {
    padding: 0px 10px 0px 0px;
    width: 18px;
    height: 18px;
    /*float: right;
    background-position: -971px -4px;
    text-indent: -9999px;*/
} .btnMinPanel {
    padding: 0px 10px 0px 0px;
    width: 18px;
    height: 18px;
    /*float: right;
    background-position: -941px -4px;
    text-indent: -9999px;*/
} .btnMinPanel:before {
        font-family: 'ionbiz' !important;
        content: "\e63b";
        font-size: 14px;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    } .btnMaxPanel:before {
    font-family: 'ionbiz' !important;
    content: "\e63a";
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
} .btnClosePanel:before {
    font-family: 'ionbiz' !important;
    content: "\e622";
    font-size: 14px;
    opacity:0.7;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
} #btnMaxModal {
    position: relative;
    overflow: visible;
    width: auto;
    min-width: 20px;
    height: 20px;
    padding: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    float: none;
    cursor: pointer;
    margin: 0;
}
/* Lay the titlebar controls out in a single flex row so they can never overlap. */
.ui-dialog:has(#btnMaxModal) .ui-dialog-titlebar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-right: 4px;
}
.ui-dialog:has(#btnMaxModal) .ui-dialog-title {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
}
.ui-dialog:has(#btnMaxModal) .ribbon-saved-filters-btn,
.ui-dialog:has(#btnMaxModal) .ribbon-classic-view-btn { order: 1; }
.ui-dialog:has(#btnMaxModal) #titleMarkupHolder {
    order: 2;
    float: none;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-right: 0 !important;
}
/* ionBiz.dialogs.js emits #titleMarkupHolder straight after #btnMaxModal; same specificity as the
   :has() form it replaces, without re-matching every link in the dialog on each DOM change. */
.ui-dialog #btnMaxModal ~ #titleMarkupHolder a {
    float: none;
    margin-right: 0;
    display: flex;
    align-items: center;
    line-height: 1;
}
.ui-dialog #btnMaxModal ~ #titleMarkupHolder a:before {
    display: block;
    line-height: 1;
}
/* The fixed top in base.css only lines up in the non-flex titlebar. */
.ui-dialog:has(#btnMaxModal) .ui-dialog-titlebar:before {
    top: 50%;
    transform: translateY(-50%);
    line-height: 1;
}
.ui-dialog:has(#btnMaxModal) #btnMaxModal { order: 3; }
.ui-dialog:has(#btnMaxModal) .ui-dialog-titlebar-close {
    order: 4;
    position: static;
    margin: 0 0 0 8px;
    width: auto;
    min-width: 20px;
} .ui-dialog #btnMaxModal:before {
    display: block;
    line-height: 1;
} .ui-dialog:not(.modalMaximized) #btnMaxModal:before {
    font-family: 'ionbiz' !important;
    content: "\e63a" !important;
    font-size: 12px;
    font-weight: 100;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
} .ui-dialog.modalMaximized #btnMaxModal:before {
    font-family: 'ionbiz' !important;
    content: "\e63b" !important;
    font-size: 12px;
    font-weight: 100;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
} #btnMaxModal ~ #titleMarkupHolder {
    margin-right: 0!important;
} .btnClosePanel {
    padding: 0px 10px 0px 0px;
    width: 18px;
    height: 18px;
} .btnMaxPanel:hover::before {color: var(--menu-hover);} .btnMinPanel:hover::before { color: var(--menu-hover) !important;} .btnClosePanel:hover { content:"\e63b";} .changePassHolder {
    padding: 0px 60px 0px 60px;
    color: var(--txt-color);
    font-size: 12px;
    width: 100%;
    text-align: center;
    margin-top: -15px;
    box-sizing: border-box;
} .changePassHolder:before {
    font-size: 45px;
} .changePassHolder #changePassFields {
    padding-top: 15px;
} .resetUserPreferenceHolder {
    color: var(--txt-color);
    padding: 0px 30px 0px 30px;
    font-size: 70px;
    width: 100%;
    text-align: center;
    /* margin-top: -15px;
    margin-bottom: 15px;*/
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
} .changePassHolder .title, .resetUserPreferenceHolder .title {
        /* color: #fff;*/
        font-size: 18px;
        text-align: center;
        padding: 17px 0px 15px 0px;
    } .resetUserPreferenceHolder .title {
        /* color: #fff;*/
        font-size: 18px;
        text-align: center;
        padding: 8px 0px 23px 0px;
    } .userSubMenuHolder .changePassHolder input, .resetUserPreferenceHolder input {
        float: none;
        width: 275px;
        height: 35px !important;
        border: solid 1px var(--bg-border);
        border-radius: var(--border-radius-sm);
        text-align: center;
    }
.changePassHolder input.changePassBtn, .changePassHolder a.changePassBtn, .userSubMenuHolder .resetUserPreferenceHolder input.resetPreferenceBtn {
    float: none;
    border: 1px solid var(--menu-hover);
    text-transform: uppercase;
    color: var(--menu-hover) !important;
    background: var(--bg);
    font-size: 12px;
    font-weight: bolder;
    border-radius: var(--border-radius-sm);
    cursor: pointer;
    padding: 8px 15px 8px 15px;
    width: auto;
    box-shadow: none;
    display: inline-block;
    line-height: 1 !important;
} .changePassHolder input.changePassBtn:hover, .changePassHolder a.changePassBtn:hover, .resetUserPreferenceHolder input.resetPreferenceBtn:hover {
    background: var(--menu-hover) !important;
    color: var(--bg) !important;
} .changePassHolder input[data-checkbox="true"][type="checkbox"] + label {
    font-size: 12px;
    width: auto;
    padding-left: 3px;
    margin-top: 12px;
} .changePassHolder input[data-checkbox="true"][type="checkbox"] + label:after {
    position: relative;
    top: 2px;
    font-style: normal;
    font-weight: bold;
    color: var(--txt-color);
} .input-validation-error, .ionbizdetails .detailInput input[readonly].input-validation-error {
    outline-color:Red!important;
    outline-style: solid !important;
    outline-offset:-1px;
    outline-width: thin !important;
    background-color:#fbe6eb !important;
} #changePasswordForm .input-validation-error::placeholder, #loginForm .input-validation-error::placeholder {
    color: red;
    font-weight: bold;
    border-color: #fbe6eb !important;
    outline-color:#fbe6eb !important;
    outline-style: solid !important;
    outline-width: thin !important;
} #loginForm input {
    font-weight:600;
    margin-bottom: 1px;
    margin-left: 0px;
    margin-top: 0px;
    outline-offset: -1px !important;
    outline-style: solid;
    outline-color: var(--bg-border-light);
    outline-width: thin;
} #changePasswordForm .valid {
    background-image: url("../Content/Themes/Blue/img/check_ok_green.png?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc");
    background-position: 300px center;
    background-repeat: no-repeat;
} #changePasswordForm #btnResetTotp {
    margin-bottom: 10px;
} .changePassTxt {
    font-size: 11px;
    color: var(--txt-color);
    opacity:0.8;
    float: left;
    width: 100%;
    padding: 0px 0px 25px 0px;
} .resetPreferenceTxt {
    font-size: 12px;
    color: var(--txt-color);
    opacity:0.8;
    float: left;
    width: 100%;
    padding: 0px 0px 25px 0px;
} .newPassHolder {
    float: none;
    width: 277px;
    clear: both;
    margin: 10px auto;
    border-top: solid 1px var(--bg-border);
    padding: 10px 0px 0px 0px;
} .changePassBtnHolder {
    float: none;
    display: block;
    width: 100%;
    clear: both;
    margin: 34px 0px 0px 0px;
} .changePassLogoutBtnHolder {
    float: none;
    display: block;
    width: 100%;
    clear: both;
    margin: 10px 0px 0px 0px;
} .resetPreferenceBtnHolder {
    float: none;
    display: block;
    width: 100%;
    clear: both;
    margin: 23px 0px 0px 0px;
} #changePassResult {
    font-size: 12px;
} #changePassResult .changePassBtnHolder {
    margin-top: 20px;
} #changePassResult div {
    margin: 13px 0;
} div#loginActivity {
    position: relative;
    height: calc(100% - 118Px);
    box-sizing: border-box;
} div#loginActivity ul {
    min-height: 30px;
    max-height: calc(100% - 300px);
    display: inline-block;
    overflow-y: auto;
    margin: 10px 0 0px 0;
} .loginBody {
    background-color: var(--east-bg);
} .loginHolder {
    width:inherit;
    height: 325px;
    position: absolute;
    left: 0px;
    padding: 10px;
    border-radius: 3px;
    box-sizing: border-box;
    top: calc(50% - 165px);
} .loginBox.mfaManage .loginHolder {
    top: calc((100% - 450px) / 2);
} .loginBox.setUpTotp .loginHolder {
    top: calc((100% - 455px) / 2);
} .loginBox.forgotPassword .loginHolder {
    top: calc((100% - 500px) / 2);
} 
.loginLogo {
    width: 100%;
    text-align: center;
    margin: 20px 0px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
.loginLogo:has(.holderNotification){
    flex-direction: column;
}
.customerLogoForLoginpage {
    margin-left: 20px;
    border-radius:8px;
} .loginBody .mfaManage {
    width: 450px;
} .loginBody .mfaManage .loginHolder {
    width: 449px;
} .loginBody .mfaManage p {
    color: var(--txt-color);
    line-height: 19px;
} .loginBody .mfaManage h2 {
    padding-left: 1px !important;
} .loginBody .mfaManage ul.lstBrowsers {
    list-style-type: none;
    margin-top: 0px;
    margin-bottom: 5px;
    padding-right: 10px;
    padding-left: 18px;
    overflow: auto;
    max-height: 253px;
} .loginBody .mfaManage ul.lstBrowsers > li {
    margin: 10px 0;
    border: 1px solid var(--bg-border);
    padding: 7px;
    border-radius: 5px;
    word-break: break-word;
    color: var(--txt-color);
} .loginBody .mfaManage #btnSetUpTotpAdditional {
    margin-top: 10px;
} .loginBody .setUpTotp p {
    color: var(--txt-color);
    line-height: 19px;
} .loginBody .setUpTotp .qrCode {
    text-align: center;
    padding: 15px 0 10px;
} .loginBody .setUpTotp .qrCode img {
    border: 1px solid var(--bg-border);
    cursor: default;
} .loginBody #mfaForm p {
    color: var(--txt-color);
    line-height: 19px;
} .loginBody #mfaForm button {
    background: var(--menu-hover) !important;
    color: var(--bg) !important;
    margin-right: 7px;
    border-color: var(--menu-hover) !important;
} .loginBody #mfaForm #loginHelperHolder {
    width: 100%;
    margin: 10px 0 0 0;
    box-sizing: border-box;
    padding-left: 7px;
} .loginBody #mfaForm #loginHelperHolder a {
    width: 100%;
    box-sizing: border-box;
    border: 0;
    line-height: 18px;
} form .loginAPIBox .loginInputHolders, .loginInputHolders {
    float: left;
    clear: both;
    width: 100%;
    padding: 10px;
    border-radius: var(--border-radius-md);
    border: solid 1px transparent;
} form .loginAPIBox .loginInputHolders input, .loginInputHolders input {
    float: none;
    clear:both;
    width: 100%;
    clear: both;
    height: 40px!important;
    border: 0px;
    background-color: var(--bg);
    text-indent: 10px;
} form .loginAPIBox .loginInputHolders .username, .loginInputHolders .username {
    background-position: 3px center;
    background-repeat: no-repeat;
} form .loginAPIBox .loginInputHolders .password, form .loginAPIBox .loginInputHolders .email, .loginInputHolders .password, .loginInputHolders .email {
    background-position: 6px center;
    background-repeat: no-repeat;
    border-top: solid 1px var(--bg-border);
    /*border-radius:0;*/
} form .loginAPIBox #AccessDuration {
    float: none;
    margin: 6px auto;
    display: block;
    height: 30px;
    padding: 5px;
    width:65%;
} form .loginAPIBox .btnAction {
    float: none;
    margin: 14px auto;
    display: block;
} .loginInputHolders .password.reset {
    border-top: none;
} 
.btnLoginHolder {
    float: left;
    width: 100%;
    margin: 10px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.mfaManage .btnLoginHolder{
    flex-direction:column;
}
.mfaManage #btnResetTotp{
    margin-top: 10px;
}
.btnLoginHolder a.gray {
    
} 
#btnLogin {
    width: 40% !important;
}
#btnLogin:focus, #btnLogin:focus-visible{
    outline: none !important;
}
#loginActivity .password{
    margin-top: 2px;
    border-top: none;
}
.btnLoginHolder #btnLogin, #forgotPassBtnHolder input {
    width: 100%;
    height: 30px;
    line-height: 27px;
    background-color: var(--blue);
    color: #fff;
    text-align: center;
    margin-top: 1px;
    margin-bottom: 1px;
    margin-left: 1px;
    font-size: 12px;
    font-weight: 700;
    border: 0px !important;
} #forgotPassBtnHolder, #forgotPassBtnHolder input {
    box-sizing: border-box;
    width: inherit;
} .rememberMe, .forgotPass {
    float: left;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 0px;
    height: 30px;
    line-height: 22px;
    box-sizing: border-box;
    text-indent: 30px;
    background-repeat: no-repeat;
    color: var(--txt-color);
} .rememberMe:before {
    width: 50%;
    color: #888888;
    font-family: 'ionbiz';
    font-style: normal;
    font-size: 16px;
    vertical-align: middle;
    content: "\e93e";
    position: absolute;
    left: -10px;
    cursor: pointer;
    display: inline-block;
    height: 19px;
    float: left;
    margin: 2px 4px 0 0;
    min-width: 17px;
    vertical-align: middle;
    line-height: 18px;
} .rememberMe.on:before {
    font-family: 'ionbiz';
    font-style: normal;
    font-size: 16px;
    vertical-align: middle;
    content: "\e601";
    color: var(--txt-color);
    position: absolute;
    left: -10px;
} .rememberMe + .forgotPass {
    width: 50%;
    float:right;
} .recoverPasswordMessage {
    font-size: 12px;
    color: #192d5c;
    padding: 10px 0 20px 0;
    font-weight: bold;
    border-top: 1px solid #ccc;
} .recoverPassword {
    font-size: 18px;
    color: #192d5c;
    padding: 10px 0 10px 0;
    font-weight: bold;
} .ieWarning {
    position: absolute;
    top: 81%;
    left: 0px;
    color: #b4b4b4;
    margin-left: 10px;
    font-size: 0.9em;
} .ieWarning span {
    font-weight: bold;
} .ieWarning p {
    margin-top: 8px;
} .loginCopyright {
    position: absolute;
    top: 90%;   
    color: #b4b4b4;
    width: 100%;
    text-align: center;
} .loginCopyright a {
    color: var(--menu-hover);
    margin: 0px 5px;
    opacity:0.7;
} .loginCopyright a:hover {
    color: var(--txt-color);
} .loginBox {
    position: absolute;
    top: 0px;
    left: calc(50% - 178px);
    height: 100%;
    width: 380px;
    min-height: 290px;
} .loginBox .error {
    font-weight: bold;
    padding-top: 5px;
} .loginAPIBox {
    position: fixed;
    left: calc(50% - 157px);
    height: 100%;
    width: 380px;
    min-height: 290px;
    /*border: 1px solid lightgray;*/
} .loginAPIBox .loginLogo .holderNotification {
    margin: 0px;
} .ui-autocomplete {
    z-index: 10000001 !important;
    margin-top: 5px;
    padding: 0px 8px 0px 0;
    border: solid 1px var(--bg-border);
    border-radius: var(--border-radius-sm);
    background-color: var(--bg);
    box-sizing: border-box; /* Opera/IE 8+ */
    overflow-y: auto;
    overflow-x: hidden;
    text-overflow:clip;
    width: auto;
    max-height: 287px;
    max-width: calc(100% - 20px);
    box-shadow: 0px 4px 10px 0px var(--shaddow);
}
.ui-autocomplete li.ui-menu-item {
        box-sizing: border-box;
        height: 30px;
        width: calc(100% - 2px) !important;
        padding: 0;
        margin: 5px 5px !important;
        overflow: hidden;
        white-space: nowrap;
        border-radius: var(--border-radius-md);
        padding-left: 5px;
        background-repeat: no-repeat;
        background-position: left center;
        background-size: 2px 0%;
        transition: background 0.1s;
        text-overflow: clip;/*ellipsis does not work in safari*/
    }

 .ui-autocomplete li.invoicingBlocked a span, .ui-autocomplete li.invoicingBlocked a span em {
    color: red;
    font-style: italic;
} .ui-autocomplete li.ui-menu-item[data-id="-3"] {
    background-color: transparent;
} .ui-autocomplete li.ui-menu-item[data-id="-3"] span { font-style: italic; font-weight: bold;color:#192d5c;} .ui-autocomplete li.ui-menu-item[data-id="-1"] span, .ui-autocomplete li.ui-menu-item[data-id="-4"] span { font-style: normal; font-weight: bold;color:var(--menu-hover);} .ui-autocomplete li a > span:before {
     margin-right: 10px;
     font-family: "ionbiz";
     font-size: 11px;
     color: #96938E;
  } .ui-autocomplete li a > .RelationIcon:before {
     content:  "\e618";
     color: var(--blue);
  } .ui-autocomplete li a > .ItemIcon:before {
    content:  "\e928";
    color: var(--blue);
} .ui-autocomplete li a > .LeadIcon:before {
     content:  "\e68c";
     color: var(--blue);
  } .ui-autocomplete li a > .QuoteIcon:before {
     content:  "\e616";
     color: var(--dark-green);
  } .ui-autocomplete li a > .ContactIcon:before {
     content:  "\e620";
     color: #D2691E;
  } .ui-autocomplete li a > .ResourceIcon:before {
    content: "\e620";
    color: #FFA500;
} .ui-autocomplete li a > .PhoneIcon:before {
    content: "\e661";
    color: var(--blue);
} .ui-autocomplete li a > .ActivityIcon:before {
    content: "\e920";
    color: var(--blue);
} .ui-autocomplete li a > .ProjectIcon:before {
    content:  "\e615";
    color: var(--blue);
} .ui-autocomplete li a > .ContractLineIcon:before {
    content: "\e682";
    color: var(--blue);
} .ui-autocomplete li a > .ContractExtraLineIcon:before {
    content: "\e682";
    color: #CC9D05;
} .ui-autocomplete li a > .InvoiceIcon:before {
     content:  "\e611";     
  } .ui-autocomplete li a > .IssueIcon:before {
     content:  "\e61a";     
  } .ui-autocomplete li a {
    clear: both;
    cursor: pointer;
    padding: 1px 0.4em 0px 3px !important;
    line-height: 32px !important;
    white-space: nowrap;
    display: inline;
    font-size: 12px;
    font-weight:500;
} .ui-autocomplete li .rating {
    padding: 0;
    display: inline-block;
    float: right;
    border: none;
    height: inherit;
    margin: 0 10px 0 0;
    width: auto;
} .rating input.star { display: none;float: right; } label.star {
    display: inline-block;
    float: right;
    margin-left: 2px;
    font-size: 11px;
    color: var(--txt-color);
    transition: all .2s;
    font-family: ionbiz;
    cursor: pointer;
} label.star:hover { transform: rotate(-15deg) scale(1.3); } label.star:before {
    font-family: ionbiz;
    content: "\e93e";
} input.star:checked ~ label.star:before {
    content: "\e941";
    color: var(--menu-hover);
    transition: all .25s;
}
/* Multi-select picker should never render narrower than 200px, even when the
   originating input is small (e.g. a narrow chip editor). The .closeList width
   is set in JS from ul.outerWidth(), so it follows the ul automatically. */
ul.ui-autocomplete.ui-menu-multiple-selection { min-width: 200px; }
.ui-autocomplete.ui-menu-multiple-selection li a span {
    margin-left: 20px;
} 
/*
    positioning fix for Firefox bug https://bugzilla.mozilla.org/show_bug.cgi?id=488725
*/
.ui-autocomplete li a > input[type="checkbox"] {
    height: 17px;
    position: absolute;
    left: 3px;
    top: 2px;
} .ui-autocomplete-input.iconAC {
    padding-right: 21px !important;
    width: 100%;
    background-repeat: no-repeat;

    cursor: default;
}
.ionbizdetails.editMode .detailInput:has(.ui-autocomplete-input.iconAC:not(.hide,[readonly=true],[readonly="readonly"])):not(:has(.halfWidth)):after,
.ionbizdetails:not(.editMode) .detailInput:where(:focus-within):has(.iconAC:not(.hide,[readonly]):focus-visible):after,
.bubbleDialogHolder .detailInput:has(.ui-autocomplete-input.iconAC):after,
.ui-dialog .w33Procent .detailInput:has(> .ui-autocomplete-input.iconAC):after,
.bubbleDialogHolder .ionbizdetails.editMode .w60:has(select):after,
.bubbleDialogHolder .detailInput:has(select):not(:has(.w60)):after,
.cell:has(.ui-autocomplete-input.iconAC):after,
.cell:has(select):after {
    font-family: 'ionbiz' !important;
    content: "\e944";
    font-size: 10px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: table-cell;
    vertical-align: middle;
    right: 10px;
    position: absolute;
    z-index: 1;
    pointer-events: none;
    top: -1px;
    opacity: 0.6;
}
.ionbizdetails.editMode .detailInput > .halfWidth:has(.ui-autocomplete-input.iconAC:not(.hide)):after {
    font-family: 'ionbiz' !important;
    content: "\e944";
    font-size: 10px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: table-cell;
    vertical-align: middle;
    left: calc(50% - 20px);
    position: absolute;
    z-index: 1;
    pointer-events: none;
    top: 0px;
    opacity: 0.6;
}
.ionbizdetails.editMode .detailInput:has(.twoElements60And40PercentWidth.ui-autocomplete-input.iconAC):after,
.ionbizdetails.editMode .detailInput:has(select.twoElements60And40PercentWidth):not(:has(input.twoElements60And40PercentWidth)):after {
    left: calc(60% - 17px) !important;
}
tr[editable="1"] td > span:has(.ui-autocomplete-input.iconAC):after, tr[editable="1"] td:has(select.editable):after {
    font-family: 'ionbiz' !important;
    content: "\e672";
    font-size: 10px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: table-cell;
    vertical-align: middle;
    left: calc(100% - 26px);
    position: absolute;
    z-index: 1;
    pointer-events: none;
    top: 4px;
    opacity: 0.6;
}
tr[editable="1"] td:has(select.editable) {
    position: relative !important;
}
tr[editable="1"] td:has(select.editable):after{
    left: calc(100% - 28px) !important;
    top: 6px;
}
/* Both containing blocks are positioned, so stretching to their full height centres the
   caret without a per-height top offset. */
.jqGrid tr[editable="1"] td > span:has(.ui-autocomplete-input.iconAC):after,
.jqGrid tr[editable="1"] td:has(select.editable):after {
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
}
tr[editable="1"] td > span:has(.ui-autocomplete-input.iconAC):has(.shortcut-autocomplete):after {
    left: calc(100% - 51px) !important;
}
.cell:has(.ui-autocomplete-input.iconAC):after,
.cell:has(select):after {
    left: 84% !important;
    top: 52%;
}
.cell:has(.ui-autocomplete-input.iconAC.ui-autocomplete-loading):after {
    top: 40px !important;
    left: 83% !important;
}
/* The `.ionbizdetails.editMode` variants of the :has(select) and :has(.iconAC) selectors
   are subsets of the two below, so they only cost an extra :has() evaluation. */
.bubbleDialogHolder .detailInput:has(select):not(:has(.w60)):after,
.bubbleDialogHolder .ionbizdetails.editMode .detailInput:has(.hasDatepicker:not(.navigateDatePicker)):after,
.bubbleDialogHolder .detailInput:has(.ui-autocomplete-input.iconAC):after {
    right: 13% !important;
}
.bubbleDialogHolder .detailInput:has(.ui-autocomplete-input.iconAC.ui-autocomplete-loading):after {
    left: calc(90% - 20px) !important;
}
.bubbleDialogHolder .ionbizdetails.editMode .w60:has(select):after { /*Day Scale field*/
    left: 61% !important;
}
.detailInput:has(.ui-autocomplete-input.iconAC.ui-autocomplete-loading):after,
.cell:has(.ui-autocomplete-input.iconAC.ui-autocomplete-loading):after,
tr[editable="1"] td > span:has(.ui-autocomplete-input.iconAC.ui-autocomplete-loading):after {
    border: 1px solid var(--bg-border);
    content: "" !important;
    border-top: 1px solid var(--menu-hover);
    border-radius: 50%;
    width: 15px;
    height: 15px;
    animation: spin 1s linear infinite;
    transform: translate(-50%, -50%);
    opacity: 1 !important;
    left: calc(100% - 20px);
}
/* Fixed-size box, so auto block margins centre it; the shared transform would then
   pull it half its height too high. */
.jqGrid tr[editable="1"] td > span:has(.ui-autocomplete-input.iconAC.ui-autocomplete-loading):after {
    top: 0;
    bottom: 0;
    margin-block: auto;
    transform: translateX(-50%);
}
.detailInput:has(.ui-autocomplete-input.iconAC.ui-autocomplete-loading):after{
    top: 21% !important;
}
.closeList { display: none; }
/*
    The .closeList is appended as a sibling of ul.ui-autocomplete inside .ui-menu-multiple-container.
    Its top / left / width are set inline from JS to align with the bottom edge of the ul (top = ul.bottom),
    so we keep position:absolute and avoid adding any positioning to the container itself. Structural
    properties (padding, full border, line-height, margin-top) are kept identical to the legacy rule
    so the JS-computed footprint and hit-testing behavior with the ul are preserved.
*/
ul.ui-autocomplete + .closeList {
    position: absolute;
    z-index: 1000;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    float: left;
    text-align: right;
    white-space: nowrap;
    line-height: 24px;
    padding: 5px 3px 3px 8px !important;
    margin-top: 1px;
    margin-bottom: 3px;
    background-color: var(--bg) !important;
    color: var(--txt-color);
    border: 1px solid var(--bg-border-light);
    border-bottom-left-radius: var(--border-radius-sm);
    border-bottom-right-radius: var(--border-radius-sm);
    box-shadow: 1px 2px 20px 4px var(--shaddow);
    font-weight: normal;
    font-size: 12px;
}
ul.ui-autocomplete + .closeList:has(:only-child) { justify-content: flex-end; }
ul.ui-autocomplete[style*="display: none"] + .closeList,
ul.ui-autocomplete[style*="display:none"] + .closeList { display: none !important; }

ul.ui-autocomplete + .closeList > label#apply {
    cursor: pointer;
    user-select: none;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    height: 26px;
    padding: 0 16px;
    margin: 0;
    margin-top: 4px;
    font-size: 12px;
    font-weight: 500;
    color: var(--txt-color);
    background: var(--east-hover);
    border: 1px solid var(--bg-border);
    border-radius: var(--border-radius-xl);
    border-top-right-radius: 0px;
    border-bottom-right-radius: var(--border-radius-sm);
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
@media (hover: hover) {
    ul.ui-autocomplete + .closeList > label#apply:hover {
        background: var(--hover);
    }
}
ul.ui-autocomplete + .closeList > label#apply:focus-visible {
    outline: 2px solid var(--menu-hover);
    outline-offset: 2px;
}

.ui-autocomplete + .closeList #selectAll {
    appearance: none;
    -webkit-appearance: none;
    margin: 0 0 0 4px;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    position: relative;
    background: var(--bg);
    color: var(--txt-color);
    border: 1.5px solid var(--txt-color);
    border-radius: 50%;
    cursor: pointer;
    display: grid;
    place-content: center;
}
.ui-autocomplete + .closeList #selectAll::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    transform: scale(0);
    transition: transform 0.1s ease-in-out;
    box-shadow: inset 1em 1em var(--menu-hover);
}
.ui-autocomplete + .closeList #selectAll:checked::before { transform: scale(1); }
.ui-autocomplete + .closeList #selectAll::after {
    content: "All";
    position: absolute;
    left: calc(100% + 6px);
    top: 50%;
    transform: translateY(-50%);
    color: var(--txt-color);
    font-size: 12px;
    line-height: 1;
}
.ui-menu .ui-state-focus, .ui-menu .ui-state-active {
	margin: 0px!important;
} 
ul.ui-autocomplete li.ui-state-focus:not(.ui-state-disabled) {
    background-color: var(--hover);
    background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
    background-size: 2px 50%;
    background-repeat: no-repeat;
    background-position: left center;
    border-radius: var(--border-radius-xs);
}
ul.ui-autocomplete li:first-of-type{
    margin-top: 7px !important;
}
ul.ui-autocomplete li:last-of-type{
    margin-bottom: 7px !important;
}
ul.ui-autocomplete li.ui-state-disabled {
    background-color: transparent;
} ul.ui-autocomplete li.ui-state-disabled:hover, ul.ui-autocomplete li.ui-state-disabled span:hover, ul.ui-autocomplete li.ui-state-disabled a:hover {
    cursor: default!important;
    text-decoration: none;
    color: #666666;
} .ui-autocomplete .ui-menu-item em {
    font-style: normal;
    font-weight: 600;
    color: var(--menu-hover);
    background-color: var(--hover);
    padding: 0px 1px 0px 1px;
    border-radius: 4px;
} .ui-autocomplete li.ui-menu-item-parent.ui-state-disabled { font-style: italic;} .ui-menu-item-leveled:not(.ui-menu-item-parent) a span, .ui-menu-item-parent:not(first-of-type):last-of-type a span {
    color: var(--txt-color);
    font-style: normal;
} 

.ui-autocomplete li:last-of-type.ui-menu-item-parent a span:before {
    content: "";
}
/* ui-menu-has-level-1 is stamped by ionBiz.autocomplete.js _renderItem. */
.ui-autocomplete.ui-menu-has-level-1 .ui-menu-item-leveled-0 a{
    font-weight:700;
}
.ui-autocomplete .ui-menu-item-leveled-1 a {
    margin-left: 20px;
    font-weight:600;
} .ui-autocomplete .ui-menu-item-leveled-2 a {
    margin-left: 40px;
    font-weight:500;
} .ui-autocomplete .ui-menu-item-leveled-3 a {
    margin-left: 60px;
    font-weight:400;
} .ui-autocomplete .ui-menu-item-leveled-4 a {
    margin-left: 80px;
    font-weight:300;
} .ui-autocomplete .ui-menu-item-leveled-5 a {
    margin-left: 100px;
    font-weight:200;
} .ui-autocomplete .ui-menu-item-leveled-6 a {
    margin-left: 120px;
    font-weight:100;
} input.cancel {
    text-align: center;
    border: solid 1px transparent;
    border-radius: 2px;
    background-color: #666666;
    padding: 5px 15px;
    text-transform: uppercase;
    color: #fff;
    font-weight: bold;
    min-width: 80px;
    cursor: pointer;
} .paneHolder { height: inherit;} #detailsContainerNotes { height: calc(100% - 188px);} .darkHeader {
    float: left;
    width: 100%;
    height: 30px !important;
    margin: 0px !important;
    padding: 0px !important;
    font-size: 12px !important;
    line-height: 30px !important;
    font-weight: normal !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    border-radius: 0px;
    padding-left: 0em !important;
    text-shadow: none;
    color: #141414 !important;
    font-weight: bold !important;
    border-top: 3px solid var(--menu-hover);
} .headerIcon {
    float: left;
    height: inherit;
    white-space: nowrap;
}
/*Page speciffic overrides based on body.cssClass selector*/
.page_invoice #addDialog, .page_costsheet #addDialog { width: 460px;} .page_invoice #addDialog .maxWidth:first-child .addBox, .bubbleDialogHolder:not([id^=btnAddIonBiz]) #addDialog .maxWidth:first-child .addBox, .page_timeline #addDialog .maxWidth:first-child .addBox {
    border-bottom: 0px;
} .bubbleDialogHolder:not([id^=btnAddIonBiz]) #addDialog, .page_timeline #addDialog {
    width: auto;
}
/*******************************************************
    [3] Note control
********************************************************/
#viewNotesRelations {
    float: left;
    margin: 10px 0;
    width: 100%;
} #addNoteRelations {
    float: left;
    margin: 10px 0;
    position: relative;
    width: 30%;
} #addNoteRelations #addNoteFormPlacer {
    float: left;
    position: fixed;
    width: 28%;
} .notesMainTable {
    background-color: #3991A4;
    border-radius: 15px 15px 15px 15px;
    margin: 10px 0;
    table-layout: fixed;
    text-align: left;
    width: 100%;
} .notesMainTable thead {
    color: #FFFFFF;
    font-weight: bold;
} .notesMainTable thead .colAuthor {
    border-right: 2px solid #FAFAFA;
    padding: 7px;
    text-align: left;
    text-indent: 15px;
    width: 138px;
} .notesMainTable thead .colNote {
    padding: 7px;
} .notesMainTable thead .colTags {
    border-left: 2px solid #FAFAFA;
    padding: 7px;
    width: 200px;
} .notesMainTable .picAuthor {
    border: 2px solid #FFFFFF;
    border-radius: 5px 5px 5px 5px;
    max-height: 70px;
    max-width: 70px;
} .notesMainTable .picAuthorReaction {
    border: 1px solid #CCCCCC;
    border-radius: 3px 3px 3px 3px;
    float: left;
    height: 35px;
    margin: 3px 5px 3px 0px;
    width: 35px;
} .notesMainTable .colNote {
    padding: 5px;
    text-align: justify;
    vertical-align: top;
} .notesMainTable .notesListHolder {
    background-color: #D7EEF3;
    border-radius: 9px 9px 9px 9px;
    padding: 10px;
} .notesMainTable .notesListHolder .notesListTable {
    border-radius: 5px 5px 5px 5px;
    color: #000000;
    margin-bottom: 5px;
    padding: 5px;
    table-layout: fixed;
    width: 100%;
} .notesMainTable .notesListHolder .notesListTable .noteHeader {
    background-color: #192d5c;
    background: -webkit-linear-gradient(#192d5c, #192d5c);
    background: -o-linear-gradient(#192d5c, #192d5c);
    background: -moz-linear-gradient(#192d5c, #192d5c);
    background: linear-gradient(#192d5c, #192d5c);
    border-radius: 5px 5px 5px 5px;
    color: #FFFFFF;
    font-weight: bold;
} .notesMainTable .noteBody {
    float: left;
    margin-top: 5px;
    width: 100%;
} .notesMainTable .noteAuthor {
    color: #4D92A1;
    font-weight: bold;
} .notesMainTable .noteDate {
    color: #4D92A1;
    float: right;
    font-weight: bold;
} .notesMainTable .notesListHolder .notesListTable .btnNoteHolder {
    float: right;
    margin: -3px 0 0;
    opacity: 0.6;
} .notesMainTable .notesListHolder .notesListTable .btnNoteHolder:hover {
    opacity: 1;
} .notesMainTable a.btnEditNote, .notesMainTable a.btnEditReact, .notesMainTable a.btnDeleteReact, .notesMainTable a.btnDeleteNote {
    color: #4D92A1 !important;
    white-space: nowrap;
} .notesMainTable .notesListHolder .notesListTable .btnReactNote {
    color: #4D92A1;
    float: left;
    white-space: nowrap;
} .notesMainTable .notesListHolder .notesListTable .btnEditNote:hover, .notesMainTable .notesListHolder .notesListTable .btnDeleteNote:hover, .notesMainTable .notesListHolder .notesListTable .btnReactNote:hover {
    text-decoration: underline;
} .notesMainTable .notesListHolder .notesListTable .btnEditNote:visited, .notesMainTable .notesListHolder .notesListTable .btnDeleteNote:visited, .notesMainTable .notesListHolder .notesListTable .btnEditReact:visited, .notesMainTable .notesListHolder .notesListTable .btnDeleteReact:visited, .notesMainTable .notesListHolder .notesListTable .btnReactNote:visited {
    color: #4D92A1;
} .notesMainTable .notesListHolder .notesListTable ul {
    float: left;
    font-size: 10px;
    list-style-type: circle;
    margin: 0;
    padding: 0;
    width: 75%;
    list-style-position: inside;
} .notesMainTable .notesListHolder .notesListTable ul li {
    float: left;
    margin: 0 3px 0 5px;
    padding: 0;
} .notesMainTable .notesListHolder .notesListTable ul li:first-child {
    list-style-type: none;
    margin-left: 5px;
} .notesMainTable .notesListHolder .notesListTable .reactionRow ul {
    padding: 3px 0;
} .notesMainTable .notesListHolder .notesListTable .noteHeader .colNote {
    padding: 2px 5px 5px;
} .notesMainTable .notesListHolder .notesListTable .noteHeader .colTags {
    border-left: 2px solid #FAFAFA;
    padding: 2px 5px 5px;
    vertical-align: top;
    width: 186px;
} .notesMainTable .notesListHolder .notesListTable .colNote {
    padding: 5px;
    text-align: justify;
    vertical-align: top;
} .notesMainTable .notesListHolder .notesListTable .colTags {
    border-left: 2px solid #FAFAFA;
    padding: 5px;
    vertical-align: top;
    width: 186px;
} .addNoteTableWrapper {
    position: relative;
} .addNoteForm {
    clear: both;
    height: 360px;
    width: 100%;
} .addNoteTable {
    background-color: #D7EEF3;
    border: 0 none;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 0 5px 5px #666666;
    display: none;
    padding: 5px;
    position: absolute;
    table-layout: fixed;
    width: 100%;
    z-index: 10;
} .notesMainTable .notesListHolder .notesListTable .noteHeader .colAuthor {
    border-right: 2px solid #FAFAFA;
    overflow: hidden;
    padding: 2px 5px 2px 0;
    text-align: left;
    white-space: nowrap;
    width: 130px;
} .addNoteTable .colNote {
} .addNoteTable .colNote textarea {
    width: 99.6%;
} .addNoteTable .colTags {
    border-left: 2px solid #FFFFFF;
    padding: 5px;
    vertical-align: top;
    width: 195px;
} .addNoteTable .colTags select {
    height: 85px;
    width: 100%;
} .addNoteTable .btnsRow {
    border-top: 2px solid #FFFFFF;
    padding-top: 10px;
} .btnAddNote {
    background-image: url("../Content/Themes/Blue/img/mainMenu.png?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc");
    background-position: -967px -129px;
    background-repeat: no-repeat;
    float: left;
    height: 19px;
    margin: -2px 3px;
    overflow: hidden;
    padding: 2px;
    text-indent: -9999px;
    width: 19px;
    border-radius: 50%;
} .btnAddNote:hover, .btnAddNote.active {
    background-color: rgba(205, 205, 205, 0.6);
} .privateNote {
    background-image: url("../Content/Themes/Blue/img/iconPrivateNote.png");
    background-position: left center;
    background-repeat: no-repeat;
    float: left;
    height: 16px;
    padding-left: 5px;
    width: 16px;
} .notesListTable .colTags .tagRow {
    clear: both;
    float: left;
    margin: 1px 0;
    width: 100%;
} .notesMainTable .noteHolder {
    clear: both;
    float: left;
    position: relative;
    width: 100%;
} .notesMainTable .imgHolder {
    position: absolute;
    width: 80px;
} .notesMainTable .txtHolder {
    margin-left: 80px;
    position: relative;
    top: 0;
} .notesPagination {
    float: left;
    width: 100%;
} .notesPagination .paginationLeft {
    color: #FFFFFF;
    float: left;
    font-weight: bold;
    padding: 8px 0 8px 20px;
    width: 40%;
} .notesPagination .paginationLeft a {
    background-color: #FFFFFF;
    border-radius: 3px 3px 3px 3px;
    box-shadow: 1px 1px 1px #333333;
    color: #000000;
    font-weight: bold;
    padding: 3px;
} .notesPagination .paginationLeft a:hover {
    background-color: #D7EEF3;
    box-shadow: 1px 1px 1px #333333 inset;
    color: #333333;
    text-decoration: none;
} .notesPagination .paginationLeft a.active {
    background-color: #CCCCCC;
    box-shadow: 1px 1px 1px #333333 inset;
    color: #333333;
    text-decoration: none;
    text-shadow: 1px 1px 1px #FFFFFF;
} .notesPagination .paginationRight {
    color: #FFFFFF;
    float: right;
    padding: 8px 20px 8px 0;
    text-align: right;
    width: 40%;
} .reactionItem {
    float: left;
    margin: 5px 0 0;
    overflow: hidden;
    width: 100%;
    /*max-height: 73px;*/
} .reactionRow {
    background-color: #FFFFFF;
    float: left;
    width: 100%;
} .reactionAuthor {
    color: #4D92A1;
    float: left;
    font-weight: bold;
    padding: 5px 0 0;
    text-indent: 5px;
    width: 65%;
} .reactionDate {
    color: #4D92A1;
    float: right;
    font-weight: bold;
    padding: 5px 5px 0 0;
    text-align: right;
    width: 30%;
} .reactionBody {
    position: relative;
    width: 98%;
    padding: 5px;
} .reactionBody p { margin: 0px;padding: 0px;} .reactReadMore {
    color: #4D92A1;
    float: right;
    font-size: 10px;
    padding: 3px 5px 0 0;
} .reactReadMore:hover {
    text-decoration: underline;
} .addReactNoteWrapper {
    background-color: #FFFFFF;
    float: left;
    margin: 5px 0 0;
    padding: 5px 0;
    width: 100%;
} .btnsItemShadow {
    box-shadow: 0 -13px 15px -5px #FFFFFF;
} .formHolder {
    float: left;
    width: 100%;
}
/*******************************************************
    [4] Settings Menu
********************************************************/
#treeviewAccordion {
    margin-top: 10px;
    background: var(--east-bg);
    border-radius: var(--border-radius-md);
    border: 1px solid var(--bg-border);
}
#treeviewAccordion h3:last-of-type{
    border-bottom:1px solid transparent;
}
#treeviewAccordion h3:last-of-type:hover{
    border-bottom-left-radius: var(--border-radius-md);
    border-bottom-right-radius: var(--border-radius-md);
}
#treeviewAccordion h3:first-of-type:hover{
    border-top-left-radius: var(--border-radius-md);
    border-top-right-radius: var(--border-radius-md);
}
#treeviewAccordion ul {
    list-style-type: none;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 15px;
    font-size: 13px;
    /*font-weight: bold;*/
} #treeviewAccordion ul ul {
    border-left: solid 1px transparent;
} 
#treeviewAccordion ul li a {
        padding: 5px;
        /*padding-left: 8px;*/
        display: block;
        width: calc(100% - 3px);
        height:20px;
        line-height:20px;
        color: var(--txt-color);
        background-repeat: no-repeat;
        background-position: left center;
        background-size: 2px 0%;
        transition: background 0.1s;
        opacity: 0.9;
        text-indent: 5px;
}
#treeviewAccordion ul li a:hover {cursor: pointer; }
#treeviewAccordion ul li .inactiveItem {
        margin: 0px 0px 0px -21px;
        padding: 0px 0px 0px 21px;
        display: block;
        width: 100%;
        color: #999999;
} 
#treeviewAccordion ul li .inactiveItem a:hover {
            padding: 5px 5px 5px 5px;
            border-radius: var(--border-radius-xs);
            border-top-left-radius: 4px;
            border-bottom-left-radius: 4px;
            background-color: var(--hover);
            background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
            background-size: 2px 50%;
            background-repeat: no-repeat;
            background-position: left center;
            width: calc(100% - 5px);
}

#treeviewAccordion ul li .activeItem {
    padding: 0px 0px 0px 21px;
    display: block;
    width: 100%;
    margin: 0px 0px 0px -21px;
    text-decoration: none;
    color: var(--bg);
    border-radius: var(--border-radius-xs);
    background-color: transparent;
}
#treeviewAccordion ul li .activeItem a {   
        text-decoration: none;
        font-weight: bold;
        background-color: var(--hover) !important;
        background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
        background-size: 2px 50%;
        background-repeat: no-repeat;
        background-position: left center;
        border-top-left-radius: 4px !important;
        border-bottom-left-radius: 4px !important;
        width: calc(100% - 5px);
        border-radius: var(--border-radius-xs);
}
#treeviewAccordion h3 {
        color: var(--txt-color);
        font-size: 12px;
        font-weight: bold;
        text-transform: uppercase;
        border-bottom: solid 1px var(--bg-border-light);
        padding: 10px 5px 10px 0px;
        text-indent: 5px;
        outline: none;
    } #treeviewAccordion h3.ui-accordion-header-active { border-bottom: solid 1px #edeef0; } #treeviewAccordion h3 .ui-accordion-header-icon {
    float: left; 
    width: 100%;
    height: inherit;
    text-indent: 0px !important;
    top: 15%;
    margin-top: 0;
    
} #treeviewAccordion h3:before, #treeviewAccordion h3 .ui-accordion-header-icon:after {
    font-family: "ionbiz";
    font-weight: normal;
    font-size: 16px;
    color: var(--txt-color);
}
#treeviewAccordion h3:hover{background: var(--bg);}
#treeviewAccordion h3:hover:before, #treeviewAccordion h3:hover .ui-accordion-header-icon:after { color: var(--menu-hover); } 
#treeviewAccordion h3.ui-accordion-header-active .ui-accordion-header-icon:before, #treeviewAccordion h3.ui-accordion-header-active .ui-accordion-header-icon:after { color: var(--red); } 
#treeviewAccordion h3.ui-accordion-header-active:hover .ui-accordion-header-icon:before, #treeviewAccordion h3.ui-accordion-header-active:hover .ui-accordion-header-icon:after { color: var(--red); }
/* after icons */
#treeviewAccordion h3.ui-accordion-header .ui-accordion-header-icon:after { content: "\e644";float: right;margin-right: 20px; margin-top:1px;} #treeviewAccordion h3.ui-accordion-header-active .ui-accordion-header-icon:after { content: "\e65f";float: right; margin-right:20px;}
/* before icons */
#treeviewAccordion h3:before {width: 24px;float: left;text-align: center;margin-top: -2px; } .activeItem { font-weight:normal;font-size: 13px;text-decoration: underline;} .paneTitle {
    float: left;
    clear: both;
    width: 100%;
    text-indent: 20px;
    border-top: solid 1px #ccc;
} .paneTitle h2 {
    color: #95938d;
    font-size: 14px;
    font-weight: bold;
} #pageTitle span.breadcrumb {
    color: #999999;
    text-transform: uppercase;
    float: left;
    text-indent: 20px;
} #pageTitle span { float: left;text-indent: 2px;} #pageTitle .child {padding: 0 4px;} #pageTitle .child:before { font-family: "ionbiz";font-size: 15px;font-weight: normal; content: "\e650";} #gridDetailName, #breadcrumbForm { color: #192d5c; white-space: nowrap; max-width: calc(100% - 120px); text-overflow: ellipsis; overflow: hidden;} #quickSearchHolder ~ #gridDetailName, #quickSearchHolder ~ #breadcrumbForm {
    color: #2F69F9;
    white-space: nowrap;
    max-width: calc(100% - 320px);
    text-overflow: ellipsis;
    overflow: hidden;
} .ui-dialog.deleteConfirmationDialog .bubbleDialogHolder {
    margin: 0px auto;
    text-align: left;
    font-size: 12px;
    font-weight: normal;
    color: var(--txt-color);
    min-height: inherit !important;
    line-height: 20px;
} .ui-dialog.deleteConfirmationDialog .ui-dialog-buttonpane .ui-button:not(.ionbiz-button-cancel, .ionbiz-button-confirm) {
    border: 1px solid #FF6666;
    color: #FF6666;
    background-color: transparent;
} .ui-dialog.deleteConfirmationDialog .ui-dialog-buttonpane .ui-button:not(.ionbiz-button-cancel):hover {
        border: 1px solid #FF6666;
        color: white;
        background-color: #f75959;
    } .ui-dialog.deleteConfirmationDialog .bubbleDialogHolder .itemName {
    color: var(--red);
    text-decoration: none;
    float: none;
    width: 100%;
    padding-top:15px;
    font-weight:500;
} .ui-dialog.deleteConfirmationDialog .deleteBtnHolders {
    float: left;width: 100%;
    padding-top: 20px;
} .btnNo {
    display: inline-block;
    padding: 5px;
    background-color: #999999;
    color: #ffffff;
    font-weight: bold;
    text-decoration: none;
    border-radius: 4px;
    margin: 0px 3px;
    text-align: center;
    min-width: 50px;
} .btnYes {
    display: inline-block;
    padding: 6px 5px;
    background-color: #ff6666;
    color: #ffffff;
    font-weight: bold;
    text-decoration: none;
    border-radius: 4px;
    margin: 0px 3px;
    text-align: center;
    min-width: 50px;
} .bubble, .pBubble {
    background-clip: padding-box;
    background-color: #FFFFFF;
    border: 1px solid var(--bg-border);
    border-radius: var(--border-radius-sm);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    color: var(--txt-color);
    display: none;
    float: left;
    /*font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;*/
    font-size: 10px;
    left: 0;
    line-height: 16px;
    list-style: none outside none;
    min-width: 130px;
    position: absolute;
    top: 100%;
    z-index: 10002;
    padding: 5px;
    visibility: visible;
} .bubble:before {
    border-color: -moz-use-text-color rgba(0, 0, 0, 0) rgba(0, 0, 0, 0.2);
    border-color: transparent transparent rgba(0,0,0,0.2) transparent;
    border-style: none solid solid;
    border-width: 0 7px 7px;
    content: "";
    display: inline-block;
    position: absolute;
} .bubble:after {
    border-color: -moz-use-text-color rgba(0, 0, 0, 0) #FFFFFF;
    border-color: transparent transparent #FFFFFF transparent;
    border-left: 6px solid rgba(0, 0, 0, 0);
    border-right: 6px solid rgba(0, 0, 0, 0);
    border-style: none solid solid;
    border-width: 0 6px 6px;
    content: "";
    display: inline-block;
    position: absolute;
} .bubble.orient-left:before {
    left: 6px;
} .bubble.orient-left:after {
    left: 7px;
} .bubble.orient-right:before {
    right: 6px;
} .bubble.orient-right:after {
    right: 7px;
} .bubble.orient-top:before {
    top: -7px;
} .bubble.orient-top:after {
    top: -6px;
} .bubble.orient-bottom:before {
    border-bottom: 0 none;
    border-top: 7px solid #999999;
    bottom: -7px;
} .bubble.orient-bottom:after {
    border-bottom: 0 none;
    border-top: 6px solid #FFFFFF;
    bottom: -6px;
} .bubble ul, .bubble ol { margin: 0px;padding: 0px;float: left;clear: both;font-size: 11px;} .bubble ul li, .bubble ol li {border-radius: 10px; list-style:  none outside none;float: left;width: auto;padding: 0 2px;width: 15px;text-align: center;cursor: pointer;} .bubble ol li { clear: both;float: left;} .bubble ol .selected, .bubble .hour.selected, .bubble .minute.selected { background-color: var(--blue); } .bubble li.hour, .bubble li.minute {clear: none; } .bubble ol li.prefix.meridian { clear: none;} .detailsheader {
    font-size: 1.2em;
    color: #666666;
    float: left;
    width: 100%;
    padding: 0.9em 0.5em;
    background-color: #f5f5f5;
    border-bottom: solid 1px #cccccc;
    box-sizing: border-box;
}
/*******************************************************
    [6] Notes
********************************************************/
.publicNote {
    background-color: var(--bg);
    float: left;
    width: 100%;
} .publicNote.off {
    background-image: none;
    background-color: var(--hover);
    float: left;
    width: 100%;
} .note .head.publicNote { background-color: inherit; border-radius: var(--border-radius-xl)} .note .head.publicNote.off { background-color: var(--hover) !important;position: sticky;} .publicNote .btnNoteState {
    float: left;
    width: 12px;
    height: 16px;
    left: -45px;
    position: relative;
    top: 90px;
    width: 14px;
    font-family: "ionbiz";
    color: var(--dark-green);
} .publicNote input[data-publiccheckbox="true"] {display: none;} .note .head.publicNote .noteState {
    float: right;
    width: 15px;
    height: 22px;
    margin: 0px 5px;
    font-family: "ionbiz";
    color: var(--dark-green);
} .publicNote:not(.off) .btnNoteState:before, .publicNote:not(.off) .noteState:before { content: "\e638"; } .publicNote.off .btnNoteState:before, .publicNote.off .noteState:before, .publicNote.off + .noteState:before { content: "\e639";color: var(--red);font-family: ionBiz; } .publicNote.off + .noteState:before {
    margin-left: -32px;
    margin-top: 18px;
    float:left;
} .headerIcon:before {content: "\e63f";} .addNoteBox {
    float: left;
    width: calc(100% - 90px);
    margin: -5px 0px 15px 0px;
    border-radius: var(--border-radius-md);
    border: solid 1px var(--bg-border-light);
    position: relative;
    background-color:var(--bg);
} .addNoteBox:before {
	right: calc(100% - 1px);
	top: 40px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(204, 204, 204, 0);
	border-right-color: var(--bg-border);
	border-width: 7px;
	margin-top: -7px;
} .addNoteBox:after{
	right: calc(100% - 2px);
	top: 40px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(255, 255, 255, 0);
	border-right-color: var(--bg);
	border-width: 7px;
	margin-top: -7px;
} .addNoteBox textarea {
    float: left;
    width: 100%;
    border: 0px;
    background-color: transparent;
    resize: none;
    height: 70px;
    outline: none;
    border-bottom: solid 1px #e5e5e5;
} .addNoteBox .mce-edit-area {
    overflow:hidden;    
    height: 101px!important;} .addNoteBox input {
    outline: none;
    float: left;
    width: calc(100% - 30px);
    border: 0px;
    background-color: transparent;
    resize: none;
    height: 28px;
} .avatar {
    float: left;
    width: 55px;
    height: 55px;
    position: relative;
    background-size: cover;
    border-radius: 50%;
    border: solid 1px var(--bg-border);
    background-repeat: no-repeat;
    background-position: center;
    margin: 23px 10px 0px 10px;
    background-color: var(--east-bg);
} .lblTo {
    float: left;
    color: #cccccc;
    padding: 11px 5px;
    font-size: 11px;
} 
.addNoteBox > .lblTo {
border-top: 1px solid var(--bg-border-light);
padding-top: 14px;
}
.addNoteBox > ul.token-input-list-facebook{
    border: 1px solid var(--bg-border-light);
    background-color: var(--bg);
    width: auto;
    overflow: hidden;
    border-bottom-color: transparent;
    border-right-color: transparent;
    padding-top:3px;
    padding-left: 5px;
}
.addNoteBox > ul.token-input-list-facebook:after{
    margin-right: 5px;
}
/* Reserve the focus border and pin margins so focusing the "To" input doesn't grow/shift the row. */
.addNoteBox ul.token-input-list-facebook li input,
.addNoteBox ul.token-input-list-facebook li input:focus{
    border: 1px solid transparent !important;
    margin: 2px 0 3px 0 !important;
}
.noteAttachAndButtons {
    float: right;
    width: calc(100% - 90px);
    margin: 0px 10px 5px 0px;
    display: flex;
    align-items: center;
    gap: 6px;
} .noteAttachAndButtons a {
    text-decoration: underline !important;} .uploadimage-dragndrop {
    border: dashed 1px var(--bg-border);
    float: left;
    height: 29px;
    width: calc(100% - 200px);
    border-radius: var(--border-radius-sm);
    margin: 0 0.4em 0.4em 0;
    text-indent: 28px;
    line-height: 28px;
    color: var(--txt-color-muted);
    white-space: nowrap;
    overflow: hidden;
    background-color: var(--east-bg);
} .uploadimage-dragndrop:before {
    font-family: "ionbiz";
    content: "\e60a";    
    float: left;
    font-size: 14px;
    text-indent: 10px;
    width: 20px;
    color: var(--dark-green);
}
.replayToButtons .uploadimage-dragndrop{
    width: calc(100% - 175px);
}
.uploadimage-progress {
    float: right;
    width: calc(100% - 90px);
    margin-right: 10px;
    color: #666666;
} .uploadimage-upload {
    float: left;
    width: 100%;
} .uploadimage-fileinfo {
    float: right;
    width: calc(100% - 90px);
    margin-right: 10px;
    padding: 0px 10px 10px 30px;
    box-sizing: border-box;
    position: relative;
} .uploadimage-fileinfo:before {
    font-family: "ionbiz";
    font-size: 24px;
    font-weight: normal;
    color: var(--txt-color);
    position: absolute;
    left: 0;
}
  .noteList .uploadimage-fileinfo:before{
      top:5px;
  }
.uploadimage-fileinfo.iconUnkown:before { content: "\e626";} .uploadimage-fileinfo.iconImage:before { content: "\e629";} .uploadimage-fileinfo.iconDoc:before { content: "\e62a";} .uploadimage-fileinfo.iconPdf:before { content: "\e633";} .uploadimage-fileinfo.iconZip:before { content: "\e62c";} .uploadimage-fileinfo.iconMovie:before { content: "\e62b";} .uploadimage-fileinfo.iconExcel:before { content: "\e627";} .uploadimage-progressbar {
    background: #cccccc;
    height: 1px;
} .uploadName {
    float: left;
    width: calc(100% - 20px);
    line-height: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
a.uploadName:hover{
    color:var(--menu-hover);
}
.uploadName:hover {
    text-decoration: underline;
} .lnkType {
    float: left;
    color: var(--txt-color);
    opacity:0.6;
    font-size:11px;
} .uploadSize {
    float: left;
    color: var(--txt-color);
    opacity:0.6;
    font-size:11px;
    padding-left: 5px;
} .uploadimage-fileinfo.loading:after {
    border: 1px solid var(--bg-border);
    content: "" !important;
    border-top: 1px solid var(--menu-hover);
    border-radius: 50%;
    width: 25px;
    height: 25px;
    animation: spin 1s linear infinite;
    transform: translate(-50%, -50%);
    opacity: 1 !important;
    position:absolute;
    left: calc(100% - 70px);

} .btnRemoveLink {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 8px;
} .btnRemoveLink:before {
    font-family: "ionbiz";
    font-weight: normal;
    content: "\e651";
    font-size: 12px;  
    color: var(--txt-color);
} .btnRemoveLink:hover { cursor: pointer;} .noteHolder {
    box-sizing: border-box;
    border-radius: var(--border-radius-xl);
    border: 1px solid transparent;
    overflow: hidden;
    padding: 0;
    float: left;
    width: 100%;
    height: 100%;
} .ui-tabs-panel .noteHolder {
    height: calc(100% - 40px);
} .gridMenu + .noteHolder {
    height: calc(100% - 40px);
} .ui-dialog-content .gridMenu + .noteHolder {
    height: calc(100% - 32px);
} .noteList {
    float: left;
    width: 100%;
    height: calc(100% - 40px);
    box-sizing: border-box;
    padding: 0px;
    margin-top: 5px;
    overflow: auto;
    /* Firefox re-anchors scroll when the reply box expands under a sticky .head, causing a scroll jump on click; disable scroll anchoring. */
    overflow-anchor: none;
} .ui-tabs-panel > .noteList { padding: 0px 5px 0px 0px;} .ui-dialog-content > .noteList {
    height: calc(100% - 40px);    
} .replayToNote {
    background-color: var(--bg);
    float: left;
    width: calc(100% - 25px);
    margin-left:20px;
    margin-top: 0px;
    margin-bottom: 20px;
    border-radius: 0px;
    border-bottom-left-radius:var(--border-radius-xl);
    border-bottom-right-radius: var(--border-radius-xl);
    border-top-color: transparent !important;
    position: relative;
    container-type: inline-size;
    container-name: replyPill;
}
.note a.icon-interface, .note a.icon-empty-star, .note a.icon-unread{
    opacity: 0;
    pointer-events: none;
    width: 1px;
}
.note:hover a.icon-interface, .note:hover a.icon-empty-star, .note:hover a.icon-read, .note:hover a.icon-unread {
    opacity: 1;
    pointer-events: auto;
    width:35px;
}
/* Compact reply bar is always visible; the full editor grows downward from the same spot once the user starts a reply (until Cancel). */
.replayToNote:not(.expanded) > form {
    display: flex;
}
.replayToNote.expanded > form {
    display: flex;
}
.replayToNote .avatar {
    width: 28px;
    height: 28px;
    margin: 25px 8px 0px 5%;
      display: flex;
  justify-content: center; /* Center horizontally */
  align-items: center;

} .replyToBox > .replyToBody {
    float: left;
    width: calc(100% - 15px);
    border: 0px;
    resize: none;
    outline: none;
    padding: 6px 0px 0px 15px;
    min-height: 50px;
    line-height: 11px;
    font: var(--font);
    font-size:100%;
    background: var(--east-bg);
    border-radius: var(--border-radius-sm);
}
.replyToBox > .replyToBody:has(p):not(:empty){
    min-height: 100px;

}
.replayToNote .replyToBox > .replyToBody:not(.mce-edit-focus, .mce-content-body):after {
    content: attr(placeholder);
    position: absolute;
    top: calc(50% - 8px);
    color: var(--txt-color);
    font-size:12px;
    
} .replyToBox {
    float: left;
    width: calc(95% - 50px);
    padding:1px;
    margin: 8px 0px 3px 0px;
    border-radius: var(--border-radius-sm);
    border: solid 1px var(--bg-border);
    position: relative;
    background-color: var(--bg);

} .replyToBox > .replyToBody.mce-edit-focus {
        border: 0px solid var(--bg-border) !important;
        border-top-left-radius: 8px !important;
        min-height:100px;
        outline: none !important;
        background-color: var(--bg) !important;
    } .noteBody {
    border-bottom: 1px solid var(--bg-border-light);
    border-right: 1px solid var(--bg-border-light);
    border-top-width: 0px !important;
    border-left-width: 0px !important;
    min-height: 100px;
    padding-top: 0px !important;
    padding-left: 10px;
    box-sizing: border-box;
    width: calc(100% + 1px);
    margin-top: 3px;
    box-shadow: none;
    outline: none !important;
    border-radius: 0px;
    font: var(--font);
    font-size:100%;
} .replyToBox > .mce-panel {
    height: inherit !important;
    float: left;
    border-top-width: 0px!important;
    overflow: hidden;} .replyToBox:before {
	right: calc(100% - 0px);
	top: 30px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(204, 204, 204, 0);
	border-right-color: var(--bg-border);
	border-width: 7px;
	margin-top: -5px;
} .replyToBox:after{
	right: calc(100% - 0px);
	top: 30px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(255, 255, 255, 0);
	border-right-color: var(--east-bg);
	border-width: 6px;
	margin-top: -4px;
} .replyToBox label, .addNoteBox label {
    top: 13px;
    left: 10px;
    z-index: 1;
    color: var(--txt-color);
    position: absolute;
    font-size: smaller;
} .replyToBox .mce-panel {
    border-width: 0 !important;
    border-radius: var(--border-radius-l);    
}
.replayToNote #previews{
    width: calc(90% - 63px);
}
.mce-btn.toolbarOn + label {
    display: none;
} .addNoteBox > label{ 
    top: 4px;
    position: relative;
    display: inline-block;
    height: 16px!important;
    z-index:0;
} .addNoteBox span {color: var(--txt-color); opacity:0.8; } 
  .addNoteBox > #toolbarHolder,
  .replyToBox > .replyToolbarHolder:has(.mce-panel){
    width: calc(100% - 10px);
    height: 34px;
    position: absolute;
    right: 0;
    overflow: hidden;
    border-radius: 0px 8px 0px 0px;
}
.replyToBox > .replyToolbarHolder:has(.mce-panel){
    top: auto;
    bottom: 0;
    left: 0;
    right: auto;
    width: 100%;
    border-radius: 0px 0px 8px 0px;
    border-top: 1px solid var(--bg-border-light);
    z-index: 1;
    /* Opaque so content scrolling behind this strip is masked, not shown through. */
    background: var(--bg);
}
/* Add-note toolbar flows in place just below the editor (above the "To" row). */
.addNoteBox > #toolbarHolder{
    position: relative;
    top: auto;
    right: auto;
    left: 0;
    width: 100%;
    border-radius: 0;
    margin-top: 5px;
}
/* Keep the last line of the reply clear of the bottom-anchored toolbar. */
.replyToBox > .replyToBody.mce-content-body{
    padding-bottom: 34px !important;
    /* Once the body scrolls (max-height reached), keep the caret clear of the
       bottom toolbar and the top edge instead of resting under them. */
    scroll-padding-bottom: 44px;
    scroll-padding-top: 8px;
}
.replyToBox > .replyToolbarHolder:not(:has(.mce-panel)){
    width:5px;
  }
.addNoteBox > #toolbarHolder > .mce-panel,
  .replyToBox > .replyToolbarHolder > .mce-panel{
        width: inherit!important;
        position: absolute;
        z-index: 1;
        display: flex;
        justify-content: flex-end;
        background-color: transparent !important;
    }
    .replyToBox > .replyToolbarHolder > .mce-panel,
    .addNoteBox > #toolbarHolder > .mce-panel{
         justify-content: flex-start !important;
    }
    .addNoteBox > #toolbarHolder > .mce-panel{
         left: 0;
    }
    /* Only the bottom-anchored new-reply toolbar; not when editing an existing reply in place (.comment). */
    .replayToNote .replyToBox > .replyToolbarHolder > .mce-panel{
         left: -5px !important;
         padding-top: 5px;
    }
.notes .mce-panel { 
    border:0px solid transparent;
    height: inherit!important;   
}
/* Mobile: let the notes toolbar scroll horizontally instead of clipping tools. */
@media (max-width: 768px) {
    .addNoteBox > #toolbarHolder,
    .replyToBox > .replyToolbarHolder:has(.mce-panel){
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }
    .addNoteBox > #toolbarHolder > .mce-panel,
    .replyToBox > .replyToolbarHolder > .mce-panel{
        position: relative !important;
        width: max-content !important;
        min-width: 100%;
    }
    .notes .mce-panel .mce-container-body,
    .notes .mce-panel .mce-toolbar,
    .notes .mce-panel .mce-flow-layout{
        white-space: nowrap !important;
    }
    .notes .mce-panel .mce-flow-layout-item{
        display: inline-block !important;
        float: none !important;
        vertical-align: middle;
    }
}
/* App-level overrides for TinyMCE dialog chrome (avoid patching the vendor skin.min.css). */
.mce-window-head {
    border-bottom: 1px solid transparent !important;
}
.mce-foot {
    border-top: 1px solid transparent !important;
    border-bottom-left-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
}
.mce-window-head .mce-title {
    font-size: 12px !important;
    text-transform: uppercase;
    color: var(--txt-color) !important;
} .note .mce-btn button {padding: 0px 6px;} .uploadimage-dragndrop-small {
   /* border-left: dashed 1px #b9c0c5;*/
    float: right;
    height: 37px;
    width: 33px;
    margin: 0px;
    color: var(--txt-color-muted);
} .uploadimage-dragndrop-small:before {
    font-family: "ionbiz";
    content: "\e60a";    
    float: left;
    font-size: 14px;
    height: inherit;
    padding-top: 10px;
    text-align: center;
    width: inherit;
} .formSubmit, .formCancel, .formReactSubmit, .formReactCancel {
    line-height: 27px;
    border-radius: var(--border-radius-sm);
    color: var(--menu-hover);
    border: 1px solid var(--menu-hover);
    background: transparent;
    cursor: pointer;
    float: right;
    font-size: 0.8em;
    font-weight: bold;
    margin-left: 4px;
    padding: 0em 1em;
    text-align: center;
    text-transform: none;
    text-indent: 0px;
    min-height: 27px;
    min-width:60px;
}
  .formSubmit, .formReactSubmit{
    background: var(--menu-hover) !important;
    color: var(--bg) !important;
  }
.formSubmit:hover, .formReactSubmit:hover {
        outline: var(--bg-border);
        color: var(--txt-color) !important;
        background: transparent !important;
    } .replayToButtons {
        float: right;
        clear: both;
        width: calc(95% - 50px);
        padding-bottom: 8px;
        padding-right: 12px;
        display: flex;
        align-items: center;
        gap: 6px;
    } .replayToButtons .formReactCancel, .formCancel {
            background: transparent;
            border: 1px solid transparent;
            color: var(--txt-color);
            opacity: 0.9;
            text-shadow:none;
            text-transform: none;
} .replayToButtons:hover .formReactCancel:hover, .formCancel:hover {
   background: var(--hover);
}
/* Post/Cancel on the left, drag-and-drop upload strip on the right */
.noteAttachAndButtons .formSubmit,
.noteAttachAndButtons .formCancel,
.replayToButtons .formReactSubmit,
.replayToButtons .formReactCancel {
    float: left;
    margin-left: 0;
    margin-right: 4px;
}
.noteAttachAndButtons .uploadimage-dragndrop,
.replayToButtons .uploadimage-dragndrop {
    float: right;
    margin: 0 0 0.4em 0.4em;
}
/* Action rows: Post/Cancel keep their size; the drag-drop strip fills the rest and shrinks on smaller screens. */
.noteAttachAndButtons .formSubmit,
.noteAttachAndButtons .formCancel,
.replayToButtons .formReactSubmit,
.replayToButtons .formReactCancel {
    float: none;
    margin-right: 0;
    flex: 0 0 auto;
}
.noteAttachAndButtons .uploadimage-dragndrop,
.replayToButtons .uploadimage-dragndrop {
    float: none;
    order: 1;
    flex: 1 1 auto;
    min-width: 40px;
    width: auto;
    margin: 0;
}
.replayToNote .replayToButtons {
    width: calc(95% - 50px);
}
/* --- Compact "reply in thread" pill: resting/hover state before the editor is expanded --- */
.replayToNote:not(.expanded) > form {
    align-items: center;
    gap: 10px;
    width: fit-content;
    max-width: calc(100% - 10px);
    min-height: 40px;
    margin: 0px 5px;
    padding: 4px 16px;
    box-sizing: border-box;
    border: 1px solid var(--bg-border-light);
    border-radius: 999px;
    border-top-left-radius: 0px;
    background: var(--east-bg);
}
.note:hover .replayToNote:not(.expanded) > form {
    background: color-mix(in srgb, var(--menu-hover) 8%, transparent);
}
.replayToNote:not(.expanded) .avatar {
    width: 28px;
    height: 28px;
    min-width: 28px;
    margin: 0;
    flex: 0 0 auto;
}
.replayToNote:not(.expanded) .replyToBox {
    flex: 0 1 auto;
    width: auto;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    display: flex;
    align-items: center;
}
.replayToNote:not(.expanded) .replyToBox:before,
.replayToNote:not(.expanded) .replyToBox:after {
    content: none;
}
.replayToNote:not(.expanded) .replyToBox > .replyToBody {
    width: auto;
    min-width: 0;
    min-height: 0;
    padding: 0;
    line-height: 1.4;
    border: 0;
    background: transparent;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.replayToNote:not(.expanded) .replyToBox > .replyToBody:not(.mce-edit-focus, .mce-content-body):after {
    position: static;
    top: auto;
    color: var(--txt-color);
    opacity: 0.5;
    font-size: 13px;
}
.replayToNote:not(.expanded) #previews,
.replayToNote:not(.expanded) .replayToButtons,
.replayToNote:not(.expanded) .replyToolbarHolder {
    display: none;
}
/* Quick-reply emoji shortcuts: only shown on the collapsed reply pill */
.replyShortcuts {
    display: none;
}
.replayToNote:not(.expanded) .replyShortcuts {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    flex: 0 0 auto;
}
.replyShortcutDivider {
    width: 1px;
    align-self: stretch;
    margin: 4px 4px;
    background: var(--bg-border);
}
.replyShortcut {
    border: 0;
    background: transparent;
    cursor: pointer;
    padding: 2px 5px;
    font-size: 15px;
    line-height: 1;
    border-radius: 999px;
    transition: background-color 0.15s ease, transform 0.15s ease;
}
.replyShortcut:hover {
    background: var(--hover);
    transform: scale(1.15);
}
@media (hover: none) {
    .replyShortcut:hover {
        background: transparent;
        transform: none;
    }
}
/* Emoji-picker button shows three dots. */
.replyShortcutMore::before {
    content: "\2026";
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 1;
    color: var(--txt-color);
}
/* --- Per-note AI actions (Summarise / Translate), gated by chatbot availability --- */
/* Icon color for the Summary and Translate rows in the note actions menu only (scoped via
   noteAiIcon, so these glyphs elsewhere, e.g. #btnTranslateAll, keep their default color). */
.contextMenuPlugin .noteAiIcon.icon-translate:before,
.contextMenuPlugin .noteAiIcon.icon-list-items:before {
    color: var(--icon-bg);
}
/* Translate language submenu. */
.contextMenuPlugin.noteAiMenu > li > a {
    padding-left: 12px;
}
.contextMenuPlugin.noteAiMenu > li > a > div {
    display: none;
}
.contextMenuPlugin.noteAiMenu .noteAiLangDefault {
    font-style: normal;
    font-size: 11px;
    opacity: 0.55;
}
#noteAiDialog {
    overflow: auto;
}
/* The app makes every .ui-dialog-content a column flexbox; as a flex item the body
   would otherwise SHRINK to the visible height and its text would paint past the
   rounded background. Keep it content-sized so #noteAiDialog scrolls instead. */
#noteAiDialog .noteAiBody {
    flex: 0 0 auto;
}
/* AI-ish pink/purple glow around the note AI dialog only. */
.ui-dialog.noteAiDialogWrap {
    border: thin solid rgba(139, 92, 246, 0.35);
    box-shadow:
        0 0 0 1px rgba(139, 92, 246, 0.25),
        0 0px 34px rgba(236, 72, 153, 0.28),
        0 8px 22px rgba(139, 92, 246, 0.22);
}
.noteAiBody {
    display: block;
    padding: 4px 2px;
    font-size: 13px;
    line-height: 1.5;
    min-height: 50px;
    white-space: pre-wrap;
    word-break: break-word;
    background: var(--bg);
    word-break: break-word;
    border-radius: var(--border-radius-md);
    padding: 8px;
    color: var(--txt-color);
}
/* Rendered markdown result: modern document typography instead of raw pre-wrap text. */
.noteAiBody--rendered {
    white-space: normal;
    padding: 14px 16px;
}
/* Tag-keyed rather than `> :first-child`: a bare pseudo-class subject is tested against every
   element in the document. Only the block tags marked() emits carry vertical margins, so
   anything unlisted is unaffected either way. */
.noteAiBody--rendered > p:first-child, .noteAiBody--rendered > div:first-child,
.noteAiBody--rendered > ul:first-child, .noteAiBody--rendered > ol:first-child,
.noteAiBody--rendered > pre:first-child, .noteAiBody--rendered > blockquote:first-child,
.noteAiBody--rendered > table:first-child, .noteAiBody--rendered > hr:first-child,
.noteAiBody--rendered > h1:first-child, .noteAiBody--rendered > h2:first-child,
.noteAiBody--rendered > h3:first-child, .noteAiBody--rendered > h4:first-child,
.noteAiBody--rendered > h5:first-child, .noteAiBody--rendered > h6:first-child { margin-top: 0; }
.noteAiBody--rendered > p:last-child, .noteAiBody--rendered > div:last-child,
.noteAiBody--rendered > ul:last-child, .noteAiBody--rendered > ol:last-child,
.noteAiBody--rendered > pre:last-child, .noteAiBody--rendered > blockquote:last-child,
.noteAiBody--rendered > table:last-child, .noteAiBody--rendered > hr:last-child,
.noteAiBody--rendered > h1:last-child, .noteAiBody--rendered > h2:last-child,
.noteAiBody--rendered > h3:last-child, .noteAiBody--rendered > h4:last-child,
.noteAiBody--rendered > h5:last-child, .noteAiBody--rendered > h6:last-child { margin-bottom: 0; }
.noteAiBody--rendered p { margin: 0 0 10px; }
.noteAiBody--rendered h1,
.noteAiBody--rendered h2,
.noteAiBody--rendered h3,
.noteAiBody--rendered h4 {
    margin: 16px 0 8px;
    line-height: 1.3;
    font-weight: 600;
}
.noteAiBody--rendered h1 { font-size: 1.35em; }
.noteAiBody--rendered h2 { font-size: 1.2em; }
.noteAiBody--rendered h3 { font-size: 1.08em; }
.noteAiBody--rendered h4 { font-size: 1em; }
.noteAiBody--rendered ul,
.noteAiBody--rendered ol {
    margin: 0 0 10px;
    padding-left: 22px;
}
.noteAiBody--rendered li { margin: 3px 0; }
.noteAiBody--rendered li > p { margin: 0; }
.noteAiBody--rendered a {
    color: var(--ion-biscay, #192D5C);
    text-decoration: underline;
}
.noteAiBody--rendered code {
    font-family: monospace;
    font-size: 0.9em;
    padding: 1px 5px;
    border-radius: var(--border-radius-xs);
    background: var(--menu-hover);
    color: var(--bg);
}
.noteAiBody--rendered pre {
    margin: 0 0 10px;
    padding: 10px 12px;
    overflow: auto;
    border-radius: var(--border-radius-md);
    background: var(--menu-hover);
}
.noteAiBody--rendered pre code {
    padding: 0;
    background: none;
}
.noteAiBody--rendered blockquote {
    margin: 0 0 10px;
    padding: 4px 12px;
    border-left: 3px solid var(--bg-border-light);
    color: var(--txt-color);
    opacity: 0.85;
}
.noteAiBody--rendered hr {
    border: 0;
    border-top: thin solid var(--bg-border-light);
    margin: 14px 0;
}
.noteAiBody--rendered table {
    border-collapse: collapse;
    margin: 0 0 10px;
}
.noteAiBody--rendered th,
.noteAiBody--rendered td {
    border: thin solid var(--bg-border-light);
    padding: 5px 9px;
    text-align: left;
}
.noteAiLoading {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--txt-color);
    opacity: 0.85;
}
/* Comet-style gradient ring spinner. */
.noteAiSpinner {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: conic-gradient(from 0deg, transparent 0turn, #8b5cf6 0.85turn, #ec4899 1turn);
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 0);
            mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 0);
    animation: noteAiSpin 0.8s linear infinite;
}
@keyframes noteAiSpin {
    to { transform: rotate(360deg); }
}
/* Screen-reader-only status text (visual loading is the spinner + skeleton). */
.noteAiSrOnly {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
/* Shimmering skeleton placeholder lines for the incoming result. */
.noteAiSkeleton {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 9px;
}
.noteAiSkelLine {
    height: 10px;
    border-radius: 6px;
    background: linear-gradient(90deg, var(--bg-border-light) 25%, rgba(139, 92, 246, 0.18) 50%, var(--bg-border-light) 75%);
    background-size: 200% 100%;
    animation: noteAiShimmer 1.4s ease-in-out infinite;
}
.noteAiSkelLine--short {
    width: 55%;
}
@keyframes noteAiShimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
/* Rotating AI-style gradient border shown while the dialog is fetching its result. */
@property --noteAiAngle {
    syntax: "<angle>";
    inherits: false;
    initial-value: 0deg;
}
.noteAiBody:has(.noteAiLoading) {
    position: relative;
    border-color: transparent;
    border-width: 2px;
    background:
        linear-gradient(var(--bg), var(--bg)) padding-box,
        conic-gradient(from var(--noteAiAngle), #6366f1, #8b5cf6, #ec4899, #22d3ee, #6366f1) border-box;
    animation: noteAiBorderSpin 2.5s linear infinite;
}
@keyframes noteAiBorderSpin {
    to { --noteAiAngle: 360deg; }
}
@media (prefers-reduced-motion: reduce) {
    .noteAiBody:has(.noteAiLoading) { animation: none; }
    .noteAiSpinner,
    .noteAiSkelLine { animation: none; }
}
/* --- Expanded reply editor: same pill container, just taller + focused --- */
.replayToNote.expanded > form {
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 8px 10px;
    width: 100%;
    min-height: 90px;
    margin: 0 5px;
    padding: 10px 16px;
    box-sizing: border-box;
    border: 1px solid var(--bg-border-light);
    border-radius: 16px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    border-right-color: transparent;
    border-bottom-color: transparent;
    background: var(--bg);
}
.replayToNote.expanded .avatar {
    width: 28px;
    height: 28px;
    min-width: 28px;
    margin: 10px 0 0 0;
    flex: 0 0 auto;
    order: 0;
}
.replayToNote.expanded .replyToBox {
    flex: 1 1 auto;
    min-height: 60px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    float: none;
    order: 1;
}
.replayToNote.expanded .replyToBox:before,
.replayToNote.expanded .replyToBox:after {
    content: none;
}
.replayToNote.expanded .replyToBox > .replyToBody {
    width: 100%;
    min-height: 100px;
    padding: 0px 0 0 0;
    border: 0;
    background: transparent;
}
.replayToNote.expanded #previews {
    flex: 0 0 100%;
    width: 100%;
    margin: 4px 0 0 40px;
    box-sizing: border-box;
    order: 2;
}
.replayToNote.expanded .replayToButtons {
    flex: 0 0 calc(100% - 40px);
    width: calc(100% - 40px);
    margin: 4px 0 0 40px;
    padding: 0;
    box-sizing: border-box;
    order: 3;
}
.pagination {
    float: left;
    width: 100%;
    height: 40px;
    line-height: 40px;
    border-top: 1px solid var(--bg-border-light);
    background-color: var(--east-bg);
} .pagInfo {
    float: left;
    width: 100%;
    padding-left: 5px;
    font-size:0.8em;
} .pagInfo span {
    float: left;
    width: auto;
    padding: 0px 3px;
} .pgBlue {
    color: #192d5c;
    font-weight: bold;
} .pagination .pagNav .btnPrev{
    background-image: url("../Content/Themes/Blue/img/ionBizGridSprite.png?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc");
    background-repeat: no-repeat;
    background-position: -1px -227px;
    float:left;
    width: 24px;
    height: 21px;
    text-indent: 25px;
    overflow: hidden;
} .pagination .pagNav .btnNext{
    background-image: url("../Content/Themes/Blue/img/ionBizGridSprite.png?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc");
    background-repeat: no-repeat;
    background-position: -47px -227px;
    float:left;
    width: 24px;
    height: 21px;
    text-indent: 25px;
    overflow: hidden;
} select.ddlPag {
    background-color: #6a6a6a;
    border: solid 1px #4e4e4e;
    border-radius: 3px;
    color: #FFFFFF;
    height: auto;
    padding: 3px 15px 3px 3px;
    /*font-family: arial;*/
    line-height: 11px;
    font-size: .8em;
    display: block;
    margin: 0;
    float: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    text-overflow: "";
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 0.01px;
    box-sizing: border-box;
    background-image: url('../Content/Themes/Blue/img/ionBizGridSprite.png?v=7mdQevJ9FE8aTY0KMeEVAEd0xzc');
    background-position: 98% -274px;
    margin: 0px 3px;
    float: left;
} .pagination .pagNav {
    width: auto;
    float: right;
    margin-right: 5px;
} .pagination .ddlPag {
    float: right;
    margin-right: 5px;
    cursor: pointer;
    color: var(--txt-color);
} .note {
    float: left;
    width: calc(100% - 20px);
    border: solid 1px var(--bg-border-light);
    /*box-shadow: 0 0 2px 0px var(--bg-border-light);*/
    border-radius: 0px;
    background-color: var(--bg);
    margin-bottom: 5px;
    box-sizing: border-box;
    position: relative;
    margin-left: 10px;
    margin-right: 10px;
}
.noteList .note:has(#addNoteForm){
    border-radius: var(--border-radius-xl) !important;
    border-bottom-left-radius: 0px !important;
    box-shadow: rgb(0 7 22 / 10%) 0px 2px 5px 0px;
}
.noteList:has(#addNoteForm) .note:nth-of-type(2){
    margin-top: 5px;
    border-top-left-radius: var(--border-radius-xl);
    border-top-right-radius: var(--border-radius-xl);
}
.noteList .note:first-of-type{
    margin-top: 5px;
    border-top-left-radius: var(--border-radius-xl);
    border-top-right-radius: var(--border-radius-xl);
}
.noteList .note:last-of-type{
    border-bottom-left-radius: var(--border-radius-xl);
    border-bottom-right-radius: var(--border-radius-xl);
}
.noteList .note:not(:first-of-type) .head.publicNote.off{
    border-radius:0px;
}
.noteList .note:first-of-type .head.publicNote.off{
    border-bottom-left-radius:0px;
    border-bottom-right-radius:0px;
}
.noteList .note:last-of-type:has(.body.hide) .head.publicNote.off{
    border-bottom-left-radius:var(--border-radius-xl);
    border-bottom-right-radius:var(--border-radius-xl);
}
.noteList .note.noNotesPlaceholder.clickable,
.noteList .note.noNotesPlaceholder.clickable .hInfo{
    cursor: pointer;
}
.noteList .note.noNotesPlaceholder.clickable:hover .username{
    color: var(--blue);
}
.noteHolder .pagInfo{
    /*background: var(--bg) !important;*/
}
.note .footer {
        float: left;
        width: 100%;
        border-top: solid 1px var(--bg-border-light);
        height: 32px;
        display: flex; /* Use flexbox to center content vertically */
        align-items: center; /* Center content vertically */
        justify-content: center; /* Center content horizontally */
        text-align: center;
    } .note .footer .more{
    text-align: center;
    padding: 5px 0px 5px 25px;
    line-height: 55px;
    font-weight: normal;
    color: var(--txt-color);
    opacity: 0.8;
} .note .footer .more:before{ font-family: "ionbiz";content: "\e662";font-size: 20px;font-weight: bold;display: inline-block;
    width: 30px;vertical-align: middle; color: var(--blue);}
  .note .footer .more span{
    color: #339900;
} .note .footer a.more:hover{
    opacity:1;
} .note .head {
        float: left;
        width: 100%;
        padding: 7px 0px 7px 5px;
        min-height:40px;
        box-sizing: border-box;
        background-color: var(--bg) !important;
        display:flex;
        align-items:center;
        /* Pin each note's header while scrolling through its body/replies */
        position: sticky;
        top: 0;
        z-index: 2;
        /* Reserve the pinned top border at rest (transparent) so pinning only changes its colour, never the header height — a height change here oscillates the sticky IntersectionObserver and makes the scroll jitter. */
        border-top: 1px solid transparent;
        transition: box-shadow 0.15s ease;
   }
   /* Elevation while the header is stuck to the top of the scrolling list */
   .note .head.pinned {
        box-shadow: 0 4px 6px -2px var(--shaddow);
        border-radius: 0px !important;
        border-top-color: var(--bg-border-light);
   }
   .note:hover .head.pinned{
    border-top-color: var(--bg-border);
   }
   /* No elevation when the note is collapsed (reply form hidden) */
   .note:has(.replayToNote.hide) .head.pinned {
        box-shadow: none;
        border-radius: var(--border-radius-xl) !important;
        border-top-color: transparent;
   }
  /* Firefox mishandles position:sticky when an ancestor (.noteEditPart) is display:contents, jittering the scroll on hover. Fall back to a non-sticky header there (class added from JS). The private-note rule sets its own position:sticky, so it must be overridden too. */
  .notes-no-sticky-head .note .head,
  .notes-no-sticky-head .note .head.publicNote.off {
        position: static;
        box-shadow: none !important;
        border-top-color: transparent !important;
  }
  /* Collapse wrapper box so the sticky header's range spans the whole note (body, comments, replies) */
  .noteEditPart {
        display: contents;
  }
  .note:not(:has(.noteEditPart)),  .note .head:not(:has(.ndate)){
      min-height:20px;
      font-size: 12px;
      border-radius: var(--border-radius-xl);
  }
  .note .head .hInfo {
    float: left;
    width: calc(100% - 60px);
    padding-left: 5px;
    line-height: 20px;
    position: relative;
    cursor:pointer;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 5px;
    row-gap: 2px;
}
/* Wrapping header row: name + date on the left, action icons pushed to the right, recipients on their own line. The username keeps its full width; a flexible spacer pushes the icons to the right, and the date shrinks/ellipsises to yield room when icons appear on hover so the icons always fit on the first row. */
.note .head .hInfo > .username {
    order: 1;
    flex: 0 0 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.note .head .hInfo > .ndate {
    order: 2;
    /* basis 0 keeps the date out of the wrap calc; it grows back to its text width (capped at max-content) when there's room, and truncates when the icons need the space. */
    flex: 1000 1 0;
    min-width: 0;
    max-width: max-content;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* Spacer eats the free space (basis 0 so it never forces a wrap) and keeps the icon cluster right-aligned. */
.note .head .hInfo::after {
    content: "";
    order: 3;
    flex: 1 1 0;
    min-width: 0;
}
.note .head .hInfo > .icon-interface { order: 4; }
.note .head .hInfo > .icon-empty-star,
.note .head .hInfo > .icon-star { order: 5; }
.note .head .hInfo > .icon-read,
.note .head .hInfo > .icon-unread { order: 6; }
.note .head .hInfo > .icon-collapse-all,
.note .head .hInfo > .icon-expand-all { order: 7; }
.note .head .hInfo > .noteTo { order: 8; width: 100%; }
/* Reserve a fixed slot for every action icon so hovering only fades them in (opacity) instead of widening the cluster — this keeps the star from shifting on hover. Safe against wrap because the date has flex-basis:0. */
.note .head .hInfo > a.icon-interface,
.note .head .hInfo > a.icon-empty-star,
.note .head .hInfo > a.icon-star,
.note .head .hInfo > a.icon-read,
.note .head .hInfo > a.icon-unread {
    width: 35px;
}
/* Touch devices can't hover, so show every action icon at rest and let the name/date shrink (basis 0, so they never force a wrap) to keep the whole cluster on one row. */
@media (hover: none) {
    .note .head .hInfo > a.icon-interface,
    .note .head .hInfo > a.icon-empty-star,
    .note .head .hInfo > a.icon-unread {
        opacity: 1;
        pointer-events: auto;
        width: 35px;
    }
    .note .head .hInfo > .username {
        flex: 3 1 0;
        max-width: max-content;
    }
    .note .head .hInfo > .ndate {
        flex: 2 1 0;
    }
}
.note .head .avatar {
    width: 40px;
    height: 40px;
    margin: 0px 0px 0px 3px;
} .note .head .username {
        float: left;
        margin-left:5px;
        width: auto;
        font-weight: 600 !important;
        font-size: 100%;
        color: var(--txt-color);
        min-width:100px;
    } .note .head .ndate {
        width: auto;
        height: 16px;
        margin-left: 5px;
        margin-right:5px;
        margin-bottom:4px;
        color: var(--txt-color-muted);
        font-size: 12px;
        float:left;
        background:var(--east-bg);
        border-radius: var(--border-radius-md);
        padding-left: 5px;
        padding-right: 5px;
    } 
#addNoteForm {
    z-index: 1;
    border-radius: var(--border-radius-xl);
    border-bottom-left-radius: 0px;
}
.note:has(#addNoteForm){
    border-color: var(--bg-border);
}
.note .like {
    float: right;
    width: 18px;
    height: 18px;
    margin: 0px 5px;
} .note .likebold {
    float: right;
    width: 18px;
    height: 18px;
    margin: 0px 5px;
    font-weight: bold;
} .note .likes {
    float: right;
    width: 0px;
    height: 0px;
} .note .likes:before {
    content: attr(data-likes);
    margin-left: -13px;
    font-size: 7px;
    position: absolute;
    top: -4px;
    width: 9px;
    border: 1px solid #ccc;
    height: 9px;
    border-radius: 50%;
    line-height: 8px;
    text-align: center;
    text-rendering: geometricPrecision;
} .note .likes[data-likes="0"] {display:none;} .note .head .noteTo { float: left;width: 100%;} .note .head .noteFor span {float: left;} .note .head .noteFor {
    width: auto;
    border-radius: var(--border-radius-xl);
    border-top-left-radius: var(--border-radius-xs);
    border-bottom-left-radius: var(--border-radius-xs);
    line-height: 16px;
    margin: 2px 3px;
    color: var(--txt-color);
    padding: 3px 6px;
    font-size: 11px;
    text-shadow: none;
} .note .head .noteFor a{
    color: var(--txt-color);
    padding: 5px;
    font-size: 11px;
    margin-top: -2px;
    display: inline-block;
} .note .head .noteFor.blue {
    color: color-mix(in srgb, var(--blue), var(--txt-color) 25%);
    border: 1px solid var(--blue);
    border-color: color-mix(in srgb, var(--blue, transparent), var(--bg) 60%);
    background-color: color-mix(in srgb, var(--blue), var(--bg) 92%);
} .note .head .noteFor.blue:before {
    content: "#";
    margin-right: 2px;
} .lineThrough {
    text-decoration: line-through;
} .iconLineThrough:before { text-decoration: line-through red; padding-left: 37%; color: #5E889E; } .note .head .noteFor.green {
    color: color-mix(in srgb, var(--dark-green), var(--txt-color) 20%);
    border: 1px solid var(--dark-green);
    border-color: color-mix(in srgb, var(--dark-green), var(--bg) 50%);
    background-color: color-mix(in srgb, var(--dark-green), var(--bg) 92%);
} .note .head .noteFor.lightGreen {
    color: rgb(62 97 20);
    border: 1px solid rgb(129, 186, 62);
    border-color: color-mix(in srgb, rgb(129, 186, 62), var(--bg) 50%);
    background-color: color-mix(in srgb, rgb(129, 186, 62), var(--bg) 92%);
} .note .head .noteFor.green:before, .note .head .noteFor.lightGreen:before {
    content: "@";
    margin-right: 2px;
    position: relative;
    top: -1px;
} .note li.token-input-token-facebook:not(.specificToken):before {
    content: "#";
    margin-right: 2px;
} .note li.token-input-token-facebook.green:not(.specificToken):before, .note li.token-input-token-facebook.lightGreen:not(.specificToken):before {
    content: "@";
    margin-right: 2px;
} .note .addComment {
    position: absolute;
    top: 25px;
    right: 5px;
    width: 15px;
    height: 15px;
    display: inline-block;
} .note .body {
    float: left;
    box-sizing: border-box;
    padding: 5px 20px 5px 53px;
    border-left: 1px solid transparent;
    color: var(--txt-color);
    background-color: var(--bg) !important;
    border-radius: 0px;
    margin-top: 0px;
    width: 100%;
    margin-bottom: 0px;
    border-bottom: 1px solid var(--bg-border-light);
}
/* No replies yet: hide the body's bottom divider */
.note:not(:has(> .comment)) .body {
    border-bottom-color: transparent;
}

.noteEditPart:has(.body:not(.hide)) .head {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.note .body > div:first-of-type, .commentBody > div:first-of-type{
    border-radius:var(--border-radius-sm);
    font-size: 100%;
    padding-left: 5px;
    padding-right: 5px;
    line-height:1.65;
    margin-bottom: 8px;
    overflow-wrap: break-word;
    word-break: break-word;
}
/*.commentBody p, .note .body p {
    margin-block-start:10px;
    margin-block-end:10px;
}*/
.note .head.off + .body {
    background-color: rgba(255, 204, 204, 0.3);
} .note .head {
    float: left;
    width: 100%;
    color: #cccccc;
} .note .head .attachments {
    padding: 10px 0px 0px 0px;
    display: inline-block;
} .note .head .actions {
    line-height: 26px;
    float: right;
    margin-left: 5px;
} .note > .comment {
    clear: both;
    padding: 10px 0px 0px 0px;
    box-sizing: border-box;
    background-color: var(--east-bg) !important;
    border-radius: 0px;
    margin: 0px 0px 0px 25px;
    width: calc(100% - 25px);
    border-left: 1px solid var(--bg-border-light);
}
.note .comment:hover .avatar:before{
    color: var(--txt-color);
}
.note .comment .avatar:before{
    content: "\e948";
    font-family: 'ionbiz';
    font-size: 19px;
    margin-right: 5px;
    top: 50%;
    left: 4px;
    transform: translate(calc(-50% - 20px), -47%);
    position: absolute;
    color: var(--bg-border-light);
}
.note .comment .avatar {
    width: 24px;
    height: 24px;
    margin: 0px 0px 0px 30px;
} .note .comment .commentBody {
   box-sizing: border-box;
   clear: both;
    color: var(--txt-color);
    margin-left: 56px;
    width: calc(100% - 95px);
    line-height: 20px;
    display: inline-block;
    margin-bottom:5px;
}
.note .comment .commentBody img{
    display: inline-block;
}
.note .body img, .note .comment .commentBody img{
    max-width: 100%;
    height: auto;
}
/* Click-to-zoom affordance for images in read-only rich-text content. */
.note .body img,
.note .comment .commentBody img,
.ionbiztinymce img{
    cursor: zoom-in;
}
[contenteditable="true"] img{
    cursor: default;
}
/* Merge the inline Save/Cancel row into the editor panel as its footer. */
.ionbiztinymce + .rteInlineActions{
    margin-top: -1px;
    position: relative;
    display: inline-flex;
    align-items: center;
    box-sizing: border-box;
    width: auto;
    padding: 5px 8px;
    background: var(--bg);
    border: thin solid var(--bg-border-light);
    border-top: 0;
    border-radius: 0 0 var(--border-radius-md) var(--border-radius-md);
}
.ionbiztinymce.mce-edit-focus:has(+ .rteInlineActions),
form.editMode .ionbiztinymce:has(+ .rteInlineActions){
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    margin-bottom: 0;
}
/* Dim the page behind the unsaved-changes toast while an inline editor is pending. */
.rteBlockShield{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99991;
    background: rgba(0, 0, 0, 0.35);
    animation: rteShieldIn 160ms ease;
}
@keyframes rteShieldIn { from { opacity: 0; } to { opacity: 1; } }
/* Toast naming the field with unsaved changes; it also hosts the Save/Cancel buttons. */
.rteUnsavedToast{
    position: fixed;
    top: 24px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100000;
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    max-width: 90vw;
    padding: 12px 18px;
    background: var(--bg);
    color: var(--text, inherit);
    border: thin solid var(--bg-border-light);
    border-radius: 40px;
    box-shadow: 0 8px 24px var(--shaddow);
    font-size: .9em;
    animation: rteToastIn 200ms cubic-bezier(.22,.61,.36,1);
}
@keyframes rteToastIn { from { opacity: 0; transform: translate(-50%, -12px); } to { opacity: 1; transform: translate(-50%, 0); } }
/* Push the field name to the left so the actions group on the right. */
.rteUnsavedToastText{
    margin-right: auto;
}
/* Tertiary "keep editing" action next to Save/Cancel. */
.rteReturnToEdit{
    color: var(--text, inherit);
    text-decoration: underline;
    cursor: pointer;
    white-space: nowrap;
}
.rteReturnToEdit:hover{
    text-decoration: none;
}
/* Strip the inline-footer chrome when the Save/Cancel row lives inside the toast. */
.rteUnsavedToast .rteInlineActions{
    position: static;
    margin: 0;
    padding: 0;
    width: auto;
    background: none;
    border: 0;
    border-radius: 0;
    display: inline-flex;
    gap: 8px;
}
/* Feedback when the user clicks away while changes are still pending. */
.rteInlineActions .rtePulse{
    animation: rtePulse 420ms ease;
}
@keyframes rtePulse {
    0%, 100% { transform: scale(1); box-shadow: none; }
    50% { transform: scale(1.08); box-shadow: 0 0 0 3px var(--menu-hover); }
}
.ion-img-overlay{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    box-sizing: border-box;
    background: rgba(0, 0, 0, 0.75);
    cursor: zoom-out;
}
.ion-img-overlay-img{
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    border-radius: 4px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.5);
} .note .uploadimage-upload {
    border-top: solid 1px var(--bg-border-light);
    overflow: hidden;
    float: left;
    margin-top: 2px;
    width: calc(100% - 12px);
} .replayToNote .uploadimage-upload {
    width: calc(90% - 53px) !important;
} .note .uploadimage-fileinfo {
    width: 100%;
    padding: 0px 0px 0px 30px;
    margin: 5px 0px;
    text-indent:0px;
} #previews {
        float: right;
    width: calc(100% - 90px);
    margin: 0px 10px 5px 0px;
}
.noteAuthorDate{
    display: flex;
    justify-content: flex-start;
    gap: 5px;
    line-height:24px;
    align-items: center;
}
.note .comment .uploadimage-fileinfo .btnRemoveLink{
    right: 0px;
} .note .comment .cUserName {
    
    color: var(--txt-color);
    font-size: 12px;
    text-indent: 5px;
    min-width: 80px;
    font-weight: 600;
} .note .comment .cdate {
    color: var(--txt-color-muted);
    font-size: 11px;
    line-height: 16px;
    background:var(--bg);
    border: 1px solid transparent;
    border-radius: var(--border-radius-md);
    padding-left: 5px;
    padding-right: 5px;
    opacity: 0.8;
} .note .comment .actions {
    float: right;
    margin: 3px 0px 0px 1%;
} .note .comment .replyToBox { width: 99%;}
.note .comment .commentBody > form .replayToButtons {
    float: left;
    clear: both;
    width: 99%;
    margin: 4px 0 0 0;
    padding: 0 0 8px 0;
} 
.note .btnEditReact, .note .btnDeleteReact, .note .btnEditNote, .note .btnDeleteNote, .note .icon-like, .note .icon-like .bold, .note .icon-unlike, .note .icon-read, .note .icon-unread, .note .icon-collapse-all, .note .icon-expand-all, .note .icon-interface, .note .icon-empty-star, .note .icon-star {
    height: 22px;
    display: table-cell;
    float: right;
    font-family: "ionbiz";
    font-size: 13px;
    text-align: center;
    width: 35px;
    color: var(--txt-color-muted);
}
.note .icon-expand-all, .note .icon-collapse-all{
    background: var(--east-bg);
    border-radius: var(--border-radius-sm);
    width: 22px;
    height:20px;
    font-size: 13px;
}
.note .icon-expand-all:hover, .note .icon-collapse-all:hover{
    background:var(--hover);
}
.note .btnEditReact:hover:before, .note .btnDeleteReact:hover:before, .note .btnEditNote:hover:before,.note .btnDeleteNote:hover:before, .uploadimage-dragndrop:hover:before {
    color:#9E9E9E;
} .note .btnEditReact:before, .note .btnEditNote:before { content: "\e602";color: #cc9d05; } .note .btnDeleteReact:before, .note .btnDeleteNote:before { content: "\e606";color: var(--red); }
/*******************************************************
    [7] Resources 
********************************************************/
#addDialog {
    float: left;
    width: 60vw;
    display: block;
}
.page_relation #addDialog{
    max-width: 400px !important;
}
.page_relation #addDialog .addBox{min-height: 100px !important;}
#addDialog .addBox {
        float: left;
        width: 50%;
        display: flex;
        flex-direction: column;
        align-items: center;
        box-sizing: border-box;
        min-height: 150px;
        padding: 0.5em 0.2em 0.5em 0.2em;
        border-radius: var(--border-radius-xl);
    } #addDialog .addBox:hover {
        background-color: var(--submenu-hover);
        border-radius: var(--border-radius-xl) !important;
        cursor: pointer;
        color: black;
        border-color:transparent;
    } #addDialog .addBox:hover .resourceText {
        
        color: black;
    } #addDialog .maxWidth:first-child .addBox {
    /*border-bottom: solid 1px var(--bg-border);
    border-bottom-left-radius:0px;
    border-bottom-right-radius:0px;*/
}
/*Invoice*/
#invoiceDefault { width:64px; height:64px; } #invoiceDefault:before{ margin-top:20px;font-family: 'ionbiz' !important;content:"\e646"; font-size:50px;} #invoiceDefault.addBox {padding: 0px;text-align: center;} #addDialog #invoiceDefault .resourceType {width: 100%;text-align: center;margin-top: 30px;} #addDialog #invoiceDefault .resourceType .userType {width: 100%;text-align: center;padding: 0px;} #addDialog #invoiceDefault .resourceText {width: 100%;text-align: center;padding: 0px;} #creditNoteDefault {width:64px; height:64px; } #creditNoteDefault:before{margin-top:20px;font-family: 'ionbiz' !important;content:"\e623"; font-size:50px;} #creditNoteDefault.addBox {padding: 0px;text-align: center;} #addDialog #creditNoteDefault .resourceType {width: 100%;text-align: center;margin-top: 30px;} #addDialog #creditNoteDefault .resourceType .userType {width: 100%;text-align: center;padding: 0px;} #addDialog #creditNoteDefault .resourceText {width: 100%;text-align: center;padding: 0px;} .iconOrangeLight {width: 37px;height: 17px;background-image: url(/images/orange-light.png?v=scWauvHJyNkotIxSpk5Z0AH9sPw);background-repeat: no-repeat;float: right;}
/*BubbleContextMenu*/
.bubbleDialogHolder:not([id^=btnAddIonBiz]) #addDialog .addBox, .page_timeline #addDialog .addBox {
    padding: 0px;
    text-align: center;
    min-height: 85px;
    width: auto;
} .bubbleDialogHolder:not([id^=btnAddIonBiz]) #addDialog .resourceType, .page_timeline #addDialog .resourceType {
    width: 150px;
    text-align: center;
    margin: 1em 5px 0px 5px;
} .bubbleDialogHolder:not([id^=btnAddIonBiz]) #addDialog .resourceType:before, .page_timeline #addDialog .resourceType:before {
    font-size: 30px;
} .bubbleDialogHolder:not([id^=btnAddIonBiz]) #addDialog .resourceType .userType, .page_timeline #addDialog .resourceType .userType {
    width: 150px;
    text-align: center;
    padding: 10px 0 0 0;
} .bubbleDialogHolder:not([id^=btnAddIonBiz]) #addDialog .resourceText, .page_timeline #addDialog .resourceText {
    width: 150px;
    text-align: center;
    padding: 0px;
    float: none;
    margin: 0px 5px 0px 5px;
} .bubbleDialogHolder:not([id^=btnAddIonBiz]) #addDialog .maxWidth:first-child .addBox.last, .page_timeline #addDialog .maxWidth:first-child .addBox.last {
    border: none !important;
}
/*Resource*/
#userDefault { background-repeat: no-repeat;} #accessDefault { background-repeat: no-repeat;} #otherDefault {background-repeat: no-repeat;} #personDefault {background-repeat: no-repeat;}  #addDialog .userType {
    float: left;
    padding: 0.3em 0.8em;
    text-transform: uppercase;
    /*font-size: 13px;*/ /*I23654*/
    /*color: #333333;*/
    font-weight: bolder;
    border-radius: 20px 0px 0px 20px;
} #userDefault .userType, #accessDefault .userType {
    border: solid 1px #99cc99;
} #otherDefault .userType, #personDefault .userType {
    border: solid 1px #ff9999;
} #addDialog .resourceType {
    width: auto;
    display: flex;
    box-sizing: border-box;
    align-items: center;
    flex-direction: column;
    position:relative;
}
.page_resource .resourceType {
    min-width: 350px !important;
    display: flex;
    box-sizing: border-box;
    align-items: center;
    flex-direction: row !important;
    position: relative;
}
.page_resource .addBox{
    min-width: 350px !important;
    margin-right: 0px !important;
    border-radius: 0px !important;
}

#otherDefault > .resourceType:before {
    font-family: 'ionbiz' !important;
    content: "\e64e";
    font-size: 56px;
    margin-right: 5px;
}
#userDefault > .resourceType:before,
#personDefault > .resourceType:before,
#accessDefault > .resourceType:before {
    font-family: 'ionbiz' !important;
    content: "\e665";
    font-size: 56px;
    margin-right: 5px;
}
#userDefault > .resourceType:after,
#personDefault > .resourceType:after,
#accessDefault > .resourceType:after {
    font-family: 'ionbiz' !important;
    content: "\e926";
    font-size: 20px;
    margin-right: 5px;
    position: absolute;
    top: -12px;
    left: 40px;
    color: var(--menu-hover);
}
#personDefault > .resourceType:after {
    content: "\e656";
}
#accessDefault > .resourceType:after {
    content: "\e658";
}
#addDialog .licensed {
    float: left;
    width: auto;
    box-sizing: border-box;
    padding: 0.3em 1.2em 0.3em 0.8em;
    background-color: var(--menu-hover);
    border: solid 1px var(--menu-hover);
    color: #ffffff;
    border-radius: 0px 20px 20px 0px;
}
body.dark #addDialog .licensed, body.dark #addDialog .unlicensed{
    color: black;
}
#addDialog .unlicensed {
    float: left;
    width: auto;
    box-sizing: border-box;
    padding: 0.3em 0.8em;
    background-color: var(--menu-hover);
    border: solid 1px var(--menu-hover);
    color: #ffffff;
    border-radius: 0px 20px 20px 0px;
} #addDialog .resourceText {
    float: left;
    width: auto;
    box-sizing: border-box;
    padding: 1em 1em 1em 1em;
    color: var(--txt-color);
    opacity:0.7;
    line-height: 1.4em;
} .datepicker:after {color: #999999;
    content: "\e600";
    font-family: "ionbiz";
    font-size: 16px;
    font-weight: normal;
    left: 0px;
    position: absolute;
    top:0px;
    z-index: 1;
    border: solid 1px red;} #gridCVResourceEducations, #gridCVResourceExperience, #gridCVResourceCurrentJobs { width: calc(100% - 10px)!important;} #ResourceCVTab .sticky {
    padding: 4px 0px 8px 0px;
    margin: 5px;
    width: calc(100% - 10px);
    border: 0;
} #ResourceCVTab .sticky > .leftCol{ float: left;width: 60%; } #ResourceCVTab .sticky > .rightCol{ float: right;width: 40%;} #ResourceCVTab .sticky > .singleCol{ float: left;width: calc(100% - 15px); } #ResourceCVTab .sticky .body {
    padding: 5px 5px 0px 5px;
    white-space: normal;
    margin: 0px;
    margin-left: 5px;
} #ResourceCVTab .sticky .name {
    font-size: 12px;
    font-weight: bold;
    margin: 5px 0;
    color: #192d5c;
    text-overflow: ellipsis;
    overflow: hidden;text-overflow: ellipsis;
    overflow: hidden;
} #ResourceCVTab .sticky .name:before {
    float: right;
    line-height: inherit;
    position: absolute;
    right: 4px;
} #ResourceCVTab .note .body, #ResourceCVTab .note {
    background-color: var(--bg);
    box-shadow: none;
    border-left-color: transparent !important;
    border-radius: var(--border-radius-xs) !important;
    text-align:justify;
} .detailInput:has(#CVText1), .detailInput:has(#CVText2){
    width: 100%;
} .note:hover {
   border-color: var(--bg-border);
}
/*******************************************************
    [9] Grid
********************************************************/
.ui-jqgrid-grouped {
    color: var(--txt-color);
}
/*******************************************************
    [10] Shared 
********************************************************/
#personInfoTag, #personInfoTagReadOnly {
    border-color: var(--bg-border-light);
    color: var(--txt-color);
} #personInfoTag .photoContainer .uploadBar, #personInfoTagReadOnly .photoContainer .uploadBar {
    color: #eee;
} #personInfoTag .name, #personInfoTagReadOnly .name {
    color: var(--txt-color);
} #personInfoTag .detail span:last-child, #personInfoTagReadOnly .detail span:last-child {
    color: #284646;
} .detailInput #personInfoTag, .detailInput #personInfoTagReadOnly {
    border: none;
    margin-bottom: 0;
    height: 85px;
}
/*******************************************************
    [--] Utils 
********************************************************/
select {
    padding-right: 15px;
    padding-left:0px !important;
    -webkit-appearance: none; /*Removes default chrome and safari style*/
    -moz-appearance: none; /* Removes Default Firefox style*/
    background-repeat: no-repeat;
    text-indent: 5px; 
    text-overflow: "";
}
/*redesing the native OS select — gated for browsers that support base-select (not Firefox) */
@supports (appearance: base-select) {
select,
select::picker(select) {
  appearance: base-select;
  white-space: nowrap;
  line-height: 22px;
}

select{
align-items: center;
/*margin-top: 2px !important;*/
margin-bottom: 2px !important;
overflow: hidden;
}
/* keep the long selected option text inside the select box instead of overflowing */
select::selectedcontent {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
select::-webkit-scrollbar{
    width: 7px;
    height: 7px;
}

select::picker-icon {
    display:none;
}
select::picker(select) {
 border: solid 1px var(--bg-border);
 border-radius: var(--border-radius-sm);
 background-color: var(--bg);
 box-shadow: 0px 0px 15px 0px var(--shaddow);
 padding-top: 7px;
 padding-bottom: 7px;
}
option {
    height: 30px;
    padding: 0;
    overflow: hidden;
    font-size:12px;
    white-space: nowrap;
    border-radius: var(--border-radius-xs);
    text-overflow: ellipsis;
    margin-left:8px;
    margin-right:8px;
    color: var(--txt-color);
    margin-bottom:2px;
    padding-left: 5px;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 2px 0%;
    transition: background 0.1s;
}
.bubbleDialogHolder select:not(.manageChk) option{
    text-align:center;
}
option:hover {
  background-color: var(--hover);
  background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
  background-size: 2px 50%;
  background-repeat: no-repeat;
  background-position: left center;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
option:checked {
  font-weight: bolder;
  background-color: var(--hover);
  background-image: linear-gradient(var(--menu-hover), var(--menu-hover));
  background-size: 2px 50%;
  background-repeat: no-repeat;
  background-position: left center;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
option:focus, option:focus-visible {
outline: none;
}
option::checkmark{
    display:none;
}
} /* end @supports (appearance: base-select) */
/*redesing the native OS select*/
.ionbizdetails.editMode .detailInput:has(select):not(:has(.w60)):not(:has(.select-inline)):not(:has(.halfWidth)):after,
.ionbizdetails.editMode .detailInput:not(:has(.w60)):not(:has(.select-inline)) > .halfWidth:has(select):after,
.detailInput:where(:focus-within):has(select:focus):not(:has(.w60)):not(:has(.select-inline)):after { 
    font-family: 'ionbiz' !important;
    content: "\e944";
    font-size: 9px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: table-cell;
    vertical-align: middle;
    right: 10px;
    text-indent: 0;
    left: auto;
    top: -1px;
    position: absolute;
    z-index: 1;
    pointer-events: none;
    opacity: 0.6;
}
.ionbizdetails.editMode .select-inline:after, .bubbleDialogHolder .select-inline:after, .select-inline:where(:focus-within):has(select:focus-visible):after {
    font-family: 'ionbiz' !important;
    content: "\e944";
    font-size: 9px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: table-cell;
    vertical-align: middle;
    right: 15px !important;
    text-indent: 0;
    left: auto;
    top: -1px;
    position: relative;
    z-index: 1;
    pointer-events: none;
    opacity: 0.6;
}
/* Firefox paints its own select arrow and nothing can remove it: appearance:none is ignored
   and ::picker-icon is only exposed with appearance:base-select, which Firefox lacks. Drop our
   duplicate chevron there. Self-reverting - once Firefox ships base-select this stops matching
   and the customizable-select styling above takes over. */
@supports (-moz-appearance: none) and (not (appearance: base-select)) {
    .detailInput:has(select):not(:has(.ui-autocomplete-input)):after,
    .halfWidth:has(select):after,
    .w60:has(select):after,
    .cell:has(select):after,
    .select-inline:after {
        content: none !important;
    }
}
.ionbizdetails.editMode .detailInput:has(.datepicker,.hasDatepicker:not(.navigateDatePicker)):not(:has(.halfSizeRight)):not(:has(.datepicker-inline)):before,
.detailInput:has(.datepicker,.hasDatepicker:not(.navigateDatePicker)):not(:has(.halfSizeRight)):not(:has(.datepicker-inline)):before,
.cell:has(.hasDatepicker:not(.navigateDatePicker)):before {
    font-family: 'ionbiz' !important;
    content: "\e943";
    font-size: 14px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* Stretching to the row and centring keeps the glyph on the input's axis; the old fixed
       line-height left it half a pixel high once the row grew past 31px. */
    display: flex;
    align-items: center;
    top: 0;
    bottom: 0;
    /* Geometric centring reads low: the glyph's ink box is pulled up by the calendar's two
       top tabs, while the value is all digits, whose band sits above the line's middle.
       Shrinking the centring box lifts the calendar body onto the digits' axis. */
    margin-bottom: 1px;
    line-height: 1;
    left: 2px !important;
    text-indent: 5px;
    position: absolute;
    z-index: 1;
    pointer-events: none;
    opacity: 1;
    color: var(--txt-color-muted);
}

.cell:has(.hasDatepicker:not(.navigateDatePicker)):before {
    top:34px !important;
    bottom: auto;
    height: 31px;
}
.ui-datepicker {
    background-color: var(--bg);
    border-radius: var(--border-radius-sm);
    z-index: 200 !important;
    box-shadow: 0px 2px 8px 1px var(--shaddow);
} .ui-datepicker select {
        border-radius: var(--border-radius-sm);
        height:27px;
        scrollbar-width:thin;
    } .ui-datepicker select::-webkit-scrollbar {
            width:3px;
        }
.ui-datepicker-title:has(select.ui-datepicker-month):before, .ui-datepicker-title:has(select.ui-datepicker-year):after {
    content: "\e672";
    line-height: 22px;
    cursor: pointer;
    font-family: 'ionbiz';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    font-size:8px;
    pointer-events:none;
    top:13px;
    position:absolute;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    
}
.ui-datepicker-title:has(select.ui-datepicker-month):before{
    left:95px;
}
.ui-datepicker-title:has(select.ui-datepicker-year):after{
    right:52px;
}

/* =========================================================================
   Modern datepicker overlay
   Visual-only refresh of the jQuery UI datepicker (single & multi-month).
   No layout-affecting changes that the JS depends on (widths/positions
   computed in jquery-ui.js are preserved).
   ========================================================================= */
.ui-datepicker {
    padding: 8px !important;
    border: 1px solid var(--bg-border) !important;
    border-radius: var(--border-radius-sm) !important;
    box-shadow: 0px 2px 20px 0px rgba(0, 7, 22, 0.18), 0 2px 6px rgba(0, 7, 22, 0.08) !important;
    font-family: inherit;
}
/* Header: flat, transparent, generous spacing */
.ui-datepicker .ui-datepicker-header {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 4px 4px 12px !important;
    position: relative;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
    border: 0 !important;
}
/* Month / year title — bigger, modern weight */
.ui-datepicker .ui-datepicker-title {
    font-size: 13px;
    font-weight: 600;
    line-height: 28px;
    color: var(--txt-color);
}
.ui-datepicker .ui-datepicker-title select {
    background: transparent !important;
    border: 1px solid transparent !important;
    border-radius: var(--border-radius-sm) !important;
    padding: 2px 6px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    color: var(--txt-color) !important;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease;
}
.ui-datepicker .ui-datepicker-title select:hover {
    background: var(--hover) !important;
    border-color: var(--bg-border-light) !important;
}
/* Round prev/next buttons */
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    top: 6px !important;
    width: 28px !important;
    height: 28px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    border: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color .15s ease;
}
.ui-datepicker .ui-datepicker-prev { left: 6px !important; }
.ui-datepicker .ui-datepicker-next { right: 6px !important; }
.ui-datepicker .ui-datepicker-prev:hover,
.ui-datepicker .ui-datepicker-next:hover {
    background: var(--hover) !important;
}
.ui-datepicker-prev:before,
.ui-datepicker-next:before {
    font-size: 12px !important;
    line-height: 1 !important;
    color: var(--txt-color);
}
/* Multi-month spacing */
.ui-datepicker.ui-datepicker-multi .ui-datepicker-group {
    padding: 0 8px;
}
.ui-datepicker.ui-datepicker-multi .ui-datepicker-group + .ui-datepicker-group {
    border-left: 1px solid var(--bg-border-light);
}
/* Calendar table — borderless modern grid */
.ui-datepicker table {
    border: 0 !important;
    border-collapse: separate !important;
    border-spacing: 2px !important;
    margin: 0 !important;
}
.ui-datepicker-calendar thead {
    display: table-header-group !important;
    background: transparent !important;
    border: 0 !important;
}
.ui-datepicker th {
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--txt-color);
    opacity: 0.6;
    padding: 6px 0 8px !important;
    border: 0 !important;
}
.ui-datepicker td,
.ui-datepicker tr td:first-child,
.ui-datepicker tr:last-child td:first-child,
.ui-datepicker tr:last-child td:last-child {
    border: 0 !important;
    border-radius: 50% !important;
    padding: 0 !important;
    height: 26px !important;
    width: 26px !important;
    background: transparent !important;
}
.ui-datepicker td > a,
.ui-datepicker td > span {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    margin: 0 auto;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: var(--txt-color) !important;
    transition: background-color .15s ease, color .15s ease;
}
/* Hover — subtle neutral pill */
.ui-datepicker td:not(.ui-state-disabled):hover {
    background: transparent !important;
    color: inherit !important;
}
.ui-datepicker td:not(.ui-state-disabled) > a:hover {
    background: var(--hover) !important;
    color: var(--txt-color) !important;
}
/* Today — accent ring, no fill */
.ui-datepicker-today,
.ui-datepicker-today a,
.ui-datepicker-today span {
    background: transparent !important;
    color: var(--blue) !important;
    font-weight: 700 !important;
    border-radius: 50% !important;
}
.ui-datepicker-today > a,
.ui-datepicker-today > span {
    box-shadow: inset 0 0 0 3px var(--menu-hover);
}
/* Selected day — solid accent pill */
.ui-datepicker-current-day,
.ui-datepicker-current-day a {
    background: transparent !important;
    color: inherit !important;
}
.ui-datepicker-current-day > a {
    background: var(--blue) !important;
    color: var(--bg) !important;
    font-weight: 700 !important;
    box-shadow: inset 0px 0px 20px 10px var(--green);
}
.ui-datepicker-current-day > a:hover {
    background: var(--blue) !important;
    color: var(--bg) !important;
    filter: brightness(1.05);
}
/* Other-month / disabled days — muted */
.ui-datepicker .ui-state-disabled,
.ui-datepicker .ui-datepicker-other-month {
    opacity: 0.35 !important;
    background: transparent !important;
}
/* Weekend column — subtle pill background on the day itself */
.ui-datepicker td.ui-datepicker-week-end,
.ui-datepicker th.ui-datepicker-week-end {
    background: transparent !important;
}
.ui-datepicker td.ui-datepicker-week-end > a,
.ui-datepicker td.ui-datepicker-week-end > span {
    background: var(--weekend-bg) !important;
    color: color-mix(in srgb, var(--txt-color) 75%, transparent) !important;
}
.ui-datepicker td.ui-datepicker-week-end:not(.ui-state-disabled) > a:hover {
    background: var(--hover) !important;
    color: var(--txt-color) !important;
}
/* Week-number column — muted and small */
.ui-datepicker .ui-datepicker-week-col {
    font-size: 10px !important;
    font-weight: 500 !important;
    color: var(--txt-color) !important;
    opacity: 0.45 !important;
    background: transparent !important;
    border: 0 !important;
    border-right: 1px solid var(--bg-border-light) !important;
    border-radius: 0 !important;
    padding-right: 6px !important;
    width: 22px !important;
}
/* Button pane: clean separator + modern pill buttons */
.ui-datepicker .ui-datepicker-buttonpane {
    margin-top: 0px !important;
    padding: 10px 4px 2px !important;
    border-top: 1px solid var(--bg-border-light) !important;
    background: transparent !important;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}
.ui-datepicker .ui-datepicker-buttonpane button {
    margin: 0 !important;
    padding: 6px 14px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    border-radius: var(--border-radius-xl) !important;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
    background: transparent !important;
    color: var(--txt-color) !important;
    border: 1px solid var(--bg-border) !important;
    margin-left: 0 !important;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current:hover {
    background: var(--hover) !important;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-close {
    display: none !important;
}
.mT10 {
    margin-top: 10px;
} select::-ms-expand { display: none; } #errorMessage{ font-size: 11px;color: red!important;float: left;width: 100%;padding: 5px 0px;} #successMessage{ font-size: 11px;color: var(--dark-green)!important;float: left;width: 100%;padding: 5px 0px;} .btnRoundAdd {  display: block;  line-height: 31px; } .btnRoundAdd:before { font-family: "ionbiz";font-weight: normal;font-size: 16px;content: "\e600";float: left;margin-right: 9px;} .tcWhite { color: #ffffff;} .tcGrey { color: #cccccc;} .tcGrey6 { color: var(--txt-color) !important;} .tcOrange{ color: #ff7800 !important;} .tcGreen{ color: var(--dark-green) !important;} .taR { text-align: right !important;} .taL { text-align: left !important;} .ti0 { text-indent: 0px !important;} .ti40 { text-indent: 40px !important;} .ti20 { text-indent: 20px !important;}
.detailInput label.icon-warning_1:before, .detailInput label.icon-warning_2:before, .detailInput .icon-search:before, .detailInput .icon-lookup:before, .detailInput .fiedlValueLink:before {
    font-size: 16px;
    line-height: 30px;
    margin-left: -30px;
    width: 30px;
    height: 30px;
    float: left;
}
.detailInput:has(.icon-lookup) label.icon-warning_2:before, .detailInput:has(.icon-lookup) label.icon-warning_1:before {
    margin-left: -60px !important;
}
.fiedlValueLink:before { margin-left: -30px !important;}
/*******************************************************
     [4] Context menu
********************************************************/
.contextMenuPlugin {
    -webkit-user-select: none;
    display: none;
    font-size: 12px;
    position: absolute;
    left: 100px;
    top: 100px;
    min-width: 120px;
    list-style-type: none;
    margin: 0;
    padding: 2px;
    background: var(--context-menu-bg) !important;
    border-radius: var(--border-radius-md);
    padding-bottom: 6px;
    z-index: 10000000;
    border: 1px solid var(--bg-border);
} .contextMenuPlugin > li {
  margin: 0 0 0 0;
  padding: 1px;
  background-repeat: no-repeat;
  height:30px;
  box-sizing: border-box;
} .contextMenuPlugin > li > a {
    position: relative;
    display: block;
    padding: 0px 5px 0px 35px;
    color: ButtonText;
    text-decoration: none;
    margin: 1px;
    font-size: 12px;
    height: 30px;
    overflow: hidden;
    box-sizing: border-box;
    line-height:30px;
} .contextMenuPlugin > li > a > span {
        font-size: 0.8rem;
        color: var(--txt-color);
        display: flex;
        height:auto;
        /*text-shadow: 0px 1px 0px #ffffff;*/
    } .contextMenuPlugin > li > a div {
            position: absolute;
            left: 9px;
            width: 18px;
            height: 18px;
            font-size: 15px;
            line-height: 32px
        } 
.contextMenuPlugin > li > a:hover {
        background: color-mix(in srgb, var(--green) 50%, transparent);
        cursor: default;
        border-radius: var(--border-radius-sm);
        z-index: 1;
        cursor: pointer;
        
} 
.myLeavesYearList .leaveRow { cursor: pointer; }
.myLeavesYearList .leaveRow:hover { background: rgba(0,0,0,0.04); }
.myLeavesYearList .leaveRow.selected { background: var(--bg-border-light); }

.ionBizContextMenu {
    list-style: none;
    margin: 0;
    padding: 4px;
    min-width: 140px;
    background: var(--context-menu-bg);
    border-radius: var(--border-radius-md);
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    font-size: 12px;
}
.ionBizContextMenu > li {
    padding: 6px 14px;
    color: var(--txt-color);
    cursor: pointer;
    border-radius: var(--border-radius-xl);
    white-space: nowrap;
}
.ionBizContextMenu > li:hover {
    background: color-mix(in srgb, var(--green) 50%, transparent);
}
.contextMenuPlugin > li.divider { border-top: 1px solid var(--bg-border-light); } .contextMenuPlugin > .header {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(90,90,90,1)), color-stop(100%,rgba(20,20,20,1)));
  position: relative;
  cursor: default;
  padding: 3px 3px 3px 3px;
  color: #ffffff;
} .contextMenuPlugin > .gutterLine {
  position: absolute;
  border-left: 1px solid var(--bg-border-light);
  border-right: 1px solid #ffffff;
  width: 0;
  top: 0;
  bottom: 0;
  left: 26px;
  z-index: 0;
} .contextMenuPlugin > li > a .ui-autocomplete-input {
    padding-right: 0px;
    height:28px;
    border-radius:var(--border-radius-md);
    
} .contextMenuPlugin .hasSubmenu::before {
    line-height: 26px;
    position: absolute;
    right: 15px;
    color: #b5b4b4;
    font-size: 8px;
    font-weight: lighter;
}
/*******************************************************
    [8] Projects
********************************************************/
.tblFinancial thead td {
    color: #192d5c;
} .tblFinancial .marginRow td {
    color: #0A6C46;
} .tblFinancial td:first-child {
    color: rgb(161, 163, 162);
} .tblFinancial td.total, .tblFinancial td.total a {
    color: rgb(102, 102, 102);
} .tblFinancial .marginRow td:first-child {
    color: #666666;
} .tblFinancial .lockIcon + label:before {
    color: var(--dark-green);
} .tblFinancial .lockIcon:checked + label:before {
    color: #E57B7B;
} #tabrecurrence_isweeklyholder input[data-checkbox="true"][type="checkbox"]+label, #isweeklyholder input[data-checkbox="true"][type="checkbox"]+label { width:auto;} .cellWarning { line-height: 26px; padding: 5px; } .warning_parent {
    position: relative;
    float: right;
    right: -2px;
    width: 0;
    display: flex;    
} .warning_parent:before {
        position: absolute;
        left: -30px;
        top: calc(50% - 4px);
        color: var(--red) !important;
        font-size: 14px;
        height: 14px;
} .warning_parent:hover:before {
    color: #9E9E9E !important;
} .detailInputCost {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-top: 1px;
    margin-bottom: 1px;
    padding: 2px;
    width: 50% !important;
    border: 1px solid transparent;
}
.ionbizdetails:not(.editMode) .detailInputCost {
    border: none;
}
.detailInputValue {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
} .detailInputValue input,input#DayNo, input#NrCopies {
    width:105px !important;
    border-radius: var(--border-radius-l) !important;
} .detailInputCostTotal {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    border-top: 1px solid var(--bg-border-light);
    width: 100%;
    margin-top: 2px;
    font-weight:600;
}
#logo_img {
    width: 146px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* ============================================================
   User menu — the avatar dropdown (Views/Shared/UserMenu.cshtml)
   Sized and coloured like the rest of the app rather than like the design handoff: 12–13px
   type, neutral icons, flat surfaces separated by borders. Everything comes from the theme
   tokens, so light, dark and classic follow; the accent is --menu-hover, the same colour the
   detail tabs and the main menu use for their selected state.
   ============================================================ */

.um {
  --um-surface: var(--dialog-bg);
  --um-surface-alt: var(--hover);
  --um-text: var(--txt-color);
  --um-muted: var(--txt-color-muted);
  --um-border: var(--bg-border);
  --um-divider: var(--bg-border-light);
  --um-accent: var(--menu-hover);
  /* The wash grid rows get on hover; selected items add the accent to their text as well, as
     the detail tabs do. */
  --um-hover: color-mix(in srgb, var(--menu-hover) 8%, transparent);
  --um-selected-bg: var(--um-hover);
  --um-selected-text: color-mix(in srgb, var(--menu-hover) 80%, var(--txt-color));
  --um-danger: var(--red);
  --um-danger-hover: color-mix(in srgb, var(--red) 8%, transparent);
  --um-ease: var(--dur-base) var(--ease-out);

  position: relative;
  width: 300px;
  box-sizing: border-box;
  font-family: var(--font-family);
  font-size: 13px;
  line-height: 1.3;
  color: var(--um-text);
  text-align: left;
}

.um *, .um *::before, .um *::after { box-sizing: border-box; }

/* The bubble is only a positioning shell here; the menu draws its own surface. */
.ui-tooltip:has(#mySubMenu) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  max-width: none !important;
  overflow: visible !important;
}
.ui-tooltip:has(#mySubMenu) > .arrow { display: none !important; }

.um button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  cursor: pointer;
  text-align: inherit;
}

.um svg {
  width: 18px;
  height: 18px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.um :focus-visible { outline: 2px solid var(--um-accent); outline-offset: 2px; }

/* One surface for the menu and every panel: flat, a hairline border, a light lift. */
.um-main,
.um-panel {
  background: var(--um-surface);
  border: 1px solid var(--um-border);
  /* Same as the detail section cards. */
  border-radius: var(--border-radius-l);
  box-shadow: var(--shadow-lg);
}

/* ── Main column ─────────────────────────────────────────── */
.um-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 8px 8px;
  /* Capped by fitToWindow when zoomed in too far for the window. */
  overflow-y: auto;
  overscroll-behavior: contain;
}

.um-user { display: flex; flex-direction: column; padding: 2px 10px 6px; min-width: 0; }
.um-user-name {
  font-weight: 600;
  font-size: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.um-user-initials { font-size: 11px; color: var(--um-muted); }

.um .um-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: var(--border-radius-sm);
  font-size: 13px;
  color: var(--um-text);
  text-decoration: none;
  cursor: pointer;
  transition: background var(--um-ease), color var(--um-ease);
}
.um .um-row > span { flex: 1; min-width: 0; }
.um .um-row:hover { background: var(--um-hover); }
.um .um-row.is-active { background: var(--um-selected-bg); color: var(--um-selected-text); }

/* Only the icon carries the red, as the delete icon does elsewhere. */
.um .um-danger svg { stroke: var(--um-danger); }
.um .um-danger:hover { background: var(--um-danger-hover); }

/* A glyph from the ionbiz icon font, sized to sit in the same box as the drawn icons. */
.um .um-font-icon {
  width: 18px;
  flex: none;
  font-size: 18px;
  font-style: normal;
  line-height: 1;
  text-align: center;
}

.um .um-chevron { width: 14px; height: 14px; color: var(--um-muted); transition: transform var(--um-ease); }
.um[data-panel-side="right"] .um-chevron { transform: scaleX(-1); }

.um-divider { height: 1px; background: var(--um-divider); margin: 4px 6px; flex: none; }

/* ── Time registration card: the home widget's block, at menu size ── */
.um-timereg {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 2px 2px 0;
  padding: 10px 12px;
  background: var(--hover);
  border: 1px solid var(--um-border);
  border-radius: var(--border-radius-md);
}
.um-timereg-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--um-muted);
}
.um-timereg-status {
  padding: 1px 6px;
  border-radius: var(--border-radius-xs);
  background: var(--um-surface);
  border: 1px solid var(--um-border);
  letter-spacing: normal;
}
.um-timereg-status.is-out { color: var(--um-danger); }
.um-timereg-status.is-in { color: var(--dark-green); }
.um-timereg-body { display: flex; align-items: center; gap: 10px; }
.um .um-timereg-toggle {
  width: 32px;
  height: 32px;
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--blue);
  transition: background var(--um-ease);
}
.um .um-timereg-toggle.is-in { background: var(--red); }
.um .um-timereg-toggle:hover { background: color-mix(in srgb, var(--blue) 85%, #000); }
.um .um-timereg-toggle.is-in:hover { background: color-mix(in srgb, var(--red) 85%, #000); }
.um .um-timereg-toggle svg { width: 12px; height: 12px; fill: #fff; stroke: none; }
.um-timereg-time { display: flex; flex-direction: column; min-width: 0; }
.um-timereg-actual { font-family: Onest, var(--font-family); font-weight: 700; font-size: 18px; }
.um-timereg-last { font-size: 11px; color: var(--um-muted); }
.um .um-timereg-all {
  margin-left: auto;
  font-size: 12px;
  font-weight: 600;
  color: var(--um-accent);
  text-align: right;
  text-decoration: none;
  cursor: pointer;
}
.um .um-timereg-all:hover,
.um .um-timereg-all.is-active { text-decoration: underline; }

/* ── Theme / Menu / Keys strip ──────────────────────────── */
.um-seg {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  margin: 8px 2px 6px;
  padding: 3px;
  border: 1px solid var(--um-border);
  border-radius: var(--border-radius-md);
}
.um .um-seg-btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 0;
  padding: 6px 8px;
  border-radius: var(--border-radius-sm);
  font-size: 13px;
  transition: background var(--um-ease), color var(--um-ease);
}
.um .um-seg-btn > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Short rules between the controls rather than full-height borders. */
.um .um-seg-btn + .um-seg-btn::before {
  content: "";
  position: absolute;
  left: -3px;
  top: 25%;
  height: 50%;
  width: 1px;
  background: var(--um-divider);
}
.um .um-seg-btn:hover { background: var(--um-hover); }
.um .um-seg-btn.is-active { background: var(--um-selected-bg); color: var(--um-selected-text); }
.um .um-seg-btn svg { width: 16px; height: 16px; }
.um .um-seg-btn svg[data-icon]:not(.is-current) { display: none; }

/* ── Version ─────────────────────────────────────────────── */
.um .um-version {
  display: block;
  width: 100%;
  padding: 8px 10px 2px;
  text-align: center;
  font-size: 11px;
  color: var(--um-muted);
  /* A local build carries the full 40-character commit hash. */
  overflow-wrap: anywhere;
}
.um .um-version:hover { color: var(--um-accent); }
/* The same copy glyph the detail header shows after the record name on hover. */
.um .um-version:hover .um-version-text:after {
  content: "\e62d";
  margin-left: 6px;
  font-family: 'ionbiz' !important;
  font-size: 11px;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
}
.um .um-version.is-copied { color: var(--dark-green); }
.um .um-version.is-copied .um-version-text:after { content: none; }

/* ── Side panels ─────────────────────────────────────────── */
.um-panel {
  position: absolute;
  top: 0;
  width: 560px;
  display: flex;
  flex-direction: column;
  overflow: auto;
  color: var(--um-text);
}
.um-panel[hidden] { display: none; }
.um[data-panel-side="left"] .um-panel { right: calc(100% + 12px); }
.um[data-panel-side="right"] .um-panel { left: calc(100% + 12px); }
.um-panel-small { width: 320px; }

.um-panel-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 20px 0;
}
.um-panel-head h2 {
  flex: 1;
  margin: 0;
  font-family: var(--font-family);
  font-weight: 600;
  font-size: 17px;
  color: var(--um-text);
}
.um-panel-small .um-panel-head { padding: 14px 16px 0; }
.um-panel-small .um-panel-head h2 { font-size: 14px; }

.um .um-close,
.um .um-back {
  width: 28px;
  height: 28px;
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--border-radius-sm);
  color: var(--um-muted);
}
.um .um-close:hover,
.um .um-back:hover { background: var(--um-hover); color: var(--um-text); }
.um .um-close svg,
.um .um-back svg { width: 16px; height: 16px; }
.um .um-back { display: none; }

.um-panel-body { padding: 12px 20px 20px; }
.um-panel-small .um-panel-body { padding: 10px 16px 16px; }

/* Tabs: the detail tabs' pill row — no rule under the strip, a soft pill for the active tab. */
.um-tabs {
  display: flex;
  gap: 4px;
  padding: 10px 20px 0;
}
.um .um-tab {
  padding: 5px 14px;
  border-radius: var(--border-radius-sm);
  font-size: 0.8rem;
  color: var(--um-text);
  transition: background var(--um-ease), color var(--um-ease);
}
.um .um-tab:hover { background: var(--um-hover); }
.um .um-tab[aria-selected="true"] { background: var(--um-selected-bg); color: var(--um-selected-text); }
.um-tabpanel { padding: 16px 20px 20px; }
.um-tabpanel[hidden] { display: none; }

/* Buttons and links inside panels */
.um .changePassHolder input.changePassBtn,
.um .resetUserPreferenceHolder input.resetPreferenceBtn {
  height: 32px;
  width: auto;
  padding: 0 16px;
  border: 0;
  border-radius: var(--border-radius-sm);
  background: var(--um-accent) !important;
  color: #fff !important;
  font: 600 13px var(--font-family);
  text-transform: none;
  line-height: 32px !important;
  cursor: pointer;
  transition: background var(--um-ease);
}
.um .changePassHolder input.changePassBtn:hover,
.um .resetUserPreferenceHolder input.resetPreferenceBtn:hover {
  background: color-mix(in srgb, var(--um-accent) 85%, #000) !important;
}
.um-panel a:not(.um-row) { color: var(--um-accent); text-decoration: none; }
.um-panel a:not(.um-row):hover { text-decoration: underline; }

.um-panel-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  font-size: 12px;
}

/* Inputs, whatever the partial that rendered them: the app's compact field. */
.um-panel input[type="text"],
.um-panel input[type="password"],
.um-panel input:not([type]),
.um-panel select {
  width: 100% !important;
  height: 32px !important;
  padding: 0 10px !important;
  border: 1px solid var(--um-border) !important;
  border-radius: var(--border-radius-l) !important;
  outline: none;
  background: var(--input-bg) !important;
  color: var(--um-text) !important;
  font: 400 13px var(--font-family) !important;
  text-align: left;
  float: none;
}
.um-panel input:focus,
.um-panel select:focus { border-color: var(--um-accent) !important; }

/* ── Profile tab (Views/Home/EditAccount.cshtml) ─────────── */
.um-profile { display: flex; flex-direction: column; gap: 16px; }
.um-profile-head { display: flex; align-items: center; gap: 14px; }
.um #personInfoTag {
  margin: 0;
  min-height: 0;
  border: 0 !important;
}
.um #personInfoTag .photoContainer,
.um #personInfoTag .photoContainer > div { height: auto; float: none; display: block; }
.um .um-profile-photo {
  display: block;
  width: 64px;
  height: 64px;
  border-radius: var(--border-radius-sm);
  object-fit: cover;
  background: var(--hover) center / cover no-repeat;
}
.um #personInfoTag .um-profile-photo { cursor: pointer; }
.um-profile-id { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.um-profile-name { font-weight: 600; font-size: 15px; }
.um-profile-initials { font-size: 12px; color: var(--um-muted); }
.um-profile-initials strong { color: var(--um-text); }
.um-profile-photo-links { display: flex; gap: 12px; margin-top: 2px; font-size: 12px; }
.um-profile-photo-links .uploadBarDelete { color: var(--um-muted) !important; }

.um-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
.um-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  font-size: 12px;
  font-weight: 600;
}
.um-field > span:not(:first-child),
.um-field .ui-autocomplete-input { width: 100%; }

/* ── Security tab (Views/Home/ChangePassword.cshtml) ─────── */
.um .userSubMenuHolder { width: auto; padding: 0; font-size: 13px; }
.um .btnCloseSubmenu,
.um .changePassHolder:before,
.um .resetUserPreferenceHolder:before { display: none; }
.um .changePassHolder { margin: 0; padding: 0; text-align: left; font-size: 13px; }
.um .changePassHolder .title {
  padding: 0 0 12px;
  text-align: left;
  font-family: var(--font-family);
  font-weight: 600;
  font-size: 14px;
}
.um #changePassFields { display: flex; flex-direction: column; gap: 12px; padding: 0; }
.um .newPassHolder { display: flex; flex-direction: column; gap: 12px; width: auto; margin: 0; padding: 0; border: 0; }
.um .changePassHolder input[type="password"] { max-width: 320px; }
.um .changePassTxt { float: none; padding: 0; font-size: 12px; color: var(--um-muted); opacity: 1; }
.um .changePassBtnHolder { display: flex; justify-content: flex-end; margin: 4px 0 0; }
.um-tabpanel .btnManageMfa { margin-top: 16px; }

/* ── Reset preferences (Views/Home/ResetPreferences.cshtml) ─ */
.um .resetUserPreferenceHolder { padding: 0; font-size: 12px; text-align: left; }
.um .resetUserPreferenceHolder .title { display: none; }
.um .resetPreferenceTxt { float: none; padding: 0 0 10px; font-size: 12px; color: var(--um-muted); opacity: 1; }
.um .resetPreferenceBtnHolder { display: flex; justify-content: flex-end; margin-top: 12px; }

/* ── Menu position list ──────────────────────────────────── */
.um-panel-list { width: 190px; }
.um-panel-list .um-panel-head { display: none; }
.um-panel-list .um-panel-body { display: flex; flex-direction: column; gap: 2px; padding: 6px; }
.um .um-position .um-check { visibility: hidden; }
.um .um-position.is-current { background: var(--um-selected-bg); color: var(--um-selected-text); cursor: default; }
.um .um-position.is-current .um-check { visibility: visible; }

/* ── Keyboard shortcuts (Views/Home/ViewShortcuts.cshtml) ── */
/* Nothing above the list: a click outside closes it. Only the narrow layout keeps a head, for
   its back button. */
.um-panel-shortcuts { width: 320px; padding: 14px 16px; }
.um-panel-shortcuts .um-panel-head { display: none; }
.um-panel-shortcuts .um-panel-body { padding: 0; }
.um #view-shortcuts {
  display: block;
  min-width: 0;
  height: auto;
  margin: 0;
  padding: 0;
  overflow: visible;
  background: none;
  border-radius: 0;
}
/* Filled with the theme's hover grey so each group reads as its own block. */
.um .shortcut-category {
  margin: 12px 0 0;
  padding: 5px 8px;
  border: 0;
  border-radius: var(--border-radius-sm);
  background: var(--hover);
  font-size: 10px;
  letter-spacing: .1em;
  color: var(--um-muted);
  opacity: 1;
}
.um #keyboard-shortcuts-container > .shortcut-category:first-child { margin-top: 0; }
.um .shortcut-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 7px 0;
  border-top: 1px solid var(--um-divider);
  border-radius: 0;
  font-size: 12px;
}
.um .shortcut-item:hover { background: none; }
.um .shortcut-category + .shortcut-item { border-top: 0; }
.um .shortcut-txt { order: -1; }
.um .shortcut-name {
  flex: none;
  min-width: 22px;
  margin: 0;
  padding: 1px 6px;
  border: 1px solid var(--um-border);
  border-radius: var(--border-radius-xs);
  background: var(--east-bg);
  color: var(--um-text);
  font-size: 11px;
  font-weight: 600;
  text-align: center;
  white-space: nowrap;
}

/* ── Narrow screens: a panel takes the menu's place ──────── */
@media (max-width: 768px) {
  .um { width: calc(100vw - 24px); max-width: 420px; }
  .um-main,
  .um-panel { max-height: calc(100dvh - 90px); overflow: auto; }
  .um.has-panel .um-main { display: none; }
  .um .um-panel {
    position: static;
    width: auto;
    top: auto !important;
  }
  .um .um-back { display: flex; }
  .um .um-close { display: none; }
  .um .um-chevron,
  .um[data-panel-side="right"] .um-chevron { transform: scaleX(-1); }
  .um-panel-head,
  .um-panel-small .um-panel-head { padding: 12px 14px 0 6px; }
  .um-tabs { padding: 8px 14px 0; }
  .um-tabpanel,
  .um-panel-body,
  .um-panel-small .um-panel-body { padding: 14px; }
  .um-panel-shortcuts { padding: 12px 14px 14px; }
  .um-panel-shortcuts .um-panel-head { display: flex; padding: 0 0 4px; }
  .um-panel-list .um-panel-head { display: flex; padding: 8px 8px 0; }
  /* The rails have no narrow form, so only top and bottom are offered there. */
  .um .um-position[data-position="left"],
  .um .um-position[data-position="right"] { display: none; }
  .um-fields { grid-template-columns: 1fr; }
}

/* Callout panels (info / warning / error) inserted via the TinyMCE "callout"
   plugin. Kept in sync with the CONTENT_CSS block in that plugin so panels look
   the same while editing and when viewing saved content. */
.ion-callout {
    position: relative;
    margin: 8px 16px 8px 0;
    padding: 10px 12px 10px 40px;
    border: 1px solid transparent;
    border-radius: 8px;
}

/* The icon is a real <span class="ion-callout-icon"> in the markup (with inline
   styles) so it survives in emails; these rules only position it in the app. */
.ion-callout-icon {
    position: absolute;
    left: 12px;
    top: 9px;
    font-size: 16px;
    line-height: 1.3;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
}

/* Tag-keyed rather than `> *`: a universal subject lands in Blink's universal bucket and is
   tested against every element in the document. Only elements with default vertical margins
   need the reset, so unlisted inline content behaves the same either way. The plugin's
   CONTENT_CSS copy keeps `> *` -- it runs inside the editor iframe, whose document is small
   enough that the universal bucket costs nothing there. */
.ion-callout > p:first-child,     .ion-callout > .ion-callout-icon + p,
.ion-callout > div:first-child,   .ion-callout > .ion-callout-icon + div,
.ion-callout > ul:first-child,    .ion-callout > .ion-callout-icon + ul,
.ion-callout > ol:first-child,    .ion-callout > .ion-callout-icon + ol,
.ion-callout > dl:first-child,    .ion-callout > .ion-callout-icon + dl,
.ion-callout > pre:first-child,   .ion-callout > .ion-callout-icon + pre,
.ion-callout > table:first-child, .ion-callout > .ion-callout-icon + table,
.ion-callout > hr:first-child,    .ion-callout > .ion-callout-icon + hr,
.ion-callout > h1:first-child,    .ion-callout > .ion-callout-icon + h1,
.ion-callout > h2:first-child,    .ion-callout > .ion-callout-icon + h2,
.ion-callout > h3:first-child,    .ion-callout > .ion-callout-icon + h3,
.ion-callout > h4:first-child,    .ion-callout > .ion-callout-icon + h4,
.ion-callout > h5:first-child,    .ion-callout > .ion-callout-icon + h5,
.ion-callout > h6:first-child,    .ion-callout > .ion-callout-icon + h6,
.ion-callout > blockquote:first-child,
.ion-callout > .ion-callout-icon + blockquote,
.ion-callout > figure:first-child,  .ion-callout > .ion-callout-icon + figure {
    margin-top: 0;
}

.ion-callout > p:last-child,     .ion-callout > div:last-child,
.ion-callout > ul:last-child,    .ion-callout > ol:last-child,
.ion-callout > dl:last-child,    .ion-callout > pre:last-child,
.ion-callout > table:last-child, .ion-callout > hr:last-child,
.ion-callout > blockquote:last-child,
.ion-callout > h1:last-child,    .ion-callout > h2:last-child,
.ion-callout > h3:last-child,    .ion-callout > h4:last-child,
.ion-callout > h5:last-child,    .ion-callout > h6:last-child,
.ion-callout > figure:last-child {
    margin-bottom: 0;
}

.ion-callout-info {
    background: #e7f3fe;
    border-color: #b6dcfb;
    color: #0b3d66;
}

.ion-callout-warning {
    background: #fff8e6;
    border-color: #ffe8a3;
    color: #6b4e00;
}

.ion-callout-error {
    background: #fdecea;
    border-color: #f9c9c4;
    color: #7a1f16;
}

/* Dark theme, app UI only. !important beats the baked-in inline light colours so
   saved panels adapt in-app; emails (no body.dark/stylesheet) keep the inline styles. */
body.dark .ion-callout-info {
    background: #10263b !important;
    border-color: #204a73 !important;
    color: #cfe3ff !important;
}

body.dark .ion-callout-warning {
    background: #33290a !important;
    border-color: #5c4a12 !important;
    color: #f5de80 !important;
}

body.dark .ion-callout-error {
    background: #3a1512 !important;
    border-color: #6b241d !important;
    color: #f3b7b0 !important;
}

body.dark .ion-callout-info .ion-callout-icon {
    color: #6ea8ff !important;
}

body.dark .ion-callout-warning .ion-callout-icon {
    color: #ffcc4d !important;
}

body.dark .ion-callout-error .ion-callout-icon {
    color: #ff6b60 !important;
}

/* The plugin's floating remove button. It is appended to editor.getDoc().body, which for an
   inline editor is this document, so the rules have to be here and not only in CONTENT_CSS. */
.ion-callout-remove {
    position: fixed;
    z-index: 10;
    width: 18px;
    height: 18px;
    display: none;
    align-items: center;
    justify-content: center;
    line-height: 1;
    text-align: center;
    cursor: pointer;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.12);
    color: #333;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.ion-callout-remove:hover {
    background: rgba(0, 0, 0, 0.25);
}

/* http://prismjs.com/download.html?themes=prism&languages=markup+css+clike+javascript */
/**
 * prism.js default theme for JavaScript, CSS and HTML
 * Based on dabblet (http://dabblet.com)
 * @author Lea Verou
 */

/* `[class*="language-"]` is deliberately avoided throughout. Blink buckets a rule by its
   rightmost compound preferring id > class > attribute > tag, so the attribute selector beat
   the `pre`/`code` tag and these rules were tested against every element carrying a class —
   3.4ms per style recalc on a 1000-row grid page with no code block on it at all. The :is()
   list is class-keyed and has identical specificity (a class, same as the attribute selector).
   Languages = codefence plugin.js DEFAULT_LANGUAGES, plus Prism's own aliases. */
code:is(.language-markup,.language-html,.language-xml,.language-svg,.language-mathml,.language-javascript,.language-js,.language-css,.language-clike,.language-php,.language-ruby,.language-python,.language-java,.language-c,.language-csharp,.language-cpp,.language-none),
pre:is(.language-markup,.language-html,.language-xml,.language-svg,.language-mathml,.language-javascript,.language-js,.language-css,.language-clike,.language-php,.language-ruby,.language-python,.language-java,.language-c,.language-csharp,.language-cpp,.language-none) {
	color: var(--txt-color);
	text-shadow: 0 1px var(--bg-border-light);
	font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
	direction: ltr;
	text-align: left;
	white-space: pre;
	word-spacing: normal;
	word-break: normal;
	word-wrap: normal;
	line-height: 1.5;

	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;

	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

/* Keyed on `.token` (a Prism-only class) instead of `pre[class*="language-"] *`: a
   class-attribute selector in an ancestor compound makes every class change in the
   document walk the whole subtree, and a universal subject makes it a full recalc —
   together ~100ms per hover in/out of a 5000-row grid. */
pre:is(.language-markup,.language-html,.language-xml,.language-svg,.language-mathml,.language-javascript,.language-js,.language-css,.language-clike,.language-php,.language-ruby,.language-python,.language-java,.language-c,.language-csharp,.language-cpp,.language-none)::-moz-selection,
code:is(.language-markup,.language-html,.language-xml,.language-svg,.language-mathml,.language-javascript,.language-js,.language-css,.language-clike,.language-php,.language-ruby,.language-python,.language-java,.language-c,.language-csharp,.language-cpp,.language-none)::-moz-selection,
.token::-moz-selection {
	text-shadow: none;
	background: #b3d4fc;
}

pre:is(.language-markup,.language-html,.language-xml,.language-svg,.language-mathml,.language-javascript,.language-js,.language-css,.language-clike,.language-php,.language-ruby,.language-python,.language-java,.language-c,.language-csharp,.language-cpp,.language-none)::selection,
code:is(.language-markup,.language-html,.language-xml,.language-svg,.language-mathml,.language-javascript,.language-js,.language-css,.language-clike,.language-php,.language-ruby,.language-python,.language-java,.language-c,.language-csharp,.language-cpp,.language-none)::selection,
.token::selection {
	text-shadow: none;
	background: #b3d4fc;
}

@media print {
	code:is(.language-markup,.language-html,.language-xml,.language-svg,.language-mathml,.language-javascript,.language-js,.language-css,.language-clike,.language-php,.language-ruby,.language-python,.language-java,.language-c,.language-csharp,.language-cpp,.language-none),
	pre:is(.language-markup,.language-html,.language-xml,.language-svg,.language-mathml,.language-javascript,.language-js,.language-css,.language-clike,.language-php,.language-ruby,.language-python,.language-java,.language-c,.language-csharp,.language-cpp,.language-none) {
		text-shadow: none;
	}
}

/* Code blocks */
pre:is(.language-markup,.language-html,.language-xml,.language-svg,.language-mathml,.language-javascript,.language-js,.language-css,.language-clike,.language-php,.language-ruby,.language-python,.language-java,.language-c,.language-csharp,.language-cpp,.language-none) {
	padding: 1em;
	margin: .5em 0;
	overflow: auto;
}

/* The codesample plugin links this file straight into the editor iframe, where the
   design tokens from base.css are not loaded, so every var() needs a fallback. */
:not(pre) > code:is(.language-markup,.language-html,.language-xml,.language-svg,.language-mathml,.language-javascript,.language-js,.language-css,.language-clike,.language-php,.language-ruby,.language-python,.language-java,.language-c,.language-csharp,.language-cpp,.language-none),
pre:is(.language-markup,.language-html,.language-xml,.language-svg,.language-mathml,.language-javascript,.language-js,.language-css,.language-clike,.language-php,.language-ruby,.language-python,.language-java,.language-c,.language-csharp,.language-cpp,.language-none) {
	background: var(--east-bg, #fbfbfb);
	border-radius: var(--border-radius-md, 12px);
	border: 1px solid var(--bg-border-light, #e9ecee);
}

/* Inline code */
:not(pre) > code:is(.language-markup,.language-html,.language-xml,.language-svg,.language-mathml,.language-javascript,.language-js,.language-css,.language-clike,.language-php,.language-ruby,.language-python,.language-java,.language-c,.language-csharp,.language-cpp,.language-none) {
	padding: .1em;
	border-radius: .3em;
}

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
	color: slategray;
}

.token.punctuation {
	color: #999;
}

.namespace {
	opacity: .7;
}

.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
	color: #905;
}

.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
	color: #690;
}

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
	color: #a67f59;
	/*background: hsla(0, 0%, 100%, .5);*/
}

.token.atrule,
.token.attr-value,
.token.keyword {
	color: #07a;
}

.token.function {
	color: #DD4A68;
}

.token.regex,
.token.important,
.token.variable {
	color: #e90;
}

.token.important,
.token.bold {
	font-weight: bold;
}
.token.italic {
	font-style: italic;
}

.token.entity {
	cursor: help;
}


/* Example tokeninput style #1: Token vertical list*/
ul.token-input-list {
    overflow: hidden; 
    height: auto !important; 
    height: 1%;
    width: 400px;
    border: 1px solid #999;
    cursor: text;
    font-size: 12px;
    font-family: Verdana;
    z-index: 999;
    margin: 0;
    padding: 0;
    background-color: #fff;
    list-style-type: none;
    clear: left;
}

ul.token-input-list li {
    list-style-type: none;
}

ul.token-input-list li input {
    border: 0;
    width: 350px;
    padding: 3px 8px;
    background-color: white;
    -webkit-appearance: caret;
}

li.token-input-token {
    overflow: hidden; 
    height: auto !important; 
    height: 1%;
    margin: 3px;
    padding: 3px 5px;
    background-color: #d0efa0;
    color: #000;
    font-weight: bold;
    cursor: default;
    display: block;
}

li.token-input-token p {
    float: left;
    padding: 0;
    margin: 0;
}

li.token-input-token span {
    float: right;
    color: #777;
    cursor: pointer;
}

li.token-input-selected-token {
    background-color: #08844e;
    color: #fff;
}

li.token-input-selected-token span {
    color: #bbb;
}

div.token-input-dropdown {
    position: absolute;
    width: 400px;
    background-color: #fff;
    overflow: hidden;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    cursor: default;
    font-size: 12px;
    font-family: Verdana;
    z-index: 1;
}

div.token-input-dropdown p {
    margin: 0;
    padding: 5px;
    font-weight: bold;
    color: #777;
}

div.token-input-dropdown ul {
    margin: 0;
    padding: 0;
}

div.token-input-dropdown ul li {
    background-color: #fff;
    padding: 3px;
    list-style-type: none;
}

div.token-input-dropdown ul li.token-input-dropdown-item {
    background-color: #fafafa;
}

div.token-input-dropdown ul li.token-input-dropdown-item2 {
    background-color: #fff;
}

div.token-input-dropdown ul li em {
    font-weight: bold;
    font-style: normal;
}

div.token-input-dropdown ul li.token-input-selected-dropdown-item {
    background-color: #d0efa0;
}


/* Example tokeninput style #2: Facebook style */
ul.token-input-list-facebook {
    overflow: hidden; 
    width: calc(100% - 56px);
    cursor: text;
    font-size: 12px;
    font-family: Verdana;
    min-height: 1px;
    z-index: 999;
    margin: 0;
    padding: 0;
    background-color: #fff;
    list-style-type: none;
    margin-bottom: 3px;
}

ul.token-input-list-facebook:after { font-family: ionbiz; content: "\e600"; color: var(--txt-color);float: right;margin-top: 12px;}
ul.token-input-list-facebook:hover:after { color: var(--menu-hover);}

ul.token-input-list-facebook li input {
    border: 0 !important;
    width: 100px;
    padding: 3px 8px;
    background-color: inherit;
    margin-top: 2px !important;
    margin: 3px 0;
    -webkit-appearance: caret;
}
ul.token-input-list-facebook li.token-input-input-token-facebook input:focus{
    outline-color:transparent !important;
}

li.token-input-token-facebook {
    overflow: hidden;
    height: auto !important;
    height: 15px;
    margin: 7px 3px 3px 3px;
    padding: 3px 5px 4px 5px;
    font-weight: 400;
    background-color: color-mix(in srgb, var(--blue), var(--bg) 92%);
    color: color-mix(in srgb, var(--blue), var(--txt-color) 25%);
    cursor: default;
    border: 1px solid var(--blue);
    font-size: 11px;
    border-radius: 16px;
    -moz-border-radius: 16px;
    -webkit-border-radius: 16px;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
    float: left;
    white-space: nowrap;
}

li.token-input-token-facebook p {
    display: inline;
    padding: 0;
    margin: 0;
}

li.token-input-token-facebook span {
    color: currentColor;
    margin-left: 5px;
    cursor: pointer;
}

li.token-input-selected-token-facebook {
    background-color: #5670a6;
    border: 1px solid #3b5998;
    color: #fff;
}

li.token-input-input-token-facebook {
    float: left;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

div.token-input-dropdown-facebook {
    position: absolute;
    width: 330px;
    background-color: var(--bg);
    overflow: hidden;
    border: 1px solid var(--bg-border);
    cursor: default;
    border-radius: var(--border-radius-sm);
    border-top-right-radius: var(--border-radius-xl);
    border-bottom-right-radius: var(--border-radius-xl);
    padding:4px 8px 4px 8px;
    z-index: 103;
    box-shadow: 0 0 30px 1px var(--shaddow);
}

div.token-input-dropdown-facebook p {
    margin: 0;
    padding: 5px;
    font-weight: bold;
    font-size:11px;
    color: var(--txt-color);
}

div.token-input-dropdown-facebook ul {
    margin: 0;
    padding: 0;
}

div.token-input-dropdown-facebook ul li {
    background-color: #fff;
    padding: 3px 8px 3px 8px;
    margin: 0;
    margin-bottom: 7px;
    list-style-type: none;
}

div.token-input-dropdown-facebook ul li.token-input-dropdown-item-facebook {
    background-color: #fff;
}

div.token-input-dropdown-facebook ul li.token-input-dropdown-item2-facebook {
    background-color: #fff;
}

div.token-input-dropdown-facebook ul li em {
    font-weight: bold;
    font-style: normal;
}

div.token-input-dropdown-facebook ul li.token-input-selected-dropdown-item-facebook {
    background-color: var(--menu-hover) !important;
    color: var(--bg) !important;
}


/*******************************************************
    Overrides
********************************************************/
li.token-input-token-facebook.green {    
    color: var(--dark-green) !important;    
    border-color: color-mix(in srgb, var(--dark-green, transparent), var(--bg) 80%);
    background-color: color-mix(in srgb, var(--dark-green), var(--bg) 92%);
}

li.token-input-token-facebook.lightGreen {    
    color: rgb(62 97 20) !important;    
    border-color: color-mix(in srgb, rgb(129, 186, 62), var(--bg) 80%);
    background-color: color-mix(in srgb, rgb(129, 186, 62), var(--bg) 92%);
}

li.token-input-token-facebook.blue {    
    color: color-mix(in srgb, var(--blue), var(--txt-color) 25%) !important;    
    border-color: color-mix(in srgb, var(--blue, transparent), var(--bg) 80%);
    background-color: color-mix(in srgb, var(--blue), var(--bg) 92%);
}

li.token-input-token-facebook.searchList {
    float: none;
    margin-top: 4px;
    display: table;
}

li.token-input-token-facebook.searchList:hover {
    background-color: var(--menu-hover) !important;
    border-color: var(--menu-hover) !important;
    color:var(--bg) !important;
}

.token-input-dropdown-facebook { display: table-cell;width:auto !important;}

li.token-input-token-facebook:not(.specificToken):before {
    content: "#";
    margin-right: 4px;
    margin-left: 4px;
}

li.token-input-token-facebook.green:not(.specificToken):before, li.token-input-token-facebook.lightGreen:not(.specificToken):before {
    content: "@";
    margin-right: 4px;
    margin-left: 4px;
    position: relative;
    top: -1px;
}
@charset 'UTF-8';
/*
 * jQuery File Upload UI Plugin CSS 6.3
 * https://github.com/blueimp/jQuery-File-Upload
 *
 * Copyright 2010, Sebastian Tschan
 * https://blueimp.net
 *
 * Licensed under the MIT license:
 * http://www.opensource.org/licenses/MIT
 */

.fileinput-button {
  position: relative;
  overflow: hidden;
  float: left;
}
.fileinput-button input {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  border: solid transparent;
  padding: 100%;
  opacity: 0;
  filter: alpha(opacity=0);
  -moz-transform: translate(-300px, 0) scale(4);
  direction: ltr;
  cursor: pointer;
}
.fileupload-buttonbar .btn,
.fileupload-buttonbar .toggle {
  margin-bottom: 5px;
}
.files .progress {
  width: 200px;
}
.progress-animated .bar {
  background: url(../Lib/img/progressbar.gif) !important;
  filter: none;
}
.fileupload-loading {
  position: absolute;
  left: 50%;
  width: 128px;
  height: 128px;
  background: url(../Lib/img/loading.gif) center no-repeat;
  display: none;
}
.fileupload-processing .fileupload-loading {
  display: block;
}

/* Fix for IE 6: */
*html .fileinput-button {
  line-height: 22px;
  margin: 1px -3px 0 0;
}

/* Fix for IE 7: */
*+html .fileinput-button {
  margin: 1px 0 0 0;
}

@media (max-width: 480px) {
  .files .btn span {
    display: none;
  }
  .files .preview * {
    width: 40px;
  }
  .files .name * {
    width: 80px;
    display: inline-block;
    word-wrap: break-word;
  }
  .files .progress {
    width: 20px;
  }
  .files .delete {
    width: 60px;
  }
}

.minicolors {
    position: relative;
    display:inline-block;
    float:left;
}

.minicolors-sprite {
    background-image: url(data:image/png;base64,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);
}

.minicolors-swatch {
    position: absolute;
    vertical-align: middle;
    background-position: -80px 0;
    cursor: text;
    padding: 0;
    margin: 0;
    display: inline-block;  
    border-radius:3px;  
    box-sizing: border-box;
}

li.minicolors-swatch 
{    
    width: 18px!important;
    height: 18px!important;
    margin: 2px 2px 1px 1px!important;
    border-radius: 8px;
}

.minicolors-swatch-color {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 1px solid var(--bg-border-light);
    border-radius:50%;
}

.minicolors input[type=hidden] + .minicolors-swatch {
    width: 28px;
    position: static;
    cursor: pointer;
}

/* Panel */
.minicolors-panel {
    width: 173px;
    height: 237px;
    background: var(--east-bg);
    border: solid 1px var(--bg-border);
    box-shadow: 0 0 10px var(--shaddow);
    z-index: 99999;
    box-sizing: content-box;
    display: none;
    position:fixed;
    border-radius:8px;
}

.minicolors-panel.minicolors-visible {
    display: block;
}

/* Panel positioning */
.minicolors-position-top .minicolors-panel { /*top: -238px;*/ }

.minicolors-position-right .minicolors-panel {
    right: 0;
}

.minicolors-position-bottom .minicolors-panel {
    margin-top: 10px;
}

.minicolors-position-left .minicolors-panel { 
    margin-top:10px;
    margin-left:-173px;/*make it show in reports, overflows ooutside of vieport otherwise*/
}

.minicolors-with-opacity .minicolors-panel {
    width: 194px;
}

.minicolors .minicolors-grid {
    position: absolute;
    top: 1px;
    left: 1px;
    width: 150px;
    height: 150px;
    background-position: -120px 0;
    cursor: crosshair;
    border-radius:8px;
}

.minicolors .minicolors-grid-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 150px;
    height: 150px;
}

.minicolors-slider-saturation .minicolors-grid {
    background-position: -420px 0;
}

.minicolors-slider-saturation .minicolors-grid-inner {
    background-position: -270px 0;
    background-image: inherit;
}

.minicolors-slider-brightness .minicolors-grid {
    background-position: -570px 0;
}

.minicolors-slider-brightness .minicolors-grid-inner {
    background-color: black;
}

.minicolors-slider-wheel .minicolors-grid {
    background-position: -720px 0;
}

.minicolors-slider,
.minicolors-opacity-slider {
    position: absolute;
    top: 1px;
    left: 152px;
    width: 20px;
    height: 150px;
    background-color: white;
    background-position: 0 0;
    cursor: row-resize;
    border-radius: 8px;
}

.minicolors-slider-saturation .minicolors-slider {
    background-position: -60px 0;
}

.minicolors-slider-brightness .minicolors-slider {
    background-position: -20px 0;
}

.minicolors-slider-wheel .minicolors-slider {
    background-position: -20px 0;
}

.minicolors-opacity-slider {
    left: 173px;
    background-position: -40px 0;
    display: none;
}

.minicolors-with-opacity .minicolors-opacity-slider {
    display: block;
}

/* Pickers */
.minicolors-grid .minicolors-picker {
    position: absolute;
    top: 70px;
    left: 70px;
    width: 12px;
    height: 12px;
    border: solid 1px black;
    border-radius: 10px;
    margin-top: -6px;
    margin-left: -6px;
    background: none;
}

.minicolors-grid .minicolors-picker > div {
    position: absolute;
    top: 0;
    left: 0;
    width: 8px;
    height: 8px;
    border-radius: 8px;
    border: solid 2px white;
    box-sizing: content-box;
}

.minicolors-picker {
    position: absolute;
    top: 0;
    left: 0;
    width: 18px;
    height: 2px;
    background: white;
    border: solid 1px black;
    margin-top: -2px;
    box-sizing: content-box;
    border-radius:8px;
}

/* Swatches */
ul.minicolors-swatches  {
    margin-left: 1px;
    padding-left: 2px;
    width: 171px;
}

.minicolors-swatches,
.minicolors-swatches li {
    margin: 151px 0 0px 0px;
    padding: 0;
    list-style: none;
    overflow: hidden;
}

.minicolors-swatches .minicolors-swatch {
    position: relative;
    float: left;
    cursor: pointer;
    margin:0 0px 0 0;
}

.minicolors-with-opacity .minicolors-swatches .minicolors-swatch {
    margin-right: 7px;
}

.minicolors-swatch.selected {
    border-color: #000;
}

/* Inline controls */
.minicolors-inline {
    display: inline-block;
}

.minicolors-inline .minicolors-input {
    display: none !important;
}

.minicolors-inline .minicolors-panel {
    position: relative;
    top: auto;
    left: auto;
    box-shadow: none;
    z-index: auto;
    display: inline-block;
}

/* Default theme */
.minicolors-theme-default .minicolors-swatch {
    width: 14px;
    height: 14px;
    border-radius: 50%;
}

.minicolors-input-swatch 
{
    /* base.css forces the swatch to position:relative, so these are offsets from its
       static position, not from the wrapper. 9px = 16 - half the 14px swatch, which
       puts the centre on the same 16px as .colorautocomplete-color:after and on the
       30px input's vertical centre line. */
    top:9px;
    left:9px;
}


.minicolors-theme-default .minicolors-input {
    height: 20px;
    width: auto;
    display: inline-block;
    padding-left: 26px!important;
    border-radius:20px !important;
}
.minicolors-theme-default.minicolors-position-right .minicolors-input {
    padding-right: 26px;
    padding-left: inherit;
}

/* Bootstrap theme */
.minicolors-theme-bootstrap .minicolors-swatch {
    z-index: 2;
    top: 3px;
    left: 3px;
    width: 28px;
    height: 28px;
    border-radius: 3px;
}
.minicolors-theme-bootstrap .minicolors-swatch-color {
    border-radius: inherit;
}
.minicolors-theme-bootstrap.minicolors-position-right .minicolors-swatch {
    left: auto;
    right: 3px;
}
.minicolors-theme-bootstrap .minicolors-input {
    float: none;
    padding-left: 44px;
}
.minicolors-theme-bootstrap.minicolors-position-right .minicolors-input {
    padding-right: 44px;
    padding-left: 12px;
}
.minicolors-theme-bootstrap .minicolors-input.input-lg + .minicolors-swatch {
    top: 4px;
    left: 4px;
    width: 37px;
    height: 37px;
    border-radius: 5px;
}
.minicolors-theme-bootstrap .minicolors-input.input-sm + .minicolors-swatch {
    width: 24px;
    height: 24px;
}
.input-group .minicolors-theme-bootstrap:not(:first-child) .minicolors-input {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}