/*
include_meta {
    DevMode: false,
    Category: "Public",
    LoadPriority: 10,
    Media: "screen"
}
*/
@charset "UTF-8";

/*Manrope (replaces Avenir, Euclid)*/
@font-face {
  font-family: 'Manrope';
  src: url(/fonts/Manrope-Regular.ttf) format('truetype');
  font-weight: 400;
}

@font-face {
  font-family: 'Manrope';
  src: url(/fonts/Manrope-Medium.ttf) format('truetype');
  font-weight: 500;
}

@font-face {
  font-family: 'Manrope';
  src: url(/fonts/Manrope-SemiBold.ttf) format('truetype');
  font-weight: 600;
}

@font-face {
  font-family: 'Manrope';
  src: url(/fonts/Manrope-Bold.ttf) format('truetype');
  font-weight: 700;
}

@font-face {
  font-family: 'Manrope';
  src: url(/fonts/Manrope-Light.ttf) format('truetype');
  font-weight: 300;
}


/*Kanit*/

@font-face {
	font-family: KanitBold;
	src: url(/fonts/kanit/Kanit-Bold.ttf);
  }


* {
	font-family: 'Manrope', 'Segoe UI', Verdana, Geneva, Arial, Sans;
}

:root {
	--toolkit-shell-gutter: 20px;
	--workspace-sidebar-basis: 20%;
	--workspace-sidebar-min-width: 280px;
	--workspace-sidebar-max-width: 480px;
	--workspace-sidebar-padding: 20px;
	--workspace-module-header-height: 61px;
	--workspace-module-header-padding: 10px 14px;
	--workspace-layout-gap: 15px; /* main content ↔ side panel, every module */
	--workspace-toolbar-control-height: 37px;
	--workspace-primary-action-padding-inline: 20px;
	--workspace-primary-action-min-width: 144px; /* "Create Event" is the widest label; all module create buttons match it */

	/* Every module title reads this - calendar, tasks, entity lists, mod-* views,
	   the docs and scheduler sidebars, and the form editor. They had drifted to
	   25px in five separate rules and 22px inherited from two sidebar headers. */
	--module-title-size: 23px;
	/* Manrope ships no ExtraBold, so font-weight tops out at 700. A currentColor
	   stroke fattens the glyphs to sit between 700 and 800. Absolute, not
	   relative to font-size - do not reuse this value on smaller stroked text. */
	--module-title-stroke: 1px;

	/* Dimensional button language. Reference specimen: the Duplicate button in
	   the form builder's read-only callout. An object reads as solid from four
	   cues - a lit top edge, a dark bottom edge (the "thickness"), a face that
	   runs light to dark, and a tight contact shadow under a wide ambient one.
	   Shade within the hue, never toward black. */
	--btn-radius: 8px;
	--btn-font-weight: 600;
	--btn-shadow-hue: 4, 44, 78;
	--btn-focus-ring: rgba(79, 151, 210, 0.32);

	/* Primary: navy */
	--btn-fill: #00529b;
	--btn-fill-hover: #075ca5;
	--btn-sheen: linear-gradient(180deg, rgba(61, 193, 255, 0.18) 0%, rgba(61, 193, 255, 0) 100%);
	--btn-border: rgba(0, 51, 96, 0.22);
	--btn-specular: rgba(255, 255, 255, 0.18);
	--btn-underside: rgba(0, 42, 80, 0.24);
	--btn-press: rgba(0, 42, 80, 0.18);

	/* Neutral: white */
	--btn-neutral-fill: #eff2f7;
	--btn-neutral-fill-hover: #e4eaf3;
	--btn-neutral-sheen: linear-gradient(180deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
	--btn-neutral-border: rgba(23, 43, 71, 0.2);
	--btn-neutral-specular: rgba(255, 255, 255, 0.9);
	--btn-neutral-underside: rgba(23, 43, 71, 0.1);
	--btn-neutral-press: rgba(23, 43, 71, 0.16);
}

div {
	font-size: 14px;
}

blockquote {
	font-style: italic;
}

blockquote::before {
	content: "\"";
}

blockquote::after {
	content: "\"";
}

table {
    border-collapse: separate;
}

a {
	cursor: pointer;
}

.disabled_text {
	color: graytext;
}

/*textarea .rtf {

}*/

label.required::before {
	content: "*";
	color: red;
}

.display_none {
	display: none;
}

#vc_root_content {
	height: 100%;
}

/* Arriving from the Toolkit sign-in page (AppArrival, vc_app_pre_init.ts): the first paint is the
 * sign-in page's last frame, a white page with the mark at the window's centre, and the shell is
 * built out of sight beneath it. */
#app_arrival_mark {
	display: none;
}

html.app-arriving body {
	background-color: #ffffff;
}

html.app-arriving #app_arrival_mark {
	display: block;
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 100000;
	width: 48px;
	height: 64px;
	margin: -32px 0 0 -24px;
	background: url(/images/welcome/toolkit-mark.svg) no-repeat center / contain;
	pointer-events: none;
}

html.app-arriving #vc_root_content {
	opacity: 0;
}

.version-container {
	text-align: right;
}

.version-container > span {
	font-size: 8px;
	color: #ccc;
	margin-right: 10px;
}

.feedback_tab {
	position: fixed;
	right: 0px;
	width: 40px;
	min-height: 150px;
	top: 475px;
	background-color: #1e4a6f;
	color: #ffffff;
	text-align: center;
	vertical-align: center;
	opacity: .75;
}

.feedback_tab div {
	font-size: 14px;
	text-transform: uppercase;
	position: absolute;
	bottom: 22.5px;
	left: 20px;
	/*text-algin: left;
	vertical-align: bottom;*/

             filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);  /* IE6,IE7 */
         -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)"; /* IE8 */
     -moz-transform: rotate(-90.0deg);  /* FF3.5+ */
      -ms-transform: rotate(-90.0deg);  /* IE9+ */
       -o-transform: rotate(-90.0deg);  /* Opera 10.5 */
  -webkit-transform: rotate(-90.0deg);  /* Safari 3.1+, Chrome */
          transform: rotate(-90.0deg);  /* Standard */
    transform-origin: left center;
}

body, html {
	margin: 0px;
	padding: 0px;
	height: 100%;
	width: 100%;
	background-color: #fff;
	/*overflow-y: scroll;*/
}

.ui-dialog {
	font-size: 12px;
}

#content_table {
	margin: 0px;
	padding: 0px;
	border-collapse: collapse;
	width: 100%;
	height: 100%;
}

#content_table th {
	height: 30px;
	margin: 0px;
	padding: 0px;
}

#content_table td {
	vertical-align: top;
	margin: 0px;
	padding: 0px;
}

/*#sidebar {*/
	/*position: fixed;*/
	/*top: 30px;*/
	/*background-color: #00529b;*/
	/*min-height: 400px;*/
	/*height: 100%;*/
  	/*background: -webkit-linear-gradient(left, #1e4a6f, #2b5b83);*/ /* For Safari 5.1 to 6.0 */
  	/*background: -o-linear-gradient(right, #1e4a6f, #2b5b83);*/ /* For Opera 11.1 to 12.0 */
  	/*background: -moz-linear-gradient(right, #1e4a6f, #2b5b83);*/ /* For Firefox 3.6 to 15 */
  	/*background: linear-gradient(to right, #1e4a6f, #2b5b83);*/ /* Standard syntax */
  	/*border-right: 3px ridge #424242;*/
/*}*/

/*
.side_menu_title_container {
	width: 300px;
	color: white;
	font-size: 20px;
	text-align: left;
	vertical-align: middle;
	padding: 6px 10px;
	border-radius: 5px;
	/*background-color: #00529b;*/
  	/*background: -webkit-linear-gradient(left, #1e4a6f, #2b5b83); */ /* For Safari 5.1 to 6.0 */
  	/*background: -o-linear-gradient(right, #1e4a6f, #2b5b83); */ /* For Opera 11.1 to 12.0 */
  	/*background: -moz-linear-gradient(right, #1e4a6f, #2b5b83); */ /* For Firefox 3.6 to 15 */
  	/*background: linear-gradient(to right, #1e4a6f, #2b5b83);*/  /* Standard syntax */
  /*	overflow: hidden;
  	text-overflow: ellipsis;
}*/

#menu_vertical, .side_menu_title_wrapper, .menu_book, .menu_item {
	display: block;
	color: white;
	white-space: nowrap;
	padding: 20px;
	margin: 2px 0px 2px 0px;
	border-bottom: 1px solid #ffffff;
	cursor: pointer;
	font-size: 16px;
}

#menu_vertical, .side_menu_title_wrapper {
	cursor: default;
	font-size: 18px;
	padding: 15px;
	font-size: 20px;
	background: #fbfcfd;
}


/*#menu_vertical span {
}*/

.menu_book, .menu_item {
	font-size: 18px;
}

#menu_subpanel {
	position: absolute;
	border: 2px solid #c1c1c1;
	border-top: 0px;
	display: none;
	background-color: #FFFFFF;
	z-index: 10;
	min-width: 150px;
	text-align: left;
	color: #444444;
	padding: 5px;
}

#menu_subpanel hr {
	margin-left: 5px;
	margin-right: 5px;
	border: none;
	border-top: 1px solid black;
}

#menu_bar_right_menu_container {
	display: flex;
	align-items: center;
	padding: 0px;
	margin: 0px;
	height: 100%;
	cursor: pointer;
}

/* App-blue avatar coin beside the user's name, mirroring the account
   menu's identity avatar at top-bar scale. */
.menu_bar_avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 22px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	overflow: hidden;
	background-image: linear-gradient(180deg, #2f7fd0, #00529b);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.35),
		inset 0 -1px 0 rgba(0, 30, 60, 0.35);
	color: #fff;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.03em;
	user-select: none;
}

.menu_bar_avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Academy keeps its own initial circle. */
.pa-root * .menu_bar_avatar {
	display: none;
}

/*
#menu_bar_right_menu_container:hover {
	background-color: #666;
}
*/

.name_container {
	padding: 0px;
	margin: 0px;
	margin-right: 10px;
	margin-left: 8px;
	text-align: center;
}

/*
.name_container:hover {
	border: 1px solid #999;
	border-radius: 3px;
}
*/

#books_subpanel, #submenu {
	position: absolute;
	min-width: 200px;
	border-right: 1px solid black;
	/*border-top: 2px solid #c1c1c1;*/
	display: none;
	background-color: #FFFFFF;
	padding: 10px;
	z-index: 100;
	/*
	border-top-right-radius: 20px;
	border-bottom-right-radius: 20px;
	box-shadow: 7px 7px 7px #888888;
	*/
}

#books_subpanel hr {
	border: none;
	border-bottom: 1px solid #000;
}

/*#content {*/
	/*position: fixed;*/
	/*top: 30px;*/
	/*overflow-y: scroll;*/
	/*padding: 40px 40px 40px 55px;*/
	/*z-index: -5;*/
/*}*/

#login {
	display: inline-block;
	margin: 0 auto;
	height: 100px;
}

/*#login table {

}*/

.no-close .ui-dialog-titlebar-close {
  display: none;
}

.menu_title {
	color: #400040;
}

.menu_section {
	padding: 10px;
	/*line-spacing: 40px;*/
	vertical-align: center;
	cursor: pointer;
	font-size: 12px;
	white-space: nowrap;
}

.menu_section:hover {
	background-color: highlight;
}

#menubar {
	font-size: 12px;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 32px;
	background-color: #222222;
	text-align: right;
	vertical-align: middle;
	color: #ffffff;
	/* padding: 5px 15px 5px 0px; */
  	background: -webkit-linear-gradient(left, #424242, #222222); /* For Safari 5.1 to 6.0 */
  	background: -o-linear-gradient(right, #424242, #222222); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(right, #424242, #222222); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(to right, #424242, #222222); /* Standard syntax */
}

#menubar .menu_bar_layout_table {
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	border-collapse: collapse;
	vertical-align: middle;
}

.menu_bar_layout_table * table {
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	border-collapse: collapse;
	vertical-align: middle;
}

.menu_bar_left_menu_cell {
	white-space: nowrap;
	width: 1%;
	text-align: left;
}

.menu_bar_center_menu_cell {
	white-space: nowrap;
	width: 98%;
	text-align: center;
}

.menu_bar_right_menu_cell {
	white-space: nowrap;
	width: 1%;
	text-align: right;
}

.book_name_input {
	width: 150px;
}

.lookup_input_readonly div.lookup_input_link_container > div.button.search {
	display: none;
}

.melf_input_link_container {
	min-height: 21px;
	min-width: 70px;
	margin: 2px;
    background: #fff;
    border: 1px solid;
    border-radius: 3px;
}
.melf_input_link_container > span {
	margin-right: 4px;
}
.melf_input_link_container > a > span.remove {
	margin-right: auto;
	margin-left: 2px;
	color: #ff0000;
}
.melf_input_link_container > a {
	margin: 2px;
}
.melf_input_link_container > div.button.search {
	margin-left: 5px;
}

.lookup_input, .select2-container {
	min-width: 400px;
}

/* The body-appended select2 dropdown positioning wrapper is a zero-height
   shell; the legacy min-width above must not apply to it, or any dropdown
   opened near the right viewport edge widens the page and pops a
   horizontal scrollbar that shifts the whole layout */
body > .select2-container--open {
	min-width: 0;
}

.lookup_input_link_container a {
	text-decoration: none;
}

.lookup_input_link_container div.search {
	float: left;
	margin-right: 5px;
	margin-top: 2px;
}

td.input_cell > div.lookup_input_link_container {
	border: 1px solid gray;
	border-radius: 2px;
	padding-left: 2px;
	min-height: 19px;
}

/* --- Lookup Dropdown Trigger --- */
.lookup-dropdown-trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 32px;
	width: 100%;
	background-color: #F3F3F3;
	border: 1px solid #E5E5E5;
	border-radius: 10px;
	padding: 0 10px;
	gap: 6px;
	cursor: pointer;
	transition: background-color 0.15s ease;
	box-sizing: border-box;
}

.lookup-dropdown-trigger:hover {
	background-color: #EBEBEB;
}

.lookup-dropdown-trigger-left {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
	flex: 1;
}

.lookup-dropdown-trigger-avatar {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.lookup-dropdown-trigger-avatar span {
	color: #fff;
	font-size: 9px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0.02em;
}

.lookup-dropdown-trigger-avatar .lookup-dropdown-avatar-image,
.lookup-dropdown-avatar .lookup-dropdown-avatar-image {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	border-radius: 50%;
}

.table-member-display {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	max-width: 100%;
	min-width: 0;
	vertical-align: middle;
	color: inherit;
	text-decoration: none;
	white-space: nowrap;
}

a.table-member-display {
	cursor: pointer;
}

a.table-member-display:hover .table-member-name {
	text-decoration: underline;
}

/* 22px is the standard team-member circle size (matches the avatar-stack treatment) */
.table-member-avatar {
	position: relative;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	flex: 0 0 22px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	color: #fff;
	font-size: 9px;
	font-weight: 700;
	line-height: 1;
	text-transform: uppercase;
}

.table-member-avatar-initials {
	position: relative;
	z-index: 1;
	color: #fff;
	font-size: 9px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0;
}

.table-member-avatar-image {
	position: absolute;
	inset: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	border-radius: 50%;
}

.table-member-name {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.table-member-display-avatar-only {
	gap: 0;
}

.lookup-dropdown-trigger-name {
	font-size: 14px;
	font-weight: 400;
	color: #0A0A0A;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.lookup-dropdown-trigger-name.placeholder {
	color: #A1A1A1;
}

a.lookup-dropdown-trigger-name.navigable {
	text-decoration: underline;
	color: #0A0A0A;
}

.lookup-dropdown-trigger-chevron {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	color: #737373;
	display: flex;
	align-items: center;
	justify-content: center;
}

.lookup-dropdown-trigger-clear {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	color: #A1A1A1;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	border-radius: 50%;
	transition: color 0.15s ease, background-color 0.15s ease;
}

.lookup-dropdown-trigger-clear:hover {
	color: #0A0A0A;
	background-color: rgba(0,0,0,0.08);
}

.lookup_input_readonly .lookup-dropdown-trigger-clear {
	display: none;
}

.lookup_input_readonly .lookup-dropdown-trigger {
	pointer-events: none;
	opacity: 0.7;
}

.lookup_input_readonly .lookup-dropdown-trigger-chevron {
	display: none;
}

/* --- Lookup Dropdown Panel --- */
/* #1760: these panels open in the browser's top layer (uix.TopLayer), above every dialog, so none of
   them carries a z-index. Undo the UA [popover] box (centred, inset 0, border, padding, overflow);
   :where() keeps this at zero specificity so each panel's own rules still win. */
:where(.lookup-dropdown-panel, .modern-record-select-popover, .pareto_picker_container)[popover] {
	inset: auto;
	margin: 0;
	padding: 0;
	border: 0;
	overflow: visible;
	width: auto;
	height: auto;
	color: inherit;
	background-color: transparent;
}

.lookup-dropdown-panel {
	position: fixed;
	width: 320px;
	min-width: 320px;
	max-height: 600px;
	border-radius: 10px;
	background: #fff;
	box-shadow: rgba(10,10,10,0.1) 0 0 0 1px, rgba(0,0,0,0.1) 0 4px 6px -1px, rgba(0,0,0,0.1) 0 2px 4px -2px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.lookup-dropdown-search {
	padding: 4px;
	flex-shrink: 0;
}

.lookup-dropdown-search-input {
	width: 100%;
	height: 32px;
	border-radius: 6px;
	border: 1px solid #A1A1A1;
	background: rgba(225,225,225,0.3);
	padding: 4px 10px;
	font-size: 14px;
	font-weight: 400;
	color: #0A0A0A;
	outline: none;
	box-sizing: border-box;
	transition: box-shadow 0.15s ease;
}

.lookup-dropdown-search-input:focus {
	box-shadow: rgba(161,161,161,0.5) 0 0 0 3px;
}

.lookup-dropdown-search-input::placeholder {
	color: #737373;
}

.lookup-dropdown-results {
	max-height: 300px;
	overflow-y: auto;
	overflow-x: hidden;
	padding: 4px;
	overscroll-behavior: contain;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.lookup-dropdown-results::-webkit-scrollbar {
	display: none;
}

.lookup-dropdown-option {
	display: flex;
	align-items: center;
	border-radius: 8px;
	padding: 4px 32px 4px 6px;
	gap: 8px;
	position: relative;
	cursor: pointer;
	transition: background-color 0.1s ease;
}

.lookup-dropdown-option:hover {
	background-color: #F5F5F5;
}

.lookup-dropdown-option.selected {
	background-color: #F9F9F9;
}

.lookup-dropdown-avatar {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.lookup-dropdown-avatar span {
	color: #fff;
	font-size: 9px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0.02em;
}

.lookup-dropdown-option-text {
	display: flex;
	flex-direction: column;
	min-width: 0;
	flex: 1;
}

.lookup-dropdown-option-name {
	font-size: 14px;
	font-weight: 500;
	color: #0A0A0A;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.lookup-dropdown-option-email {
	font-size: 12px;
	font-weight: 400;
	color: #737373;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.lookup-dropdown-option-check {
	position: absolute;
	right: 8px;
	top: 50%;
	transform: translateY(-50%);
	width: 16px;
	height: 16px;
	color: #0A0A0A;
	display: flex;
	align-items: center;
	justify-content: center;
}

.lookup-dropdown-loading,
.lookup-dropdown-empty {
	padding: 12px 10px;
	font-size: 13px;
	color: #737373;
	text-align: center;
}

input.forminput {
	border: 1px solid gray;
	border-radius: 2px;
}

.label {
	width: 150px;
	text-align: right;
	vertical-align: top;
	white-space: nowrap;
	/*color: #2b5b83;*/
	color: #24282d;
}

td.label {
	/*background-color: lightgray;*/
	/*background-color: #bbc3ce;*/
	background-color: #eaebed;
	padding: 4px;
}

td.label label {
	padding: 5px;
}

.entry textarea, .entry textarea[name=Description] {
	min-height: 150px;
	min-width: 395px;
	color: #24282d;
}

.entry textarea[name=Introduction] {
	min-height: 300px;
	min-width: 395px;
	color: #24282d;
}

.entry input {
	min-width: 395px;
	padding-left: 3px;
	color: #24282d;
}

.entry input:not(input[type=checkbox]) {
	width: 98%;
}

.entry input[type=range] {
	padding-left: 0px;
}

.entry input[type=checkbox] {
	text-align: left;
	min-width: 0px;
	color: #24282d;
}

.entry input[type=radio] {
	text-align: left;
	min-width: auto;
}

.entry select {
	min-width: 402px;
	/*max-width: 402px;*/
	height: 23px;
	color: #24282d;
	width: 100%;
}

/*table .entry tbody tr * {

}*/

.table .entry {
	width: 98%;
}

.entry_colspan textarea, .entry_colspan input:not([type='checkbox']) {
	width: 100%;
}

.entry_section {
	padding-bottom: 15px !important;
	padding-top: 15px !important;
	font-size: 16px;
	font-weight: bold;
}

/* Multi-column form layout styles */
tr.form-row-3col .entry_colspan textarea,
tr.form-row-3col .entry_colspan input:not([type='checkbox']) {
	width: 100%;
	min-width: auto !important;
}

tr.form-row-3col input:not([type='checkbox']):not(.entry_colspan input),
tr.form-row-3col select:not(.entry_colspan select),
tr.form-row-3col textarea:not(.entry_colspan textarea) {
	width: 85% !important;
	min-width: auto !important;
}

tr.form-row-4col .entry_colspan textarea,
tr.form-row-4col .entry_colspan input:not([type='checkbox']) {
	width: 100%;
	min-width: auto !important;
}

tr.form-row-4col input:not([type='checkbox']):not(.entry_colspan input),
tr.form-row-4col select:not(.entry_colspan select),
tr.form-row-4col textarea:not(.entry_colspan textarea) {
	width: 75% !important;
	min-width: auto !important;
}

.formtitle {
	font-size: 18px;
	font-weight: bold;
	line-height: 3;
	white-space: nowrap;
}

BUTTON.save_button {
	margin-right: 5px;
	margin-top: 10px;
}

BUTTON.save_button:after {
	content: url(/images/icons/18/color/diskette.png);
	margin-left: 3px;
}

BUTTON.save_and_close_button {
	margin-right: 5px;
	margin-top: 10px;
}

BUTTON.save_and_close_button:after {
	content: url(/images/icons/18/color/diskette.png);
	margin-left: 3px;
}

BUTTON.cancel_button {
	margin-right: 5px;
	margin-top: 10px;
}

BUTTON.cancel_button:after {
	content: url(/images/icons/18/color/cancel.png);
	margin-left: 3px;
}

BUTTON.sudo_button {
	margin-right: 5px;
	margin-top: 10px;
}

BUTTON.sudo_button:after {
	content: url(/images/icons/18/color/user.png);
	margin-left: 3px;
}

BUTTON.reset_eula_button {
	float: right;
	margin-right: 15px;
	margin-top: 10px;
}

BUTTON.reset_eula_button:after {
	content: url(/images/icons/18/color/lock_open.png);
	margin-left: 3px;
}

.eula_status_label {
	float: right;
	margin-right: 15px;
	margin-top: 14px;
	display: inline-block;
	font-size: 12px;
}

BUTTON.delete_button {
	float: right;
	margin-top: 10px;
}

BUTTON.delete_button:after {
	content: url(/images/icons/18/color/trash_can.png);
	margin-left: 3px;
}

.icon {
	margin: 0px 3px 0px 0px;
	background-size: cover;
	width: 16px;
	height: 16px;
	display: inline-block;
	z-index: 10;
	vertical-align: middle;
	background-color: transparent;
}

.tab_icon {
	width: 18px;
	height: 18px;
	margin-left: 6px;
	margin-right: 2px;
}

.tab_icon + a.ui-tabs-anchor {
	padding-left: 2px !important;
}

.right {
	float: right;
}

.button {
	margin: 0px 3px 0px 0px;
	cursor: pointer;
	/*background-size: 16px;*/
	background-size: cover;
	width: 16px;
	height: 16px;
	display: inline-block;
	z-index: 10;
	vertical-align: middle;
	background-color: transparent;
}

.icon_button_div {
	float: right;
}

.button_div {
	float: right;
	margin-bottom: 10px;
}

.form_output {
	display: none;
}

.icon_bell_small_color {
	background-image: url(/images/icons/18/color/bell.png);
}

.icon_calendar_small_color {
	background-image: url(/images/icons/18/color/calendar.png);
}

.icon_company_small_color {
	background-image: url(/images/icons/18/color/group.png);
}

.icon_coupon_small_color {
	background-image: url(/images/icons/18/color/barcode.png);
}

.icon_banner_small_color {
	background-image: url(/images/icons/18/color/camera.png);
}

.icon_contact_small_color {
	background-image: url(/images/icons/18/color/user.png);
}

.icon_contact_tab {
	background-image: url(/images/icons/ribbon_menu/contacts-menu-icon.svg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.icon_company_tab {
	background-image: url(/images/icons/ribbon_menu/company-tab-icon.svg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.icon_household_tab {
	background-image: url(/images/icons/ribbon_menu/household-tab-icon.svg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.icon_email_small_color {
	background-image: url(/images/icons/18/color/mail.png);
}

.icon_course_small_color {
	background-image: url(/images/icons/18/color/coin.png);
}

.icon_backup_small_color {
	background-image: url(/images/icons/18/color/spreadsheet.png);
}

.icon_exports_small_color {
	background-image: url(/images/icons/18/color/spreadsheet.png);
}

.icon_file_stores_small_color {
	background-image: url(/images/icons/18/color/folder.png);
}

.icon_gap_small_color {
	background-image: url(/images/icons/18/color/document.png);
}

.icon_pricing_small_color {
	background-image: url(/images/icons/18/color/money_bag.png);
}

.icon_sponsor_small_color {
	background-image: url(/images/icons/18/color/id.png);
}

.icon_survey_small_color {
	background-image: url(/images/icons/18/color/document.png);
}

.icon_tos_small_color {
	background-image: url(/images/icons/18/color/paragraph_justify.png);
}

.icon_trial_small_color {
	background-image: url(/images/icons/18/color/clock.png);
}

.icon_trial_small {
	background-image: url(/images/icons/18/gray/clock.png);
}

.icon_trial_small:hover {
	background-image: url(/images/icons/18/color/clock.png);
}

.icon_package_small_color {
	background-image: url(/images/PackageIcon_w25.png);
}

.icon_recreation_small_color {
	background-image: url(/images/icons/18/color/card_diamonds.png);
}

.icon_organization_user_small_color {
	background-image: url(/images/icons/18/color/user.png);
}

.icon_organization_history_small_color {
	background-image: url(/images/icons/18/color/history.png);
}

.icon_list_small_color {
	background-image: url(/images/icons/18/color/list.png);
}

.change_passwd {
	background-image: url(/images/icons/18/gray/lock.png);
	width: 14px;
	height: 14px;
}

.comment {
	background-image: url(/images/icons/comment.png);
}

.save {
	background-image: url(/images/icons/18/gray/diskette.png);
}

.save:hover {
	background-image: url(/images/icons/18/color/diskette.png);
}

.comments_closed {
	background-image: url(/images/icons/18/single_arrow_thick_r_18x.png);
}

.comments_open {
	background-image: url(/images/icons/18/single_arrow_thick_u_18x.png);
}

.go {
	background-image: url(/images/icons/18/gray/go-icon.png);
}

.go:hover {
	background-image: url(/images/icons/18/color/go-icon.png);
}

.mail {
	background-image: url(/images/icons/18/gray/mail.png);
}

.mail:hover {
	background-image: url(/images/icons/18/color/mail-blue.png);
}

.history {
	background-image: url(/images/icons/18/gray/history.png);
}

.history:hover {
	background-image: url(/images/icons/18/color/history.png);
}

.change_passwd:hover {
	background-image: url(/images/icons/18/color/lock.png);
}

.complete {
	background-image: url(/images/icons/18/gray/checkmark2.png);
}

.hasPermission {
	background-image: url(/images/icons/18/color/checkmark2.png);
}

.noPermission {
	background-image: url(/images/icons/18/color/cross.png);
}

.section_completed, .complete:hover {
	background-image: url(/images/icons/18/color/checkmark2.png);
}

.invite {
	background-image: url(/images/icons/18/gray/mail.png);
}

.invite:hover {
	background-image: url(/images/icons/18/color/mail.png);
}

.note {
	background-image: url(/images/icons/18/gray/document.png);
}

.note:hover {
	background-image: url(/images/icons/18/color/document.png);
}

.cancel {
	background-image: url(/images/icons/18/gray/cancel.png);
}

.cancel:hover {
	background-image: url(/images/icons/18/color/cancel.png);
}

.print {
	background-image: url(/images/icons/18/gray/print.png);
}

.print:hover {
	background-image: url(/images/icons/18/color/print.png);
}

.black_print {
	background-image: url(/images/icons/18/gray/print_black.png);
}

.reload {
	background-image: url(/images/icons/18/gray/reload.png);
}

.reload:hover {
	background-image: url(/images/icons/18/color/reload.png);
}

.upload {
	background-image: url(/images/icons/18/gray/upload2.png);
}

.upload:hover {
	background-image: url(/images/icons/18/color/upload2.png);
}

.export {
	background-image: url(/images/icons/18/gray/hard_disk.png);
}

.export:hover {
	background-image: url(/images/icons/18/color/hard_disk.png);
}

.spreadsheet {
	background-image: url(/images/calendar/spreadsheet.svg);
}

.import {
	background-image: url(/images/icons/18/gray/software24.png);
}

.import:hover {
	background-image: url(/images/icons/18/color/software24.png);
}

.delete {
	background-image: url(/images/calendar/delete.svg);
}

.preview {
	background-image: url(/images/icons/print_preview/print_preview16.png);
}

.unlink {
	background-image: url(/images/icons/18/gray/broken_link.png);
	width: 14px;
	height: 14px;
}

.unlink:hover {
	background-image: url(/images/icons/18/color/broken_link.png);
}

.add {
	background-image: url(/images/icons/18/gray/add.png);
}

.attach {
	background-image: url(/images/icons/18/gray/clip.png);
}

.attach:hover {
	background-image: url(/images/icons/18/color/clip.png);
}

.add:hover {
	background-image: url(/images/icons/18/color/add.png);
}

.add-light {
	background-image: url(/images/icons/18/gray/add-light.png);
}

.add-light:hover {
	background-image: url(/images/icons/18/color/add-light.png);
}

.search {
	background-image: url(/images/icons/18/gray/zoom.png);
}

.search:hover {
	background-image: url(/images/icons/18/color/zoom.png);
}

.transfer {
	background-image: url(/images/icons/18/gray/arrow_bidirectional.png);
}

.transfer:hover {
	background-image: url(/images/icons/18/color/arrow_bidirectional.png);
}

.search-light {
	background-image: url(/images/icons/18/gray/zoom-light.png);
}

.search-light:hover {
	background-image: url(/images/icons/18/color/zoom-light.png);
}

.key {
	background-image: url(/images/icons/18/gray/key.png);
}

.key:hover {
	background-image: url(/images/icons/18/color/key.png);
}

.copy {
	background-image: url(/images/calendar/duplicate.svg);
}

.edit {
	background-image: url(/images/calendar/edit.svg);
}

.info {
	background-image: url(/images/icons/18/gray/info.png);
}

.info:hover {
	background-image: url(/images/icons/18/color/info.png);
}

.add_course {
	background-image: url(/images/icons/18/gray/certificate.png);
}

.add_course:hover {
	background-image: url(/images/icons/18/color/certificate.png);
}

.up {
	background-image: url(/images/icons/18/gray/arrow_up2.png);
}

.up:hover {
	background-image: url(/images/icons/18/color/arrow_up2.png);
}

.help {
	background-image: url(/images/icons/18/gray/help2.png);
}

.help:hover {
	background-image: url(/images/icons/18/color/help2.png);
}

.dots_white {
	background-image: url(/images/icons/3dots-white-32.png);
}

.dots_white:hover {
	background-image: url(/images/icons/3dots-blue-32.png);
}

.dots_black {
	background-image: url(/images/icons/3dots-black-32.png);
}

.dots_black:hover {
	background-image: url(/images/icons/3dots-blue-32.png);
}

.view-matrix {
	background-image: url(/images/icons/18/gray/spreadsheet.png);
}

.view-matrix:hover {
	background-image: url(/images/icons/18/color/spreadsheet.png);
}

.custom_entity_open {
	background-image: url(/images/down_arrow_black.png);
}

.custom_entity_closed {
	background-image: url(/images/right_arrow_blue.png);
}

.button.dots_white, .button.dots_black {
	height: 25px;
	width: 25px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position-y: center;
}

.move {
	background-image: url(/images/icons/move_alt1_w14.png);
	cursor: move;
}

.move:hover {
	background-image: url(/images/icons/move_alt1_w14.png);
}

.connect {
	background-image: url(/images/icons/18/gray/connect.png);
}

.connect:hover {
	background-image: url(/images/icons/18/color/connect.png);
}

.passed {
	background-image: url(/images/icons/18/color/star.png);
}

.failed {
	background-image: url(/images/icons/18/color/cross.png);
}

.info {
	background-image: url(/images/icons/user_alerts/info_icon.png);
}

.warning {
	background-image: url(/images/icons/user_alerts/yield_icon_disabled.png);
}

.severe {
	background-image: url(/images/icons/user_alerts/error-icon.png);
}

.alerts {
	background-image: url(/images/icons/18/gray/bell.png);
}

.alerts:hover {
	background-image: url(/images/icons/18/color/bell.png);
}

.display_section_title {
	font-size: 1.5em;
/*	color: #007596; */
	color: #000000;
}

.display_section_title_edit_mode {
	color: #c0c0c0;
}

.view {
	background-image: url(/images/icons/18/gray/list.png);
}

.view:hover {
	background-image: url(/images/icons/18/color/list.png);
}

.download {
	background-image: url(/images/icons/18/gray/download2.png);
}

.download:hover {
	background-image: url(/images/icons/18/color/download2.png);
}

.nav_first {
	background-image: url(/images/icons/18/color/first.png);
}

.nav_previous {
	background-image: url(/images/icons/18/color/previous.png);
}

.nav_next {
	background-image: url(/images/icons/18/color/next.png);
}

.nav_last {
	background-image: url(/images/icons/18/color/last.png);
}

/*
#side_bar_container {
	width: 0px;
	background-color: #00529b;
  	background: -webkit-linear-gradient(left, #1e4a6f, #2b5b83);*/ /* For Safari 5.1 to 6.0 */
  	/*background: -o-linear-gradient(right, #1e4a6f, #2b5b83);*/ /* For Opera 11.1 to 12.0 */
  	/*background: -moz-linear-gradient(right, #1e4a6f, #2b5b83);*/ /* For Firefox 3.6 to 15 */
  	/*background: linear-gradient(to right, #1e4a6f, #2b5b83);*/ /* Standard syntax */
/*}*/

#content_container {
	width: 100%;
}

.vertical_content_container {
	padding: 20px;
}

.menu_book.active {
	background-color: #161b5e;
	white-space: nowrap;
}

.menu_section.active {
	background-color: #cccccc;
}

.resources_title {
	font-size: 18px;
	font-weight: bold;
	white-space: nowrap;
}

/*
.resources_panel {
	position: fixed;
	right: 0px;
	min-width: 40px;
	top: 300px;
	color: #ffffff;
	text-align: left;
	vertical-align: bottom;
	display:none;
	padding-bottom: 10px;
  	background: -webkit-linear-gradient(left, #1e4a6f, #2b5b83);*/ /* For Safari 5.1 to 6.0 */
  	/*background: -o-linear-gradient(right, #1e4a6f, #2b5b83);*/ /* For Opera 11.1 to 12.0 */
  	/*background: -moz-linear-gradient(right, #1e4a6f, #2b5b83);*/ /* For Firefox 3.6 to 15 */
  	/*background: linear-gradient(to right, #1e4a6f, #2b5b83);*/ /* Standard syntax */
  	/*z-index: 2;*/
/*}*/

.resources_panel {
	font-family: EucildMedium;
	background-color: #e1edf4;
	border-radius: 10px;
	color: #05273a;
	position: fixed;
	right: 100px;
	bottom: 100px;
	width: 150px;
}

.resources_dlzip_footer {
	text-align: right;
	vertical-align: middle;
	font-size: 12px;
}

/*
.resources_tab {
	position: fixed;
	right: 0px;
	width: 40px;
	min-height: 150px;
	top: 300px;
	background-color: #1e4a6f;
	color: #ffffff;
	text-align: center;
	vertical-align: center;
	opacity: .75;
}

.resources_tab div {
	font-size: 14px;
	text-transform: uppercase;
	position: absolute;
	bottom: 22.5px;
	left: 20px;

             filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);*/  /* IE6,IE7 */
/*         -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)";*/ /* IE8 */
/*     -moz-transform: rotate(-90.0deg);*/  /* FF3.5+ */
/*      -ms-transform: rotate(-90.0deg);*/  /* IE9+ */
/*       -o-transform: rotate(-90.0deg);*/  /* Opera 10.5 */
/*  -webkit-transform: rotate(-90.0deg);*/  /* Safari 3.1+, Chrome */
/*          transform: rotate(-90.0deg);*/  /* Standard */
/*    transform-origin: left center; */
/*}*/

.resources_tab {
	font-family: 'Manrope';
	background-color: #e1edf4;
	border-radius: 10px;
	color: #05273a;
	position: fixed;
	right: 100px;
	bottom: 100px;
}

.resources_tab div {
	font-family: 'Manrope';
	font-size: 19px;
	text-transform: uppercase;
	padding: 20px;
}

.resources_tab div::before {
	content: url(/images/pareto_academy/folder_icon.svg);
	margin-right: 5px;
}

.resources {
	list-style-type: none;
	margin-left: 0px;
	padding-left: 0px;
	min-height: 75px;
}

.resources li {
	font-size: 11px;
	padding: 10px 0px 10px 0px;
	margin:  2.5px 0px 2.5px 0px;
  	border-radius: 3px;
  	white-space: nowrap;
}

/** spacing for IE **/
.resources li span {
  	white-space: nowrap;
  	margin-right: 15px;
}

.resources li:hover {
  	background: -webkit-linear-gradient(left, #2b5b83, #1e4a6f); /* For Safari 5.1 to 6.0 */
  	background: -o-linear-gradient(right, #2b5b83, #1e4a6f); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(right, #2b5b83, #1e4a6f); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(to right, #2b5b83, #1e4a6f); /* Standard syntax */
}

.resources_content {
	padding: 10px;
}
/* select all checkbox */
#resources_sa {
	margin-right: 5px;
	margin-top: 5px;
}

a.resource {
	text-decoration: none;
}

/*a.resource:hover {

}*/

table.clickable_rows * tr {
	cursor: pointer;
}

table.display {
	border: 1px solid #161b5e;
	font-size: 12px;
	border-radius: 3px;
	width: 100%;
}

table.display tfoot tr th, table.display thead tr th {
	text-align: left;
	background-color: #eeeeee;
	border-bottom: 1px solid #161b5e;
}

table.display th, table.display td {
	padding: 3px;
}

table.display tbody tr td {
	padding: 5px;
	border-bottom: 1px solid #eeeeee;
}

.draggablefile {
	cursor: move;
	padding: 5px;
}

.draggablefile:hover {
	background-color: highlight;
	box-shadow: 2px 2px 3px #999;
	border-radius: 2px;
}

.busy_indicator {
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -24px;
    margin-left: -24px;
    z-index: 100;
    display: none;
}

.display_section_jump {
	margin-top: 5px;
	margin-left: 10px;
	padding: 5px;
	cursor: pointer;
}

.display_section_jump:hover {
	background-color: #999999;
}

/* User Table Styles */
table#user_table {
  width: 100%;
  margin: 0 auto;
  clear: both;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #ccc;
}
#user_table_filter {
	margin-bottom: 10px;
}
#user_table_length {
	margin-bottom: 10px;
}
table#user_table thead th {
	text-align:left;
}
table#user_table thead th,
table#user_table thead td,
table#user_table tfoot th,
table#user_table tfoot td {
  padding: 4px 10px;
}
table#user_table thead th,
table#user_table tfoot th {
  font-weight: bold;
}
table#user_table thead th:active,
table#user_table thead td:active {
  outline: none;
}
table#user_table thead .sorting_asc,
table#user_table thead .sorting_desc,
table#user_table thead .sorting {
  cursor: pointer;
  /*cursor: hand;*/
}
table#user_table thead th div#user_tables_sort_wrapper {
  position: relative;
  padding-right: 10px;
}
table#user_table thead th div#user_tables_sort_wrapper span {
  position: absolute;
  top: 50%;
  margin-top: -8px;
  right: -5px;
}
table#user_table thead th.ui-state-default {
  border-right-width: 0;
}
table#user_table thead th.ui-state-default:last-child {
  border-right-width: 1px;
}
table#user_table tbody tr {
  background-color: white;
}
table#user_table tbody tr.selected {
  background-color: #b0bed9;
}
table#user_table tbody th,
table#user_table tbody td {
  padding: 8px 10px;
}
table#user_table th.center,
table#user_table td.center,
table#user_table td#user_tables_empty {
  text-align: center;
}
table#user_table th.right,
table#user_table td.right {
  text-align: right;
}
table#user_table.row-border tbody th, table#user_table.row-border tbody td, table#user_table.display tbody th, table#user_table.display tbody td {
  border-top: 1px solid #dddddd;
}
table#user_table.row-border tbody tr:first-child th,
table#user_table.row-border tbody tr:first-child td, table#user_table.display tbody tr:first-child th,
table#user_table.display tbody tr:first-child td {
  border-top: none;
}
table#user_table.cell-border tbody th, table#user_table.cell-border tbody td {
  border-top: 1px solid #dddddd;
  border-right: 1px solid #dddddd;
}
table#user_table.cell-border tbody tr th:first-child,
table#user_table.cell-border tbody tr td:first-child {
  border-left: 1px solid #dddddd;
}
table#user_table.cell-border tbody tr:first-child th,
table#user_table.cell-border tbody tr:first-child td {
  border-top: none;
}
table#user_table.stripe tbody tr.odd, table#user_table.display tbody tr.odd {
  background-color: #f9f9f9;
}
table#user_table.stripe tbody tr.odd.selected, table#user_table.display tbody tr.odd.selected {
  background-color: #abb9d3;
}
table#user_table.hover tbody tr:hover,
table#user_table.hover tbody tr.odd:hover,
table#user_table.hover tbody tr.even:hover, table#user_table.display tbody tr:hover,
table#user_table.display tbody tr.odd:hover,
table#user_table.display tbody tr.even:hover {
  background-color: whitesmoke;
  cursor: pointer;
  /*cursor: hand;*/
}
table#user_table.hover tbody tr:hover.selected,
table#user_table.hover tbody tr.odd:hover.selected,
table#user_table.hover tbody tr.even:hover.selected, table#user_table.display tbody tr:hover.selected,
table#user_table.display tbody tr.odd:hover.selected,
table#user_table.display tbody tr.even:hover.selected {
  background-color: #a9b7d1;
}
table#user_table.order-column tbody tr > .sorting_1,
table#user_table.order-column tbody tr > .sorting_2,
table#user_table.order-column tbody tr > .sorting_3, table#user_table.display tbody tr > .sorting_1,
table#user_table.display tbody tr > .sorting_2,
table#user_table.display tbody tr > .sorting_3 {
  background-color: #f9f9f9;
}
table#user_table.order-column tbody tr.selected > .sorting_1,
table#user_table.order-column tbody tr.selected > .sorting_2,
table#user_table.order-column tbody tr.selected > .sorting_3, table#user_table.display tbody tr.selected > .sorting_1,
table#user_table.display tbody tr.selected > .sorting_2,
table#user_table.display tbody tr.selected > .sorting_3 {
  background-color: #acbad4;
}
table#user_table.display tbody tr.odd > .sorting_1, table#user_table.order-column.stripe tbody tr.odd > .sorting_1 {
  background-color: #f1f1f1;
}
table#user_table.display tbody tr.odd > .sorting_2, table#user_table.order-column.stripe tbody tr.odd > .sorting_2 {
  background-color: #f3f3f3;
}
table#user_table.display tbody tr.odd > .sorting_3, table#user_table.order-column.stripe tbody tr.odd > .sorting_3 {
  background-color: whitesmoke;
}
table#user_table.display tbody tr.odd.selected > .sorting_1, table#user_table.order-column.stripe tbody tr.odd.selected > .sorting_1 {
  background-color: #a6b3cd;
}
table#user_table.display tbody tr.odd.selected > .sorting_2, table#user_table.order-column.stripe tbody tr.odd.selected > .sorting_2 {
  background-color: #a7b5ce;
}
table#user_table.display tbody tr.odd.selected > .sorting_3, table#user_table.order-column.stripe tbody tr.odd.selected > .sorting_3 {
  background-color: #a9b6d0;
}
table#user_table.display tbody tr.even > .sorting_1, table#user_table.order-column.stripe tbody tr.even > .sorting_1 {
  background-color: #f9f9f9;
}
table#user_table.display tbody tr.even > .sorting_2, table#user_table.order-column.stripe tbody tr.even > .sorting_2 {
  background-color: #fbfbfb;
}
table#user_table.display tbody tr.even > .sorting_3, table#user_table.order-column.stripe tbody tr.even > .sorting_3 {
  background-color: #fdfdfd;
}
table#user_table.display tbody tr.even.selected > .sorting_1, table#user_table.order-column.stripe tbody tr.even.selected > .sorting_1 {
  background-color: #acbad4;
}
table#user_table.display tbody tr.even.selected > .sorting_2, table#user_table.order-column.stripe tbody tr.even.selected > .sorting_2 {
  background-color: #adbbd6;
}
table#user_table.display tbody tr.even.selected > .sorting_3, table#user_table.order-column.stripe tbody tr.even.selected > .sorting_3 {
  background-color: #afbdd8;
}
table#user_table.display tbody tr:hover > .sorting_1,
table#user_table.display tbody tr.odd:hover > .sorting_1,
table#user_table.display tbody tr.even:hover > .sorting_1, table#user_table.order-column.hover tbody tr:hover > .sorting_1,
table#user_table.order-column.hover tbody tr.odd:hover > .sorting_1,
table#user_table.order-column.hover tbody tr.even:hover > .sorting_1 {
  background-color: #eaeaea;
}
table#user_table.display tbody tr:hover > .sorting_2,
table#user_table.display tbody tr.odd:hover > .sorting_2,
table#user_table.display tbody tr.even:hover > .sorting_2, table#user_table.order-column.hover tbody tr:hover > .sorting_2,
table#user_table.order-column.hover tbody tr.odd:hover > .sorting_2,
table#user_table.order-column.hover tbody tr.even:hover > .sorting_2 {
  background-color: #ebebeb;
}
table#user_table.display tbody tr:hover > .sorting_3,
table#user_table.display tbody tr.odd:hover > .sorting_3,
table#user_table.display tbody tr.even:hover > .sorting_3, table#user_table.order-column.hover tbody tr:hover > .sorting_3,
table#user_table.order-column.hover tbody tr.odd:hover > .sorting_3,
table#user_table.order-column.hover tbody tr.even:hover > .sorting_3 {
  background-color: #eeeeee;
}
table#user_table.display tbody tr:hover.selected > .sorting_1,
table#user_table.display tbody tr.odd:hover.selected > .sorting_1,
table#user_table.display tbody tr.even:hover.selected > .sorting_1, table#user_table.order-column.hover tbody tr:hover.selected > .sorting_1,
table#user_table.order-column.hover tbody tr.odd:hover.selected > .sorting_1,
table#user_table.order-column.hover tbody tr.even:hover.selected > .sorting_1 {
  background-color: #a1aec7;
}
table#user_table.display tbody tr:hover.selected > .sorting_2,
table#user_table.display tbody tr.odd:hover.selected > .sorting_2,
table#user_table.display tbody tr.even:hover.selected > .sorting_2, table#user_table.order-column.hover tbody tr:hover.selected > .sorting_2,
table#user_table.order-column.hover tbody tr.odd:hover.selected > .sorting_2,
table#user_table.order-column.hover tbody tr.even:hover.selected > .sorting_2 {
  background-color: #a2afc8;
}
table#user_table.display tbody tr:hover.selected > .sorting_3,
table#user_table.display tbody tr.odd:hover.selected > .sorting_3,
table#user_table.display tbody tr.even:hover.selected > .sorting_3, table#user_table.order-column.hover tbody tr:hover.selected > .sorting_3,
table#user_table.order-column.hover tbody tr.odd:hover.selected > .sorting_3,
table#user_table.order-column.hover tbody tr.even:hover.selected > .sorting_3 {
  background-color: #a4b2cb;
}

table#user_table,
table#user_table th,
table#user_table td {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

/*
 * Control feature layout
 */
#user_tables_wrapper {
  position: relative;
  clear: both;
  /*zoom: 1;*/
  zoom: 1;
}
#user_tables_wrapper #user_tables_length {
  float: left;
}
#user_tables_wrapper #user_tables_filter {
  float: right;
  text-align: right;
}
#user_tables_wrapper #user_tables_filter input {
  margin-left: 0.5em;
}
#user_tables_wrapper #user_tables_info {
  clear: both;
  float: left;
  padding-top: 0.55em;
}
#user_tables_wrapper #user_tables_paginate {
  float: right;
  text-align: right;
}
#user_tables_wrapper #user_tables_paginate .fg-button {
  box-sizing: border-box;
  display: inline-block;
  min-width: 1.5em;
  padding: 0.5em;
  margin-left: 2px;
  text-align: center;
  text-decoration: none !important;
  cursor: pointer;
  /*cursor: hand;*/
  color: #333333 !important;
  border: 1px solid transparent;
}
#user_tables_wrapper #user_tables_paginate .fg-button:active {
  outline: none;
}
#user_tables_wrapper #user_tables_paginate .fg-button:first-child {
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
#user_tables_wrapper #user_tables_paginate .fg-button:last-child {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
#user_tables_wrapper #user_tables_processing {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 40px;
  margin-left: -50%;
  margin-top: -25px;
  padding-top: 20px;
  text-align: center;
  font-size: 1.2em;
  background-color: white;
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(25%, rgba(255, 255, 255, 0.9)), color-stop(75%, rgba(255, 255, 255, 0.9)), color-stop(100%, rgba(255, 255, 255, 0)));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
  /* Chrome10+,Safari5.1+ */
  background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
  /* FF3.6+ */
  background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
  /* IE10+ */
  background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
  /* Opera 11.10+ */
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
  /* W3C */
}
#user_tables_wrapper #user_tables_length,
#user_tables_wrapper #user_tables_filter,
#user_tables_wrapper #user_tables_info,
#user_tables_wrapper #user_tables_processing,
#user_tables_wrapper #user_tables_paginate {
  color: #333333;
}
#user_tables_wrapper #user_tables_scroll {
  clear: both;
}
#user_tables_wrapper #user_tables_scrollBody {
  /*margin-top: -1px;*/
  -webkit-overflow-scrolling: touch;
}
#user_tables_wrapper .ui-widget-header {
  font-weight: normal;
}
#user_tables_wrapper .ui-toolbar {
  padding: 8px;
}
#user_tables_wrapper:after {
  visibility: hidden;
  display: block;
  content: "";
  clear: both;
  height: 0;
}
/* End User Table Styles */

.connected_verticals li {
	padding: 10px;
	list-style-type: none;
	margin: none;
}

.connected_verticals li {
	padding: 10px;
	margin: 5px;
	cursor: move;
}

/*
input[type=text].lookup:after {
	content: url('/images/icons/icon_search.gif');
}
*/

UL.connected_lists, UL#organization_packages_applied, UL#organization_packages, UL#organization_users, UL.connected_pricing_schemes, UL#pricing_tiers {
	margin-left: 0px;
	padding-left: 0px;
	list-style-type: none;
	min-height: 100px;
}

UL.connected_lists LI, UL#organization_packages_applied LI, UL#organization_packages LI, UL#organization_users LI, UL.connected_pricing_schemes LI, UL#pricing_tiers LI {
	border: 1px solid #cccccc;
	background-color: #eeeeee;
	border-radius: 5px;
	margin-bottom: 5px;
	padding: 6px;
	max-width: 250px;
}

UL.connected_lists LI:hover, UL#organization_packages_applied LI:hover, UL#organization_packages LI:hover, UL#organization_users LI:hover, UL.connected_pricing_schemes LI:hover, UL#pricing_tiers LI:hover {
	background-color: highlight;
	cursor: pointer;
}


/** Fancy Login Styles **/
.form-1 *,
*:after,
*:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

.form-1 {
    /* Size & position */
    width: 300px;
    /*margin: 60px auto 30px;*/
    padding: 10px;
    position: relative; /* For the submit button positioning */

    /* Styles */
    box-shadow:
        0 0 1px rgba(0, 0, 0, 0.3),
        0 3px 7px rgba(0, 0, 0, 0.3),
        inset 0 1px rgba(255,255,255,1),
        inset 0 -3px 2px rgba(0,0,0,0.25);
    border-radius: 5px;
    background: linear-gradient(#eeefef, #ffffff 10%);
}

.form-1 .field {
    position: relative; /* For the icon positioning */
}

.form-1 .field i {
    /* Size and position */
    left: 0px;
    top: 0px;
    position: absolute;
    height: 36px;
    width: 36px;

    /* Line */
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 1px 0 0 rgba(255, 255, 255, 0.7);

    /* Styles */
    color: #777777;
    text-align: center;
    line-height: 42px;
    transition: all 0.3s ease-out;
    pointer-events: none;
}

.form-1 input[type=text],
.form-1 input[type=password] {
    font-family: 'Lato', Calibri, Arial, sans-serif;
    font-size: 13px;
    font-weight: 400;
    text-shadow: 0 1px 0 rgba(255,255,255,0.8);

    /* Size and position */
    width: 100%;
    padding: 10px 18px 10px 45px;

    /* Styles */
    border: none; /* Remove the default border */
    box-shadow:
        inset 0 0 5px rgba(0,0,0,0.1),
        inset 0 3px 2px rgba(0,0,0,0.1);
    border-radius: 3px;
    background: #f9f9f9;
    color: #777;
    transition: color 0.3s ease-out;
}

.form-1 input[type=text] {
    margin-bottom: 10px;
}

.form-1 input[type=text]:hover ~ i,
.form-1 input[type=password]:hover ~ i {
    color: #52cfeb;
}

.form-1 input[type=text]:focus ~ i,
.form-1 input[type=password]:focus ~ i {
    color: #42A2BC;
}

.form-1 input[type=text]:focus,
.form-1 input[type=password]:focus,
.form-1 button[type=button]:focus {
    outline: none;
}

.form-1 .submit {
    /* Size and position */
    width: 65px;
    height: 65px;
    position: absolute;
    top: 18px;
    right: -25px;
    padding: 10px;
    z-index: 2;

    /* Styles */
    background: #ffffff;
    border-radius: 50%;
    box-shadow:
        0 0 2px rgba(0,0,0,0.1),
        0 3px 2px rgba(0,0,0,0.1),
        inset 0 -3px 2px rgba(0,0,0,0.2);
}

.form-1 .submit:after {
    /* Size and position */
    content: "";
    width: 10px;
    height: 10px;
    position: absolute;
    top: -2px;
    left: 30px;

    /* Styles */
    background: #ffffff;

    /* Other masks trick */
    box-shadow: 0 62px white, -32px 31px white;
}

.form-1 button[type=button] {
    /* Size and position */
    width: 100%;
    height: 100%;
    margin-top: -1px;

    /* Icon styles */
    font-size: 1.4em;
    line-height: 0.75;
    color: white;

    /* Styles */
    border: none; /* Remove the default border */
    border-radius: inherit;
    background: linear-gradient(#52cfeb, #42A2BC);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.3),
        0 1px 2px rgba(0,0,0,0.35),
        inset 0 3px 2px rgba(255,255,255,0.2),
        inset 0 -3px 2px rgba(0,0,0,0.1);

    cursor: pointer;
}

.form-1 button[type=button]:hover,
.form-1 button[type=button]:focus {
    background: #52cfeb;
    transition: all 0.3s ease-out;
}

.form-1 button[type=button]:active {
    background: #42A2BC;
    box-shadow:
        inset 0 0 5px rgba(0,0,0,0.3),
        inset 0 3px 4px rgba(0,0,0,0.3);
}

.login_wrapper {
	/*float: left;*/
	margin-right: 30px;
}

/** End Fancy Login Styles **/

.welcome_mast {
    clear: both;
    background-color: #eee;
  	background: -webkit-linear-gradient(left, #ffffff, #1e4a6f); /* For Safari 5.1 to 6.0 */
  	background: -o-linear-gradient(right, #ffffff, #1e4a6f); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(right, #ffffff, #1e4a6f); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(to right, #ffffff, #1e4a6f); /* Standard syntax */
    /*position: fixed;
    width: 100%;
    top: 0px;*/
    /* border-bottom: 1px solid #000000; */
    padding-bottom: 2px;
}

.login_message {
	padding: 20px;
	position: absolute;
	box-shadow: 5px 5px 7px #444;
	border: 1px solid #ddd;
	border-radius: 5px;
	background-color: #ffffff;
	display: none;
}

.login_message .close_icon {
	width: 8px;
	float: right;
	cursor: pointer;
	margin-top: -10px;
}

.welcome_big_logo {
	margin-top: 5px;
	width: 40%;
	float: right;
}

#background_logo {
	position: fixed;
	bottom: 10px;
	right: 50px;
	z-index: -10;
	/*opacity: 0.35;*/
}

#background_logo img {
	max-height: 100px;
}

.welcome_contact_us {
	text-align: center;
	margin: 20px;
	padding: 20px;
}

.welcome_contact_us table {
	margin-left: auto;
	margin-right: auto;
}

.welcome_blurb_1 {
	width: 50%;
	margin: 20px;
	padding: 20px;
}

#welcome_signup_area {
	width: 50%;
	float: right;
}

#vc_welcome_footer {
	min-height: 50px;
	line-height: 50px;
	background-color: #444444;
	text-align: right;
	padding: 10px;
}

#vc_welcome_footer a {
	color: #dddddd;
	text-decoration: none;
}

/*#vc_welcome_footer nav {
}*/

.tm_form_title {
	color: #2b5b83;
	font-size: 15px;
}

.tm_question_form {
	border: 1px dashed #eee;
}

.tm_question {
	border: 1px solid #ccc;
	margin-bottom: 10px;
	padding: 10px;
	border-radius: 5px;
	box-shadow: -2px -2px 10px #999 inset;
}

.tm_options_list li:before {
	content: url(/images/icons/18/color/square.png);
	position: relative;
	left: -8px;
	top: 3px;
	width: 14px;
	height: 14px;
}

.tm_options_list li.checked:before {
	content: url(/images/icons/18/color/checkmark.png);
	position: relative;
	left: -8px;
	top: 3px;
	width: 14px;
	height: 14px;
}

.tm_test_li, .tm_questions_list {
	cursor: move;
	border: 1px dotted transparent;
}

.tm_test_li {
	margin-left: 0px;
	padding: 10px;
}

.tm_form_title:before {
	content: url(/images/icons/move_alt1_w12.png);
	position: relative;
	left: -5px;
	top: 0px;
	opacity: .5;
}

/*.tm_test_li:hover  {*/
	/*border: 1px dotted #2b5b83;*/
/*}*/

/*.tm_questions_list:hover, .tm_options_list:hover {

}*/

.tm_questions_list_highlight {
	background-color: #ddd;
	border: 1px dashed #bbb;
	height: 50px;
	margin-bottom: 10px;
}

.tm_answers_list_highlight {
	height: 10px;
	background-color: #ddd;
	border: 1px dashed #bbb;
	margin-bottom: 10px;
}

.tm_test_container {
	margin-bottom: 25px;
	background-color: white;
}

.tm_test_container ul {
	margin-top: 10px;
}

.tm_publish_marker {
	/*color: #999;
	border: 1px solid #999;
	border-radius: 5px;*/
	padding: 1px 3.5px 1px 3.5px;
	cursor: pointer;
}

.tm_publish_marker.published {
	background-color: #2b5b83;
	color: #ffffff;
}

.tm_publish_marker.published:hover {
	background-color: #FF9933;
}

.tm_publish_marker.draft {
	background-color: #FF9933;
	color: #222;
}

.tm_publish_marker.draft:hover {
	background-color: #2b5b83;
	color: #FFFFFF;
}

/* #1609 CON-226: an action icon with nothing to act on reads as broken rather than empty.
   Dimmed and inert until the field it belongs to has a value. */
.button.button-disabled {
	opacity: .35;
	cursor: default;
	pointer-events: none;
}

/* #1608 TSK-019: a missing required field is named at the field itself. Replaces the old
   floating error bubble, which positioned itself over the form. */
.tk-field-error {
	margin: 3px 0 0;
	color: #b3261e;
	font-size: 11px;
	line-height: 1.35;
}

/* DEPRECATED: Util.showError renders through the top-right notification banner now, so nothing
   builds this bubble any more. Kept because older markup may still carry the class. */
.tm_error_bubble {
	position: absolute;
	display: none;
	background-color: white;
	border-radius: 5px;
	border: 1px solid #444;
	max-width: 300px;
	padding: 5px;
	z-index: 10;
}

.tm_multiple_choice_header {
	font-size: 14px;
	margin-top: 0px;
	margin-bottom: 5px;
	font-weight: normal;
	margin-left: 5px;
}

.tm_root, .tm_root ul {
	list-style-type: none;
}

TABLE.test_manager {
	width: 100%;
	margin-bottom: 10px;
}

TABLE.test_manager TBODY TR TD {
	padding: 5px;
}

TD.tm_label {
	width: 170px;
	text-align: right;
	vertical-align: top;
	padding-right: 20px;
}

TABLE.test_manager * INPUT[type=text] {
	margin: 3px;
	width: 300px;
}

TABLE.test_manager * SELECT {
	margin: 3px;
	width: 305px;

}

TABLE.test_manager * TEXTAREA {
	margin: 3px;
	width: 305px;
	height: 100px;
}

TABLE.test_manager * BUTTON {
	margin: 3px;
}

TABLE.user_info_table {
	width: 100%;
}

TABLE.user_info_table input[type=text] {
	width: 400px;
}

TABLE.user_info_table select {
	width: 405px;
}

.toolTip_wrapper {
	border: 1px solid #888;
	position: absolute;
	display: none;
	max-width: 500px;
	z-index: 1000;
	padding: 10px;
	background-color: #FFFFFF;
	color: #888;
	box-shadow: 3px 3px 7px #999;
}

/*.vc_test {

}*/
.vc_test_question blockquote {
	font-style: italic;
	font-size: larger;
}
/*.vc_test_submit_area {

}
.vc_test_question_mc {
}*/

.vc_test_question_mc input[type=radio] {
	margin-right: 10px;
}
.vc_test_question_mc ol {
	margin-left: 50px;
	list-style-type: upper-alpha;
}
.vc_test_question_num input[type=text]{
	margin-left: 50px;
}
.vc_test_question_bool table {
	margin-left: 50px;
}
.vc_test_question_txt textarea {
	margin-left: 50px;
	width: 80%;
	height: 120px;
}

.up_tests {
	margin: 0px;
	padding: 0px 0px 0px 20px;
	padding-top: 40px;
	clear: both;
	width: 90%;
}

.up_available_ce_courses {
	margin: 0px;
	padding: 0px 0px 0px 20px;
	padding-top: 40px;
	clear: both;
	width: 90%;
}

.up_title {
	width: 100%;
	padding: 10px;
	margin-top: 10px;
	border: 1px solid rgb(238, 238, 238);
  	background: -webkit-linear-gradient(left, #1e4a6f, #2b5b83); /* For Safari 5.1 to 6.0 */
  	background: -o-linear-gradient(right, #1e4a6f, #2b5b83); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(right, #1e4a6f, #2b5b83); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(to right, #1e4a6f, #2b5b83); /* Standard syntax */
	color: #ffffff;
}

UL.up_completed_tests {
	/*list-style-image: url("/images/icons/18/color/document.png");*/
	list-style-image: none;
	list-style-type: none;
}

UL.up_completed_tests LI {
	padding: 3px;
	margin-bottom: 3px;
	font-size: 1.3em;
}

UL.up_completed_tests LI.passed {
	list-style-image: url("/images/icons/18/color/checkmark2.png");
}

.table_up_ce_credit_course_info {
	width: 70%;
}

.test_list_content_table {
	width: 100%;
	height: 100%;
}

.test_list_content_top_row {
	height: 250px;
}

.test_list_content_tile_row {
	height: 300px;
}

#content_table .test_list_content_descr {
	width: 80%;
	background-color: #aaaaaa;
	padding: 10px;
	height: 250px;
	overflow-y: scroll;
}

#content_table td.test_list_content_history {
	background-color: gray;
	padding: 10px;
	height: 250px;
	overflow-y: scroll;
}

.test_list_content_tiles {
  	background: -webkit-linear-gradient(left, #1e4a6f, #2b5b83); /* For Safari 5.1 to 6.0 */
  	background: -o-linear-gradient(right, #1e4a6f, #2b5b83); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(right, #1e4a6f, #2b5b83); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(to right, #1e4a6f, #2b5b83); /* Standard syntax */
}

.test_list_content_tiles_list {
    width:auto;
    padding:5px;
    height:auto;
    display:table;
}

.test_list_content_tiles_list_tile {
	background: white;
    height:125px;
    line-height:125px;
    width:250px;
    float:left;
    margin:0 5px 0 0;
    padding:2px;
    text-align: center;
    box-shadow: -3px -3px 10px #555 inset;
    border-radius: 6px;
  	background: -webkit-linear-gradient(left, #dddddd, #ffffff); /* For Safari 5.1 to 6.0 */
  	background: -o-linear-gradient(right, #dddddd, #ffffff); /* For Opera 11.1 to 12.0 */
  	background: -moz-linear-gradient(right, #dddddd, #ffffff); /* For Firefox 3.6 to 15 */
  	background: linear-gradient(to right, #dddddd, #ffffff); /* Standard syntax */
}

test_list_content_tiles_list_tile_passed {
	background: lime;
}

.test_list_content_tiles_list_tile span {
	display:inline-block;
    vertical-align: middle;
}

/*
.test_passed_container {

}

.test_failed_container {

}
*/

#user_alert_container {
	width: 18px;
	cursor: pointer;
}

.user_alert_dialog {
	position: absolute;
}

.enable_edit_button {
	display: inline;
	position: fixed;
	width: 100px;
	right: 50px;
    top: 65px;
	border: 1px solid #444;
	padding: 3px;
	cursor: pointer;
	text-align: center;
	background-color: #ffffff;
	z-index: 1;
	box-shadow: 2px 2px 8px #444;
}

.enable_edit_button:hover {
	background-color: #1e4a6f;
	color: white;
}

.message_div {
	margin-top: 20px;
	border-radius: 10px;
	padding: 5px;
	border: 1px solid #444;
	display: none;
	width: 385px;
}
















.admin_page_users_span {
	font-size: 25px;
	font-family: Courier;
}

.bold {
	font-weight: bold;
}

.survey_question {
	margin-left: 50px;
	margin-bottom: 10px;
}

.survey_question TEXTAREA {
	width: 400px;
	height: 100px;
}

.vp_assigned_vertical {
	font-size: 16px;
	font-weight: bold;
}

.vp_provides {
	color: #444;
	display: block;
	margin-left: 20px;
	font-weight: normal;
}

.vp_provides_public {
	color: green;
	font-weight: normal;
}

.payment_row {
	cursor: pointer;
}

.payment_row:hover td {
	background-color: #94becd;
}

.ss_subscription_list, .ss_user_list {
	list-style-type: none;
	margin-left: 0px;
	padding-left: 0px;
	width: 500px;
}

.ss_subscription_list li div, .ss_user_list li div {
	margin-bottom: 10px;
	border: 1px solid #ccc;
	padding: 10px;
	border-radius: 5px;
	display: inline-block;
	min-width: 250px;
}

.ss_subscription_list li div {
	min-width: 500px;
}

.ss_invite_list {
	list-style-type: none;
	margin-left: 0px;
	padding-left: 0px;
}

.ss_invite_list li div {
	margin-bottom: 10px;
	border: 1px solid #ccc;
	padding: 10px;
	border-radius: 5px;
	display: inline-block;
	min-width: 250px;
}

.ss_payment_list {
	list-style-type: none;
	margin-left: 0px;
	padding-left: 0px;
}

.ss_payment_list li div {
	margin-bottom: 10px;
	border: 1px solid #ccc;
	padding: 10px;
	display: inline-block;
	width: 500px;
	cursor: pointer;
	word-wrap: break-word;
}

.ss_payment_list li div:hover {
	background-color: #eee;
}

.invite_text_input[type=text] {
	width: 400px;
	padding: 2.5px;
	font-size: 13px;
}

.invite_text_textarea {
	width: 398px;
	height: 75px;
	padding: 3.5px;
}

.invite_error {
	margin: 20px;
	border: 1px solid #ccc;
	border-radius: 4px;
}

.invite_error p {
	padding: 20px;
}


#signup_message {
	border: 1px solid #161b5e;
	border-radius: 5px;
	padding: 10px;
	margin: 10px;
	display: none;
}

/** Widget Base Style **/
/*.VCWidget {
}*/

.VCWidget table {
	width: 100%;
/*	border: 1px solid #444;*/
}

.VCWidget table thead tr th {
	border-bottom: 1px solid #444;
}

.VCWidget td {
	padding: 20px;
	margin: 10px;
}

.VCWidget table tbody tr td a span {
	color: #2b5b83;
	text-decoration: underline;
}

/** End Widget Base Style **/


.WCouponCodeRedeemer {
	width: 500px;
	border: 1px solid lightgray;
	padding: 10px;
	box-shadow: 2px 2px 6px lightgray;
}

.WCouponCodeRedeemer .saleable_tile_buttons {
	padding-top: 20px;
	border-top: 1px solid #ccc;
	height: 40px;
}

/*.WListSaleableVerticals {*/
	/*
	background-color: #F7F7F7;
	border-radius: 10px;
	box-shadow: 2px 2px 10px #ccc;
	padding: 20px;
	display: inline-block;*/
/*}*/

.WListSaleableVerticals h2 {
	margin-top: 0px;
}

.WListSaleableVerticals table {
	/** table-layout: fixed; **/
	width: auto;
}

.WListSaleableVerticals td.vp_name {
	font-weight: bold;
	color: red;
}


.WListSaleableVerticals td {
	text-align: left;
}

.WListSaleableVerticals .saleable_tile {
	border: 2px solid #ccc;
	display: inline-block;
	height: 490px;
	max-width: 360px;
	margin: 7.5px;
	vertical-align: top;
	position: relative;
}

.WListSaleableVerticals .saleable_tile .saleable_spacer {
	margin: 0px;
	padding: 0px;
	border: none;
	border-top: 1px solid #444;
}

.WListSaleableVerticals .saleable_tile {
	padding: 15px;
}

.WListSaleableVerticals .saleable_tile h3 {
	margin-top: 10px;
	margin-bottom: 10px;
	padding: 0px;
	letter-spacing: 0.75px;
	font-size: 19px;
	color: #444;
	font-weight: 400;
}

.WListSaleableVerticals .saleable_content {
  	word-wrap: break-word;
	overflow-y: auto;
	max-height: 155px;
	max-width: 336px;
	color: #666;
	font-size: 12px;
}

.WListSaleableVerticals .saleable_tile_buttons .learn_more {
	margin-bottom: -55px;
	color: #444;
	font-weight: 600;
	letter-spacing: 1.5px;
	text-decoration: none;
	font-size: 120%;
	line-height: 35px;
	position: relative;
	padding-left: 28px;
}


.WListSaleableVerticals .saleable_tile_buttons .learn_more:before {
  content: url(/images/glyphicons/png/glyphicons-152-new-window.png);
  position: absolute;
  top: -3px;
  margin-left: -28px;
}

.WListSaleableVerticals .saleable_tile_buttons {
	position: absolute;
	bottom: 20px;
	width: 90%;
	border-top: 1px solid #ccc;
	padding-top: 20px;
}

.WListSaleableVerticals .saleable_pricing {
	position: absolute;
	bottom: 80px;
	width: 90%;
	padding-top: 20px;
	font-size: 22px;
	font-weight: 600;
	text-align: center;
}

.saleable_button {
	background-color: #2b5b83;
	color: #ffffff;
	padding: 7.5px;
	border: 0px;
	width: 100px;
	font-weight: 600;
	letter-spacing: .75px;
	cursor: pointer;
}

.saleable_button:hover {
 background: linear-gradient(#67B8E4, #33A0DB) repeat scroll 0 0 rgba(0, 0, 0, 0);
}

.pull_right {
	float: right !important;
}

.pull_left {
	float: left !important;
}

.pricing_overlay {
	display: none;
	position: absolute;
	border: 2px solid #ccc;
	box-shadow: 6px 6px 10px #444;
	background-color: #FFFFFF;
	vertical-align: top;
	padding: 15px;
}

.pricing_overlay * {
	max-width: 336px;
}

.pricing_overlay h3 {
	margin-top: 10px;
	margin-bottom: 10px;
	padding: 0px;
	letter-spacing: 1px;
	font-size: 19px;
	color: #444;
	font-weight: 400;
}

.pricing_overlay_content {
	overflow-y: auto;
	max-width: 336px;
}

.pricing_overlay_buttons {
	text-align: right;
	margin-top: 20px;
}

.pricing_overlay_buttons button {
	margin-right: 10px;
	cursor: pointer;
	background-color: #2b5b83;
	color: #eee;
	padding: 7.5px;
	border: 0px;
	width: 100px;
	font-weight: 500;
	letter-spacing: .75px;
}

.pricing_overlay_buttons button:hover {
 background: linear-gradient(#67B8E4, #33A0DB) repeat scroll 0 0 rgba(0, 0, 0, 0);
}

.left {
	text-align: left;
}

.pricing_overlay_buttons button:disabled {
	color: #cccccc;
	background: linear-gradient(#ffffff,#cccccc);
}

.pricing_overlay_buttons button, .saleable_button {
	background: linear-gradient(#329FDB,#48555C);
}

.pricing_overlay_checkbox {
	cursor: pointer;
}

.pricing_overlay_message {
	border: 1px dashed #ffffff;
	display: none;
	padding: 10px;
}

.pricing_overlay_error * {
	color: #f7941d;
	font-weight: bolder;
	font-size: 20px;
}

.personal_menu_item {
	white-space: nowrap;
	padding: 5px;
	margin: 5px;
	cursor: pointer;
}

.personal_menu_item:hover {
	background-color: #cccccc;
}

#menu_subpanel .personal_menu_item a {
	text-shadow: none;
	color: #000000;
}

.pricing_overlay_organizations {
	width: 100%;
}

.pricing_overlay_organizations thead tr th {
	border-bottom: 1px dashed #444;
	text-align: left;
}

.pricing_overlay_organizations tbody tr td {
	padding: 5px;
	word-wrap: break-word;
	vertical-align: top;
	border-bottom: 1px dashed #ddd;
}

.pricing_overlay_organizations tbody tr.disabled td {
	color: #333;
	background-color: #eee;
}

.orgs_infodiv {
	border: 1px solid #444;
	padding: 20px;
	width: 600px;
	float: right;
}

.tagline_span {
	display: block;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
	font-size: 17px;
	font-weight: 500;
	color: #444;
	text-shadow: 6px 6px 10px #aaa;
	font-style: italic;
	font-variant: small-caps;
}

.tagline_hr {
	border: 0px;
	border-bottom: 1px solid #ccc;
}

.confirm_parent {
	border: 1px solid black;
	background-color: white;
}

.user_list_row {
	cursor: help;
}

.user_list_row:hover td {
	background-color: highlight;
}

.dashboard_panel {
	border: 1px solid darkgray;
	display: inline-block;
	padding: 10px;
	margin-left: 20px;
	margin-bottom: 20px;
	vertical-align: top;
	height: 520px;
	width: 360px;
	overflow: auto;
	box-shadow: 3px 3px 10px #999;
}

.dashboard_panel_range {
	padding: 5px;
}

.dashboard_panel_range h3 {
	font-size: 13px;
	margin-top: 2px;
	margin-bottom: 5px;
}

.dashboard_panel_range button {
	margin-left: 10px;
}

.dashboard_panel_range input:NOT([type=checkbox]) {
	width: 100px;
}

.dashboard_panel span.title {
	width: 100%;
	text-align: center;
}

.pie-legend {
	list-style-type: none;
}

.pie-legend li {
	margin-bottom: 5px;
}

.bar-legend {
	list-style-type: none;
}

.bar-legend li {
	margin-bottom: 5px;
}

.vc-document-variable-input {
	background-color: yellow;
	text-align: center;
	border: 2px dashed #D1C7AC;
}

.floatright {
	float: right;
}

.floatleft {
	float: left;
}

.user_image_div {
	float: left;
	width: 200px;
	height: 200px;
	border: 1px solid #ccc;
	box-shadow: -3px -3px 10px #999 inset;
	text-align: center;
}

.user_image_div img {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.user_content_div {
	width: 70%;
	min-height: 300px;
}

.display_title_div {
	border: 1px solid #ccc;
	border-radius: 5px;
	box-shadow: -3px -3px 10px #ddd inset;
	margin-bottom: 10px;
}

.fine_print {
	color: #aaaaaa;
}

.invite_expire {
	margin-top: 25px;
}

.invite_personal_message_title {
	font-weight: 600;
}

.org_profile_input {
	width: 300px;
}

select.org_profile_input {
	width: 305px;
}

.vc_multi_text_input {
	width: 300px;
}

.vc_multi_text_input_wrapper {
	margin-bottom: 2px;
	white-space: nowrap;
}

.org_profile_label {
	vertical-align: top;
}

.master-user-pin-container {
	margin-top: 8px;
	padding: 6px 10px;
	background: #f8f9fa;
	border: 1px solid #dee2e6;
	border-radius: 4px;
	display: flex;
	align-items: center;
	gap: 8px;
}
.master-user-pin-label {
	font-weight: bold;
	font-size: 13px;
	color: #333;
}
.master-user-pin-value {
	font-family: monospace;
	font-size: 15px;
	font-weight: bold;
	letter-spacing: 2px;
	color: #0066cc;
}
.master-user-pin-copy-btn,
.master-user-pin-regenerate-btn {
	padding: 2px 8px;
	font-size: 11px;
	border: 1px solid #ccc;
	border-radius: 3px;
	background: #fff;
	cursor: pointer;
}
.master-user-pin-copy-btn:hover,
.master-user-pin-regenerate-btn:hover {
	background: #e9ecef;
}
.master-user-pin-regenerate-btn {
	border-color: #dc3545;
	color: #dc3545;
}
.master-user-pin-regenerate-btn:hover {
	background: #dc3545;
	color: #fff;
}
.master-user-transfer-btn {
	margin-left: auto;
	padding: 4px 12px;
	font-size: 12px;
	border: 1px solid #0066cc;
	border-radius: 3px;
	background: #0066cc;
	color: #fff;
	cursor: pointer;
}
.master-user-transfer-btn:hover {
	background: #0052a3;
	border-color: #0052a3;
}

.clickable {
	cursor:pointer;
}

.vc_multi_text_remove_btn {
	margin-left: 10px;
	margin-bottom: -5px;
}

.vc_multi_text_add_btn {
	margin-top: 5px;
}

.vc_multi_text_error {
	color: #9C6F30;
	font-size: 20px;
	display: none;
}

/*.code_redeemer_profile_page {*/
	/*border: 1px dashed red;*/
/*}*/

.code_redeemer_profile_page input[type=text] {
	width: 300px;
}

.code_redeemer_profile_page select {
	width: 305px;
}

.redeem_code_preview_saleable_tile {
	border: 1px solid lightgray;
	padding: 15px;
	width: 336px;
	margin: 0 auto;
	margin-top: 10px;
	vertical-align: top;
}

.redeem_code_preview_saleable_tile h3 {
	font-size: 19px;
	color: #444;
	letter-spacing: 0.75px;
	margin-top: 10px;
	margin-bottom: 10px;
	font-weight: 400;
}

.redeem_code_preview_saleable_content {
	height: 155px;
	width: 336px;
	color: #666;
	font-size: 12px;
	overflow-y: auto;
	word-wrap: break-word;
}

.redeem_code_preview_saleable_pricing {
	margin: 0 auto;
	width: 90%;
	padding-top: 15px;
	font-size: 22px;
	font-weight: 600;
	text-align: center;
}

.redeem_code_preview_tagline_span {
	display: block;
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: center;
    font-size: 17px;
    font-weight: 500;
    color: #444;
    text-shadow: 6px 6px 10px #aaa;
    font-style: italic;
    font-variant: small-caps;
}

.redeem_code_output_div {
	font-weight: 500;
	width: 336px;
	margin: 0 auto;
	margin-top: 10px;
}

.menu_wrapper {
    background-color: rgba(0, 0, 0, 0.8);
    /*
	-webkit-filter: blur(3px);
	filter : url('/images/blur.svg#blur');
	filter : blur( 3px);
	*/
	box-shadow: 5px 5px 5px #000000;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 200;
}

/* Styles for addon section rows */
.addon_section_row td {
    padding: 0;
    background-color: transparent;
    width: 100%;
}

.addon_section_row .addon_section {
    margin: 0;
    width: 100%;
    box-sizing: border-box;
	z-index: 2;
}

.menu_content_container {
	padding: 20px;
}

.menu_tile_category_tile_container {
	display: flex;
	flex-flow: row;
    column-gap: 5px;
    row-gap: 10px;
    justify-content: flex-start;
    flex-wrap: wrap;
    overflow-y: auto;
    max-height: 70vh;
    scrollbar-width: thin;
}

.menu_item_tile_container {
	color: #ffffff;
	height: 100px;
	width: 200px;
	display: inline-block;
    margin: 3px;
    cursor: pointer;
    border: 1px solid #000;
	vertical-align: bottom;
}

/*
.menu_item_tile_container:hover {
	border: 1px solid white;
}
*/

.menu_plugin_vertical_tile {
    display: flex !important;
    flex-flow: column;
}

.menu_plugin_vertical_tile_img {
    min-height: 80px;
    max-height: 80px;
    background-size: cover;
    background-repeat: no-repeat;
}

.menu_plugin_vertical_tile_text {
    background-color: rgba(0, 0, 0, 0.8);
    padding: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.menu_tile_category_container_title {
	padding: 5px;
	color: #ffffff;
	font-weight: bold;
}

.menu_tile_hidden {
	display: none;
}

.menu_standard_category_container_title {
	padding: 5px;
	color: #ffffff;
	font-weight: bold;
}

.menu_standard_menu_item_container {
	width: 250px;
	vertical-align: top;
}

.menu_standard_category_list {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}

.menu_standard_category_list li {
	padding: 2px;
	margin: 2px;
	border: 1px solid transparent;
	vertical-align: middle;
}

.menu_standard_category_list li:hover {
	border: 1px solid #fff;
}

.menu_tile_menu_item_container {
	vertical-align: top;
}

.menu_plugin_settings_item {
	vertical-align: middle;
	color: #ffffff;
	cursor: pointer;
}

.menu_plugin_settings_item_icon_container {
	text-align: center;
	vertical-align: middle;
	width: 24px;
	height: 24px;
	background-color: #ffffff;
	display: inline-block;
	margin-right: 5px;
}

.menu_plugin_settings_item_icon {
	width: 14px;
	vertical-align: middle;
    /*margin-bottom: -3px;*/
}

.menu_plugin_nav_item {
	vertical-align: middle;
	color: #ffffff;
	cursor: pointer;
}

.menu_plugin_nav_item_icon_container {
	text-align: center;
	vertical-align: middle;
	width: 24px;
	height: 24px;
	background-color: #ffffff;
	display: inline-block;
	margin-right: 5px;
}

.menu_plugin_nav_item_icon {
	width: 14px;
	vertical-align: middle;
    /*margin-bottom: -3px;*/
}

/* Programs hover row: the tile widgets moved out of the always-on grid into
   a flyout panel that opens beside the menu. */
.menu_programs_chevron {
	display: flex;
	align-items: center;
	flex: 0 0 14px;
	margin-left: auto;
	color: rgba(255, 255, 255, 0.5);
}

.menu_programs_chevron svg {
	display: block;
	width: 14px;
	height: 14px;
}

/* The flyout wears the same charcoal frosted glass as the organization
   switcher menu so the two top-bar surfaces read as one material. */
.menu_programs_flyout {
	position: absolute;
	box-sizing: border-box;
	right: calc(100% + 8px);
	top: 0;
	display: none;
	flex-flow: column;
	row-gap: 8px;
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
	padding: 12px;
	border-radius: 10px;
	background-color: rgba(40, 40, 40, 0.5);
	background-image: linear-gradient(to right, rgba(66, 66, 66, 0.42), rgba(34, 34, 34, 0.52));
	-webkit-backdrop-filter: blur(22px) saturate(1.5);
	backdrop-filter: blur(22px) saturate(1.5);
	border: 1px solid rgba(255, 255, 255, 0.14);
	box-shadow:
		0 12px 32px rgba(8, 18, 32, 0.35),
		0 2px 8px rgba(8, 18, 32, 0.25),
		inset 0 1px 0 rgba(255, 255, 255, 0.14);
	z-index: 201;
}

.menu_programs_flyout.is-open {
	display: flex;
}

.menu_programs_flyout::-webkit-scrollbar {
	width: 6px;
}

.menu_programs_flyout::-webkit-scrollbar-track {
	background: transparent;
}

.menu_programs_flyout::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.18);
	border-radius: 3px;
}

.menu_programs_flyout::-webkit-scrollbar-thumb:hover {
	background: rgba(255, 255, 255, 0.32);
}

.menu_programs_flyout .menu_item_tile_container {
	margin: 0;
	flex: 0 0 auto;
	border: none;
	border-radius: 8px;
	overflow: hidden;
}

/* ------------------------------------------------------------------
   Toolkit account menu: the modern glass panel. Same charcoal frost
   as the organization switcher, led by an identity header, with
   stroke-glyph card-pill rows. Scoped away from the Academy menu
   (pa-menu), which keeps its original look.
   ------------------------------------------------------------------ */
.menu_wrapper.menu_wrapper_modern {
	background-color: rgba(40, 40, 40, 0.5);
	background-image: linear-gradient(to right, rgba(66, 66, 66, 0.42), rgba(34, 34, 34, 0.52));
	-webkit-backdrop-filter: blur(22px) saturate(1.5);
	backdrop-filter: blur(22px) saturate(1.5);
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 14px;
	box-shadow:
		0 12px 32px rgba(8, 18, 32, 0.35),
		0 2px 8px rgba(8, 18, 32, 0.25),
		inset 0 1px 0 rgba(255, 255, 255, 0.14);
	font-family: 'Manrope', sans-serif;
	transform-origin: top right;
	animation: menu-glass-pop-in 0.16s ease-out;
}

@keyframes menu-glass-pop-in {
	from { opacity: 0; transform: translateY(-6px) scale(0.98); }
	to { opacity: 1; transform: translateY(0) scale(1); }
}

.menu_wrapper.menu_wrapper_closing {
	opacity: 0;
	transform: translateY(-4px) scale(0.98);
	transition: opacity 0.14s ease-in, transform 0.14s ease-in;
	pointer-events: none;
}

.menu_wrapper_modern .menu_content_container {
	padding: 12px;
}

/* --- Identity header: avatar + name + email, split by a hairline. --- */
.menu_identity {
	padding: 6px 6px 12px;
	margin-bottom: 10px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.menu_identity_main {
	display: flex;
	align-items: center;
	gap: 11px;
}

/* Rows hosted inside the profile card (e.g. Settings). */
.menu_identity_actions {
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}

.menu_wrapper_modern .menu_identity_actions li:last-child {
	margin-bottom: 0;
}

/* App-blue avatar coin with the dimensional lit-top / dark-bottom edges. */
.menu_identity_avatar {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 38px;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	overflow: hidden;
	background-image: linear-gradient(180deg, #2f7fd0, #00529b);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.35),
		inset 0 -1px 0 rgba(0, 30, 60, 0.35),
		0 1px 3px rgba(8, 18, 32, 0.4);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.03em;
	user-select: none;
}

.menu_identity_avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.menu_identity_text {
	min-width: 0;
}

.menu_identity_name {
	color: rgba(255, 255, 255, 0.95);
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.menu_identity_email {
	color: rgba(255, 255, 255, 0.5);
	font-size: 12px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* --- Sections: captions like the switcher's "SWITCH ORGANIZATION". --- */
.menu_wrapper_modern .menu_standard_category_container_title {
	padding: 6px 8px 5px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.5);
}

/* --- Rows: glass card pills with stroke glyphs. --- */
.menu_wrapper_modern .menu_standard_category_list li {
	padding: 8px 10px;
	margin: 0 0 6px;
	border: none;
	border-radius: 9px;
	background-color: rgba(255, 255, 255, 0.08);
	color: rgba(255, 255, 255, 0.88);
	cursor: pointer;
}

.menu_wrapper_modern .menu_standard_category_list li:hover {
	border: none;
	background-color: rgba(255, 255, 255, 0.16);
}

.menu_modern_row {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
}

.menu_modern_row_icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 16px;
	width: 16px;
	height: 16px;
	color: rgba(255, 255, 255, 0.65);
}

.menu_modern_row_icon svg {
	display: block;
	width: 16px;
	height: 16px;
}

.menu_modern_row_label {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Logout and friends: soft red, warmer on hover. */
.menu_wrapper_modern .menu_standard_category_list li.is-danger {
	color: #ff9d9d;
}

.menu_wrapper_modern .menu_standard_category_list li.is-danger .menu_modern_row_icon {
	color: #ff9d9d;
}

.menu_wrapper_modern .menu_standard_category_list li.is-danger:hover {
	background-color: rgba(255, 110, 110, 0.18);
}

/* Legacy fallback rows (plugins without a glyph): blend the old white
   icon chips into the glass. */
.menu_wrapper_modern .menu_plugin_nav_item,
.menu_wrapper_modern .menu_plugin_settings_item {
	color: rgba(255, 255, 255, 0.88);
}

.menu_wrapper_modern .menu_plugin_nav_item_icon_container,
.menu_wrapper_modern .menu_plugin_settings_item_icon_container {
	background-color: transparent;
	border-radius: 6px;
	margin-right: 8px;
}

.menu_wrapper_modern .menu_plugin_nav_item_icon,
.menu_wrapper_modern .menu_plugin_settings_item_icon {
	filter: grayscale(1) invert(1) brightness(1.7);
}

.menu_wrapper_modern .version-container {
	padding: 0 14px 8px;
	text-align: right;
	color: rgba(255, 255, 255, 0.35);
	font-size: 10px;
}

.menu_wrapper_modern .version-container > span {
	margin-right: 0;
}

/* --- Support view: the same glass panel, re-dressed in place. --- */

.menu_support_view {
	display: none;
	min-width: 230px;
}

.menu_wrapper.menu_support_mode .menu_content_container > *:not(.menu_support_view) {
	display: none;
}

.menu_wrapper.menu_support_mode .menu_support_view {
	display: block;
}

.menu_wrapper.menu_support_mode .menu_programs_flyout {
	display: none;
}

.menu_support_back {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 6px 6px 12px;
	margin-bottom: 10px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	color: rgba(255, 255, 255, 0.95);
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
}

.menu_support_back_icon {
	display: flex;
	width: 16px;
	height: 16px;
	color: rgba(255, 255, 255, 0.65);
}

.menu_support_back_icon svg {
	width: 16px;
	height: 16px;
}

.menu_support_back:hover .menu_support_back_icon {
	color: #fff;
}

/* Live hours badge in the support header: entity-badge language,
   tuned for the dark glass. */
.menu_support_status {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin-left: auto;
	padding: 2px 8px;
	border-radius: 999px;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: default;
}

/* Instant tooltip (the native title one waits ~1s before showing). */
.menu_support_status::after {
	content: attr(data-tooltip);
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	width: max-content;
	white-space: nowrap;
	padding: 7px 10px;
	border-radius: 8px;
	background: rgba(20, 24, 30, 0.95);
	box-shadow:
		inset 0 0 0 1px rgba(255, 255, 255, 0.12),
		0 4px 14px rgba(8, 18, 32, 0.4);
	color: rgba(255, 255, 255, 0.92);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: normal;
	text-transform: none;
	line-height: 1.45;
	text-align: left;
	opacity: 0;
	transform: translateY(-2px);
	pointer-events: none;
	transition: opacity 0.12s ease, transform 0.12s ease;
	z-index: 5;
}

.menu_support_status:hover::after {
	opacity: 1;
	transform: translateY(0);
}

.menu_support_status::before {
	content: '';
	width: 6px;
	height: 6px;
	border-radius: 50%;
}

.menu_support_status.is-online {
	color: #8ce7ad;
	background: rgba(46, 174, 87, 0.22);
}

.menu_support_status.is-online::before {
	background: #2eae57;
	box-shadow: 0 0 0 3px rgba(46, 174, 87, 0.22);
}

.menu_support_status.is-offline {
	color: rgba(255, 255, 255, 0.6);
	background: rgba(255, 255, 255, 0.10);
}

.menu_support_status.is-offline::before {
	background: rgba(255, 255, 255, 0.45);
}

.menu_support_list {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Match the identity view's 6px content inset (rows at 19px from the
   panel edge); the back header's divider stays full-width like the
   identity hairline. */
.menu_wrapper_modern .menu_support_list li {
	margin: 0 6px 6px;
}

.menu_support_link {
	display: flex;
	align-items: center;
	gap: 10px;
	color: inherit;
	text-decoration: none;
}

/* Booking CTA: the dimensional app-blue coin recipe, stretched into a bar. */
.menu_support_schedule {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 10px 6px 0;
	padding: 9px 12px;
	border-radius: 9px;
	background-image: linear-gradient(180deg, #2f7fd0, #00529b);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.35),
		inset 0 -1px 0 rgba(0, 30, 60, 0.35),
		0 1px 3px rgba(8, 18, 32, 0.4);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
}

.menu_support_schedule:hover {
	filter: brightness(1.08);
}

.menu_support_schedule_icon {
	display: flex;
	width: 15px;
	height: 15px;
}

.menu_support_schedule_icon svg {
	width: 15px;
	height: 15px;
}

.menu_support_pin {
	margin: 10px 6px 0;
	padding: 10px 12px;
	border-radius: 9px;
	background-color: rgba(255, 255, 255, 0.08);
}

.menu_support_pin_title {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.5);
}

.menu_support_pin_value {
	margin-top: 4px;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 0.22em;
	color: #fff;
}

.menu_support_pin_hint {
	margin-top: 4px;
	font-size: 11px;
	color: rgba(255, 255, 255, 0.5);
	white-space: normal;
	max-width: 230px;
}

#confirm_dialog {
	display: none;
	position: absolute;
	border: 1px solid black;
    background-color: rgba(0, 0, 0, 0.8);
    color: white;
	padding: 5px;
	max-width: 300px;
}

.confirm_dialog_buttons {
	text-align: right;
}

.confirm_dialog_buttons > button {
	margin: 5px;
}

.confirm_dialog_buttons > button.yes:after {
	content: url(/images/icons/18/color/checkmark2.png);
	margin-left: 3px;
}

.confirm_dialog_buttons > button.no:after {
	content: url(/images/icons/18/color/cross.png);
	margin-left: 3px;
}

.vc-confirm-dialog.ui-dialog {
	max-width: calc(100vw - 32px);
	padding: 0;
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 18px 45px rgba(0, 0, 0, .18), 0 4px 12px rgba(0, 0, 0, .08);
	overflow: hidden;
}

.vc-confirm-dialog .ui-dialog-titlebar {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 22px;
	padding: 14px 46px 6px 6px;
	border: 0;
	background: #fff;
	color: #151d29;
	box-sizing: border-box;
}

.vc-confirm-dialog .ui-dialog-title {
	display: block;
	float: none;
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
	margin: 0;
	color: #151d29;
	font-size: 15px;
	font-weight: 700;
	line-height: 20px;
	white-space: normal;
}

.vc-confirm-dialog .ui-dialog-titlebar-close {
	position: absolute;
	top: 10px;
	right: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	margin: 0;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 7px;
	background: transparent;
	color: #6f7782;
	box-sizing: border-box;
	cursor: pointer;
}

.vc-confirm-dialog .ui-dialog-titlebar-close:hover {
	border-color: #d9dee5;
	background: #f5f5f5;
	color: #252a31;
}

.vc-confirm-dialog .ui-dialog-titlebar-close:focus-visible {
	outline: none;
	border-color: #b8c0ca;
	box-shadow: 0 0 0 2px rgba(15, 23, 42, .12);
}

.vc-confirm-dialog .ui-dialog-titlebar-close .ui-icon,
.vc-confirm-dialog .ui-dialog-titlebar-close .ui-button-icon,
.vc-confirm-dialog .ui-dialog-titlebar-close .ui-button-icon-primary,
.vc-confirm-dialog .ui-dialog-titlebar-close .ui-button-text {
	display: none;
}

.vc-confirm-dialog .ui-dialog-titlebar-close:before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.vc-confirm-dialog .ui-dialog-content {
	padding: 16px;
	border: 0;
	background: #fff;
	color: #3b4856;
	min-height: 0 !important;
	overflow: visible;
}

.vc-confirm-content {
	min-height: 0;
}

.vc-confirm-title-icon {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	border: 1px solid #f5d795;
	border-radius: 999px;
	background: #fff7e6;
	color: #a86100;
	box-sizing: border-box;
}

.vc-confirm-title-icon:before {
	content: "!";
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
}

.vc-confirm-title-icon-danger {
	border-color: #f4c7c7;
	background: #fff1f1;
	color: #c92d2d;
}

.vc-confirm-message {
	min-width: 0;
	color: #3b4856;
	font-size: 13px;
	font-weight: 500;
	line-height: 18px;
	overflow-wrap: anywhere;
}

.vc-confirm-message p {
	margin: 0 0 8px;
}

.vc-confirm-message p:last-child {
	margin-bottom: 0;
}

.vc-confirm-dialog .ui-dialog-buttonpane {
	margin: 0;
	padding: 10px 14px 12px;
	border-width: 1px 0 0;
	border-style: solid;
	border-color: #e7ebef;
	background: #fff;
	box-sizing: border-box;
}

.vc-confirm-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	float: none;
	width: 100%;
}

.vc-confirm-dialog .ui-dialog-buttonpane button.ui-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	height: 32px;
	margin: 0;
	padding: 0 14px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background: #fff;
	color: #395066;
	box-shadow: none;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	box-sizing: border-box;
}

.vc-confirm-dialog .ui-dialog-buttonpane button.ui-button:hover {
	border-color: #bfcad6;
	background: #f5f8fb;
	color: #23384f;
}

.vc-confirm-dialog .ui-dialog-buttonpane button.ui-button:focus {
	outline: none;
	border-color: #8cb2e5;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .16);
}

.vc-confirm-dialog .ui-dialog-buttonpane button.ui-button .ui-button-text {
	padding: 0;
	line-height: 1;
}

/* The scoped rule above paints every dialog button white and clears its shadow, and it
   outranks the shared DIMENSIONAL BUTTONS block (which only matches the bare
   .vc-confirm-primary class). So the primary has to carry the dimensional face here, at
   the specificity that actually wins - otherwise it renders as white-on-white. */
.vc-confirm-dialog .ui-dialog-buttonpane button.vc-confirm-button-primary {
	border-color: var(--btn-border);
	background-color: var(--btn-fill);
	background-image: var(--btn-sheen);
	color: #fff;
	box-shadow:
		0 1px 1px rgba(var(--btn-shadow-hue), 0.18),
		0 3px 7px rgba(var(--btn-shadow-hue), 0.16),
		var(--btn-ring),
		inset 0 1px 0 var(--btn-specular),
		inset 0 -1px 0 var(--btn-underside);
}

.vc-confirm-dialog .ui-dialog-buttonpane button.vc-confirm-button-primary:hover {
	border-color: var(--btn-border);
	background-color: var(--btn-fill-hover);
	background-image: var(--btn-sheen);
	color: #fff;
}

.vc-confirm-dialog .ui-dialog-buttonpane button.vc-confirm-button-danger {
	border-color: #ef4444;
	background: #ef4444;
	color: #fff;
}

.vc-confirm-dialog .ui-dialog-buttonpane button.vc-confirm-button-danger:hover {
	border-color: #dc2626;
	background: #dc2626;
	color: #fff;
}

.vc-utility-dialog.ui-dialog {
	max-width: calc(100vw - 32px);
	padding: 0;
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 18px 45px rgba(0, 0, 0, .18), 0 4px 12px rgba(0, 0, 0, .08);
	overflow: hidden;
}

.vc-utility-dialog .ui-dialog-titlebar {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 42px;
	padding: 12px 46px 8px 16px;
	border: 0;
	background: #fff;
	color: #151d29;
	box-sizing: border-box;
}

.vc-utility-dialog .ui-dialog-title {
	display: block;
	float: none;
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
	margin: 0;
	color: #151d29;
	font-size: 15px;
	font-weight: 700;
	line-height: 20px;
	white-space: normal;
}

.vc-utility-dialog .ui-dialog-titlebar-close {
	position: absolute;
	top: 10px;
	right: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	margin: 0;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 7px;
	background: transparent;
	color: #6f7782;
	box-sizing: border-box;
	cursor: pointer;
}

.vc-utility-dialog .ui-dialog-titlebar-close:hover {
	border-color: #d9dee5;
	background: #f5f5f5;
	color: #252a31;
}

.vc-utility-dialog .ui-dialog-titlebar-close:focus-visible {
	outline: none;
	border-color: #b8c0ca;
	box-shadow: 0 0 0 2px rgba(15, 23, 42, .12);
}

.vc-utility-dialog .ui-dialog-titlebar-close .ui-icon,
.vc-utility-dialog .ui-dialog-titlebar-close .ui-button-icon,
.vc-utility-dialog .ui-dialog-titlebar-close .ui-button-icon-primary,
.vc-utility-dialog .ui-dialog-titlebar-close .ui-button-text {
	display: none;
}

.vc-utility-dialog .ui-dialog-titlebar-close:before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Dialogs that also offer Maximize: the control is inline-styled at right: 2.2em by the
   script that builds it, which put it under the modern close button. Seat it beside the
   close instead, and reserve the title room for both (#1609 CON-118). */
.vc-utility-dialog .ui-dialog-titlebar-maximize {
	top: 10px !important;
	right: 46px !important;
	width: 30px !important;
	height: 30px !important;
	padding: 0 !important;
	border: 1px solid transparent !important;
	border-radius: 7px;
	background: transparent;
	color: #6f7782;
	transform: none !important;
	box-sizing: border-box;
	cursor: pointer;
}

.vc-utility-dialog .ui-dialog-titlebar-maximize:hover {
	border-color: #d9dee5 !important;
	background: #f5f5f5;
}

.vc-utility-dialog .ui-dialog-titlebar-maximize:focus-visible {
	outline: none;
	border-color: #b8c0ca !important;
	box-shadow: 0 0 0 2px rgba(15, 23, 42, .12);
}

.vc-utility-dialog:has(.ui-dialog-titlebar-maximize) .ui-dialog-titlebar {
	padding-right: 82px;
}

.vc-utility-dialog .ui-dialog-content {
	padding: 16px;
	border: 0;
	background: #fff;
	color: #3b4856;
	min-height: 0 !important;
	overflow: auto;
	box-sizing: border-box;
}

.vc-utility-content {
	color: #3b4856;
	font-size: 13px;
	font-weight: 500;
	line-height: 18px;
}

.vc-utility-message-text {
	margin: 0;
	overflow-wrap: anywhere;
}

.vc-utility-checkbox-row {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	color: #3b4856;
	font-size: 13px;
	font-weight: 600;
	line-height: 18px;
	cursor: pointer;
}

.vc-utility-checkbox-row input {
	flex: 0 0 auto;
	margin: 0;
}

.vc-utility-dialog .ui-dialog-buttonpane {
	margin: 0;
	padding: 10px 14px 12px;
	border-width: 1px 0 0;
	border-style: solid;
	border-color: #e7ebef;
	background: #fff;
	box-sizing: border-box;
}

.vc-utility-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	float: none;
	width: 100%;
}

.vc-utility-dialog .ui-dialog-buttonpane button.ui-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	height: 32px;
	margin: 0;
	padding: 0 14px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background: #fff;
	color: #395066;
	box-shadow: none;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	box-sizing: border-box;
}

.vc-utility-dialog .ui-dialog-buttonpane button.ui-button:hover {
	border-color: #bfcad6;
	background: #f5f8fb;
	color: #23384f;
}

.vc-utility-dialog .ui-dialog-buttonpane button.ui-button:focus {
	outline: none;
	border-color: #8cb2e5;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .16);
}

.vc-utility-dialog .ui-dialog-buttonpane button.ui-button .ui-button-text {
	padding: 0;
	line-height: 1;
}

/* The scoped rule above paints every dialog button white and clears its shadow, and it
   outranks the shared DIMENSIONAL BUTTONS block (which only matches the bare
   .vc-utility-primary class). So the primary has to carry the dimensional face here, at
   the specificity that actually wins - otherwise it renders as white-on-white. */
.vc-utility-dialog .ui-dialog-buttonpane button.vc-utility-button-primary {
	border-color: var(--btn-border);
	background-color: var(--btn-fill);
	background-image: var(--btn-sheen);
	color: #fff;
	box-shadow:
		0 1px 1px rgba(var(--btn-shadow-hue), 0.18),
		0 3px 7px rgba(var(--btn-shadow-hue), 0.16),
		var(--btn-ring),
		inset 0 1px 0 var(--btn-specular),
		inset 0 -1px 0 var(--btn-underside);
}

.vc-utility-dialog .ui-dialog-buttonpane button.vc-utility-button-primary:hover {
	border-color: var(--btn-border);
	background-color: var(--btn-fill-hover);
	background-image: var(--btn-sheen);
	color: #fff;
}

.appointment-conflict-dialog .ui-dialog-content {
	padding: 8px 14px 14px;
}

.cal-conflict-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cal-conflict-list-item {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 0;
	border: 1px solid #d4e1ee;
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 10px 24px rgba(0, 51, 102, .08), 0 1px 2px rgba(20, 32, 46, .05);
	color: #2d3a48;
	box-sizing: border-box;
	cursor: pointer;
	overflow: hidden;
	transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.cal-conflict-list-item:hover {
	border-color: #a9c2dc;
	box-shadow: 0 14px 30px rgba(0, 51, 102, .14), 0 2px 4px rgba(20, 32, 46, .06);
	transform: translateY(-1px);
}

.cal-conflict-list-item:focus-visible {
	outline: none;
	border-color: #8eb1d2;
	box-shadow: 0 0 0 3px rgba(0, 82, 155, .20), 0 14px 30px rgba(0, 51, 102, .14);
}

/* Header row: subject + date on the left, horizontal time pill on the far right */
.cal-conflict-header {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 14px;
}

.cal-conflict-time {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: baseline;
	gap: 5px;
	padding: 5px 11px;
	border: 1px solid #a9c2dc;
	border-radius: 8px;
	background: #f4f8fc;
	color: #1f5f93;
	white-space: nowrap;
}

.cal-conflict-time-start {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: -.2px;
	color: #174d82;
}

.cal-conflict-time-sep {
	font-size: 11px;
	font-weight: 700;
	color: #88a4c2;
}

.cal-conflict-time-end {
	font-size: 13px;
	font-weight: 700;
	color: #3f648c;
}

.cal-conflict-list-details {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
	gap: 3px;
}

.cal-conflict-list-subject {
	display: block;
	min-width: 0;
	margin: 0;
	color: #1d2b3a;
	font-size: 15px;
	font-weight: 700;
	line-height: 19px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	text-decoration: none;
}

.cal-conflict-list-date {
	display: block;
	min-width: 0;
	color: #6a7d92;
	font-size: 12px;
	font-weight: 650;
	line-height: 16px;
	letter-spacing: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Attendees accordion — Team & Contacts, collapsed by default */
.cal-conflict-accordion {
	border-top: 1px solid #eaeff5;
	background: #fbfdff;
}

.cal-conflict-accordion-header {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 9px 14px;
	color: #174d82;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .4px;
	text-transform: uppercase;
	cursor: pointer;
	outline: none;
	transition: background-color .14s ease;
}

.cal-conflict-accordion-header:hover {
	background: #f1f6fb;
}

.cal-conflict-accordion-header:focus-visible {
	background: #eaf3fb;
	box-shadow: inset 0 0 0 2px rgba(0, 82, 155, .25);
}

.cal-conflict-accordion-caret {
	flex: 0 0 auto;
	width: 0;
	height: 0;
	border-left: 5px solid #5a82ac;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	transition: transform .2s ease;
}

.cal-conflict-accordion.is-open .cal-conflict-accordion-caret {
	transform: rotate(90deg);
}

.cal-conflict-accordion-title {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.cal-conflict-accordion-count {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	height: 18px;
	padding: 0 6px;
	border-radius: 999px;
	background: #e4eef8;
	color: #174d82;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0;
}

.cal-conflict-accordion-body {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows .22s ease;
}

.cal-conflict-accordion.is-open .cal-conflict-accordion-body {
	grid-template-rows: 1fr;
}

.cal-conflict-accordion-body-inner {
	min-height: 0;
	overflow: hidden;
}

.cal-conflict-attendee-list {
	display: flex;
	flex-direction: column;
	min-width: 0;
	gap: 11px;
	padding: 3px 14px 13px;
}

.cal-conflict-attendee-row {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	min-width: 0;
	gap: 5px;
}

.cal-conflict-attendee-row-label {
	flex: 0 0 auto;
	color: #7f93aa;
	font-size: 10px;
	font-weight: 700;
	line-height: 13px;
	letter-spacing: .5px;
	text-transform: uppercase;
}

.cal-conflict-attendee-chips {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	min-width: 0;
	gap: 6px;
}

.cal-conflict-attendee-chip {
	display: inline-flex;
	align-items: center;
	min-width: 0;
	max-width: 100%;
	gap: 7px;
	padding: 2px 10px 2px 3px;
	border: 1px solid #e3eaf2;
	border-radius: 999px;
	background: #fff;
	color: #42566b;
	box-sizing: border-box;
}

.cal-conflict-attendee-avatar,
.cal-conflict-attendee-avatar .lookup-dropdown-avatar-image {
	width: 22px;
	height: 22px;
}

.cal-conflict-attendee-avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	border-radius: 50%;
	color: #fff;
	font-size: 9px;
	font-weight: 700;
	line-height: 1;
	overflow: hidden;
	text-transform: uppercase;
	box-shadow: 0 1px 3px rgba(20, 32, 46, .20);
}

.cal-conflict-attendee-avatar span {
	line-height: 1;
}

.cal-conflict-attendee-name {
	min-width: 0;
	max-width: 170px;
	color: #42566b;
	font-size: 12px;
	font-weight: 650;
	line-height: 16px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

@media (max-width: 520px) {
	.cal-conflict-header {
		gap: 10px;
		padding: 11px 10px 11px 12px;
	}
	.cal-conflict-time {
		padding: 5px 9px;
	}
	.cal-conflict-accordion-header,
	.cal-conflict-attendee-list {
		padding-left: 12px;
		padding-right: 12px;
	}
}

.side_menu_sub_menu_container {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

.side_menu_sub_menu_container li {
	/*margin-bottom: 3px;*/
	padding: 3px;
	min-height: 20px;
	position: relative;
}

/*
.side_menu_sub_menu_container li:not(.side_menu_sub_sub_menu_container li) {
    margin-bottom: 5px;
}
*/

/*
.side_menu_sub_menu_container li:not(:last-child) .side_menu_vertical_buttons .complete-section-mark::before {
	content: "";
	position: absolute;
    top: 10px;
    right: 14px;
	width: 2px;
	height: 100%;
    background-image: radial-gradient(circle, #a9a9a9 1px, transparent 1px);
	background-size: 2px 5px;
	background-repeat: repeat-y;
}

.side_menu_sub_sub_menu_container li::before {
	content: "";
	position: absolute;
    top: 10px;
    right: 14px;
	width: 2px;
	height: 100%;
    background-image: radial-gradient(circle, #a9a9a9 1px, transparent 1px);
	background-size: 2px 5px;
	background-repeat: repeat-y;
}
*/

.side_menu_sub_sub_menu_container {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
    margin-left: 28px;
	/*margin-top: 5px;*/
	vertical-align: middle;
}

.side_menu_sub_sub_menu_container li {
	/*margin-bottom: 3px;*/
	padding: 3px;
	border: 1px dashed transparent;
}

.side_menu_sub_sub_menu_container li:hover {
	border: 1px dashed #CFBAB4;
}

.side_menu_book_progress {
	min-height: 30px;
	position: relative;
}

.side_menu * .ui-progressbar {
	background-color: transparent;
}

.side_menu * .ui-widget-content {
	border: none;
	background-color: transparent;
}

.side_menu * .ui-accordion-content {
	border: 1px solid #a6c9e2;
	background-color: #ffffff;
}

.side_menu * .ui-accordion-content {
	padding-right: 3px;
}

.side_menu_book_progress .ui-progressbar-value {
	border: none;
	background-color: rgba(255,255,255, 0.10);
	vertical-align: middle;
}

.side_menu_book {
	vertical-align: middle;
    line-height: 27px;
    height: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-left: 5px;
    font-size: 16px;
    font-family: 'Manrope';
	white-space: nowrap;
	flex-grow:1;
}

.side_menu_section {
	display:flex;
	flex-flow:row;
    justify-content: space-between;
	vertical-align: middle;
	font-size: 16px;
	cursor: pointer;
	min-height: 20px;
	line-height:30px;
    position: relative;
	border-radius:10px;
}

.side_menu_section:hover {
	background-color: #D5DCDE;
}

.side_menu_section span {
    white-space: nowrap;
    width: calc(100% - 40px);
    text-overflow: ellipsis;
    overflow: hidden;
    padding-left: 10px;
}

/*
.side_menu_section span:before {
	content: "";
	background-image: url(/images/pareto_academy/unopened_module.svg);
    min-width: 15px;
    min-height: 15px;
    display: inline-block;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: -2px;
    margin-right: 16px;
    margin-left: -2px;
}
*/

.side_menu_section_selected {
	position:relative;
    background-color: #d5dcde;
}

/*
.side_menu_section_selected span:before {
	background-image: url(/images/pareto_academy/active_module.svg);
    min-width: 30px;
    min-height: 30px;
    margin-left: -9px;
    margin-bottom: -9px;
    margin-right: 8px;
}

.side_menu_section span.complete_section:before {
	background-image: url(/images/pareto_academy/complete_check.svg);
    min-width: 30px;
    min-height: 28px;
    margin-bottom: -6px;
    margin-left: -8px;
    margin-right: 9px;
}
*/

/*
.side_menu_section_selected {
	background-color: #eee;
}
	*/

.side_menu_display_section {
	vertical-align: middle;
	font-size: 13px;
	cursor: pointer;
	min-height: 20px;
}

.side_menu_display_section:before {
    content: "\1f852";
    margin-left: 10px;
    margin-right: 2px;
    font-size: 15px;
    color: darkgray;
}

.side_menu_admin_section {
	min-width: 300px;
	white-space: nowrap;
}

.side_menu_admin_sub_section {
	white-space: nowrap;
	cursor: pointer;
}

.side_menu_toolkit_menu_item {
	min-width: 300px;
	white-space: nowrap;
}

/*.side_menu_vertical_buttons {*/
	/*float: right;*/
	/*margin-top: 5px;*/
	/*vertical-align: middle;
	position: absolute;
	right: 0;
	z-index: 5;	*/
/*}*/

.quick_nav_table {
	margin-left: auto;
	margin-right: auto;
}

.quick_nav_table tbody tr td a {
	padding-left: 50px;
	padding-right: 50px;
}

.quick_nav_container {
	margin: 7px;
	padding: 7px;
	border-top: 1px solid #ccc;
	vertical-align: middle;
}

.quick_nav_link {
	font-size: 15px;
	text-decoration: none;
	vertical-align: middle;
}

.quick_nav_link_disabled {
	text-decoration: none;
	text-shadow: none;
	color: gray;
}

.quick_nav_icon {
	margin: 3px;
	vertical-align: middle;
}

.organization_selector {
	display: flex;
	align-items: center;
	padding-left: 20px;
	cursor: default;
	height: 100%;
}

/* The caret glyph is baseline-set at font-size:large elsewhere, which
   inflates the line box and floats the 14px label off optical center;
   flex-center it at text scale instead. */
.organization_selector.drop_down_indicator::after {
	font-size: 15px;
	line-height: 1;
}

/* No hover/open surface on the trigger - the flipping caret is the only
   affordance; the frosted menu itself carries the visual weight. */
.organization_selector_multi {
	padding-right: 5px;
}

/* The caret flips while the switcher menu is open. */
.organization_selector.drop_down_indicator::after {
	display: inline-block;
	transition: transform 0.2s ease;
}

.organization_selector.is-menu-open.drop_down_indicator::after {
	transform: rotate(180deg);
}

/* Terms of Service: the document scrolls inside the dialog, so the dialog body itself
   neither pads nor scrolls (TermsOfServiceUIProvider.showTosDialog). */
.vc-utility-dialog .ui-dialog-content.terms_of_service_dialog_body {
	overflow: hidden;
	padding: 0;
}

.terms_of_service_content {
	overflow-y: auto;
	padding: 20px;
	height: 100%;
	box-sizing: border-box;
}

/* "Setting up your Toolkit" wait shown while a new org's database is built
   (OrganizationSelector.waitForOrgDbReady). */
.toolkit_setup_wait_title {
	text-align: center;
	margin: 10px 0;
}

.toolkit_setup_wait_hint {
	text-align: center;
	color: #666;
	font-size: 0.9em;
}

.toolkit_setup_wait_spinner {
	margin: 20px auto;
	width: 40px;
	height: 40px;
	border: 4px solid #eee;
	border-top-color: #3498db;
	border-radius: 50%;
	animation: toolkit_setup_wait_spin 1s linear infinite;
}

@keyframes toolkit_setup_wait_spin {
	to { transform: rotate(360deg); }
}

/* Organization switcher menu - rides the shared context-menu card
   (context_menu.css); only the org rows need a voice of their own. */
/* Dark frosted glass: the menu hangs off the top menu bar, so the pane wears
   the bar's own charcoal (#424242 -> #222222 gradient) as a translucent
   frost, with a lit top edge. Without backdrop-filter support the ~0.7
   alpha still reads fine. */
.vc-context-menu.organization_selector_context_menu {
	/* Mirror the account menu's viewport gaps (~6px from the edge, top
	   at 38px): the anchor opens this at left 2 / top 33, so nudge by
	   the difference. */
	margin-left: 4px;
	margin-top: 2px;
	/* The account menu's generous metrics: 12px pane inset, 14px radius. */
	padding: 12px;
	border-radius: 14px;
	background-color: rgba(40, 40, 40, 0.5);
	background-image: linear-gradient(to right, rgba(66, 66, 66, 0.42), rgba(34, 34, 34, 0.52));
	-webkit-backdrop-filter: blur(22px) saturate(1.5);
	backdrop-filter: blur(22px) saturate(1.5);
	border: 1px solid rgba(255, 255, 255, 0.14);
	box-shadow:
		0 12px 32px rgba(8, 18, 32, 0.35),
		0 2px 8px rgba(8, 18, 32, 0.25),
		inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.organization_selector_context_menu .vc-context-menu-header {
	padding: 6px 8px 8px;
	color: rgba(255, 255, 255, 0.55);
}

.organization_selector_context_menu .vc-context-menu-thumb {
	background-color: rgba(255, 255, 255, 0.35);
}

/* Org rows are glass cards floating in the pane. */
.organization_selector_context_menu .organization_selector_menu_item {
	padding: 10px 12px;
	border-radius: 9px;
	background-color: rgba(255, 255, 255, 0.08);
	color: rgba(255, 255, 255, 0.88);
}

.organization_selector_context_menu .organization_selector_menu_item + .organization_selector_menu_item {
	margin-top: 6px;
}

.organization_selector_context_menu .organization_selector_menu_item:hover,
.organization_selector_context_menu .organization_selector_menu_item.is-focused {
	background-color: rgba(255, 255, 255, 0.16);
}

/* Stroke glyphs tuned for the glass. */
.organization_selector_context_menu .vc-context-menu-icon {
	color: rgba(255, 255, 255, 0.65);
}

/* Current org: a cool blue glow in the glass with a brighter ring. */
.organization_selector_context_menu .organization_selector_menu_item.is-current,
.organization_selector_context_menu .organization_selector_menu_item.is-current:hover,
.organization_selector_context_menu .organization_selector_menu_item.is-current.is-focused {
	background-color: rgba(122, 180, 255, 0.22);
	box-shadow: inset 0 0 0 1px rgba(158, 205, 255, 0.4);
	color: #dcecff;
	font-weight: 600;
	cursor: default;
}

.organization_selector_context_menu .organization_selector_menu_item.is-current .vc-context-menu-icon {
	color: #dcecff;
}

/* Trailing check on the current org. */
.organization_selector_context_menu .organization_selector_menu_item.is-current::after {
	content: '';
	flex: 0 0 13px;
	width: 13px;
	height: 13px;
	margin-left: auto;
	background-color: #dcecff;
	-webkit-mask: url("data:image/svg+xml;utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpolyline%20points='20%206%209%2017%204%2012'/%3E%3C/svg%3E") no-repeat center / contain;
	mask: url("data:image/svg+xml;utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpolyline%20points='20%206%209%2017%204%2012'/%3E%3C/svg%3E") no-repeat center / contain;
}

.mouse_cursor_pointer {
	cursor: pointer;
}

/*
.drop_down_indicator {
	height: 100%;
	vertical-align: middle;
}
*/

.drop_down_indicator::after {
	margin-left: 5px;
	margin-right: 5px;
	content: "\25BE";
	font-size: large;
}

.multi_invite_fieldset {
	border: 1px dashed #666;
	padding: 15px;
}

.multi_invite_warning {
	color: #dd4800;
	font-weight: 400;
}

/*
.multi_invite_file_input {

}
*/

.multi_invite_name {
	display: inline-block;
	margin: 2px;
	padding: 2px;
	border: 1px solid #69BAD6;
	border-radius: 2px;
	font-size: 11px;
	font-weight: 400;
	color: #444;
	/*background-color: #C5DDE6;*/
	background-color: #D8E5EB;
}

.multi_invite_name img {
	width: 10px;
	height: 10px;
	margin: 2px;
	margin-bottom: -1px;
	margin-left: 5px;
	cursor: pointer;
}

.multi_invite_names {
	margin-bottom: 15px;
	/*border: 1px solid red;*/
}

.multi_invite_output {
	display: none;
	margin-top: 20px;
	height: 150px;
	overflow-y: auto;
}

.multi_invite_msg_list {
	list-style-type: none;
	margin-left: 0;
	padding-left: 0;
}

.admin_guid_display {
	margin-top: 20px !important;
	color: #aaaaaa;
}

.sort_input {
	list-style-type: none;
}

/*
.sort_input li {

}
*/

.sort_input li.selected {
	font-weight: bolder;
	color: green;
}

.card-form-message {
	display: none;
	padding: 10px;
	font-size: 16px;
	font-weight: 400;
	color: #CF3057;
}

/** Billing Reports Admin Page **/

#admin_panel_content_BillingReportsAdminPage .search_fields {
	border: 1px solid #dddddd;
	padding: 10px;
	margin-bottom: 20px;
}

#admin_panel_content_BillingReportsAdminPage .search_fields h4 {
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	color: #999;
}

#admin_panel_content_BillingReportsAdminPage .search_fields input {
	font-size: 15px;
	margin: 2px;
}

#admin_panel_content_BillingReportsAdminPage .search_fields label {
	font-size: 15px;
	margin: 2px;
}

#admin_panel_content_BillingReportsAdminPage .search_fields button.submit {
	font-size: 15px;
	margin: 2px;
	margin-right: 20px;
}

#admin_panel_content_BillingReportsAdminPage .output_div {
	float: left;
	width: 65%;
	min-width: 500px;
	margin-bottom: 20px;
}

#admin_panel_content_BillingReportsAdminPage table.dataTable tr:hover td {
	background-color: highlight;
	cursor: pointer;
}

#admin_panel_content_BillingReportsAdminPage table.dataTable tr td {
	padding: 5px;
}

#admin_panel_content_BillingReportsAdminPage table.dataTable tr.odd {
	background-color: #e2e4ff;

}

#admin_panel_content_BillingReportsAdminPage table.dataTable tr.even {
	background-color: #ffffff;
}

.details {
	float: right;
	min-height: 200px;
	width: 32%;
	border: 1px solid #dddddd;
	padding: 5px;
	margin-bottom: 20px;
}

#admin_panel_content_BillingReportsAdminPage table.dataTable tr.row_selected {
	background-color: #dd4800;
	color: #dddddd;
}

#admin_panel_content_BillingReportsAdminPage table.dataTable tr.row_selected:after {
	content: "\2192";
	font-weight: 600;
	font-size: 20px;
}

.details_label {
	font-weight: 500;
	white-space: nowrap;
	text-align: right;
	padding-right: 10px;
	color: #dd4800;
}

/** End Billing Reports Admin Page **/

.admin_buttons_div {
	padding: 10px;
}

ul.bep_business_areas {
	list-style-type: none;
}

ul.bep_business_areas li {
	cursor: pointer;
}

ul.bep_business_areas li:before {
	content: "\25b6";
	margin-right: 5px;
}

ul.bep_business_areas li.open:before {
	content: "\25bc";
	margin-right: 5px;
}


/** VC Videos CKEditor Plugin **/
/*
.vc-video {

}
*/

.vc-videos-layout-table {
	border: 1px solid #eeeeee;
	width: 100%;
	height: 100%;
}

.vc-videos-layout-table .content-row {
	height: 90%;
}

.vc-videos-layout-table .tabs-div {
	height: 100%;
}

.vc-videos-upload-progress {
	height: 27px;
}

.vc-videos-float-right {
	float: right;
    margin: 0 0 10px 10px;
}

.vc-videos-no-float {
    clear: both;
}

.vc-videos-float-left {
	float: left;
    margin: 0 0 10px 10px;
}


/** VC Audios CKEditor Plugin **/

.vc-audio {
	width: 512px;
}

.vc-audios-layout-table {
	border: 1px solid #eeeeee;
	width: 100%;
	height: 100%;
}

.vc-audios-layout-table .content-row {
	height: 90%;
}

.vc-audios-layout-table .tabs-div {
	height: 100%;
}

.vc-audios-upload-progress {
	height: 27px;
}

.vc-audios-float-right {
	float: right;
    margin: 0 0 10px 10px;
}

.vc-audios-no-float {
    clear: both;
}

.vc-audios-float-left {
	float: left;
    margin: 0 0 10px 10px;
}

/** BEP Stuff **/

.bep_grid {
	vertical-align: top;
}

.bep_tile {
	display: inline-block;
	width: 300px;
	height: 300px;
	border: 1px solid #999;
	margin: 15px;
	padding: 10px;
	border-radius: 10px;
	overflow-y: auto;
	overflow-x: hidden;
	background-color: #f1f1f1;
}

.bep_tile h3 {
	margin-top: 0px;
	padding-top: 0px;
	color: #444;
	font-size: 16px;
	height: 30px;
}

.bep_published {
	border: 2px solid #7dc7ed;
	/*background-color: #ffffff;*/
	background-color: #cce9f8;
}

.bep_published_icon {
	float: right;
	cursor: pointer;
}

.bep_tile_description {
	height: 200px;
	overflow-y: auto;
	overflow-x: hidden;
	clear: both;
}

.bep_tile_buttons {
	height: 30px;
	padding-top: 9px;
	border-top: 1px solid #999;
}

.bep_tile_buttons button {
	margin-left: 5px;
}

#admin_panel_content_BEPAdminPage * button {
	margin-left: 10px;
	padding: 5px;
	box-shadow: 2px 2px 7px #999;
	border: 1px solid lightgray;
	cursor: pointer;
}

#admin_panel_content_BEPAdminPage * button:hover {
	box-shadow: 4px 4px 7px #999;
	border: 1px solid lightgray;
}

#admin_panel_content_BEPAdminPage * button img {
	margin-bottom: -2px;
}

.WBEP {
	border: 1px solid #999;
	padding: 10px;
	font-weight: normal;
}

.WBEP h3 {
	border-bottom: 1px solid #999;
}

.WBEP h3.report_summary {
	border: none;
}

/** Begin: Static Side Menu **/

/*#sidebar {*/
	/*position: fixed;
	height: 100%;
	overflow-y: auto;*/
	/* overflow-x: hidden; */
/*}*/

#content_container {
	overflow-x: auto;
}

#sidebar_container_fake_content {
	display: inline-block;
}

/** End: Static Side Menu **/

/** icons for file browsers **/
td.select_icon_td {
	background-image: urL(/images/icons/18/color/checkmark2.png);
	background-repeat: no-repeat;
	background-position: center;
	width: 40px;
	cursor: pointer;
}

td.open_icon_td {
	background-image: urL(/images/icons/18/color/download2.png);
	background-repeat: no-repeat;
	background-position: center;
	width: 40px;
	cursor: pointer;
}

td.replace_icon_td {
	background-image: urL(/images/icons/18/color/upload2.png);
	background-repeat: no-repeat;
	background-position: center;
	width: 40px;
	cursor: pointer;
}

td.delete_icon_td {
	background-image: urL(/images/icons/18/color/trash_can.png);
	background-repeat: no-repeat;
	background-position: center;
	width: 40px;
	cursor: pointer;
}
/** end icons for file browsers **/

/** vertical progress report tables **/

table.user_profile_reporting {
	table-layout: fixed;
	width: 100%;
	border: 1px solid #eee;
	margin-bottom: 10px;
}

table.user_profile_reporting thead tr th {
	border-bottom: 1px solid #eee;
	text-align: left;
	background-color: #eee;
	padding: 3px;
}

table.user_profile_reporting thead tr th:not(:last-child) {
	border-right: 1px solid #eee;
}

table.user_profile_reporting thead tr:first-child th {
	border: none;
}

table.user_profile_reporting tbody tr td {
	padding: 3px;
}

table.user_profile_reporting tbody tr td:first-child {
	color: #1e4a6f;
}

table.user_profile_reporting tbody tr:not(:last-child) td {
	border-bottom: 1px solid #eee;
}
/*
table.user_profile_reporting tbody tr:nth-child(odd) td {

}

table.user_profile_reporting tbody tr:nth-child(even) td {*/
	/*background-color: #eee;*/
/*}*/

/** end vertical progress report tables **/

table.dataTable tr.selected-row {
	color: #ffffff;
	background-color: #5555ff;
}

/** table builder default styling **/
table.table_builder {
	min-width: 300px;
	width: 100%;
	/*background-color: lightblue; */
	border-collapse: separate;
	border-spacing: 0px 3px !important;
	border-radius: 3px;
	/*box-shadow: 2px 2px 3px #999;*/
	/*padding: 0px 5px 0px 5px; //making overflow-y in bad places// */
	border-bottom: 0px !important;
}

table.table_builder:not(:last-child) {
	margin-bottom: 10px;
}

table.table_builder > thead > tr > th:hover {
 	transition: background-color 0.3s ease;
	background-color: #eee;
}

table.table_builder_ellipsis tbody tr td {
	min-width: 75px;
	text-overflow: ellipsis;
	max-width: 250px;
}

table.table_builder_fixed {
	table-layout: fixed;
}

table.table_builder.table_builder_centered tbody tr td {
	text-align: center;
}

table.table_builder thead th.gdt_ops_col,
table.table_builder tbody tr td.gdt_ops_col {
	text-align: center;
	/* A fixed width, not the old 1%: these tables are table-layout: fixed, where 1% is literally
	   1% (about 8px), so the "Options" header spilled past the table and put a scrollbar under it.
	   74px matches the wide-table layout; contexts with their own width still override it. */
	width: 74px;
	white-space: nowrap;
	/* The options cell holds a 25px icon, not text: the table-wide text-overflow: ellipsis
	   otherwise paints a second, small "…" beside the dots when the cell is a hair narrower. */
	text-overflow: clip;
}

table.table_builder tbody tr td {
	padding: 4px 8px !important;
}

table.table_builder thead th {
	text-align: left;
	padding-left: 10px !important;
	background-color: #fafafa;
	font-weight: bold !important;
	font-size: smaller;
	border-bottom: 0px !important;
}

table.table_builder tbody tr:not(:last-child) td {
	border-bottom: solid 1px #f0f0f0;
}
/** quite cool... but probably not as cool on large tables.
table.table_builder tbody tr:first-child td:first-child { border-top-left-radius: 10px; }
table.table_builder tbody tr:first-child td:last-child { border-top-right-radius: 10px; }
table.table_builder tbody tr:last-child td:first-child { border-bottom-left-radius: 10px; }
table.table_builder tbody tr:last-child td:last-child { border-bottom-right-radius: 10px; }
**/
table.table_builder tbody tr td:first-child {
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}

table.table_builder tbody tr td:last-child {
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
	padding-right: 10px;
}

table.table_builder_labeled tbody tr td {
	vertical-align: top;
	padding: 5px !important;
}

table.table_builder_labeled tbody tr td:nth-child(odd) {
	background-color: #eaebed;
	width: 150px;
	text-align: right;
	white-space: nowrap;
}

table.table_builder_labeled tbody tr:not(:last-child) td {
	border-bottom: 1px solid #eee;
}

table.table_builder tbody tr td.label:after {
	content: ":";
}

table.table_builder_selectable_rows tbody tr {
	cursor: pointer;
}

table.table_builder.table_builder_selectable_rows tbody tr:hover {
	background-color: #c1daee;
}

table.table_builder_alt_color_rows tbody tr:nth-child(odd) {
	background-color: #fff;
}

table.table_builder_alt_color_rows tbody tr:nth-child(even) {
	background-color: #eee;
}

table.table_builder_alt_color_columns tbody tr td:nth-child(odd) {
	background-color: #fff;
}

table.table_builder_alt_color_columns tbody tr td:nth-child(even) {
	background-color: #eff;
}

table.table_builder_data td {
	white-space: nowrap;
	text-overflow:ellipsis;
	overflow: hidden;
}

table.info_table {
	border: none;
}

/*
table.info_table tbody tr:not(:last-child) td {
	border: none;
}
*/

/** personally, i like it better with this disabled... but... **/
table.info_table tbody tr td {
	border: none;
}

/** end table builder default styling **/

.ccecc_certificate_print_list {
	list-style-type: none;
}

.ccecc_certificate_print_list li {
	cursor: pointer;
	display: inline-block;
	margin-right: 15px;
	border: 1px solid #999;
	text-align: center;
	padding: 5px;
	border-radius: 5px;
	font-size: 12px;
}

.ccecc_certificate_print_list li img {
	width: 40px;
}

TABLE.billing_report_details {
	width: 100%;
}

TABLE.billing_report_details tbody tr td:first-child {
	font-weight: 600;
	text-align: right;
	padding-right: 5px !important;
	color: #444;
	white-space: nowrap;
}

TABLE.billing_report_details tbody tr td div ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

TABLE.billing_report_details tbody tr td div ul li {
	padding-left: 10px;
}

TABLE.billing_report_details tbody tr td div ul li:before {
	content: " - ";
}

/***** Begin: Generalized Types DataTable **********/

TABLE.generalized_types_datatable {
	width: 100%;
	max-width: 100%;
	overflow-x: auto;
	table-layout: fixed;
}

TABLE.generalized_types_datatable.gtd-wide-table {
	max-width: none;
}

TABLE.generalized_types_datatable tbody tr td div.html_hover_cell:hover {
	/* background-color: #ccc; */
	/* text-align: center */
	/* vertical-align: middle; */
	text-decoration: underline;
}

TABLE.generalized_types_datatable tbody tr td.sort_column {
	cursor: ns-resize;
}

div.dt_multiline {
	white-space: pre-wrap;
	max-height: 200px;
	overflow: auto;
}

.entity-list-container .entity-list-scroll.gtd-wide-table-multiline-single-line div.dt_multiline,
.contacts-container .contact-table-scroll.gtd-wide-table-multiline-single-line div.dt_multiline,
.contact_right .addon_section .addon-table-scroll.gtd-wide-table-multiline-single-line div.dt_multiline {
	display: block;
	white-space: nowrap;
	max-height: none;
	overflow: hidden;
	text-overflow: ellipsis;
}

.entity-list-container .entity-list-scroll.gtd-wide-table-multiline-two-line div.dt_multiline,
.contacts-container .contact-table-scroll.gtd-wide-table-multiline-two-line div.dt_multiline {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	white-space: normal;
	max-height: none;
	overflow: hidden;
}

/***** End: Generalized Types DataTable **********/

.jq_diag_left_button {
	position: absolute;
	left: 20px;
}


.copy_question_summary {
	padding: 20px;
	border: 1px solid #444;
	border-radius: 5px;
	display: none;
	vertical-align: top;
	margin-top: 10px;
}

/**** Fix for FileBrowser Context Menu in JQDialog *****/
.vakata-context {
	z-index: 200;
}

/*** Procedure Manual Specific ***/

.proc_man_clickable {
	cursor: pointer;
}

.proc_man_clickable:hover {
	cursor: pointer;
}

ol.numeric_list {
	list-style-type: none;
	counter-reset: item;
}
ol.numeric_list > li::before {
	content: counters(item, ".") " ";
	counter-increment: item
}

li.proc_man_clickable > a.proc_man_new_entry_fade {
	visibility: hidden;
}

li.proc_man_clickable:hover > a.proc_man_new_entry_fade {
	visibility: visible;
}

.proc_man_new_entry_fade {
	color: #cecece;
	font-style: italic;
	text-decoration: none;
}

.proc_man_new_entry_fade::before {
	content: " - ";
}

ol.numeric_list > li.proc_man_new_entry_fade::before {
	content: " - ";
}

li.proc_man_clickable > div.button {
	vertical-align: sub;
	margin-left: 5px;
	visibility: hidden;
}

li.proc_man_clickable:hover > div.button {
	visibility: visible;
}

.proc_man_procedure_rendering_root {
	margin: 10px;
}

.proc_man_procedure_title {
	font-weight: bold;
	font-size: large;
	text-align: center;
}

.proc_man_procedure_company_letterhead {
	margin-left: 0px;
	margin-top: 0px;
}
/*
.proc_man_procedure_intro {

}
*/

.proc_man_procedure_toc {
	font-weight: bold;
	font-size: large;
}

.proc_man_toc_section_list {
	font-weight: bold;
	font-size: larger;
}
/*
.proc_man_toc_section_list_item {
}

.procedure_manual_section {
}
*/

.procedure_manual_section_heading {
	background-color: #ccc;
	font-weight: bold;
	font-size: x-large;
	margin-top: 20px;
}

/*
.procedure_manual_section_description {
}
*/

.proc_man_toc_sub_section_list {
	font-size: smaller;
	font-weight: normal;
}

/*
.proc_man_toc_sub_section_list_item {
}
*/

.procedure_manual_sub_section {
	margin-left: 20px;
}

.procedure_manual_sub_section_heading {
	background-color: #ddd;
	font-weight: bold;
	font-size: large;
	margin-top: 15px;
}

.pre_formatted {
	white-space: pre-wrap;
}

.proc_man_sub_section_data_row {
	margin-top: 10px;
}

.proc_man_label {
	font-weight: bold;
	padding-right: 10px;
}
.proc_man_label:after {
	content: ":";
}

/*** End Procedure Manual Specific ***/

/*** File Dropzone Stuff ***/
.dropzone_file_drop {
	text-align: center;
	font-weight: bolder;
	color: #aea89d;
	border-style: dashed;
	border-color: #aea89d;
    border-radius: 25px;
	font-size: large;
	cursor: pointer;
	vertical-align: middle;
	height: 50px;
	line-height: 50px;
}

.dz-drag-hover {
	border-style: solid;
	color: black;
}

table.dataTable tbody tr.data_table_selected_row {
	background-color: #95afcc !important;
}


/*** End File Dropzone Stuff ***/


/** Password Change **/
/*
.password_change_form {

}
*/

.password_change_form input[type=password], .password_change_form label {
	display: block;
	width: 400px;
	margin: 5px;
}

.administration_upload_busy_mask {
	position: absolute;
	opacity: .25;
	background-color: #444;
	width: 100%;
	height: 100%;
	z-index: 1000;
}

.administration_upload_busy_mask_img {
	position: absolute;
	z-index: 1002;
}

/** End Password Change **/

.wide {
	width: 100%;
}

.tall {
	height: 100%;
}

/** Service Matrix **/

.tk_mod_sd_table_logo {
	cursor: pointer;
	background-image: url(/images/icons/128/gray/reload-black.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 28px;
}

#tk_mod_sm_table {
	width: 100%;
	border: 1px solid black;
	table-layout: fixed;
}

#tk_mod_sm_table tbody tr {
	height: 80px;
}

#tk_mod_sm_table tbody tr td {
	border: 1px solid blue;
	text-align: center;
}

#tk_mod_sm_table tbody tr td.tk_mod_sm_table_axis_label {
	background-color: #d2d2ff;
	font-size: 12pt;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
}

#tk_mod_sm_table tbody tr td.tk_mod_sm_table_logo {
	background-color: rgb(88, 88, 222);
	color: white;
	font-size: 14pt;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
	width: 150px;
}

.tk_mod_sm_table_service_cell {
 	transition: background-color 0.5s ease;
	background-color: white;
	position: relative;
}

.tk_mod_sm_table_service_cell:hover {
	background-color: #80ffff;
}

.tk_mod_sm_entry {
 	transition: background-color 0.5s ease;
	background-color: #80ff80;
	display: block;
	cursor: pointer;
}

.tk_mod_sm_entry:hover {
	background-color: #ffff00;
}

.tk_mod_sm_cc {
	cursor: pointer;
}
/** End Serivce Matrix **/

/** Service Deliverables List **/
.tk_mod_sd_list_split_table > tbody > tr > td:nth-child(2) {
	width: 350px;
}

.tk_mod_sd_list_flow_container {
	width: 100%;
	height: 100%;
}

.tk_mod_sd_list_item_container {
	font-weight: bold;
	text-align: center;
	display: inline-block;
	vertical-align: middle;
	background-color: #a3a89d;
	border-radius: 25px;
	padding: 20px;
	margin: 20px;
	width: 200px;
	height: 150px;
	line-height: 150px;
	box-shadow: 5px 5px 5px #000000;
	cursor: pointer;
}

.tk_mod_sd_list_cc_item_container {
	font-weight: bold;
	text-align: center;
	background-color: rgb(174,162,157);
	box-shadow: 5px 5px 5px #000000;
	cursor: pointer;
	padding: 20px;
	margin: 20px;
	border-radius: 25px;
}

.tk_mod_sd_list_cc_item_droptarget {
 	transition: background-color 0.5s ease;
	background-color: #cec2bd;
}

.tk_mod_sd_list_cc_item_drophover {
	background-color: #cec2bd;
 	transition: background-color 0.5s ease;
	background-color: rgba(0,0,0,0.4);
}


.big_button {
	margin: 0px 3px 0px 0px;
	cursor: pointer;
	/*background-size: 16px;*/
	background-size: cover;
	width: 120px;
	height: 120px;
	display: inline-block;
	z-index: 10;
	vertical-align: middle;
	background-color: transparent;
}

.big_add {
	background-image: url(/images/large/add_big_white.png);
}

.big_add:hover {
	background-image: url(/images/large/add_big_green.png);
}

/** End Service Deliverables List **/


/** Service Deliverables Matrix **/
.tk_mod_sd_content {
	overflow-x: auto;
}

#tk_mod_sd_table {
	/*border: 1px solid black;*/
	table-layout: fixed;
	border-collapse: collapse;
}

#tk_mod_sd_table tbody tr {
	height: 80px;
}

#tk_mod_sd_table tbody tr td {
	border: 1px solid #000;
	text-align: center;
}

#tk_mod_sd_table tbody tr td.tk_mod_sd_table_axis_label {
	width: 200px;
	background-color: #F3F3F3;
	font-size: 12pt;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
	cursor: pointer;
}

#tk_mod_sd_table tbody tr td.tk_mod_sd_table_logo {
	background-color: #F3F3F3;
	border: 0px;
	color: white;
	font-size: 14pt;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
	width: 150px;

}

.tk_mod_sd_table_service_cell {
 	transition: background-color 0.5s ease;
	background-color: white;
	position: relative;
}

.tk_mod_sd_table_service_cell:hover {
	background-color: #80ffff;
}

.tk_mod_sd_entry {
 	transition: background-color 0.5s ease;
	background-color: #eee;
	display: block;
	cursor: pointer;
}

.tk_mod_sd_entry:hover {
	background-color: #ffff00;
}


.tk_mod_st_entry {
 	transition: background-color 0.5s ease;
	background-color: #eee;
	display: block;
	cursor: pointer;
}

.tk_mod_st_entry:hover {
	background-color: #00ffff;
}

/** End Service Deliverables Matrix **/

/** Begin History **/
/* (module styles live in the HISTORY MODULE feed section further down) */
/** End History **/

/** Begin Client Class TK MOD **/

.tk_mod_cc_table {
	width: 100%;
	border: 1px solid #000000;
	border-collapse: collapse;
	margin-bottom: 20px;
}

.tk_mod_cc_table_head {
	font-weight: bold;
	font-size: larger;
	background-color: #eaf5fe;
}

.tk_mod_cc_table_head th {
	border-right: 1px solid #ada1a1;
}

.tk_mod_cc_table_row {
 	transition: background-color 0.5s ease;
	background-color: rgba(255,255,255,255);
	cursor: pointer;
	border-top: 1px solid #c0c0c0;
}

.tk_mod_cc_table_row td {
	text-align: center;
}

.tk_mod_cc_table_row:hover {
	background-color: rgba(200,200,255,255);
	cursor: pointer;
}

.tk_mod_cc_table_row td.tk_mod_cc_name_cell {
	font-weight: bold;
	vertical-align: middle !important;
	padding: 20px !important;
	width: 100px;
	border-right: 1px solid #c0c0c0;
}

.tk_mod_cc_descr_cell {
	vertical-align: top;
	text-align: left;
}

.tk_mod_cc_descr_cell div {
	white-space: pre-wrap;
	display: inline-block;
	text-align: left;
	padding: 20px;
	overflow: auto;
	width: 97%;
	height: 100px;
}


/** End Client Class TK MOD **/

/* ============================================================
   Unified Module Design System (mod-*)
   Shared toolbar, list container, and table styles used across
   modules (Filters, and future migrations of Tasks, etc.).
   ============================================================ */

/* --- Module Toolbar --- */
.mod-view-head {
	background: #F3F3F3;
	border-radius: 12px;
	height: var(--workspace-module-header-height);
	min-height: var(--workspace-module-header-height);
	padding: var(--workspace-module-header-padding);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: nowrap;
	margin-bottom: 1em;
}

.mod-tb-title {
	font-family: 'Manrope', sans-serif;
	font-weight: 700;
	-webkit-text-stroke: var(--module-title-stroke) currentColor;
	font-size: var(--module-title-size);
	white-space: nowrap;
	color: #000;
	line-height: 1;
}

.mod-tb-spacer {
	flex-grow: 1;
}

/* --- Module Toolbar: Expandable Search --- */
.mod-tb-search-wrapper {
	display: flex;
	flex-flow: row;
	justify-content: center;
	align-items: center;
	background-color: transparent;
	border: none;
	width: 25px;
	min-width: 25px;
	padding: 0;
	overflow: visible;
	height: 37px;
	box-sizing: border-box;
	gap: 0;
	cursor: pointer;
	transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            min-width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            padding 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            border-radius 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            gap 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	overflow: hidden;
	flex-shrink: 0;
}

.mod-tb-search-wrapper.expanded {
	width: 250px;
	min-width: 150px;
	padding: 0 12px;
	border-radius: 5px;
	background-color: #ffffff;
	justify-content: flex-start;
	gap: 8px;
	cursor: text;
}

.mod-tb-search-wrapper .mod-tb-search-input {
	color: #555555;
	outline: none;
	border: none;
	font-size: 14px;
	background: transparent;
	width: 0;
	opacity: 0;
	flex-grow: 0;
	padding: 0;
	transition: opacity 0.2s ease 0.1s, width 0.3s cubic-bezier(0.4, 0, 0.2, 1), flex-grow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.mod-tb-search-wrapper.expanded .mod-tb-search-input {
	width: auto;
	opacity: 1;
	flex-grow: 1;
}

.mod-tb-search-wrapper .mod-tb-search-input::placeholder {
	color: #888888;
}

.mod-tb-search-icon {
	background-image: url(/images/calendar/search.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	max-width: 25px;
	min-width: 25px;
	height: 25px;
	cursor: pointer;
	transition: scale 0.2s var(--cal-arrive);
	flex-shrink: 0;
}

.mod-tb-search-icon:hover {
	scale: 1.1;
}

.mod-tb-search-wrapper.expanded .mod-tb-search-icon {
	max-width: 18px;
	min-width: 18px;
	height: 18px;
}

/* --- Shared: canonical "+" icon for create buttons ---
   Masked so it renders in the button's text color (currentColor). */
.vc-plus-icon {
	width: 13px;
	height: 13px;
	flex: 0 0 auto;
	background-color: currentColor;
	-webkit-mask: url(/images/plus.svg) center / contain no-repeat;
	mask: url(/images/plus.svg) center / contain no-repeat;
}

/* --- Module Toolbar: Create Button --- */
.mod-tb-create-button {
	color: white;
	border: none;
	border-radius: 8px;
	padding: 0 var(--workspace-primary-action-padding-inline);
	cursor: pointer;
	height: var(--workspace-toolbar-control-height);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap: 7px;
	white-space: nowrap;
	flex-shrink: 0;
	font: inherit;
}

.mod-tb-save-button.mod-tb-save-button--saved {
	background-color: #b0b0b0;
	cursor: default;
}

.mod-tb-save-button.mod-tb-save-button--saved:hover {
	background-color: #b0b0b0;
}

.mod-tb-create-button-content {
	display: flex;
	gap: 7px;
	align-items: center;
}

.mod-tb-create-button-icon {
	display: flex;
	align-items: center;
}

.mod-tb-create-button-icon svg {
	width: 14px;
	height: 14px;
	display: block;
}

.mod-tb-create-button-text {
	font-weight: inherit;
	color: #ffffff;
}

/* --- Module Toolbar: Secondary Button (white pill) --- */
.mod-tb-secondary-button {
	background-color: #ffffff;
	color: #333;
	border: 1px solid #ccc;
	border-radius: 8px;
	padding: 0 var(--workspace-primary-action-padding-inline);
	cursor: pointer;
	height: var(--workspace-toolbar-control-height);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	white-space: nowrap;
	flex-shrink: 0;
	font-weight: 500;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.mod-tb-secondary-button:hover {
	background-color: #f5f5f5;
	border-color: #999;
}

.mod-tb-secondary-button:active {
	background-color: #eee;
	border-color: #888;
}

/* --- Module Toolbar: Segmented Mode Switch (pairs with fc-tb-clone-selector-*) --- */
.mod-tb-mode-switch {
	flex-shrink: 0;
}

.mod-tb-mode-btn {
	font-size: 13px;
	padding: 0 12px;
	line-height: 28px;
}

/* --- Module Toolbar: Reload Button (mirrors task-tb-btn-reload) --- */
.mod-tb-btn-reload {
	margin: 2px 0;
	cursor: pointer;
	background-size: cover;
	background-image: url(/images/calendar/reload.svg);
	transition: scale 0.2s var(--cal-arrive);
	flex-shrink: 0;
}
.mod-tb-btn-reload:hover {
	scale: 1.1;
}
.mod-tb-btn-reload.spinning {
	animation: fc-reload-spin 0.8s linear infinite;
}

/* --- Module Toolbar: Export Button (pill style, mirrors task-tb-create-button) --- */
.mod-tb-export-button {
	color: white;
	border-radius: 8px;
	padding: 0px 20px;
	cursor: pointer;
	height: 37px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	white-space: nowrap;
	flex-shrink: 0;
}
.mod-tb-export-button-content {
	display: flex;
	gap: 10px;
	align-items: center;
}
.mod-tb-export-button-text {
	font-weight: 500;
	color: #ffffff;
}

/* --- Module Toolbar: Edit Filter Icon Button --- */
.mod-tb-btn-edit {
	margin: 2px 0;
	cursor: pointer;
	background-image: url(/images/calendar/edit.svg);
	background-size: cover;
	width: 25px;
	height: 25px;
	transition: scale 0.2s var(--cal-arrive);
	flex-shrink: 0;
}
.mod-tb-btn-edit:hover {
	scale: 1.1;
}

/* --- Module Toolbar: Duplicate Icon Button --- */
.mod-tb-btn-duplicate {
	margin: 2px 0;
	cursor: pointer;
	background-image: url(/images/calendar/duplicate.svg);
	background-size: cover;
	transition: transform 0.2s ease;
	flex-shrink: 0;
}
.mod-tb-btn-duplicate:hover {
	transform: scale(1.1);
}

/* --- Module Toolbar: Delete Icon Button --- */
.mod-tb-btn-delete {
	margin: 2px 0;
	cursor: pointer;
	background-image: url(/images/calendar/delete.svg);
	background-size: cover;
	transition: transform 0.2s ease;
	flex-shrink: 0;
}
.mod-tb-btn-delete:hover {
	transform: scale(1.1);
}

/* --- Module Toolbar: Layout Selector Control --- */
.mod-tb-layout-control {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 2px 0;
	flex-shrink: 0;
}
.mod-tb-btn-layout {
	cursor: pointer;
	background-size: cover;
	background-color: transparent;
	background-image: url(/images/calendar/layout.svg);
	transition: transform 0.2s ease;
	flex-shrink: 0;
	position: relative;
}
.mod-tb-btn-layout:hover {
	transform: scale(1.1);
}
.mod-tb-layout-badge {
	position: absolute;
	top: -1px;
	right: -1px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #016ba5;
	border: 1px solid #fff;
	opacity: 0;
	transition: opacity 0.2s ease;
	pointer-events: none;
}
.mod-tb-layout-control.has-custom-layout .mod-tb-layout-badge {
	opacity: 1;
}
.mod-tb-layout-host {
	display: none;
	align-items: center;
}
.mod-tb-layout-control.expanded .mod-tb-layout-host {
	display: flex;
}
.mod-tb-layout-host .custom_table_select {
	float: none;
	margin: 0;
	font-size: 14px;
	padding: 4px 8px;
	border: 1px solid #ccc;
	border-radius: 5px;
	background: white;
	cursor: pointer;
	outline: none;
	height: 31px;
	min-width: 165px;
}

/* --- Module List Main Wrapper --- */
.mod-list-main {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	min-height: 0;
	overflow: hidden;
}

/* Hide DataTables built-in search and length controls (toolbar replaces them) */
.mod-list-main .dataTables_filter,
.mod-list-main .dataTables_length {
	display: none !important;
}

/* --- Module List Container (table area) --- */
.mod-list-container {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
	background: #F3F3F3;
	border-radius: 12px;
	padding: 10px;
}

.mod-list-container > div {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.mod-list-container .dataTables_wrapper {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.mod-list-scroll {
	flex: 1 1 0;
	min-height: 0;
	overflow-y: auto;
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.mod-list-scroll::-webkit-scrollbar {
	width: 0;
	height: 0;
	display: none;
}

.mod-list-container .dataTables_wrapper > .dataTables_paginate {
	flex: 0 0 auto;
	margin-top: auto;
}

/* Hide pagination and info in infinite scroll mode */
.mod-list-container.mod-list-infinite .dataTables_wrapper > .dataTables_paginate,
.mod-list-container.mod-list-infinite .dataTables_wrapper > .dataTables_info {
	display: none !important;
}

/* --- Saved Filters: scope segmented control (My / Shared with me / Public) #1562 --- */
.filter-scope-switch {
	display: flex;
	gap: 2px;
	margin: 4px 0 10px 0;
	padding: 3px;
	background-color: #eef1f5;
	border-radius: 8px;
	width: fit-content;
}

.filter-scope-btn {
	appearance: none;
	border: none;
	background: transparent;
	color: #4a5568;
	font-size: 13px;
	font-weight: 500;
	padding: 6px 14px;
	border-radius: 6px;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease;
	white-space: nowrap;
}

.filter-scope-btn:hover {
	color: #1a202c;
}

.filter-scope-btn.selected {
	background-color: #ffffff;
	color: #1a202c;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
}

/* --- Saved Filters: share dialog #1562 --- */
.filter-share-body {
	min-width: 360px;
}

.filter-share-body .filter-share-title {
	font-weight: 600;
	margin-bottom: 4px;
}

.filter-share-body .filter-share-add {
	/* This element carries the `.button` class, which is ICON-ONLY (16x16, background-size:cover),
	   but it is a TEXT button ("Add User…"), so it must override that fixed sizing or the text is
	   crammed into a 16px box. Render it as a clean bordered text button with the `.add` icon
	   pinned on the left. (The full #1562 styling for this class isn't on release.) Matches the
	   .vc-confirm-dialog button look for consistency. */
	margin: 6px 0 0;
	width: auto;
	height: auto;
	display: inline-flex;
	align-items: center;
	padding: 6px 12px 6px 28px;
	background-repeat: no-repeat;
	background-position: 8px center;
	background-size: 16px 16px;
	background-color: #fff;
	border: 1px solid #d5dce4;
	border-radius: 6px;
	color: #395066;
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
}

.filter-share-body .filter-share-add:hover {
	border-color: #bfcad6;
	background-color: #f7f9fb;
}

.filter-share-recipients {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	min-height: 34px;
	padding: 6px;
	margin: 8px 0;
	border: 1px solid #d7dce3;
	border-radius: 6px;
	align-content: flex-start;
}

.filter-share-empty {
	color: #8a94a3;
	font-style: italic;
	padding: 4px 2px;
}

.filter-share-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background-color: #eef1f5;
	border-radius: 14px;
	padding: 4px 6px 4px 12px;
	font-size: 13px;
	color: #2d3748;
}

.filter-share-chip .filter-share-chip-remove {
	cursor: pointer;
	width: 16px;
	height: 16px;
	line-height: 16px;
	text-align: center;
	border-radius: 50%;
	color: #6b7280;
	background-color: rgba(0, 0, 0, 0.06);
	font-size: 12px;
}

.filter-share-chip .filter-share-chip-remove:hover {
	color: #ffffff;
	background-color: #c0392b;
}

/* --- Module List: Modern Pill-Style Rows --- */
.mod-list-container table.table_builder {
	border-spacing: 0px 2px !important;
}

.mod-list-container table.table_builder tbody tr {
	background-color: #ffffff;
	transition: background-color 0.15s ease;
}

.mod-list-container table.table_builder.table_builder_selectable_rows tbody tr:hover {
	background-color: rgba(0, 0, 0, 0.04);
}

.mod-list-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row {
	background-color: #95afcc !important;
}

.mod-list-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row:hover {
	background-color: #8aa3c0 !important;
}

.mod-list-container table.table_builder tbody tr td:first-child {
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
}

.mod-list-container table.table_builder tbody tr td:last-child {
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
}

.mod-list-container table.table_builder tbody tr:not(:last-child) td {
	border-bottom: none;
}

.mod-list-container table.table_builder tbody tr td {
	padding: 8px 14px !important;
	font-size: 13px;
}

.mod-list-container table.table_builder tbody tr td:first-child {
	font-weight: 500;
}

.mod-list-container table.table_builder tbody tr td:last-child {
	padding-right: 14px;
}

/* --- Module List: Uppercase Column Headers --- */
.mod-list-container table.table_builder thead th {
	font-size: 11px;
	font-weight: 500 !important;
	color: #999;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	padding: 4px 14px 10px !important;
	border-bottom: none !important;
	white-space: nowrap;
	position: sticky;
	top: 0;
	z-index: 2;
	background-color: #f3f3f3 !important;
}

.mod-list-container table.table_builder thead th,
.mod-list-container table.table_builder thead th * {
	font-weight: 500 !important;
}

.mod-list-container table.table_builder thead tr th:hover {
	background-color: rgba(0, 0, 0, 0.02) !important;
	border-radius: 6px;
}

/* --- Module List: Sort Indicators --- */
.mod-list-container table thead .sorting,
.mod-list-container table thead .sorting_asc,
.mod-list-container table thead .sorting_desc {
	position: relative;
	padding-right: 22px !important;
	background-repeat: no-repeat !important;
	background-position: center right !important;
	background-size: 12px 12px !important;
}

.mod-list-container table thead .sorting {
	background-image: url("/images/icons/sort_both.png") !important;
}

.mod-list-container table thead .sorting_asc {
	background-image: url("/images/icons/sort_asc.png") !important;
}

.mod-list-container table thead .sorting_desc {
	background-image: url("/images/icons/sort_desc.png") !important;
}

/* --- Filters Builder Workspace --- */
.filters-workspace-shell {
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
}

.filters-workspace {
	display: flex;
	flex: 1 1 auto;
	min-height: 0;
	gap: 1em;
}

.filters-workspace--build {
	align-items: stretch;
}

.filters-panel {
	background: #F3F3F3;
	border-radius: 12px;
	padding: 12px;
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.filters-panel--builder {
	flex: 0 0 var(--workspace-sidebar-basis);
	min-width: var(--workspace-sidebar-min-width);
	max-width: var(--workspace-sidebar-max-width);
	box-sizing: border-box;
	padding: var(--workspace-sidebar-padding);
}

.filters-panel--preview {
	flex: 1 1 auto;
	min-width: 0;
	/* Same recipe as the data import preview: pad the reading edges (top/left),
	   leave right/bottom open so the results surface bleeds to the rounded clip;
	   header elements carry their own right inset */
	padding: 20px 0 0 25px;
	overflow: hidden;
}

.filters-panel-title {
	font-size: 18px;
	font-weight: 700;
	color: #222;
	margin-bottom: 10px;
}

.filters-builder-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
}
.filters-builder-header .filters-panel-title {
	margin-bottom: 0;
}
.filters-builder-clear-btn {
	background: none;
	border: 1px solid transparent;
	border-radius: 6px;
	padding: 4px 6px;
	cursor: pointer;
	color: #999;
	display: flex;
	align-items: center;
	transition: color 0.15s, background 0.15s;
}
.filters-builder-clear-btn svg {
	width: 22px;
	height: 16px;
}
.filters-builder-clear-btn:hover {
	color: #555;
	background: rgba(0,0,0,0.05);
}

.filters-builder-host {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	overflow-x: hidden;
}

.entity-list-quick-filter-picker-list,
.sfb-field-toggle-list {
	scrollbar-width: none;
	-ms-overflow-style: none;
	-webkit-overflow-scrolling: touch;
}

.entity-list-quick-filter-picker-list::-webkit-scrollbar,
.sfb-field-toggle-list::-webkit-scrollbar {
	width: 0;
	height: 0;
	display: none;
}

.adv-search-embedded-builder .entry td.formtitle {
	white-space: nowrap;
	width: 120px;
}

.adv-search-embedded-builder-root {
	margin-top: 10px;
}

/* ── Search Filter Builder (sfb-*) Design System ───────────────── */

.adv-search-embedded-builder {
	display: flex;
	flex-direction: column;
	min-height: 100%;
}

.sfb-form {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 4px 0 0 0;
	flex: 1;
}

.sfb-form-field {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.sfb-form-label {
	font-family: 'Manrope', sans-serif;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #888;
	line-height: 1;
}

.sfb-form select,
.sfb-form input[type="text"] {
	width: 100%;
	box-sizing: border-box;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	padding: 7px 9px;
	border: 1px solid #ddd;
	border-radius: 6px;
	background: #fff;
	color: #222;
	outline: none;
	transition: border-color 0.15s;
}

.sfb-form select:focus,
.sfb-form input[type="text"]:focus {
	border-color: #999;
}

.sfb-section-divider {
	height: 1px;
	background: #e0e0e0;
	margin: 2px 0;
}

/* ── Inline AI Prompt Bar ("Dark Glass Intelligence") ───────── */

.sfb-ai-bar {
	--sfb-ai-bg: #ffffff;
	--sfb-ai-surface: rgba(0,0,0,0.03);
	--sfb-ai-text: #2a2a2a;
	--sfb-ai-text-muted: #8c8c8c;
	--sfb-ai-placeholder: #b0aeb5;
	--sfb-ai-accent: #5a7cbf;
	--sfb-ai-accent-cool: #8b6fbf;
	--sfb-ai-success: #5aaa6a;
	--sfb-ai-error: #c45c5c;
	--sfb-ai-clarify: #b08a3e;
	--sfb-ai-rotate-duration: 6s;
	position: relative;
	border-radius: 10px;
	padding: 3px;
	overflow: hidden;
	font-family: 'Manrope', sans-serif;
}

.sfb-ai-wrapper {
	margin-top: auto;
}

.sfb-ai-bar.sfb-ai-generating {
	--sfb-ai-rotate-duration: 2.5s;
}

/* Rotating conic-gradient border (idle traveling light) */
.sfb-ai-bar::before {
	content: '';
	position: absolute;
	/* Large square centered on the bar so the conic gradient rotates uniformly */
	width: 200%;
	height: 0;
	padding-bottom: 200%;
	top: 50%;
	left: 50%;
	transform-origin: center;
	translate: -50% -50%;
	border-radius: 50%;
	background: conic-gradient(
		from 0deg,
		transparent 0%,
		transparent 65%,
		rgba(70,130,220,0.5) 78%,
		rgba(60,120,230,0.8) 88%,
		rgba(80,140,240,0.9) 94%,
		rgba(120,160,255,0.6) 97%,
		transparent 100%
	);
	animation: sfb-ai-border-rotate var(--sfb-ai-rotate-duration) linear infinite;
	z-index: 0;
}

@keyframes sfb-ai-border-rotate {
	0%   { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}


.sfb-ai-card {
	position: relative;
	z-index: 1;
	background: var(--sfb-ai-bg);
	border: none;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0,0,0,0.1), 0 1px 3px rgba(0,0,0,0.06);
	transition: box-shadow 0.2s;
}

/* Border fill element (used for green sweep animation) */
.sfb-ai-border-fill {
	position: absolute;
	width: 200%;
	height: 0;
	padding-bottom: 200%;
	top: 50%;
	left: 50%;
	transform-origin: center;
	translate: -50% -50%;
	border-radius: 50%;
	z-index: 0;
	pointer-events: none;
	opacity: 0;
}

/* Freeze trail during green sweep */
.sfb-ai-bar.sfb-ai-success-sweep::before {
	animation-play-state: paused;
}

/* Persistent green border after sweep completes */
.sfb-ai-bar.sfb-ai-success-done::before {
	background: conic-gradient(from 0deg, #7ecc8e 0%, #3d8a4f 100%);
	animation: none;
}
.sfb-ai-bar.sfb-ai-success-done .sfb-ai-card {
	box-shadow: 0 0 8px rgba(90,170,106,0.3), 0 1px 4px rgba(0,0,0,0.06);
}

/* AI shimmer — sweeps across auto-populated elements on success */
@keyframes sfb-ai-shimmer {
	0%   { background-position: -100% 0; }
	100% { background-position: 200% 0; }
}
.sfb-ai-shimmer {
	position: relative !important;
	overflow: hidden !important;
}
.sfb-ai-shimmer::after {
	content: '';
	position: absolute;
	inset: 0;
	background-image: linear-gradient(
		90deg,
		transparent 0%,
		rgba(126, 204, 142, 0.15) 25%,
		rgba(126, 204, 142, 0.3) 50%,
		rgba(126, 204, 142, 0.15) 75%,
		transparent 100%
	);
	background-size: 50% 100%;
	background-repeat: no-repeat;
	animation: sfb-ai-shimmer 1.2s ease-in-out;
	pointer-events: none;
	border-radius: inherit;
	z-index: 1;
}

/* Error flash — solid border glow replaces rotating gradient */
.sfb-ai-bar.sfb-ai-error-flash::before {
	background: var(--sfb-ai-error);
	animation: none;
}
.sfb-ai-bar.sfb-ai-error-flash .sfb-ai-card {
	box-shadow: 0 0 8px rgba(196,92,92,0.4), 0 1px 4px rgba(0,0,0,0.06);
}


/* ── Collapsed view (idle single-line) ── */

.sfb-ai-collapsed {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	cursor: text;
	min-height: 40px;
}

.sfb-ai-sparkle {
	flex-shrink: 0;
	font-size: 14px;
	color: var(--sfb-ai-accent);
	line-height: 1;
}

.sfb-ai-inline-input {
	flex: 1;
	border: none;
	outline: none;
	background: transparent;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 400;
	color: var(--sfb-ai-text);
	resize: none;
	overflow: hidden;
	line-height: 20px;
	padding: 0;
	min-height: 20px;
	max-height: 52px;
}

.sfb-ai-inline-input::placeholder {
	color: var(--sfb-ai-placeholder);
	font-weight: 300;
}

.sfb-ai-inline-input:read-only {
	opacity: 0.5;
	cursor: default;
}

.sfb-ai-collapsed-send {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	border-radius: 6px;
	border: none;
	background: rgba(90,124,191,0.4);
	color: var(--sfb-ai-bg);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	transition: background 0.2s;
}

.sfb-ai-collapsed-send:hover {
	background: rgba(90,124,191,0.55);
}

.sfb-ai-bar.sfb-ai-has-input .sfb-ai-collapsed-send {
	background: #3B82F6;
}

.sfb-ai-bar.sfb-ai-has-input .sfb-ai-collapsed-send:hover {
	filter: brightness(1.12);
}

/* (expanded view removed — inline input only) */

/* ── Status area ── */

.sfb-ai-status {
	padding: 0 14px 10px;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 400;
	color: var(--sfb-ai-text-muted);
	margin: 0;
}

.sfb-ai-status.sfb-ai-status-error {
	color: var(--sfb-ai-error);
}

.sfb-ai-status:empty {
	display: none;
}

/* ── Summary view (post-success collapsed) ── */

.sfb-ai-summary {
	display: none;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	min-height: 40px;
}

.sfb-ai-bar.sfb-ai-has-summary .sfb-ai-collapsed { display: none; }
.sfb-ai-bar.sfb-ai-has-summary .sfb-ai-summary { display: flex; }

.sfb-ai-summary-sparkle {
	flex-shrink: 0;
	font-size: 14px;
	color: var(--sfb-ai-accent);
}

.sfb-ai-summary-text {
	flex: 1;
	width: 0;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 400;
	color: var(--sfb-ai-text-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.sfb-ai-summary-edit {
	flex-shrink: 0;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	font-weight: 600;
	color: var(--sfb-ai-accent);
	cursor: pointer;
	border: none;
	background: none;
	padding: 0;
	text-decoration: none;
}

.sfb-ai-summary-edit:hover {
	text-decoration: underline;
}

/* ── Assumption pills ── */

.sfb-ai-assumptions {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	padding: 8px 0 10px;
	margin-bottom: 4px;
}

.sfb-ai-assumptions:empty {
	display: none;
}

.sfb-ai-pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	background: rgba(90,124,191,0.06);
	border: 1px solid rgba(90,124,191,0.12);
	border-radius: 16px;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	font-weight: 400;
	color: var(--sfb-ai-text-muted);
}

.sfb-ai-pill-close {
	flex-shrink: 0;
	cursor: pointer;
	color: var(--sfb-ai-text-muted);
	opacity: 0.5;
	font-size: 12px;
	line-height: 1;
}

.sfb-ai-pill-close:hover {
	opacity: 1;
}

/* ── Clarification area ── */

.sfb-ai-clarification {
	display: none;
	padding: 14px;
	background: rgba(90,124,191,0.03);
	border: 1px solid rgba(90,124,191,0.12);
	border-radius: 8px;
	margin-bottom: 8px;
}

.sfb-ai-clarification-question {
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 400;
	color: var(--sfb-ai-text);
	margin-bottom: 10px;
	line-height: 1.6;
}

.sfb-ai-clarification-question::before {
	content: '\1F4AC';
	margin-right: 6px;
	font-size: 12px;
}

.sfb-ai-clarification-suggestions {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 10px;
}

.sfb-ai-clarification-suggestions:empty {
	display: none;
}

.sfb-ai-suggestion-chip {
	display: inline-block;
	padding: 5px 12px;
	border: 1px solid rgba(90,124,191,0.2);
	border-radius: 14px;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 500;
	color: var(--sfb-ai-accent);
	cursor: pointer;
	background: var(--sfb-ai-bg);
	transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
	box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

.sfb-ai-suggestion-chip:hover {
	background: rgba(90,124,191,0.06);
	border-color: var(--sfb-ai-accent);
	box-shadow: 0 1px 4px rgba(90,124,191,0.15);
}

.sfb-ai-clarification-actions {
	display: flex;
	gap: 8px;
	align-items: center;
}

.sfb-ai-clarification-input {
	flex: 1;
	box-sizing: border-box;
	background: var(--sfb-ai-bg);
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	padding: 8px 12px;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 400;
	color: var(--sfb-ai-text);
	outline: none;
	transition: border-color 0.15s;
}

.sfb-ai-clarification-input::placeholder {
	color: var(--sfb-ai-placeholder);
	font-weight: 300;
}

.sfb-ai-clarification-input:focus {
	border-color: rgba(90,124,191,0.4);
}

.sfb-ai-clarification-send {
	flex-shrink: 0;
	padding: 8px 16px;
	border: none;
	border-radius: 6px;
	background: var(--sfb-ai-accent);
	color: var(--sfb-ai-bg);
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	transition: opacity 0.15s;
}

.sfb-ai-clarification-send:hover {
	opacity: 0.85;
}

/* ── Retry link ── */

.sfb-ai-retry {
	color: var(--sfb-ai-accent);
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	font-weight: 600;
	cursor: pointer;
	background: none;
	border: none;
	padding: 0;
	margin-left: 8px;
	text-decoration: none;
}

.sfb-ai-retry:hover {
	text-decoration: underline;
}

/* ── Filter Group: left-border accent ── */

.sfb-filter-group {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 8px;
	border-left: 3px solid #d0d0d0;
	padding-left: 10px;
	margin-left: 2px;
}

.sfb-filter-group .sfb-filter-group {
	border-left-color: #b0b0b0;
	margin-top: 4px;
}

/* Neutralize old bordered style when new class is present */
.sfb-filter-group.adv-search-filter-group.adv-search-bg-borders {
	border-right: none;
	border-top: none;
	border-bottom: none;
	background: none;
	margin-right: 0;
	margin-bottom: 0;
}

/* ── Filter Group Header ── */

.sfb-group-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6px;
	min-height: 28px;
	flex-wrap: wrap;
}

/* ── AND/OR pill toggle ── */

.sfb-andor-toggle {
	display: inline-flex;
	background: #E4E4E4;
	border-radius: 5px;
	padding: 2px;
	gap: 0;
}

.sfb-andor-btn {
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	font-weight: 600;
	padding: 3px 10px;
	border: none;
	border-radius: 4px;
	background: transparent;
	color: #969696;
	cursor: pointer;
	transition: all 0.15s;
	line-height: 1.4;
}

.sfb-andor-btn:hover {
	color: #666;
}

.sfb-andor-btn.active {
	background: #fff;
	color: #333;
	box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

/* ── Group control buttons ── */

.sfb-group-actions {
	display: flex;
	align-items: center;
	gap: 2px;
}

.sfb-group-action-btn {
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	font-weight: 500;
	color: #888;
	background: none;
	border: none;
	padding: 3px 6px;
	cursor: pointer;
	border-radius: 4px;
	transition: background 0.12s, color 0.12s;
	white-space: nowrap;
}

.sfb-group-action-btn:hover {
	background: #f3f3f3;
	color: #444;
}

.sfb-group-action-btn--danger:hover {
	background: #fde8e8;
	color: #c44;
}

/* ── Individual filter row: vertical card ── */

.sfb-filter-row {
	display: flex;
	flex-direction: column;
	gap: 5px;
	padding: 8px 10px;
	padding-right: 28px;
	background: #fff;
	border-radius: 6px;
	border: 1px solid #eee;
	position: relative;
	transition: border-color 0.12s;
}

.sfb-filter-row:hover {
	border-color: #d0d0d0;
}

.adv-search-filter.sfb-filter-row > * {
	margin-left: 0;
}

.sfb-filter-row select,
.sfb-filter-row input[type="text"],
.sfb-filter-row input[type="number"] {
	width: 100%;
	box-sizing: border-box;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	padding: 5px 7px;
	border: 1px solid #e0e0e0;
	border-radius: 5px;
	background: #fafafa;
	color: #222;
	outline: none;
	transition: border-color 0.12s, background 0.12s;
}

.sfb-filter-row select:focus,
.sfb-filter-row input[type="text"]:focus,
.sfb-filter-row input[type="number"]:focus {
	border-color: #aaa;
	background: #fff;
}

/* Override inline-flex and max-width from legacy styles */
.sfb-filter-row .adv-search-filter-clause-list,
.sfb-filter-row .adv-search-filter-clause-value {
	display: block;
	max-width: none;
	margin-left: 0;
}

.sfb-filter-row .adv-search-filter-clause-list select,
.sfb-filter-row .adv-search-filter-clause-value input,
.sfb-filter-row .adv-search-filter-clause-value select {
	max-width: none;
}

/* Related clauses render as parent row with nested child rules */
.adv-search-filter-group-filter.sfb-has-related-child {
	padding: 8px;
	border: 1px solid #e8e8e8;
	border-radius: 8px;
	background: #fcfcfc;
}

.adv-search-filter-group-filter.sfb-has-related-child > .sfb-filter-row {
	border-color: transparent;
}

.sfb-related-children {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-left: 11px;
	padding-left: 0;
	border-left: none;
}

.sfb-related-children > .adv-search-filter-group {
	margin-left: 0;
}

.sfb-related-children > .adv-search-filter-group.sfb-filter-group {
	border-left-color: #bcc6d4;
}

/* ── Date Input with Ignore Year ── */

.date-input-with-ignore-year {
	display: flex;
	align-items: center;
	gap: 6px;
}

.date-input-with-ignore-year > input[type="number"] {
	flex: 1;
	min-width: 0;
}

.ignore-year-container {
	display: flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
	white-space: nowrap;
}

.ignore-year-label {
	font-size: 12px;
	white-space: nowrap;
	cursor: pointer;
}

.ignore-year-checkbox {
	margin: 0;
	cursor: pointer;
}

/* ── Inline Entity Picker (UUID lookup dropdown) ── */
/* Override legacy div.adv-search-filter-group-filter div { display: inline-flex } */

div.adv-search-filter-group-filter .sfb-entity-picker {
	display: block;
	position: relative;
	width: 100%;
}

div.adv-search-filter-group-filter .sfb-entity-picker-dropdown {
	display: none;
}

div.adv-search-filter-group-filter .sfb-entity-picker-dropdown.open {
	display: block;
}

div.adv-search-filter-group-filter .sfb-entity-picker-search-wrap {
	display: block;
}

div.adv-search-filter-group-filter .sfb-entity-picker-results {
	display: block;
}

div.adv-search-filter-group-filter .sfb-entity-picker-result-row {
	display: block;
}

.sfb-entity-picker-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	margin-bottom: 4px;
}

.sfb-entity-picker-chips:empty {
	display: none;
}

.sfb-entity-chip {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 2px 6px;
	background: #eaf0fb;
	border: 1px solid #c8d8ee;
	border-radius: 4px;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	color: #333;
	max-width: 100%;
}

.sfb-entity-chip-label {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.sfb-entity-chip-remove {
	cursor: pointer;
	color: #999;
	font-weight: bold;
	font-size: 13px;
	line-height: 1;
	transition: color 0.12s;
}

.sfb-entity-chip-remove:hover {
	color: #c44;
}

.sfb-entity-picker-trigger {
	display: flex;
	align-items: center;
	gap: 6px;
	width: 100%;
	box-sizing: border-box;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	padding: 5px 7px;
	border: 1px solid #e0e0e0;
	border-radius: 5px;
	background: #fafafa;
	color: #999;
	cursor: pointer;
	transition: border-color 0.12s, background 0.12s;
	user-select: none;
}

.sfb-entity-picker-trigger:hover {
	border-color: #ccc;
}

.sfb-entity-picker-trigger.open {
	border-color: #aaa;
	background: #fff;
}

.sfb-entity-picker-trigger svg {
	flex-shrink: 0;
	opacity: 0.4;
}

.sfb-entity-picker-dropdown {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	margin-top: 2px;
	background: #fff;
	border: 1px solid #e0e0e0;
	border-radius: 5px;
	box-shadow: 0 4px 12px rgba(0,0,0,0.08);
	z-index: 1000;
	overflow: hidden;
}

.sfb-entity-picker-dropdown.open {
	display: block;
}

.sfb-entity-picker-search-wrap {
	position: relative;
	padding: 6px;
	border-bottom: 1px solid #f0f0f0;
}

.sfb-entity-picker-search-input {
	width: 100%;
	box-sizing: border-box;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	padding: 5px 24px 5px 8px;
	border: 1px solid #ddd;
	border-radius: 5px;
	background: #fff;
	outline: none;
	transition: border-color 0.12s;
}

.sfb-entity-picker-search-input:focus {
	border-color: #aaa;
}

.sfb-entity-picker-search-clear {
	position: absolute;
	right: 13px;
	top: 50%;
	transform: translateY(-50%);
	cursor: pointer;
	color: #999;
	font-size: 15px;
	font-weight: bold;
	display: none;
	user-select: none;
	line-height: 1;
	transition: color 0.12s;
}

.sfb-entity-picker-search-clear:hover {
	color: #333;
}

.sfb-entity-picker-results {
	max-height: 220px;
	overflow-y: auto;
}

.sfb-entity-picker-result-row {
	padding: 6px 10px;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	color: #333;
	cursor: pointer;
	border-bottom: 1px solid #f5f5f5;
	transition: background 0.1s;
}

.sfb-entity-picker-result-row:last-child {
	border-bottom: none;
}

.sfb-entity-picker-result-row:hover {
	background: #f5f8ff;
}

.sfb-entity-picker-result-row.selected {
	background: #eaf0fb;
	font-weight: 500;
}

.sfb-entity-picker-empty,
.sfb-entity-picker-loading {
	padding: 12px 10px;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	color: #999;
	text-align: center;
}

/* ── InlineOptionPicker selected label ── */

.sfb-option-picker-selected-label {
	flex: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: #333;
	font-weight: 500;
}

/* ── Filter delete button ── */

.sfb-filter-delete {
	position: absolute;
	top: 7px;
	right: 7px;
	width: 18px;
	height: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
	color: #bbb;
	cursor: pointer;
	border-radius: 4px;
	transition: background 0.12s, color 0.12s;
	line-height: 1;
}

.sfb-filter-delete:hover {
	background: #fde8e8;
	color: #c44;
}

/* Hide delete for first row in join groups */
div.fg-n-n-group .sfb-filter-row > .sfb-filter-delete,
div.fg-1-n-group .sfb-filter-row > .sfb-filter-delete {
	display: none;
}

/* ── Display Fields collapsible section ── */

.sfb-collapsible {
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	overflow: hidden;
}

.sfb-collapsible-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 7px 10px;
	background: #f8f8f8;
	cursor: pointer;
	user-select: none;
	transition: background 0.12s;
}

.sfb-collapsible-header:hover {
	background: #f0f0f0;
}

.sfb-collapsible-title {
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 600;
	color: #444;
}

.sfb-collapsible-chevron {
	font-size: 11px;
	color: #999;
	transition: transform 0.2s;
}

.sfb-collapsible.open .sfb-collapsible-chevron {
	transform: rotate(180deg);
}

.sfb-collapsible-body {
	display: none;
	padding: 8px;
}

.sfb-collapsible.open .sfb-collapsible-body {
	display: block;
}

/* ── Display Fields toggle list ── */

.sfb-field-toggle-container {
	display: flex;
	flex-direction: column;
}

.sfb-field-select-all-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 6px 8px;
	border: 1px solid #e8e8e8;
	border-radius: 5px;
	background: #fff;
	margin-top: 6px;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 600;
	color: #333;
}

.sfb-field-toggle-list {
	max-height: 280px;
	overflow-y: auto;
	overflow-x: hidden;
	border: 1px solid #e8e8e8;
	border-radius: 5px;
	background: #fff;
	margin-top: 6px;
}

.sfb-field-toggle-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 5px 8px;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	color: #333;
	border-bottom: 1px solid #f0f0f0;
	transition: background 0.1s;
}
.sfb-field-toggle-row:last-child { border-bottom: none; }
.sfb-field-toggle-row:hover { background: #f8f8f8; }

.sfb-field-toggle-row-placeholder {
	height: 28px;
	border-radius: 5px;
	margin: 0 6px;
	background: #eef1f5;
	border: 1px dashed #c7d0dc;
}

.sfb-field-toggle-label {
	flex: 1;
	min-width: 0;
	user-select: none;
}

.sfb-field-toggle-drag-handle {
	width: 16px;
	height: 16px;
	flex-shrink: 0;
	background-color: #3d4652;
	-webkit-mask-image: var(--sfb-field-toggle-drag-icon);
	mask-image: var(--sfb-field-toggle-drag-icon);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 16px 16px;
	mask-size: 16px 16px;
	cursor: grab;
	transition: background-color 0.12s ease, opacity 0.12s ease;
}

.sfb-field-toggle-row-draggable .sfb-field-toggle-drag-handle:hover {
	background-color: #1f2732;
}

.sfb-field-toggle-row-disabled .sfb-field-toggle-drag-handle,
.sfb-field-toggle-list-reorder-disabled .sfb-field-toggle-drag-handle,
.sfb-field-toggle-row-not-draggable .sfb-field-toggle-drag-handle {
	background-color: #c2cad4;
	cursor: default;
}

.sfb-field-toggle-list .ui-sortable-helper {
	background: #fff;
	box-shadow: 0 8px 20px rgba(16, 24, 40, 0.14);
	border-radius: 5px;
}

.sfb-field-toggle-list .ui-sortable-helper .sfb-field-toggle-drag-handle {
	cursor: grabbing;
}

/* Toggle switch */
.sfb-toggle-switch {
	position: relative;
	display: inline-block;
	width: 28px;
	height: 16px;
	flex-shrink: 0;
	cursor: pointer;
	margin: 0;
}
.sfb-toggle-switch input {
	opacity: 0;
	width: 0;
	height: 0;
	position: absolute;
}

.sfb-toggle-track {
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	background: #ccc;
	border-radius: 8px;
	transition: background 0.2s;
}
.sfb-toggle-thumb {
	position: absolute;
	top: 2px;
	left: 2px;
	width: 12px;
	height: 12px;
	background: #fff;
	border-radius: 50%;
	transition: transform 0.2s;
}
.sfb-toggle-switch input:checked + .sfb-toggle-track {
	background: #4a8fe7;
}
.sfb-toggle-switch input:checked + .sfb-toggle-track .sfb-toggle-thumb {
	transform: translateX(12px);
}

/* Shared filter input styles (used by toggle list) */
.sfb-field-filter-input {
	width: 100%;
	box-sizing: border-box;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	padding: 5px 24px 5px 8px;
	border: 1px solid #ddd;
	border-radius: 5px;
	background: #fff;
	outline: none;
	transition: border-color 0.12s;
}
.sfb-field-filter-input:focus {
	border-color: #aaa;
}

.sfb-field-filter-wrap {
	position: relative;
	display: flex;
}

.sfb-field-filter-clear {
	position: absolute;
	right: 7px;
	top: 50%;
	transform: translateY(-50%);
	cursor: pointer;
	color: #999;
	font-size: 15px;
	font-weight: bold;
	display: none;
	user-select: none;
	line-height: 1;
	transition: color 0.12s;
}
.sfb-field-filter-clear:hover {
	color: #333;
}

/* ── Ascending checkbox row ── */

.sfb-checkbox-row {
	display: flex;
	align-items: center;
	gap: 6px;
}

.sfb-checkbox-row input[type="checkbox"] {
	width: 14px;
	height: 14px;
	accent-color: #555;
}

.sfb-checkbox-label {
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	color: #555;
}

/* ── End Search Filter Builder Design System ── */

.filters-preview-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 6px;
	/* the panel leaves its right edge open — the header keeps its own inset */
	padding-right: 20px;
}

.filters-preview-header .filters-panel-title {
	margin-bottom: 0;
	font-size: 18px;
	font-weight: 700;
}

.filters-preview-header-actions {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin-left: auto;
}

.filters-preview-orderby-host {
	position: relative;
	flex: 0 0 auto;
}

.filters-preview-orderby-trigger {
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	background: #f8f8f8;
	color: #666;
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
	transition: background 0.12s, border-color 0.12s, color 0.12s;
}

.filters-preview-orderby-trigger:hover {
	background: #f0f0f0;
	border-color: #d6d6d6;
	color: #444;
}

.filters-preview-orderby-host.open .filters-preview-orderby-trigger {
	background: #ececec;
	border-color: #cfcfcf;
	color: #333;
}

.filters-preview-orderby-popover {
	position: absolute;
	top: calc(100% + 6px);
	right: 0;
	width: 230px;
	padding: 8px;
	background: #f8f8f8;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.14);
	z-index: 17;
}

.filters-preview-orderby-label {
	margin-bottom: 4px;
}

.filters-preview-orderby-select {
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	padding: 5px 7px;
	border: 1px solid #e0e0e0;
	border-radius: 5px;
	background: #fafafa;
	color: #222;
	outline: none;
}

.filters-preview-orderby-select:focus {
	border-color: #aaa;
	background: #fff;
}

.filters-preview-orderby-ascending {
	margin-top: 8px;
}

.filters-preview-display-fields-host {
	flex: 0 0 280px;
	max-width: 100%;
	min-width: 248px;
}

.filters-preview-display-fields-host .sfb-collapsible {
	margin: 0;
	position: relative;
	border: none;
	overflow: visible;
	z-index: 15;
}

.filters-preview-display-fields-host .sfb-collapsible-header {
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	background-clip: padding-box;
}

.filters-preview-display-fields-host .sfb-collapsible-body {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	right: 0;
	background: #f8f8f8;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.14);
	z-index: 16;
}

.filters-preview-meta {
	font-size: 12px;
	color: #666;
	margin: 15px 20px 14px 0;
}

.filters-preview-status {
	font-size: 13px;
	color: #333;
	margin-bottom: 8px;
}

.filters-preview-table-host {
	flex: 1 1 auto;
	min-height: 0;
	overflow: auto;
	background: #F3F3F3;
	border-radius: 12px;
	padding: 0 0 10px 0;
	scrollbar-width: none;
}

/* Right inset while the columns fit the panel; dropped (bleed to the rounded
   edge) once they overflow horizontally — toggled by the module's fit check */
.filters-preview-table-host.is-inset {
	margin-right: 20px;
}
.filters-preview-table-host::-webkit-scrollbar {
	display: none;
}

table.table_builder.filters-preview-table {
	width: 100%;
	border-spacing: 0 2px !important;
}

table.table_builder.filters-preview-table tbody tr {
	background-color: #ffffff;
	transition: background-color 0.15s ease;
}
table.table_builder.filters-preview-table tbody tr:hover {
	background-color: rgba(0, 0, 0, 0.04);
}

table.table_builder.filters-preview-table tbody tr td {
	padding: 8px 14px !important;
	font-size: 13px;
	border-bottom: none;
}
table.table_builder.filters-preview-table tbody tr td:first-child {
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
	font-weight: 500;
}
table.table_builder.filters-preview-table tbody tr td:last-child {
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
}

table.table_builder.filters-preview-table thead th {
	font-size: 11px;
	font-weight: 500 !important;
	color: #999;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	padding: 4px 14px 10px !important;
	border-bottom: none !important;
	white-space: nowrap;
	position: sticky;
	top: 0;
	z-index: 2;
	background-color: #f3f3f3 !important;
}

.filters-toolbar-actions {
	display: flex;
	align-items: center;
	gap: 8px;
}

/* Saved-filter sharing and scope controls, ported from MR 37. */
.filters-workspace-shell .mod-list-scroll table.table_builder td .fb_v4_view_badge {
	margin-left: 8px;
	vertical-align: middle;
}

.filters-tb-scope-host {
	display: inline-flex;
	align-items: center;
}

.filters-tb-scope-menu .filters-tb-scope-item .vc-context-menu-icon {
	visibility: hidden;
}

.filters-workspace-shell .mod-list-scroll table.table_builder thead th.gdt_ops_col,
.filters-workspace-shell .mod-list-scroll table.table_builder tbody tr td.gdt_ops_col {
	width: 96px;
	min-width: 96px;
}

.filters-tb-mode-switch {
	flex-shrink: 0;
}

.filters-tb-mode-btn {
	font-size: 13px;
	padding: 0 12px;
	line-height: 28px;
}

@media (max-width: 1100px) {
	.filters-workspace--build {
		flex-direction: column;
	}

	.filters-panel--builder {
		flex: 0 0 auto;
		min-width: 0;
		max-width: 100%;
	}

	.filters-preview-header {
		flex-direction: column;
		align-items: stretch;
	}

	.filters-preview-header-actions {
		margin-left: 0;
		width: 100%;
	}

	.filters-preview-display-fields-host {
		margin-left: 0;
		flex: 1 1 auto;
		min-width: 0;
	}
}

/* ============================================================
   End Unified Module Design System
   ============================================================ */

/** TK MOD Calendar **/

div.slider-input {
	width: 94%;
	margin-left: auto;
	margin-right: auto;
}

div.slider-input > div.ui-slider-handle {
	width: 2em;
	margin-left: -1em;
	text-align: center;
}

/** Task List **/
.tasks-container {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
	background: #F3F3F3;
	border-radius: 12px;
	padding: 10px;
	/* Anchor for the floating back-to-top button */
	position: relative;
}

.tasks-container:not(.tasks-board-mode) {
	padding: 10px 0 0 14px;
}

/* Header total-count badge, sits next to the "Tasks" title */
.task-tb-count {
	font-family: 'Manrope', sans-serif;
	font-weight: 600;
	font-size: 13px;
	color: #777;
	white-space: nowrap;
	line-height: 1;
	padding: 3px 9px;
	background: #e6e6e6;
	border-radius: 999px;
}

/* Floating "back to top" button for the task list */
.task-back-to-top {
	position: absolute;
	right: 22px;
	bottom: 48px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #1e4a6f;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	translate: 0 8px;
	transition: opacity 0.2s var(--cal-arrive), translate 0.2s var(--cal-arrive), visibility 0.2s;
	z-index: 5;
}

.task-back-to-top:hover {
	background: #2a5d88;
}

.task-back-to-top.visible {
	opacity: 0.92;
	visibility: visible;
	translate: 0 0;
}

.task-back-to-top::before {
	content: '';
	position: absolute;
	top: 16px;
	left: 50%;
	width: 11px;
	height: 11px;
	border-left: 2px solid #fff;
	border-top: 2px solid #fff;
	transform: translateX(-50%) rotate(45deg);
}

.tasks-container > div {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.tasks-container .dataTables_wrapper {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.tasks-container .task-table-scroll {
	flex: 1 1 0;
	min-height: 0;
	overflow-x: auto;
	overflow-y: auto;
	scrollbar-gutter: stable;
}

.tasks-container.tasks-infinite-mode .dataTables_wrapper > .dataTables_paginate,
.tasks-container.tasks-infinite-mode .dataTables_wrapper > .dataTables_info {
	display: none !important;
}

.tasks-container .dataTables_wrapper > .dataTables_paginate {
	flex: 0 0 auto;
	margin-top: auto;
}

.task-overdue {
	background: #f18c8c !important;
	color: #000;
}

.task-today {
	background: #fff9c4 !important;
}

.task-complete {
	background: #cccccc !important;
}

/* === Task List — Modern Pill-Style Rows (matching Calendar List View) === */

/* Row gap spacing for pill separation */
.tasks-container table.table_builder {
	border-spacing: 0px 2px !important;
}

/* Row pill shape: white background, smooth hover transition */
.tasks-container table.table_builder tbody tr {
	background-color: #ffffff;
	transition: background-color 0.15s ease;
}

/* While a draw lands its status tints (onUnifiedTableRedrawn), rows take their colour at once. */
.tasks-container.task-rows-settling table.table_builder tbody tr {
	transition: none;
}

/* Smooth hover — overrides table_builder_selectable_rows #c1daee */
.tasks-container table.table_builder.table_builder_selectable_rows tbody tr:hover {
	background-color: rgba(0, 0, 0, 0.04);
}

/* Selected row must stay visible even while hovering or on overdue rows */
.tasks-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row {
	background-color: #95afcc !important;
}
.tasks-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row:hover {
	background-color: #8aa3c0 !important;
}

/* Pill radius on row ends */
.tasks-container table.table_builder tbody tr td:first-child {
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
}

.tasks-container table.table_builder tbody tr td:last-child {
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
}

/* Remove inter-row borders — the gray container background shows through gaps */
.tasks-container table.table_builder tbody tr:not(:last-child) td {
	border-bottom: none;
}

/* Cell padding and font — match calendar list view */
.tasks-container table.table_builder tbody tr td {
	padding: 8px 14px !important;
	font-size: 13px;
}

/* Subject column emphasis — medium weight (500) */
.tasks-container table.table_builder tbody tr td:first-child {
	font-weight: 500;
}

/* Override base last-cell extra padding */
.tasks-container table.table_builder tbody tr td:last-child {
	padding-right: 14px;
}

/* Team member links in task rows — display-only, not clickable */
.tasks-container table a.attendee-link[data-type="User"],
.tasks-container table a.attendee-link[data-type="OrganizationUser"] {
	text-decoration: none;
	color: inherit;
	cursor: default;
}

/* Header row — subtle labels, not a heavy band */
.tasks-container table.table_builder thead th {
	font-size: 11px;
	font-weight: 500 !important;
	color: #999;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	padding: 4px 14px 10px !important;
	border-bottom: none !important;
	white-space: nowrap;
	position: sticky;
	top: 0;
	z-index: 2;
	background-color: #f3f3f3 !important;
}

.tasks-container table.table_builder thead th,
.tasks-container table.table_builder thead th *,
.tasks-container table.dataTable thead th,
.tasks-container table.dataTable thead th * {
	font-weight: 500 !important;
}

.tasks-container table thead .sorting,
.tasks-container table thead .sorting_asc,
.tasks-container table thead .sorting_desc {
	position: relative;
	padding-right: 22px !important;
	background-repeat: no-repeat !important;
	background-position: center right !important;
	background-size: 12px 12px !important;
}

.tasks-container table thead .sorting {
	background-image: url("/images/icons/sort_both.png") !important;
}

.tasks-container table thead .sorting_asc {
	background-image: url("/images/icons/sort_asc.png") !important;
}

.tasks-container table thead .sorting_desc {
	background-image: url("/images/icons/sort_desc.png") !important;
}

.tasks-container table.table_builder thead tr th:hover {
	background-color: rgba(0, 0, 0, 0.02) !important;
	border-radius: 6px;
}

/* Status colors — soft modern tones */
.tasks-container .task-overdue {
	background: #fee2e2 !important;
	color: #991b1b;
}

.tasks-container .task-overdue:hover {
	background: #fecaca !important;
}

.tasks-container .task-today {
	background: #fff9c4 !important;
	color: #854d0e;
}

.tasks-container .task-today:hover {
	background: #fff59d !important;
}

.tasks-container .task-complete {
	background: #f3f4f6 !important;
	color: #6b7280;
}

.tasks-container .task-complete:hover {
	background: #e5e7eb !important;
}

/* Pagination — info + page buttons in one row */
.tasks-container .dataTables_paginate {
	display: flex;
	align-items: center;
	padding: 6px 14px;
}

.tasks-container .dataTables_paginate .dataTables_info {
	font-size: 12px;
	color: #999;
	margin-right: auto;
}

/* Matches .entity-list-info (the "Showing 1 to 50 of 85 entries" footer on entity lists) */
.tasks-main-content .task-infinite-status {
	padding: 4px 14px 0;
	text-align: left;
	font-size: 12px;
	color: #999;
}

/* Pinned footer status bar (direct child of the container, below the scroll area) — stays put
   while rows load in, instead of scrolling away with the list content. */
.tasks-main-content > .task-infinite-status {
	flex: 0 0 auto;
}

.tasks-main-content .task-infinite-status.hidden {
	display: none;
}

.tasks-container .task-infinite-status.loading {
	display: block;
}

.tasks-container .task-infinite-sentinel {
	height: 1px;
	width: 100%;
}

/* Modern progress bar */
.tasks-container .ui-progressbar.ui-widget.ui-widget-content {
	height: 10px;
	border: none;
	border-radius: 5px;
	background: #e5e7eb;
	background-image: none;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.06);
	padding: 0;
	margin: 4px 0;
	overflow: hidden;
}

.tasks-container .ui-progressbar .ui-progressbar-value.ui-widget-header {
	border: none;
	border-radius: 5px;
	background: linear-gradient(135deg, #3b82f6 0%, #2563eb 50%, #1d4ed8 100%);
	background-image: linear-gradient(135deg, #3b82f6 0%, #2563eb 50%, #1d4ed8 100%);
	box-shadow: 0 1px 3px rgba(37, 99, 235, 0.3);
	margin: 0;
	transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.tasks-container .task-overdue .ui-progressbar .ui-progressbar-value.ui-widget-header {
	background: linear-gradient(135deg, #f87171 0%, #ef4444 50%, #dc2626 100%);
	background-image: linear-gradient(135deg, #f87171 0%, #ef4444 50%, #dc2626 100%);
	box-shadow: 0 1px 3px rgba(239, 68, 68, 0.3);
}

.tasks-container .task-today .ui-progressbar .ui-progressbar-value.ui-widget-header {
	background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 50%, #d97706 100%);
	background-image: linear-gradient(135deg, #fbbf24 0%, #f59e0b 50%, #d97706 100%);
	box-shadow: 0 1px 3px rgba(217, 119, 6, 0.3);
}

.tasks-container .task-complete .ui-progressbar .ui-progressbar-value.ui-widget-header {
	background: linear-gradient(135deg, #3b82f6 0%, #2563eb 50%, #1d4ed8 100%);
	background-image: linear-gradient(135deg, #3b82f6 0%, #2563eb 50%, #1d4ed8 100%);
	box-shadow: 0 1px 3px rgba(37, 99, 235, 0.3);
}

/* Task toolbar - unified design matching Calendar toolbar */
div.task-view-head {
	background: #F3F3F3;
	border-radius: 12px;
	height: var(--workspace-module-header-height);
	min-height: var(--workspace-module-header-height);
	padding: var(--workspace-module-header-padding);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: nowrap;
	margin-bottom: 1em;
}

.task-tb-title {
	font-family: 'Manrope', sans-serif;
	font-weight: 700;
	-webkit-text-stroke: var(--module-title-stroke) currentColor;
	font-size: var(--module-title-size);
	white-space: nowrap;
	color: #000;
	line-height: 1;
}

.task-tb-display-mode {
	flex-shrink: 0;
	margin-right: 4px;
}

.task-tb-display-mode.task-tb-display-mode-hidden {
	display: none;
}

.task-tb-display-mode .task-tb-display-mode-btn {
	font-size: 13px;
	padding: 0 12px;
	line-height: 28px;
	/* background-color is deliberately not transitioned: the sheen cannot fade
	   with it, so a fading fill would show the white ramp over bare track for a
	   frame. Fill and sheen land together; colour and shadow animate. */
	transition: color 0.15s, box-shadow 0.15s;
}

/* This switch has no indicator element - the pill is painted onto the selected
   button, so it carries the same surface as .fc-tb-clone-selector-indicator. */
.task-tb-display-mode .fc-tb-clone-selector-btn-selected {
	background-image: var(--btn-neutral-sheen);
	background-color: var(--btn-neutral-fill);
	box-shadow:
		0 1px 1px rgba(23, 43, 71, 0.16),
		0 2px 5px rgba(23, 43, 71, 0.14),
		inset 0 0 0 1px var(--btn-neutral-border),
		inset 0 1px 0 var(--btn-neutral-specular),
		inset 0 -1px 0 var(--btn-neutral-underside);
}

.task-tb-spacer {
	flex-grow: 1;
}

.task-tb-layout-control {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 2px 0;
	flex-shrink: 0;
}

.task-tb-btn-layout {
	cursor: pointer;
	background-size: cover;
	width: 25px;
	height: 25px;
	background-color: transparent;
	background-image: url(/images/calendar/layout.svg);
	transition: scale 0.2s var(--cal-arrive);
	flex-shrink: 0;
	position: relative;
}

.task-tb-btn-layout:hover {
	scale: 1.1;
}

.task-tb-btn-layout:focus {
	outline: none;
}

.task-tb-btn-layout:focus-visible {
	outline: 2px solid #66afe9;
	outline-offset: 2px;
	border-radius: 4px;
}

.task-tb-layout-badge {
	position: absolute;
	top: -1px;
	right: -1px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #016ba5;
	border: 1px solid #fff;
	opacity: 0;
	transition: opacity 0.2s ease;
	pointer-events: none;
}

.task-tb-layout-control.has-custom-layout .task-tb-layout-badge {
	opacity: 1;
}

.task-tb-layout-host {
	display: none;
	align-items: center;
}

.task-tb-layout-control.expanded .task-tb-layout-host {
	display: flex;
}

.task-tb-layout-control.task-layout-hidden {
	display: none;
}

/* #1683/#1642: a saved filter that carries its own DisplayFields owns the columns, so the layout
   picker would be two controls fighting over the same job. Hide it while that's true. */
.task-tb-layout-control.task-layout-filter-owned {
	display: none;
}

/* #1608 TSK-030: sits beside the layout select once the control is expanded, so the
   arrangement on screen can be kept rather than only chosen from. */
.task-tb-layout-save {
	margin-left: 6px;
	padding: 4px 9px;
	border: 1px solid #d3d7db;
	border-radius: 5px;
	background: #fff;
	color: rgba(0, 0, 0, 0.58);
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	white-space: nowrap;
	cursor: pointer;
	transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}

.task-tb-layout-save:hover,
.task-tb-layout-save:focus-visible {
	border-color: #1b74c9;
	color: #1b5e9f;
	background: #f8fafc;
	outline: none;
}

.task-tb-layout-save:focus-visible {
	box-shadow: 0 0 0 3px rgba(27, 116, 201, 0.18);
}

.task-tb-layout-host .custom_table_select {
	float: none;
	margin: 0;
	font-size: 14px;
	padding: 4px 8px;
	border: 1px solid #ccc;
	border-radius: 5px;
	background: white;
	cursor: pointer;
	outline: none;
	height: 31px;
	min-width: 165px;
}

.task-tb-btn-settings {
	margin: 2px 0;
	cursor: pointer;
	background-size: cover;
	width: 25px;
	height: 25px;
	background-color: transparent;
	background-image: url(/images/calendar/settings-toolbar.svg);
	transition: scale 0.2s var(--cal-arrive);
	flex-shrink: 0;
}

.task-tb-btn-settings:hover {
	scale: 1.1;
}

.task-tb-btn-print {
	margin: 2px 0;
	cursor: pointer;
	background-size: cover;
	width: 25px;
	height: 25px;
	background-color: transparent;
	background-image: url(/images/calendar/print-toolbar.svg);
	transition: scale 0.2s var(--cal-arrive);
	flex-shrink: 0;
}

.task-tb-btn-print:hover {
	scale: 1.1;
}

.task-tb-btn-print.task-print-hidden {
	display: none;
}

.task-tb-btn-reload {
	margin: 2px 0;
	cursor: pointer;
	background-size: cover;
	width: 25px;
	height: 25px;
	background-color: transparent;
	background-image: url(/images/calendar/reload.svg);
	transition: scale 0.2s var(--cal-arrive);
	flex-shrink: 0;
}

.task-tb-btn-reload:hover {
	scale: 1.1;
}

.task-tb-btn-reload.spinning {
	animation: fc-reload-spin 0.8s linear infinite;
}

/* Task expandable search - collapsed state (default) */
.task-tb-search-wrapper {
	display: flex;
	flex-flow: row;
	justify-content: center;
	align-items: center;
	background-color: transparent;
	border: none;
	width: 25px;
	min-width: 25px;
	padding: 0;
	overflow: visible;
	height: 37px;
	box-sizing: border-box;
	gap: 0;
	cursor: pointer;
	transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            min-width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            padding 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            border-radius 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            gap 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	overflow: hidden;
	flex-shrink: 0;
}

/* Task expandable search - expanded state */
.task-tb-search-wrapper.expanded {
	width: 250px;
	min-width: 150px;
	padding: 0 12px;
	border-radius: 5px;
	background-color: #ffffff;
	justify-content: flex-start;
	gap: 8px;
	cursor: text;
}

/* Task search input - hidden when collapsed */
.task-tb-search-wrapper input.task-tb-search-input {
	color: #555555;
	outline: none;
	border: none;
	font-size: 14px;
	background: transparent;
	width: 0;
	opacity: 0;
	flex-grow: 0;
	padding: 0;
	transition: opacity 0.2s ease 0.1s, width 0.3s cubic-bezier(0.4, 0, 0.2, 1), flex-grow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Task search input - visible when expanded */
.task-tb-search-wrapper.expanded input.task-tb-search-input {
	width: auto;
	opacity: 1;
	flex-grow: 1;
}

.task-tb-search-wrapper input.task-tb-search-input::placeholder {
	color: #888888;
}

/* Task search icon */
.task-tb-search-icon {
	background-image: url(/images/calendar/search.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	max-width: 25px;
	min-width: 25px;
	height: 25px;
	cursor: pointer;
	transition: scale 0.2s var(--cal-arrive);
	flex-shrink: 0;
}

.task-tb-search-icon:hover {
	scale: 1.1;
}

.task-tb-search-wrapper.expanded .task-tb-search-icon {
	max-width: 18px;
	min-width: 18px;
	height: 18px;
}

/* Match the contact-record action group: 10px parent gap, 34px hit boxes,
   centered 25px artwork, and consistent negative optical inset. */
.task-tb-btn-layout,
.task-tb-btn-print,
.task-tb-btn-reload,
.task-tb-btn-settings,
.mod-tb-btn-edit,
.mod-tb-btn-layout,
.mod-tb-btn-reload,
.mod-tb-btn-duplicate,
.mod-tb-btn-delete {
	width: 34px;
	height: 34px;
	margin: 0 0 0 -5px;
	background-color: transparent;
	background-size: 25px 25px;
	background-repeat: no-repeat;
	background-position: center;
}

.task-tb-layout-control,
.mod-tb-layout-control {
	margin: 0;
}

.task-tb-search-wrapper:not(.expanded) {
	width: 34px;
	min-width: 34px;
	height: 34px;
	margin-left: -5px;
}

.task-tb-search-wrapper:not(.expanded) .task-tb-search-icon {
	background-size: 25px 25px;
}

/* Task Create button */
.task-tb-create-button {
	color: white;
	border: none;
	border-radius: 8px;
	padding: 0px 20px;
	cursor: pointer;
	height: 37px;
	min-width: var(--workspace-primary-action-min-width);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	white-space: nowrap;
	flex-shrink: 0;
	font: inherit;
}

.task-tb-create-button-text {
	font-weight: inherit;
	color: #ffffff;
}

/* Task sidebar collapse button */
.task-tb-collapse {
	flex-grow: 0;
	flex-shrink: 0;
	margin: 0;
	width: 20px;
	min-width: 20px;
	height: 20px;
	cursor: pointer;
	background-image: url(/images/calendar/collapse.svg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

/* Hide DataTables search — our toolbar search replaces it */
.tasks-main-content .dataTables_filter {
	display: none;
}

/* Hide DataTables "Show entries" — auto-calculated to fill available space */
.tasks-main-content .dataTables_length {
	display: none;
}

/* ============================================================
   Contacts Module — Toolbar, Container, Pill Rows, Sticky Headers
   (mirrors Tasks design language)
   ============================================================ */

/* --- Contacts Toolbar --- */

div.entity-list-view-head,
div.contact-view-head {
	background: #F3F3F3;
	border-radius: 12px;
	height: var(--workspace-module-header-height);
	min-height: var(--workspace-module-header-height);
	padding: var(--workspace-module-header-padding);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: nowrap;
	margin-bottom: 1em;
}

.entity-list-title,
.contact-tb-title {
	font-family: 'Manrope', sans-serif;
	font-weight: 700;
	-webkit-text-stroke: var(--module-title-stroke) currentColor;
	font-size: var(--module-title-size);
	white-space: nowrap;
	color: #000;
	line-height: 1;
}

.entity-list-spacer,
.contact-tb-spacer {
	flex-grow: 1;
}

/* Native selects styled to match .entity-list-default-filter-header-trigger (the
   "All Contacts" pill) — visual only, behavior stays the native select */
.entity-list-filter,
.contact-tb-filter {
	appearance: none;
	-webkit-appearance: none;
	height: 34px;
	min-width: 187px;
	padding: 0 34px 0 10px;
	border: 1px solid #C6C6C6;
	border-radius: 10px;
	background-color: #ffffff;
	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9L12 15L18 9' stroke='%2300000066' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 15px 15px;
	color: rgba(0, 0, 0, 0.58);
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	outline: none;
	box-sizing: border-box;
	transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.entity-list-filter:hover,
.contact-tb-filter:hover {
	background-color: #f8f8f8;
	border-color: #B8B8B8;
}

.entity-list-filter:focus,
.contact-tb-filter:focus {
	outline: none;
	border-color: #8cb2e5;
	box-shadow: 0 0 0 3px rgba(140, 178, 229, 0.25);
}

.entity-list-title-filter {
	display: flex;
	align-items: center;
	flex-shrink: 0;
}

.entity-list-title-filter .entity-list-filter {
	min-width: 0;
}

.entity-list-title-type-select {
	min-width: 146px !important;
}

.entity-list-default-filter-header-host {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	min-width: 0;
}

.entity-list-default-filter-header-trigger {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 34px;
	max-width: 260px;
	min-width: 168px;
	padding: 0 10px;
	border: 1px solid #C6C6C6;
	border-radius: 10px;
	background: #ffffff;
	color: rgba(0, 0, 0, 0.58);
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	text-align: left;
	box-sizing: border-box;
	transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.entity-list-default-filter-header-trigger:hover {
	background: #f8f8f8;
	border-color: #B8B8B8;
}

.entity-list-default-filter-header-trigger:focus,
.entity-list-default-filter-header-trigger:focus-visible {
	outline: none;
	border-color: #8cb2e5;
	box-shadow: 0 0 0 3px rgba(140, 178, 229, 0.25);
}

.entity-list-default-filter-header-trigger-label {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.entity-list-default-filter-header-trigger-icon {
	width: 15px;
	height: 15px;
	flex: 0 0 15px;
	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 6L15 12L9 18' stroke='%2300000066' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	transform: rotate(90deg);
}

.entity-list-actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}

.entity-list-view-head.entity-list-selection-mode .entity-list-actions,
.entity-list-view-head.entity-list-selection-mode .entity-list-create-button,
.entity-list-view-head.entity-list-selection-mode .entity-list-save-view-button {
	display: none;
}

.entity-list-quick-filter-host {
	display: flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
	margin-left: -5px;
}

.entity-list-quick-filter-trigger {
	cursor: pointer;
	background-size: 25px 25px;
	background-repeat: no-repeat;
	background-position: center;
	width: 34px;
	height: 34px;
	background-color: transparent;
	background-image: url(/images/icons/filter-toolbar-icon.svg);
	transition: scale 0.2s var(--cal-arrive);
	flex-shrink: 0;
}

.entity-list-quick-filter-trigger:hover {
	scale: 1.1;
}

.entity-list-quick-filter-trigger:focus {
	outline: none;
}

.entity-list-quick-filter-trigger:focus-visible {
	outline: 2px solid #66afe9;
	outline-offset: 2px;
	border-radius: 4px;
}

.entity-list-quick-filter-preview-back {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 0;
	width: auto;
	min-width: 34px;
	max-width: none;
	padding: 0 12px 0 38px;
	border-radius: 17px;
	background-image: url(/images/icons/arrow-back-toolbar-icon.svg);
	background-size: 25px 25px;
	background-position: 5px center;
	background-repeat: no-repeat;
	flex: 0 0 auto;
	overflow: visible;
	white-space: nowrap;
}

.entity-list-quick-filter-preview-back:hover {
	transform: none;
	background-color: rgba(0, 0, 0, 0.05);
}

.entity-list-quick-filter-preview-back::after {
	content: 'Back';
	display: block;
	font-size: 14px;
	font-weight: 700;
	line-height: 18px;
	color: rgba(0, 0, 0, 0.68);
	white-space: nowrap;
}

.entity-list-quick-filter-preview-back-icon,
.entity-list-quick-filter-preview-back-label {
	display: none;
}

.entity-list-quick-filter-preview-back:hover::after,
.entity-list-quick-filter-preview-back:focus-visible::after {
	color: rgba(0, 0, 0, 0.86);
}

.entity-list-quick-filter-preview-back.entity-list-quick-filter-preview-back-icon-only {
	min-width: 34px;
	width: 34px;
	padding: 0;
	background-position: center;
}

.entity-list-quick-filter-preview-back.entity-list-quick-filter-preview-back-icon-only::after {
	content: none;
	display: none;
}

.entity-list-quick-filter-strip-host {
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0;
}

.entity-list-quick-filter-strip {
	display: none;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	background: #f3f3f3;
	border-radius: 12px;
	padding: 14px;
	margin: -4px 0 12px 0;
	width: 100%;
	box-sizing: border-box;
}

.entity-list-quick-filter-strip-recent {
	justify-content: flex-start;
	background: #ffffff;
	padding: 10px 14px 10px 0;
	margin: -12px 0 4px 0;
	min-height: 64px;
}

.entity-list-recent-content {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	width: 100%;
}

.entity-list-recent-label {
	flex: 0 0 auto;
	color: #667789;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0;
}

.entity-list-recent-pill-list {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: 8px;
	height: 33px;
	min-width: 0;
	overflow: visible;
	flex: 1 1 auto;
}

.entity-list-recent-pill {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	gap: 7px;
	max-width: 220px;
	height: 33px;
	padding: 0 11px 0 7px;
	border: 1px solid rgba(36, 56, 77, 0.12);
	border-radius: 999px;
	background: #f3f3f3;
	color: #24384d;
	box-shadow: 0 1px 2px rgba(13, 29, 48, 0.04);
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	font-size: 11.5px;
	font-weight: 700;
	transition: background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.entity-list-recent-pill-hidden {
	display: none !important;
}

.entity-list-recent-pill:hover,
.entity-list-recent-pill:focus-visible {
	background: #eef3f8;
	border-color: #b7c5d7;
	box-shadow: 0 6px 16px rgba(13, 29, 48, 0.08);
	transform: translateY(-1px);
	outline: none;
}

.entity-list-recent-avatar {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	flex: 0 0 20px;
	overflow: hidden;
	border-radius: 50%;
	color: #ffffff;
	font-size: 8.5px;
	font-weight: 700;
	line-height: 1;
	text-transform: uppercase;
}

.entity-list-recent-avatar span {
	position: relative;
	z-index: 1;
}

.entity-list-recent-avatar-image {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	object-fit: cover;
}

.entity-list-recent-pill-name {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.entity-list-quick-filter-inline-prompt {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9000;
	width: 360px;
	max-width: calc(100vw - 24px);
	margin: 0;
	padding: 20px 15px 15px;
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 9px;
	box-shadow: 0 14px 40px rgba(11, 28, 49, 0.18);
	box-sizing: border-box;
}

.entity-list-quick-filter-pill-list {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	min-width: 0;
	flex: 1 1 auto;
}

.entity-list-quick-filter-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
}

.entity-list-quick-filter-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 36px;
	padding: 0 12px;
	border-radius: 8px;
	border: 1px solid #ccd4df;
	background: #ffffff;
	color: #24384d;
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 600;
	transition: background 0.16s ease, border-color 0.16s ease;
}

.entity-list-quick-filter-pill.active,
.entity-list-quick-filter-pill-advanced.active {
	background: #e9f2ff;
	border-color: #8cb2e5;
	color: #0d417c;
}

.entity-list-quick-filter-pill:hover {
	background: #f7faff;
	border-color: #b7c5d7;
}

.entity-list-quick-filter-pill-label {
	white-space: nowrap;
}

.entity-list-quick-filter-pill-remove {
	font-size: 16px;
	line-height: 1;
	color: #7d8a98;
}

.entity-list-quick-filter-pill-add {
	border-style: dashed;
	color: #4c6076;
}

.entity-list-quick-filter-action {
	height: 34px;
	padding: 0 12px;
	border: none;
	border-radius: 8px;
	background: transparent;
	color: #526273;
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 500;
}

.entity-list-quick-filter-action:hover {
	background: rgba(0, 0, 0, 0.05);
}

.entity-list-quick-filter-action-primary {
	background: #ffffff;
	box-shadow: inset 0 0 0 1px #e4e4e4;
}

.entity-list-quick-filter-action-primary:disabled {
	opacity: 0.45;
	cursor: default;
}

.entity-list-quick-filter-action-danger {
	background: #fff1f1;
	color: #a53232;
	box-shadow: inset 0 0 0 1px rgba(165, 50, 50, 0.16);
}

.entity-list-quick-filter-action-danger:hover {
	background: #ffe3e3;
}

.entity-list-quick-filter-action-danger:disabled {
	opacity: 0.55;
	cursor: default;
	background: #fff1f1;
}

.entity-list-quick-filter-popover {
	width: 265px;
	max-width: calc(100vw - 24px);
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 9px;
	box-shadow: 0 14px 40px rgba(11, 28, 49, 0.18);
	padding: 20px 15px 15px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 10px;
	overflow: hidden;
}

.entity-list-quick-filter-default-filter-section {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	align-self: stretch;
}

.entity-list-quick-filter-default-filter-heading {
	color: #6E6E6E;
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	letter-spacing: -0.02em;
	line-height: 18px;
	padding-bottom: 8px;
}

.entity-list-quick-filter-default-filter {
	display: flex;
	align-items: center;
	width: 100%;
	height: 34px;
	min-height: 34px;
	padding: 0 10px;
	border: 1px solid #C6C6C6;
	border-radius: 10px;
	background: #F3F3F3;
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	text-align: left;
	box-sizing: border-box;
	flex-shrink: 0;
}

.entity-list-quick-filter-default-filter-value {
	flex: 1;
	color: rgba(0, 0, 0, 0.5);
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
}

.entity-list-quick-filter-default-filter-icon {
	flex-shrink: 0;
	width: 15px;
	height: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.entity-list-quick-filter-default-filter-icon svg {
	width: 15px;
	height: auto;
}

.entity-list-quick-filter-popover-divider {
	width: 100%;
	height: 0.5px;
	background: rgba(0, 0, 0, 0.1);
	flex-shrink: 0;
}

.entity-list-quick-filter-default-filter-section .entity-list-quick-filter-popover-divider {
	margin-top: 10px;
}

.entity-list-quick-filter-picker-search {
	display: block;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	height: 34px;
	min-height: 34px;
	flex-shrink: 0;
	padding: 0 10px;
	border: 1px solid #C6C6C6;
	border-radius: 10px;
	background: transparent;
	box-shadow: none;
	appearance: none;
	-webkit-appearance: none;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	color: rgba(0, 0, 0, 0.5);
	outline: none;
}

.entity-list-quick-filter-picker-search::placeholder {
	color: rgba(0, 0, 0, 0.5);
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
}

.entity-list-quick-filter-editor-input,
.entity-list-quick-save-input,
.entity-list-quick-option-picker-input {
	width: 100%;
	box-sizing: border-box;
	height: 34px;
	padding: 0 10px;
	border: 1px solid #C6C6C6;
	border-radius: 10px;
	background: transparent;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	outline: none;
}

.entity-list-quick-filter-picker-search:focus {
	border-color: #999;
}

.entity-list-quick-filter-picker-search::-webkit-search-cancel-button,
.entity-list-quick-filter-picker-search::-webkit-search-decoration,
.entity-list-quick-filter-picker-search::-webkit-search-results-button,
.entity-list-quick-filter-picker-search::-webkit-search-results-decoration {
	-webkit-appearance: none;
	appearance: none;
	display: none;
}

.entity-list-quick-filter-editor-input:focus,
.entity-list-quick-save-input:focus,
.entity-list-quick-option-picker-input:focus {
	border-color: #999;
	background: #ffffff;
}

.entity-list-quick-filter-picker-list {
	display: flex;
	flex-direction: column;
	gap: 5px;
	overflow-y: auto;
}

.entity-list-default-filter-picker-list {
	display: flex;
	flex-direction: column;
	gap: 6px;
	overflow-y: auto;
}

.entity-list-quick-filter-picker-item {
	display: flex;
	align-items: center;
	width: 100%;
	height: 34px;
	padding: 0 10px;
	border: none;
	border-radius: 10px;
	background: #F3F3F3;
	color: rgba(0, 0, 0, 0.7);
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	text-align: left;
	box-sizing: border-box;
	flex-shrink: 0;
}

.entity-list-quick-filter-picker-item:hover {
	background: #eaeaea;
}

.entity-list-quick-filter-picker-item-expand {
	background: #F3F3F3;
	border: 1px dashed rgba(0, 0, 0, 0.2);
	justify-content: space-between;
	margin-top: -5px;
}

.entity-list-quick-filter-picker-item-expand .entity-list-quick-filter-picker-item-label {
	color: rgba(0, 0, 0, 0.4);
	font-weight: 500;
}

.entity-list-quick-filter-picker-item-expand::after {
	content: '';
	width: 17px;
	height: 17px;
	flex-shrink: 0;
	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 6L15 12L9 18' stroke='%2300000066' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-size: contain;
	background-repeat: no-repeat;
}

.entity-list-quick-filter-picker-item-advanced,
.entity-list-quick-filter-picker-item-advanced:hover {
	background: transparent;
	border: none;
	gap: 5px;
	height: auto;
	padding: 0;
}

.entity-list-quick-filter-picker-item-advanced .entity-list-quick-filter-picker-item-label {
	color: rgba(0, 0, 0, 0.4);
	font-weight: 500;
}

.entity-list-quick-filter-picker-item-advanced::before {
	content: '';
	width: 16px;
	height: 16px;
	flex-shrink: 0;
	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 5V19M5 12H19' stroke='%2300000066' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-size: contain;
	background-repeat: no-repeat;
}

.entity-list-default-filter-picker-section-label {
	display: none;
}

.entity-list-default-filter-picker-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	max-height: 360px;
	overflow-y: auto;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.entity-list-default-filter-picker-list::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}

.entity-list-default-filter-picker-items {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.entity-list-default-filter-picker-item {
	display: flex;
	align-items: center;
	width: 100%;
	height: 34px;
	padding: 0 10px;
	border: none;
	border-radius: 10px;
	background: #F3F3F3;
	color: rgba(0, 0, 0, 0.7);
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	text-align: left;
	box-sizing: border-box;
	flex-shrink: 0;
}

.entity-list-default-filter-picker-item-wrap {
	position: relative;
	width: 100%;
}

.entity-list-default-filter-picker-item-with-delete {
	padding-right: 38px;
}

.entity-list-default-filter-picker-item-label {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.entity-list-default-filter-picker-item-delete {
	position: absolute;
	top: 50%;
	right: 5px;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	padding: 0;
	border: none;
	border-radius: 7px;
	background: transparent;
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.15s ease, visibility 0.15s ease, background-color 0.15s ease;
}

.entity-list-default-filter-picker-item-delete::before {
	content: '';
	width: 14px;
	height: 14px;
	background: center / contain no-repeat url('/images/icons/notes/trash-toolbar-icon.svg');
	opacity: 0.6;
}

.entity-list-default-filter-picker-item-wrap-deletable:hover .entity-list-default-filter-picker-item-delete,
.entity-list-default-filter-picker-item-wrap-deletable:focus-within .entity-list-default-filter-picker-item-delete {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.entity-list-default-filter-picker-item:hover {
	background: #eaeaea;
}

.entity-list-default-filter-picker-item-delete:hover,
.entity-list-default-filter-picker-item-delete:focus {
	background: rgba(0, 0, 0, 0.06);
	outline: none;
}

.entity-list-default-filter-picker-item-delete:hover::before,
.entity-list-default-filter-picker-item-delete:focus::before {
	opacity: 0.85;
}

.entity-list-inline-decision-panel {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 2px 1px 1px;
}

.entity-list-inline-decision-panel-title {
	color: #202020;
	font-family: 'Manrope', sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 20px;
}

.entity-list-inline-decision-panel-message {
	color: rgba(0, 0, 0, 0.68);
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	line-height: 19px;
}

.entity-list-inline-decision-panel-actions {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	flex-wrap: wrap;
}

.entity-list-inline-decision-panel-actions .entity-list-quick-filter-action {
	background: #f3f3f3;
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.05);
}

.entity-list-inline-decision-panel-actions .entity-list-quick-filter-action:hover {
	background: #ebebeb;
}

.entity-list-inline-decision-panel-actions .entity-list-quick-filter-action-primary,
.entity-list-inline-decision-panel-actions .entity-list-quick-filter-action-primary:hover,
.entity-list-inline-decision-panel-actions .entity-list-quick-filter-action-primary:disabled {
	background: #ffffff;
	box-shadow: inset 0 0 0 1px #e4e4e4;
}

.entity-list-inline-decision-panel-actions .entity-list-quick-filter-action-danger,
.entity-list-inline-decision-panel-actions .entity-list-quick-filter-action-danger:hover,
.entity-list-inline-decision-panel-actions .entity-list-quick-filter-action-danger:disabled {
	box-shadow: inset 0 0 0 1px rgba(165, 50, 50, 0.16);
}

.entity-list-default-filter-picker-item.selected {
	background: #e9f2ff;
	color: #0d417c;
	box-shadow: inset 0 0 0 1px #8cb2e5;
}

.entity-list-default-filter-picker-section-toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 34px;
	padding: 0 10px;
	border: 1px dashed rgba(0, 0, 0, 0.2);
	border-radius: 10px;
	background: #F3F3F3;
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	text-align: left;
	box-sizing: border-box;
	flex-shrink: 0;
	color: rgba(0, 0, 0, 0.75); /* #1609 CON-124: 0.4 is this app's disabled look, and the row is live */
}

.entity-list-default-filter-picker-section-toggle:hover {
	background: #eaeaea;
}

.entity-list-default-filter-picker-section-toggle::after {
	content: '';
	width: 17px;
	height: 17px;
	flex-shrink: 0;
	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 6L15 12L9 18' stroke='%2300000066' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-size: contain;
	background-repeat: no-repeat;
}

.entity-list-default-filter-picker-section-toggle.expanded::after {
	transform: rotate(90deg);
}

.entity-list-default-filter-picker-empty {
	padding: 8px 10px 4px;
	color: rgba(0, 0, 0, 0.4);
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
}

.entity-list-quick-filter-picker-item-meta {
	color: rgba(0, 0, 0, 0.4);
	font-size: 11px;
	font-weight: 500;
	margin-left: auto;
}

.entity-list-quick-filter-picker-empty {
	padding: 10px 4px 4px;
	color: rgba(0, 0, 0, 0.4);
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
}

.entity-list-quick-filter-editor {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.entity-list-quick-filter-editor-header {
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: #6E6E6E;
	letter-spacing: -0.02em;
	line-height: 18px;
}

.entity-list-quick-filter-editor-remove {
	width: 100%;
	height: 34px;
	border: 1px dashed rgba(0, 0, 0, 0.15);
	border-radius: 10px;
	background: transparent;
	color: rgba(0, 0, 0, 0.4);
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 500;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.entity-list-quick-filter-editor-remove:hover {
	background: #fff1f1;
	color: #b44545;
	border-color: rgba(180, 69, 69, 0.3);
}

.entity-list-quick-filter-editor-operator-trigger {
	display: flex;
	align-items: center;
	width: 100%;
	height: 34px;
	min-height: 34px;
	padding: 0 10px;
	border: 1px solid #C6C6C6;
	border-radius: 10px;
	background: #F3F3F3;
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	text-align: left;
	box-sizing: border-box;
	flex-shrink: 0;
	transition: background 0.15s ease;
}

.entity-list-quick-filter-editor-operator-trigger:hover {
	background: #eaeaea;
}

.entity-list-quick-filter-editor-operator-label {
	flex: 1;
	color: rgba(0, 0, 0, 0.5);
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
}

.entity-list-quick-filter-editor-operator-icon {
	flex-shrink: 0;
	width: 15px;
	height: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.2s ease;
}

.entity-list-quick-filter-editor-operator-icon svg {
	width: 15px;
	height: auto;
}

.entity-list-quick-filter-editor-operator-icon.expanded {
	transform: rotate(90deg);
}

.entity-list-quick-filter-editor-operator-list {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin-top: 6px;
}

.entity-list-quick-filter-editor-operator-item {
	display: flex;
	align-items: center;
	width: 100%;
	height: 34px;
	padding: 0 10px;
	border: none;
	border-radius: 10px;
	background: #F3F3F3;
	color: rgba(0, 0, 0, 0.7);
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	text-align: left;
	box-sizing: border-box;
	flex-shrink: 0;
	transition: background 0.15s ease;
}

.entity-list-quick-filter-editor-operator-item:hover {
	background: #eaeaea;
}

.entity-list-quick-filter-editor-operator-item.selected {
	background: #e9f2ff;
	color: #0d417c;
	box-shadow: inset 0 0 0 1px #8cb2e5;
}

/* ── Entity picker inline overrides inside criterion editor ── */

.entity-list-quick-filter-editor .sfb-entity-picker {
	position: relative;
}

.entity-list-quick-filter-editor .sfb-entity-picker-trigger {
	display: none;
}

.entity-list-quick-filter-editor .sfb-entity-picker-dropdown {
	display: block !important;
	position: static;
	margin-top: 0;
	border: none;
	border-radius: 0;
	box-shadow: none;
	z-index: auto;
	overflow: visible;
	background: transparent;
}

.entity-list-quick-filter-editor .sfb-entity-picker-search-wrap {
	padding: 0;
	border-bottom: none;
	position: relative;
}

.entity-list-quick-filter-editor .sfb-entity-picker-search-input {
	height: 34px;
	padding: 0 28px 0 10px;
	border: 1px solid #C6C6C6;
	border-radius: 10px;
	background: transparent;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	color: rgba(0, 0, 0, 0.5);
}

.entity-list-quick-filter-editor .sfb-entity-picker-search-input:focus {
	border-color: #999;
	background: #ffffff;
}

.entity-list-quick-filter-editor .sfb-entity-picker-search-clear {
	right: 8px;
}

.entity-list-quick-filter-editor .sfb-entity-picker-results {
	display: flex;
	flex-direction: column;
	gap: 5px;
	max-height: 220px;
	overflow-y: auto;
	margin-top: 8px;
	scrollbar-width: none;
	-ms-overflow-style: none;
	-webkit-overflow-scrolling: touch;
}

.entity-list-quick-filter-editor .sfb-entity-picker-results::-webkit-scrollbar {
	width: 0;
	height: 0;
	display: none;
}

.entity-list-quick-filter-editor .sfb-entity-picker-result-row {
	display: flex;
	align-items: center;
	height: 34px;
	padding: 0 10px;
	border-radius: 10px;
	background: #F3F3F3;
	color: rgba(0, 0, 0, 0.7);
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 500;
	border-bottom: none;
	flex-shrink: 0;
	transition: background 0.15s ease, box-shadow 0.15s ease;
}

.entity-list-quick-filter-editor .sfb-entity-picker-result-row:last-child {
	border-bottom: none;
}

.entity-list-quick-filter-editor .sfb-entity-picker-result-row:hover {
	background: #eaeaea;
}

.entity-list-quick-filter-editor .sfb-entity-picker-result-row.selected {
	background: #e9f2ff;
	box-shadow: inset 0 0 0 1px #8cb2e5;
	color: #0d417c;
	font-weight: 500;
}


.entity-list-quick-filter-editor .sfb-entity-chip {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	height: 28px;
	padding: 0 8px;
	background: #e9f2ff;
	border: none;
	box-shadow: inset 0 0 0 1px #8cb2e5;
	border-radius: 10px;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	color: #0d417c;
	font-weight: 500;
}

.entity-list-quick-filter-editor .sfb-entity-chip-remove {
	color: #8cb2e5;
	font-size: 14px;
}

.entity-list-quick-filter-editor .sfb-entity-chip-remove:hover {
	color: #c44;
}

.entity-list-quick-filter-editor .sfb-entity-picker-empty,
.entity-list-quick-filter-editor .sfb-entity-picker-loading {
	padding: 8px 10px;
	font-size: 12px;
	color: rgba(0, 0, 0, 0.4);
	text-align: left;
}

.entity-list-quick-option-picker-search {
	position: relative;
}

.entity-list-quick-option-picker-clear {
	position: absolute;
	top: 5px;
	right: 10px;
	border: none;
	background: transparent;
	color: #8592a3;
	cursor: pointer;
	font-size: 18px;
	line-height: 1;
}

.entity-list-quick-option-picker-results {
	display: flex;
	flex-direction: column;
	gap: 5px;
	max-height: 220px;
	overflow-y: auto;
	margin-top: 8px;
	scrollbar-width: none;
	-ms-overflow-style: none;
	-webkit-overflow-scrolling: touch;
}

.entity-list-quick-option-picker-results::-webkit-scrollbar {
	width: 0;
	height: 0;
	display: none;
}

.entity-list-quick-option-row {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 0 10px;
	height: 34px;
	border-radius: 10px;
	background: #F3F3F3;
	cursor: pointer;
	transition: background 0.15s ease, box-shadow 0.15s ease;
}

.entity-list-quick-option-row:hover {
	background: #eaeaea;
}

.entity-list-quick-option-row:has(input:checked) {
	background: #e9f2ff;
	box-shadow: inset 0 0 0 1px #8cb2e5;
}

.entity-list-quick-option-row input[type="checkbox"] {
	-webkit-appearance: none;
	appearance: none;
	width: 16px;
	height: 16px;
	min-width: 16px;
	border: 1.5px solid #C6C6C6;
	border-radius: 4px;
	background: #ffffff;
	cursor: pointer;
	margin: 0;
	position: relative;
	flex-shrink: 0;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.entity-list-quick-option-row input[type="checkbox"]:checked {
	background: #0d417c;
	border-color: #0d417c;
}

.entity-list-quick-option-row input[type="checkbox"]:checked::after {
	content: '';
	position: absolute;
	left: 4px;
	top: 1px;
	width: 5px;
	height: 9px;
	border: solid #ffffff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.entity-list-quick-option-row-label {
	flex: 1 1 auto;
	font-size: 12px;
	font-weight: 500;
	color: rgba(0, 0, 0, 0.7);
}

.entity-list-quick-option-row:has(input:checked) .entity-list-quick-option-row-label {
	color: #0d417c;
}

.entity-list-quick-option-picker-empty {
	display: none;
	margin-top: 8px;
	color: #7c8794;
	font-size: 12px;
}

.entity-list-quick-filter-advanced-popover {
	width: 580px;
	max-width: calc(100vw - 24px);
}

.entity-list-quick-filter-advanced-builder .adv-search-embedded-builder {
	padding: 0;
}

.entity-list-quick-filter-advanced-builder .adv-search-embedded-builder-root {
	margin-top: 0;
}

.entity-list-quick-save-dialog {
	padding: 6px 2px 2px;
}

.entity-list-quick-save-label {
	margin-bottom: 8px;
	color: #46596d;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 700;
}

.entity-list-layout-control,
.contact-tb-layout-control {
	display: flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
}

.entity-list-btn-layout,
.contact-tb-btn-layout {
	cursor: pointer;
	background-size: 25px 25px;
	background-repeat: no-repeat;
	background-position: center;
	width: 34px;
	height: 34px;
	background-color: transparent;
	background-image: url(/images/icons/layout-toolbar-icon.svg);
	transition: scale 0.2s var(--cal-arrive);
	flex-shrink: 0;
	position: relative;
	margin-left: -5px;
}

.entity-list-btn-layout:hover,
.contact-tb-btn-layout:hover {
	scale: 1.1;
}

.entity-list-btn-layout:focus,
.contact-tb-btn-layout:focus {
	outline: none;
}

.entity-list-btn-layout:focus-visible,
.contact-tb-btn-layout:focus-visible {
	outline: 2px solid #66afe9;
	outline-offset: 2px;
	border-radius: 4px;
}

.entity-list-layout-badge,
.contact-tb-layout-badge {
	position: absolute;
	top: 3px;
	right: 3px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #016ba5;
	border: 1px solid #fff;
	opacity: 0;
	transition: opacity 0.2s ease;
	pointer-events: none;
}

.entity-list-layout-control.has-custom-layout .entity-list-layout-badge,
.contact-tb-layout-control.has-custom-layout .contact-tb-layout-badge {
	opacity: 1;
}

.entity-list-layout-host,
.contact-tb-layout-host {
	display: none;
	align-items: center;
	position: relative;
}

.entity-list-layout-control.expanded .entity-list-layout-host,
.contact-tb-layout-control.expanded .contact-tb-layout-host {
	display: flex;
}

.entity-list-layout-inline-controls {
	display: flex;
	align-items: center;
	position: relative;
}

.entity-list-layout-compound {
	display: flex;
	align-items: center;
	border: 1px solid #ccc;
	border-radius: 5px;
	background: #fff;
	width: 280px;
	box-sizing: border-box;
}

.entity-list-layout-select-host {
	display: flex;
	align-items: center;
	flex: 1;
	min-width: 0;
}

.entity-list-layout-compound .entity-list-layout-select-host .custom_table_select {
	border: none;
	border-radius: 0;
	margin-right: 0;
	width: 100%;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23666' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center;
}

.entity-list-layout-compound .entity-list-layout-select-host:last-child .custom_table_select {
	margin-right: 0;
}

.entity-list-layout-select-host .custom_table_select,
.contact-tb-layout-host .custom_table_select {
	float: none;
	margin: 0;
	font-size: 14px;
	padding: 4px 8px;
	border: 1px solid #ccc;
	border-radius: 5px;
	background: white;
	cursor: pointer;
	outline: none;
	height: 31px;
	min-width: 165px;
}

.entity-list-layout-settings-wrap {
	position: relative;
	display: flex;
	align-items: center;
}

.entity-list-layout-settings-btn {
	width: 31px;
	height: 31px;
	padding: 0;
	border: none;
	border-left: 1px solid #ccc;
	border-radius: 0 4px 4px 0;
	background: transparent url(/images/icons/adjustments-horizontal-icon.svg) no-repeat center;
	background-size: 16px 16px;
	cursor: pointer;
	transition: background-color 0.12s ease;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.entity-list-layout-settings-btn:hover,
.entity-list-layout-settings-wrap:has(.entity-list-layout-settings-popover.open) .entity-list-layout-settings-btn {
	background-color: #EAEAEA;
}

.entity-list-layout-settings-btn:focus {
	outline: none;
}

.entity-list-layout-settings-btn:focus-visible {
	outline: 2px solid #66afe9;
	outline-offset: -2px;
}

.entity-list-layout-settings-btn.disabled,
.entity-list-layout-settings-btn:disabled {
	opacity: 0.55;
	cursor: default;
}

.entity-list-layout-settings-btn.disabled:hover,
.entity-list-layout-settings-btn:disabled:hover {
	background-color: transparent;
}

.entity-list-layout-settings-popover {
	display: none;
	position: absolute;
	top: calc(100% + 6px);
	right: 0;
	width: 280px;
	padding: 20px 15px 15px;
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 9px;
	box-shadow: 0 14px 40px rgba(11, 28, 49, 0.18);
	overflow: hidden;
	z-index: 18;
	box-sizing: border-box;
}

.entity-list-layout-settings-popover.open {
	display: block;
}

.entity-list-layout-settings-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 0 0 8px;
}

.entity-list-layout-settings-popover .sfb-collapsible-title {
	font-size: 14px;
	font-weight: 400;
	color: #6E6E6E;
	letter-spacing: -0.02em;
	flex: 1 1 auto;
	min-width: 0;
}

.entity-list-layout-settings-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex: 0 0 auto;
}

/* #1608 TSK-030: sits beside Delete layout in the same row and shares its idiom -
   an icon that reveals its label on hover, so the row stays quiet until used. */
.entity-list-layout-settings-save-as {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	gap: 6px;
	width: 28px;
	max-width: 28px;
	height: 28px;
	padding: 0 7px;
	border: none;
	border-radius: 8px;
	background: transparent;
	color: rgba(0, 0, 0, 0.42);
	cursor: pointer;
	overflow: hidden;
	white-space: nowrap;
	box-sizing: border-box;
	transition: max-width 0.18s ease, width 0.18s ease, background-color 0.18s ease, color 0.18s ease;
}

.entity-list-layout-settings-save-as::before {
	content: '';
	width: 14px;
	min-width: 14px;
	height: 14px;
	background: center / contain no-repeat url('/images/icons/layout-toolbar-icon.svg');
	opacity: 0.62;
	flex: 0 0 auto;
}

.entity-list-layout-settings-save-as-label {
	opacity: 0;
	max-width: 0;
	overflow: hidden;
	color: rgba(0, 0, 0, 0.52);
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	transform: translateX(-4px);
	transition: opacity 0.16s ease, max-width 0.18s ease, transform 0.18s ease;
}

.entity-list-layout-settings-save-as:hover,
.entity-list-layout-settings-save-as:focus-visible {
	width: 128px;
	max-width: 128px;
	background: #f3f3f3;
	color: rgba(0, 0, 0, 0.58);
	outline: none;
}

.entity-list-layout-settings-save-as:hover .entity-list-layout-settings-save-as-label,
.entity-list-layout-settings-save-as:focus-visible .entity-list-layout-settings-save-as-label {
	opacity: 1;
	max-width: 96px;
	transform: translateX(0);
}

.entity-list-layout-settings-save-as:hover::before,
.entity-list-layout-settings-save-as:focus-visible::before {
	opacity: 0.82;
}

.entity-list-layout-settings-save-as.disabled,
.entity-list-layout-settings-save-as:disabled {
	opacity: 0.45;
	cursor: default;
}

.entity-list-layout-settings-delete {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	gap: 6px;
	width: 28px;
	max-width: 28px;
	height: 28px;
	padding: 0 7px;
	border: none;
	border-radius: 8px;
	background: transparent;
	color: rgba(0, 0, 0, 0.42);
	cursor: pointer;
	overflow: hidden;
	white-space: nowrap;
	box-sizing: border-box;
	transition: max-width 0.18s ease, width 0.18s ease, background-color 0.18s ease, color 0.18s ease;
}

.entity-list-layout-settings-delete::before {
	content: '';
	width: 14px;
	min-width: 14px;
	height: 14px;
	background: center / contain no-repeat url('/images/icons/notes/trash-toolbar-icon.svg');
	opacity: 0.62;
	flex: 0 0 auto;
}

.entity-list-layout-settings-delete-label {
	opacity: 0;
	max-width: 0;
	overflow: hidden;
	color: rgba(0, 0, 0, 0.52);
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	transform: translateX(-4px);
	transition: opacity 0.16s ease, max-width 0.18s ease, transform 0.18s ease;
}

.entity-list-layout-settings-delete:hover,
.entity-list-layout-settings-delete:focus-visible {
	width: 108px;
	max-width: 108px;
	background: #f3f3f3;
	color: rgba(0, 0, 0, 0.58);
	outline: none;
}

.entity-list-layout-settings-delete:hover::before,
.entity-list-layout-settings-delete:focus-visible::before {
	opacity: 0.82;
}

.entity-list-layout-settings-delete:hover .entity-list-layout-settings-delete-label,
.entity-list-layout-settings-delete:focus-visible .entity-list-layout-settings-delete-label {
	opacity: 1;
	max-width: 74px;
	transform: translateX(0);
}

.entity-list-layout-settings-delete.disabled,
.entity-list-layout-settings-delete:disabled {
	cursor: default;
	opacity: 0.45;
}

.entity-list-layout-settings-delete.disabled:hover,
.entity-list-layout-settings-delete:disabled:hover,
.entity-list-layout-settings-delete.disabled:focus-visible,
.entity-list-layout-settings-delete:disabled:focus-visible {
	width: 28px;
	max-width: 28px;
	background: transparent;
	color: rgba(0, 0, 0, 0.42);
}

.entity-list-layout-settings-delete.disabled .entity-list-layout-settings-delete-label,
.entity-list-layout-settings-delete:disabled .entity-list-layout-settings-delete-label {
	opacity: 0;
	max-width: 0;
	transform: translateX(-4px);
}

.entity-list-layout-settings-popover .sfb-field-filter-wrap {
	margin-bottom: 0;
}

.entity-list-layout-settings-popover .sfb-field-filter-input {
	border-radius: 10px;
	border: 1px solid #C6C6C6;
	height: 34px;
	font-size: 11px;
	padding: 0 24px 0 10px;
	background: transparent;
	box-sizing: border-box;
}

.entity-list-layout-settings-popover .sfb-field-filter-input:focus {
	border-color: #aaa;
}

.entity-list-layout-settings-popover .sfb-field-toggle-list {
	max-height: 280px;
	margin-top: 10px;
	border: none;
	border-radius: 0;
	background: transparent;
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.entity-list-layout-settings-popover .sfb-field-toggle-row {
	background: #F3F3F3;
	border-radius: 10px;
	border-bottom: none;
	height: 34px;
	min-height: 34px;
	padding: 0 10px;
	color: rgba(0, 0, 0, 0.7);
	gap: 8px;
	box-sizing: border-box;
	flex-shrink: 0;
}

.entity-list-layout-settings-popover .sfb-field-toggle-row:last-child {
	border-bottom: none;
}

.entity-list-layout-settings-popover .sfb-field-toggle-row:hover {
	background: #EBEBEB;
}

.entity-list-layout-settings-popover .sfb-field-toggle-list .ui-sortable-helper {
	background: #fff;
	box-shadow: 0 14px 40px rgba(11, 28, 49, 0.18);
	border-radius: 10px;
}

.entity-list-layout-settings-popover .sfb-field-toggle-row-placeholder {
	border-radius: 10px;
	height: 34px;
}

.entity-list-container table.generalized_types_datatable th.gtd-field-hydrating,
.entity-list-container table.generalized_types_datatable td.gtd-field-hydrating {
	position: relative;
}

.entity-list-container table.generalized_types_datatable .gtd-field-hydrating-pill {
	display: block;
	width: 100%;
	height: 12px;
	border-radius: 999px;
	background: linear-gradient(90deg, #eef2f7 0%, #dce4ee 50%, #eef2f7 100%);
	background-size: 220% 100%;
	animation: entity-list-field-hydrate 1.15s ease-in-out infinite;
}

.entity-list-container table.generalized_types_datatable th.gtd-field-hydrating .gtd-field-hydrating-pill {
	height: 10px;
}

@keyframes entity-list-field-hydrate {
	0% {
		background-position: 100% 0;
	}
	100% {
		background-position: -100% 0;
	}
}

.entity-list-create-button {
	color: white;
	border: none;
	border-radius: 8px;
	padding: 0px 20px;
	cursor: pointer;
	height: 37px;
	min-width: var(--workspace-primary-action-min-width);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	white-space: nowrap;
	flex-shrink: 0;
	font: inherit;
}

.entity-list-create-button-text {
	font-weight: inherit;
	color: #ffffff;
}

/* Recoloured by token, so it keeps the dimensional face. */
.entity-list-save-view-button {
	--btn-fill: #3b82f6;
	--btn-fill-hover: #2563eb;
	--btn-border: rgba(23, 63, 122, 0.24);
	--btn-underside: rgba(19, 56, 112, 0.24);
	--btn-shadow-hue: 21, 54, 105;
}

/* Contact expandable search - collapsed state (default) */
.entity-list-search-wrapper,
.contact-tb-search-wrapper {
	display: flex;
	flex-flow: row;
	justify-content: center;
	align-items: center;
	background-color: transparent;
	border: none;
	width: 34px;
	min-width: 34px;
	padding: 0;
	overflow: visible;
	height: 34px;
	box-sizing: border-box;
	gap: 0;
	cursor: pointer;
	transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            min-width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            padding 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            border-radius 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            gap 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            margin-left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	overflow: hidden;
	flex-shrink: 0;
	margin-left: -5px;
}

/* Contact expandable search - expanded state */
.entity-list-search-wrapper.expanded,
.contact-tb-search-wrapper.expanded {
	width: 250px;
	min-width: 150px;
	padding: 0 12px;
	border-radius: 5px;
	background-color: #ffffff;
	justify-content: flex-start;
	gap: 8px;
	cursor: text;
	margin-left: 0;
}

/* Contact search input - hidden when collapsed */
.entity-list-search-wrapper input.entity-list-search-input,
.contact-tb-search-wrapper input.contact-tb-search-input {
	color: #555555;
	outline: none;
	border: none;
	font-size: 14px;
	background: transparent;
	width: 0;
	opacity: 0;
	flex-grow: 0;
	padding: 0;
	transition: opacity 0.2s ease 0.1s, width 0.3s cubic-bezier(0.4, 0, 0.2, 1), flex-grow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Contact search input - visible when expanded */
.entity-list-search-wrapper.expanded input.entity-list-search-input,
.contact-tb-search-wrapper.expanded input.contact-tb-search-input {
	width: auto;
	opacity: 1;
	flex-grow: 1;
}

.entity-list-search-wrapper input.entity-list-search-input::placeholder,
.contact-tb-search-wrapper input.contact-tb-search-input::placeholder {
	color: #888888;
}

/* Contact search icon */
.entity-list-search-icon,
.contact-tb-search-icon {
	background-image: url(/images/calendar/search.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	max-width: 25px;
	min-width: 25px;
	height: 25px;
	cursor: pointer;
	transition: scale 0.2s var(--cal-arrive);
	flex-shrink: 0;
}

.entity-list-search-icon:hover,
.contact-tb-search-icon:hover {
	scale: 1.1;
}

.entity-list-search-wrapper.expanded .entity-list-search-icon,
.contact-tb-search-wrapper.expanded .contact-tb-search-icon {
	max-width: 18px;
	min-width: 18px;
	height: 18px;
}

/* Hide DataTables native search UI inside contacts container */
.entity-list-container .dataTables_filter,
.contacts-container .dataTables_filter {
	display: none;
}

/* --- Contacts Main Content (flex column filling tab panel) --- */

.entity-list-main-content,
.contacts-main-content {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
}

/* --- Contacts Container --- */

.entity-list-container,
.contacts-container {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
	background: #F3F3F3;
	border-radius: 12px;
	padding: 10px 0 10px 14px;
}

.custom-entity-list-view {
	box-sizing: border-box;
	padding-bottom: 14px;
}

.custom-entity-list-container {
	padding-right: 14px;
}

.entity-list-container:has(.entity-list-scroll.gtd-wide-table-scroll),
.contacts-container:has(.contact-table-scroll.gtd-wide-table-scroll) {
	padding-bottom: 0;
}

.custom-entity-list-container:has(.entity-list-scroll.gtd-wide-table-scroll) {
	padding-right: 0;
}

.entity-list-container > div,
.contacts-container > div {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.entity-list-container .dataTables_wrapper,
.contacts-container .dataTables_wrapper {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.entity-list-container > div,
.contacts-container > div {
	flex: 1 1 0;
	min-height: 0;
	overflow: hidden;
}

.entity-list-container .entity-list-scroll,
.contacts-container .contact-table-scroll {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	scrollbar-gutter: stable;
}

.entity-list-container .entity-list-scroll.gtd-wide-table-scroll,
.contacts-container .contact-table-scroll.gtd-wide-table-scroll {
	overflow-x: auto;
	overflow-y: auto;
}

.entity-list-container .entity-list-scroll.gtd-wide-table-scroll:not(:has(tbody tr)),
.entity-list-container .dataTables_wrapper:not(:has(tbody tr)),
.contacts-container .contact-table-scroll.gtd-wide-table-scroll:not(:has(tbody tr)),
.contacts-container .dataTables_wrapper:not(:has(tbody tr)) {
	overflow-x: hidden;
}

.entity-list-container .entity-list-scroll::-webkit-scrollbar,
.entity-list-container .dataTables_wrapper::-webkit-scrollbar,
.contacts-container .contact-table-scroll::-webkit-scrollbar,
.contacts-container .dataTables_wrapper::-webkit-scrollbar,
.tasks-container .task-table-scroll::-webkit-scrollbar {
	width: 16px;
	height: 16px;
}

.entity-list-container .entity-list-scroll.gtd-wide-table-scroll::-webkit-scrollbar:horizontal,
.entity-list-container .dataTables_wrapper::-webkit-scrollbar:horizontal,
.contacts-container .dataTables_wrapper::-webkit-scrollbar:horizontal,
.contacts-container .contact-table-scroll.gtd-wide-table-scroll::-webkit-scrollbar:horizontal,
.tasks-container .task-table-scroll::-webkit-scrollbar:horizontal {
	background: #F3F3F3;
	height: 16px;
}

.entity-list-container .entity-list-scroll::-webkit-scrollbar-track,
.entity-list-container .dataTables_wrapper::-webkit-scrollbar-track,
.contacts-container .contact-table-scroll::-webkit-scrollbar-track,
.contacts-container .dataTables_wrapper::-webkit-scrollbar-track,
.tasks-container .task-table-scroll::-webkit-scrollbar-track {
	background: transparent;
	margin-top: 0;
}

.entity-list-container .entity-list-scroll.gtd-wide-table-scroll::-webkit-scrollbar-track:horizontal,
.entity-list-container .dataTables_wrapper::-webkit-scrollbar-track:horizontal,
.contacts-container .dataTables_wrapper::-webkit-scrollbar-track:horizontal,
.contacts-container .contact-table-scroll.gtd-wide-table-scroll::-webkit-scrollbar-track:horizontal,
.tasks-container .task-table-scroll::-webkit-scrollbar-track:horizontal {
	background: #F3F3F3;
}

.entity-list-container .entity-list-scroll::-webkit-scrollbar-thumb,
.entity-list-container .dataTables_wrapper::-webkit-scrollbar-thumb,
.contacts-container .contact-table-scroll::-webkit-scrollbar-thumb,
.contacts-container .dataTables_wrapper::-webkit-scrollbar-thumb,
.tasks-container .task-table-scroll::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.15);
	background-clip: content-box;
	border: 5px solid transparent;
	border-radius: 10px;
}

.entity-list-container .entity-list-scroll.gtd-wide-table-scroll::-webkit-scrollbar-thumb:horizontal,
.entity-list-container .dataTables_wrapper::-webkit-scrollbar-thumb:horizontal,
.contacts-container .dataTables_wrapper::-webkit-scrollbar-thumb:horizontal,
.contacts-container .contact-table-scroll.gtd-wide-table-scroll::-webkit-scrollbar-thumb:horizontal,
.tasks-container .task-table-scroll::-webkit-scrollbar-thumb:horizontal {
	border-color: #F3F3F3;
	border-width: 4px 2px;
	border-radius: 8px;
}

.entity-list-container .entity-list-scroll::-webkit-scrollbar-corner,
.entity-list-container .dataTables_wrapper::-webkit-scrollbar-corner,
.contacts-container .contact-table-scroll::-webkit-scrollbar-corner,
.contacts-container .dataTables_wrapper::-webkit-scrollbar-corner,
.tasks-container .task-table-scroll::-webkit-scrollbar-corner {
	background: transparent;
}

/* Hide pagination in infinite mode */
.entity-list-container .dataTables_wrapper > .dataTables_paginate,
.contacts-container .dataTables_wrapper > .dataTables_paginate {
	display: none !important;
}

/* Hide DataTables search — toolbar filter replaces it */
.entity-list-container .dataTables_filter,
.contacts-container .dataTables_filter {
	display: none;
}

/* Hide DataTables "Show entries" */
.entity-list-container .dataTables_length,
.contacts-container .dataTables_length {
	display: none;
}

/* Hide DataTables info inside container (moved outside by JS) */
.entity-list-container .dataTables_info,
.contacts-container .dataTables_info {
	display: none !important;
}

/* Moved info element — sits below the contacts container */
.entity-list-info,
.contact-table-info {
	display: block !important;
	flex-shrink: 0;
	padding: 4px 14px 0;
	font-size: 12px;
	color: #999;
}

/* Filter results — "Showing X of Y matching rows" footer below the table.
   Visually consistent with .filters-preview-meta in the filter-builder.
   Kept block-flow (not flex-shrink-pinned) so it sits flush below the
   rendered rows inside .dataTables_wrapper rather than at the bottom of
   the surrounding flex column. */
.filter-list-info {
	font-size: 12px;
	color: #666;
	padding: 6px 14px 4px;
}

/* Filter results — waterfall (infinite-scroll) sentinel + status.
   The sentinel is an invisible 1px-tall block at the bottom of the
   scroll viewport; an IntersectionObserver fires the next page when it
   comes into view. The status line surfaces "Loading more…" /
   "All loaded" cues without competing with the total-count footer. */
.filter-list-sentinel {
	width: 100%;
	height: 1px;
	pointer-events: none;
}

.filter-list-status {
	font-size: 12px;
	color: #888;
	padding: 4px 14px;
	text-align: right;
}
.filter-list-status.hidden {
	display: none;
}
.filter-list-status.loading {
	color: #555;
}
.filter-list-status.done {
	color: #aaa;
	font-style: italic;
}

/* --- Contacts Pill-Style Rows --- */

.entity-list-container table.table_builder,
.contacts-container table.table_builder {
	border-spacing: 0px 2px !important;
}

.entity-list-container table.table_builder tbody tr,
.contacts-container table.table_builder tbody tr {
	background-color: #ffffff;
	transition: background-color 0.15s ease;
}

.entity-list-container table.table_builder.table_builder_selectable_rows tbody tr:hover,
.entity-list-container table.table_builder.table_builder_selectable_rows tbody tr.contact-context-active,
.entity-list-container table.table_builder.table_builder_selectable_rows tbody tr.account-context-active,
.contacts-container table.table_builder.table_builder_selectable_rows tbody tr:hover,
.contacts-container table.table_builder.table_builder_selectable_rows tbody tr.contact-context-active,
.contacts-container table.table_builder.table_builder_selectable_rows tbody tr.account-context-active {
	background-color: rgba(0, 0, 0, 0.04);
}

.entity-list-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row,
.contacts-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row {
	background-color: #E9F2FF !important;
	color: #0D417C;
}
.entity-list-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row td,
.contacts-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row td {
	color: #0D417C;
	box-shadow: 0px 1px 0px 0px #8CB2E5 inset, 0px -1px 0px 0px #8CB2E5 inset;
}
.entity-list-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row td:first-child,
.contacts-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row td:first-child {
	box-shadow: 0px 1px 0px 0px #8CB2E5 inset, 0px -1px 0px 0px #8CB2E5 inset, 1px 0px 0px 0px #8CB2E5 inset;
}
.entity-list-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row td:last-child,
.contacts-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row td:last-child {
	box-shadow: 0px 1px 0px 0px #8CB2E5 inset, 0px -1px 0px 0px #8CB2E5 inset, -1px 0px 0px 0px #8CB2E5 inset;
}
.entity-list-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row a,
.contacts-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row a,
.entity-list-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row span,
.contacts-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row span {
	color: #0D417C !important;
}
.entity-list-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row:hover,
.contacts-container table.table_builder.table_builder_selectable_rows tbody tr.data_table_selected_row:hover {
	background-color: #DDEAF8 !important;
	color: #0D417C;
}

.entity-list-container table.table_builder tbody tr td:first-child,
.contacts-container table.table_builder tbody tr td:first-child {
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
}

.entity-list-container table.table_builder tbody tr td:last-child,
.contacts-container table.table_builder tbody tr td:last-child {
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
}

.entity-list-container table.table_builder tbody tr:not(:last-child) td,
.contacts-container table.table_builder tbody tr:not(:last-child) td {
	border-bottom: none;
}

.entity-list-container table.table_builder tbody tr td,
.contacts-container table.table_builder tbody tr td {
	padding: 5px 14px !important;
	font-size: 13px;
	height: 32px;
	vertical-align: middle;
}

.entity-list-container table.table_builder tbody tr td:empty::after,
.contacts-container table.table_builder tbody tr td:empty::after {
	content: 'No Data';
	color: #ddd;
	font-size: 12px;
	font-weight: 300;
	pointer-events: none;
}

.entity-list-container table.table_builder tbody tr td:first-child,
.contacts-container table.table_builder tbody tr td:first-child {
	font-weight: 500;
}

.entity-list-container table.table_builder tbody tr td:last-child,
.contacts-container table.table_builder tbody tr td:last-child {
	padding-right: 14px;
}

/* --- Contacts Sticky Headers --- */

.entity-list-container table.table_builder thead th,
.contacts-container table.table_builder thead th {
	font-size: 11px;
	font-weight: 500 !important;
	color: #999;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	padding: 4px 14px 10px !important;
	border-bottom: none !important;
	white-space: nowrap;
	position: sticky;
	top: 0;
	z-index: 2;
	background-color: #f3f3f3 !important;
}

.entity-list-container .entity-list-scroll.gtd-wide-table-sticky-options table.table_builder thead th.gdt_ops_col,
.contacts-container .contact-table-scroll.gtd-wide-table-sticky-options table.table_builder thead th.gdt_ops_col {
	position: sticky;
	right: 0;
	z-index: 4;
	background-color: #f3f3f3 !important;
	border-left: none;
	background-clip: padding-box;
}

.entity-list-container .entity-list-scroll.gtd-wide-table-sticky-options table.table_builder tbody td.gdt_ops_col,
.contacts-container .contact-table-scroll.gtd-wide-table-sticky-options table.table_builder tbody td.gdt_ops_col {
	position: sticky;
	right: 0;
	z-index: 1;
	background-color: #fff;
	border-left: 1px solid #f0f0f0;
	background-clip: padding-box;
}
.entity-list-container .entity-list-scroll.gtd-wide-table-sticky-options table.table_builder tbody tr.data_table_selected_row td.gdt_ops_col,
.contacts-container .contact-table-scroll.gtd-wide-table-sticky-options table.table_builder tbody tr.data_table_selected_row td.gdt_ops_col {
	background-color: #E9F2FF;
	border-left-color: #8CB2E5;
}
.entity-list-container .entity-list-scroll.gtd-wide-table-sticky-options table.table_builder tbody tr.data_table_selected_row:hover td.gdt_ops_col,
.contacts-container .contact-table-scroll.gtd-wide-table-sticky-options table.table_builder tbody tr.data_table_selected_row:hover td.gdt_ops_col {
	background-color: #DDEAF8;
}
.entity-list-container table.table_builder tbody tr.data_table_selected_row .dots_black,
.contacts-container table.table_builder tbody tr.data_table_selected_row .dots_black {
	background-image: url(/images/icons/3dots-blue-32.png);
}

.entity-list-container table.table_builder thead th,
.entity-list-container table.table_builder thead th *,
.entity-list-container table.dataTable thead th,
.entity-list-container table.dataTable thead th *,
.contacts-container table.table_builder thead th,
.contacts-container table.table_builder thead th *,
.contacts-container table.dataTable thead th,
.contacts-container table.dataTable thead th * {
	font-weight: 500 !important;
}

.entity-list-container table thead .sorting,
.entity-list-container table thead .sorting_asc,
.entity-list-container table thead .sorting_desc,
.contacts-container table thead .sorting,
.contacts-container table thead .sorting_asc,
.contacts-container table thead .sorting_desc {
	position: relative;
	padding-right: 22px !important;
	background-repeat: no-repeat !important;
	background-position: center right !important;
	background-size: 12px 12px !important;
}

.entity-list-container table thead .sorting,
.contacts-container table thead .sorting {
	background-image: url("/images/icons/sort_both.png") !important;
}

.entity-list-container table thead .sorting_asc,
.contacts-container table thead .sorting_asc {
	background-image: url("/images/icons/sort_asc.png") !important;
}

.entity-list-container table thead .sorting_desc,
.contacts-container table thead .sorting_desc {
	background-image: url("/images/icons/sort_desc.png") !important;
}

.entity-list-container table.table_builder thead tr th:hover,
.contacts-container table.table_builder thead tr th:hover {
	background-color: rgba(0, 0, 0, 0.02) !important;
	border-radius: 6px;
}

/* --- Contacts Infinite Scroll Status --- */

.entity-infinite-status,
.contact-infinite-status {
	text-align: center;
	padding: 12px;
	font-size: 13px;
	color: #999;
	display: none;
}

.entity-infinite-status.loading,
.contact-infinite-status.loading {
	display: block;
}

.entity-infinite-sentinel,
.contact-infinite-sentinel {
	height: 1px;
	visibility: hidden;
}

/* Tasks view flex layout wrapper */
.tasks-layout-wrapper {
	display: flex;
	gap: var(--workspace-layout-gap);
	width: 100%;
	height: 100%;
	min-height: 0;
	overflow: hidden;
}

.tasks-main-content {
	flex: 1 1 auto;
	min-width: 0;
	min-height: 0;
	display: flex;
	flex-direction: column;
}

.tasks-container.tasks-board-mode {
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
	padding-bottom: 5px;
}

.tasks-container.tasks-board-mode > .task-board {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
}

.tasks-container.tasks-board-mode > .task-board-loading {
	flex: 0 0 auto;
	display: block;
}

.task-board {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	width: 100%;
	flex: 1 1 auto;
	height: 100%;
	min-height: 0;
	overflow-x: auto;
	overflow-y: hidden;
	overscroll-behavior-x: contain;
	scroll-snap-type: none;
	padding-bottom: 5px;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.task-board::-webkit-scrollbar {
	display: none;
}

.task-board-scrollbar {
	display: none;
	position: relative;
	flex: 0 0 10px;
	height: 10px;
	margin: 0 2px;
	background: transparent;
	cursor: pointer;
	box-sizing: border-box;
}

.task-board-scrollbar.task-board-scrollbar-visible {
	display: block;
}

.task-board-scrollbar-thumb {
	position: absolute;
	left: 0;
	top: 2px;
	height: 6px;
	min-width: 44px;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.28);
	cursor: grab;
	will-change: transform;
}

.task-board-scrollbar-thumb:hover {
	background: rgba(0, 0, 0, 0.4);
}

.task-board-scrollbar.task-board-scrollbar-dragging .task-board-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.44);
	cursor: grabbing;
}

.task-board-column {
	flex: 1 1 240px;
	min-width: 240px;
	height: 100%;
	min-height: 0;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	background: #fafbfc;
	border: 1px solid #e8ecf1;
	border-radius: 10px;
	overflow: hidden;
}

.task-board-column.task-board-column-completed {
	background: #f8fdf9;
	border-color: #d5ead8;
}

.task-board-column-header {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 14px 14px 10px 14px;
}

.task-board-column-title {
	display: flex;
	align-items: center;
	gap: 7px;
	font-weight: 600;
	font-size: 13px;
	color: #1e293b;
	flex: 1;
}

.task-board-column-status-dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	flex-shrink: 0;
	background: #94a3b8;
}

.task-board-column[data-status-key="notstarted"] .task-board-column-status-dot {
	background: #94a3b8;
}

.task-board-column[data-status-key="inprogress"] .task-board-column-status-dot {
	background: #3b82f6;
}

.task-board-column[data-status-key="waitingonsomeoneelse"] .task-board-column-status-dot {
	background: #f59e0b;
}

.task-board-column[data-status-key="deferred"] .task-board-column-status-dot {
	background: #8b5cf6;
}

.task-board-column[data-status-key="completed"] .task-board-column-status-dot,
.task-board-column.task-board-column-completed .task-board-column-status-dot {
	background: #22c55e;
}

.task-board-column-count {
	font-weight: 600;
	font-size: 11px;
	color: #fff;
	background: var(--status-color, #94a3b8);
	border-radius: 6px;
	padding: 1px 8px;
	min-width: 20px;
	text-align: center;
}

.task-board-column-actions {
	padding: 0 14px 10px 14px;
}

.task-board-add-btn {
	width: 100%;
	border-radius: 8px;
	border: 1.5px dashed #d0d5dd;
	background: transparent;
	padding: 8px 12px;
	font-size: 13px;
	font-weight: 500;
	color: #94a3b8;
	cursor: pointer;
	touch-action: manipulation;
	transition: border-color 0.15s var(--cal-arrive), color 0.15s var(--cal-arrive), background-color 0.15s var(--cal-arrive);
}

.task-board-add-btn:hover {
	border-color: var(--status-color, #94a3b8);
	color: var(--status-color, #94a3b8);
}

.task-board-column-drop {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	padding: 0 12px 12px 12px;
	contain: layout paint;
	position: relative;
	background: inherit;
	border-radius: 0 0 10px 10px;
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.task-board-column-drop::-webkit-scrollbar {
	width: 0;
	height: 0;
	display: none;
}

.task-board-column-drop:empty::before {
	content: 'No tasks';
	display: block;
	text-align: center;
	padding: 32px 12px;
	font-size: 12px;
	color: #c0c9d4;
	font-weight: 500;
}

.task-board-drop-placeholder {
	display: none;
}

.task-board-drop-active .task-board-drop-placeholder {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	position: absolute;
	inset: 0;
	z-index: 1;
	border: 1.5px dashed #d0d5dd;
	border-radius: 8px;
	background: inherit;
}

.task-board-drop-placeholder-icon {
	color: var(--status-color, #c0c9d4);
}

.task-board-drop-placeholder-text {
	font-size: 18px;
	font-weight: 400;
	color: var(--status-color, #c0c9d4);
}

.task-board-drop-active.task-board-column-drop:empty::before {
	display: none;
}

.task-board-card {
	background: rgba(255, 255, 255, 0.9);
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 12px 12px 10px 12px;
	margin-bottom: 8px;
	cursor: pointer;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
	touch-action: manipulation;
	content-visibility: auto;
	contain-intrinsic-size: 180px;
	/* GSAP owns the entrance (the staggered cascade in appendBoardCardsFromStream) and
	   the settle pop after a drop, so `transform` is reserved for it. The hover lift and
	   the drag-origin shrink use the independent `translate:` / `scale:` properties. */
	transition: box-shadow 0.2s var(--cal-arrive), translate 0.2s var(--cal-arrive);
}

.task-board-card:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
	translate: 0 -1px;
}

.task-board-card.task-board-card-saving {
	opacity: 0.7;
}

.task-board-card.task-board-card-drag-origin {
	opacity: 0.3;
	scale: 0.97;
}

.task-board-dragging .task-board-card {
	transition: none !important;
	animation: none !important;
}

.task-board-drag-helper {
	background: #ffffff;
	border: 1px solid #93c5fd;
	border-radius: 8px;
	box-shadow: 0 8px 24px rgba(59, 130, 246, 0.15);
	padding: 8px 10px;
	pointer-events: none;
	contain: layout style paint;
	will-change: transform;
	opacity: 0.92;
}


.task-board-drag-helper-subject {
	font-weight: 600;
	font-size: 13px;
	line-height: 1.35;
	color: #1f3042;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.task-board-drag-helper-meta {
	margin-top: 4px;
	font-size: 11px;
	color: #52677d;
}

.task-board-drag-helper-active {
	opacity: 0.96;
}

.task-board-drag-helper-full {
	content-visibility: visible;
	contain-intrinsic-size: auto;
	border-color: #93c5fd;
	box-shadow: 0 8px 24px rgba(59, 130, 246, 0.15);
}

.task-board-card.task-board-card-completed-pending {
	border-color: #6bbf73;
	background: #f2fff3;
}

.task-board-card-subject {
	font-weight: 600;
	font-size: 13px;
	color: #1e293b;
	line-height: 1.4;
	height: calc(2 * 1.4em);
	margin-bottom: 10px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}


.task-board-card-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 8px;
}

.task-board-priority-pill {
	display: inline-flex;
	align-items: center;
	padding: 2px 10px;
	border-radius: 6px;
	font-size: 11px;
	font-weight: 600;
	line-height: 1.4;
	background: #f1f5f9;
	color: #64748b;
}

.task-board-priority-pill[data-priority="low"] {
	background: #f1f5f9;
	color: #64748b;
}

.task-board-priority-pill[data-priority="normal"] {
	background: #eff6ff;
	color: #2563eb;
}

.task-board-priority-pill[data-priority="high"] {
	background: #fef2f2;
	color: #dc2626;
}

.task-board-priority-pill[data-priority="none"] {
	background: #f8fafc;
	color: #94a3b8;
}

.task-board-card-menu-btn {
	background: none;
	border: none;
	cursor: pointer;
	color: #94a3b8;
	padding: 2px 4px;
	border-radius: 4px;
	line-height: 1;
}

.task-board-card-menu-btn:hover {
	background: #f1f5f9;
	color: #475569;
}

/* Shared kebab (three-dot) icon — SVG drawn via mask so it follows the
   button's text color (grey, darker on hover) */
.task-board-card-menu-btn::before,
.fc-settings-status-menu-btn::before {
	content: '';
	display: block;
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13Z' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 6C12.5523 6 13 5.55228 13 5C13 4.44772 12.5523 4 12 4C11.4477 4 11 4.44772 11 5C11 5.55228 11.4477 6 12 6Z' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 20C12.5523 20 13 19.5523 13 19C13 18.4477 12.5523 18 12 18C11.4477 18 11 18.4477 11 19C11 19.5523 11.4477 20 12 20Z' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13Z' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 6C12.5523 6 13 5.55228 13 5C13 4.44772 12.5523 4 12 4C11.4477 4 11 4.44772 11 5C11 5.55228 11.4477 6 12 6Z' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 20C12.5523 20 13 19.5523 13 19C13 18.4477 12.5523 18 12 18C11.4477 18 11 18.4477 11 19C11 19.5523 11.4477 20 12 20Z' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.task-board-card-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 10px;
}

.task-board-card-footer .task-board-date-due {
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 11px;
	color: #64748b;
	line-height: 1.3;
	background: #f1f5f9;
	padding: 4px 8px 4px 6px;
	border-radius: 6px;
}

.task-board-card-footer .task-board-date-due svg {
	width: 11px;
	height: 11px;
	flex-shrink: 0;
}

.task-board-attendees {
	display: flex;
	align-items: center;
	gap: 0;
}

.task-board-avatar {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 10px;
	font-weight: 600;
	color: #ffffff;
	flex-shrink: 0;
	margin-left: -8px;
	border: 2px solid #ffffff;
	text-transform: uppercase;
	overflow: hidden;
	line-height: 1;
}

.task-board-avatar:first-child {
	margin-left: 0;
}

.task-board-avatar-image {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	border-radius: 50%;
}

.task-board-avatar-overflow {
	background: #e2e8f0;
	color: #475569;
	font-size: 9px;
	font-weight: 700;
}

.task-board-avatar:not(.task-board-avatar-overflow):hover {
	transform: scale(1.15);
	z-index: 1;
}

.task-board-progress-track {
	height: 7px;
	background: #f1f5f9;
	border-radius: 999px;
	overflow: hidden;
}

.task-board-progress-fill {
	height: 100%;
	border-radius: 999px;
	background: #3b82f6;
	transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.task-board-card[data-due-state="overdue"] .task-board-progress-fill {
	background: #ef4444;
}

.task-board-card[data-due-state="today"] .task-board-progress-fill {
	background: #f59e0b;
}

.task-board-card[data-due-state="completed"] .task-board-progress-fill {
	background: #22c55e;
}

.task-board-progress-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 4px;
}

.task-board-progress-label {
	font-size: 11px;
	font-weight: 500;
	color: #64748b;
}

.task-board-progress-text {
	font-size: 10px;
	color: #94a3b8;
	font-weight: 500;
}

.task-board-complete-note {
	margin-top: 8px;
	padding: 6px 8px;
	border-radius: 8px;
	background: #dff8e0;
	font-size: 11px;
	color: #246e2b;
}

.task-board-loading {
	margin-top: 8px;
	font-size: 12px;
	color: #6f8194;
}

.tasks-container.tasks-board-mode.tasks-board-compact > .task-board,
.task-board.task-board-compact {
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
}

.tasks-container.tasks-board-mode.tasks-board-compact .task-board-column {
	flex: 0 0 84vw;
	width: 84vw;
	min-width: 240px;
	max-width: 320px;
	scroll-snap-align: start;
}

.tasks-container.tasks-board-mode.tasks-board-compact .task-board-column-header {
	padding: 12px 10px 8px 10px;
}

.tasks-container.tasks-board-mode.tasks-board-compact .task-board-column-actions {
	padding: 0 10px 8px 10px;
}

.tasks-container.tasks-board-mode.tasks-board-compact .task-board-column-drop {
	padding: 0 10px 10px 10px;
}

.tasks-container.tasks-board-mode.tasks-board-compact .task-board-add-btn {
	padding: 12px 10px;
}

.tasks-container.tasks-board-mode.tasks-board-compact .task-board-card {
	padding: 10px;
	border-radius: 8px;
	margin-bottom: 6px;
}

.tasks-container.tasks-board-mode.tasks-board-compact .task-board-card-subject {
	font-size: 14px;
	line-height: 1.4;
}

.tasks-container.tasks-board-mode.tasks-board-compact .task-board-avatar {
	width: 22px;
	height: 22px;
	font-size: 9px;
}

.tasks-container.tasks-board-mode.tasks-board-compact .task-board-card-footer .task-board-attendees {
	display: none;
}

@media screen and (max-width: 980px) {
	.tasks-layout-wrapper {
		flex-direction: column;
		height: auto;
		min-height: 0;
		gap: 10px;
		overflow: visible;
	}

	.tasks-main-content {
		min-height: 420px;
	}

	.tasks-layout-wrapper > .cal_ops_container {
		width: 100%;
		min-width: 0;
		flex: 0 0 auto;
	}

	.tasks-container.tasks-board-mode {
		min-height: 420px;
	}
}

/* Ops container as flex sibling in tasks view */
.tasks-layout-wrapper > .cal_ops_container {
	flex: 0 0 clamp(300px, 20vw, 360px);
	min-width: 300px;
	width: clamp(300px, 20vw, 360px);
	align-self: flex-start;  /* Only as tall as content */
	height: auto;  /* Override base height: 100% */
}


/** Calendar **/

/*
.cal-conflict-list span {

}
*/

.cal-conflict-list a {
	margin-left: 0;
	margin-right: 0;
}

.cal-allday-s {
	background: white;
	min-height: 22px;
	border-bottom: 1px solid #222;
}

.cal-allday-s > div {
	height: auto;
}

.cal-allday-s .fc-event-container {
	vertical-align: top;
}

.cal-allday-s table,
.cal-day-headers table {
	border-collapse: collapse !important;
	border-spacing: 0 !important;
}

.cal-allday-s .fc-bg table {
	border-right: 1px solid #ddd !important;
}

.cal-allday-s .fc-axis,
.cal-day-headers .fc-axis {
	padding: 4px !important;
	border: 1px solid #ddd !important;
	border-top: none !important;
	border-bottom: none !important;
}

.cal-allday-s td.fc-day {
	padding: 0 !important;
	border: 1px solid #ddd !important;
	border-top: none !important;
	border-bottom: none !important;
}

.cal-allday-s td.fc-day:last-child {
	border-right: 1px solid #ddd !important;
}

.cal-day-headers .fc-axis {
	border-color: transparent !important;
}

.cal-day-headers th.fc-day-header {
	padding: 4px 0 !important;
	border: 1px solid transparent !important;
	text-align: center;
}


.cal-day-headers th {
	padding: 4px 0 !important;
	text-align: center;
}


.cal-allday-s table > tbody > tr:last-child > td:last-child {
	padding-bottom: 15px !important;
}


/* #1608 TSK-014: a completed task's form is entirely read-only, so it says so rather than
   simply refusing every control without explanation. */
.entity-editor-readonly-note,
.task-editor-completed-note {
	margin: 0 0 12px;
	padding: 9px 12px;
	border: 1px solid #f0d8a8;
	border-radius: 4px;
	background: #fdf6e6;
	color: #6b5320;
	font-size: 12px;
	line-height: 1.45;
}

.act-completed {
	color: #00d700;
	padding-left: 0.5em;
}

.act-end-of-series {
	color: #c0392b;
	padding-left: 0.5em;
	font-weight: 600;
}

a.strike-through.fc-event {
	text-decoration: line-through;
}

a.strike-through.fc-event > div.fc-content > div {
	text-decoration: line-through;
}

a.fc-event.cal-activity.task {
	background-color: white;
	color: black;
	padding-right: 0;
}
.cal-activity.task > div.fc-content > div.priority {
	/*display: inline-block;*/
	border-left: 1px solid black;
	text-align: center;
	float: right;
	min-width: 20px;
}

.cal-btn-flr {
	margin-left: auto;
}

.cal_ops_container .tk_section_heading > input[type="checkbox"] {
	margin-left: auto;
	flex-shrink: 0;
}

.cal_ops_container .tk_section_heading > input[type="checkbox"] ~ .cal-btn-flr {
	margin-left: 6px;
}

.cal-activity.task.priority-low > div.fc-content > div.priority {
	background-color: #00ffff;
}
.cal-activity.task.priority-normal > div.fc-content > div.priority {
	background-color: #ffff00;
}
.cal-activity.task.priority-high > div.fc-content > div.priority {
	background-color: #ff0000;
	color: white;
}

/* No transition at rest: GSAP tweens opacity on these during entrance cascades and a
   stylesheet transition would re-ease every frame. The state classes below carry their
   own arrival transitions; leaving them is instant, which reads as release. */
.cal-activity {
	opacity: 1;
}

.cal-activity.fade {
	opacity: 0.5;
	transition: opacity 0.2s var(--cal-arrive);
}

.cal-activity.highlight {
    box-shadow: black 0px 5px 5px;
}

/* Search: pills that do not match dim immediately while the debounced rebuild waits. */
.cal-activity.cal-search-miss {
	opacity: 0.18;
	transition: opacity 0.15s var(--cal-arrive);
}


.calendar_layout {
	display: flex;
	align-items: stretch;
	width: 100%;
	min-height: 0;
	height: 100%;
	flex: 1 1 auto;
	gap: var(--workspace-layout-gap);
	overflow: hidden;
}

.calendar_layout .cal_fc_container,
.calendar_layout .cal_ops_container {
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 0;
}

.calendar_layout .cal_fc_container {
	flex: 1 1 auto;
	min-width: 0;
	height: 100%;
	min-height: 0;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

/* Calendar content wrapper - grows to fill container */
.calendar_layout .cal_fc_container .cal-content-wrapper {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0;
	width: 100%;
}

/* .fc grows to fill wrapper */
.calendar_layout .cal_fc_container .cal-content-wrapper .fc {
	flex: 1 1 auto;
	min-height: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
}

.calendar_layout .cal_fc_container > div:not(.fc-tb-clone) {
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
}

.calendar_layout .cal_fc_container .fc {
	flex: 1 1 auto;
	min-height: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
}

.calendar_layout .cal_fc_container .fc-view-container {
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
}

.calendar_layout .cal_fc_container .fc-view {
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
}

.calendar_layout .cal_fc_container .fc-scroller {
	flex: 1 1 auto;
	min-height: 0;
	overflow: auto;
}

.calendar_layout .cal_fc_container .fc-view {
	height: 100%;
}

.calendar_layout .cal_fc_container .fc-view > table {
	height: 100%;
}

/*
 * Month view can let its all-day grid flow inside the outer flex column, but
 * agenda/list scrollers must keep their own overflow. In particular, never
 * apply overflow: visible to .fc-time-grid-container; FullCalendar relies on
 * that element for week/day scrolling.
 */
.calendar_layout .fc-month-view .fc-day-grid-container {
	max-height: none;
	overflow: visible !important;
}

/* Month view: make all levels flex containers so rows can expand */
.calendar_layout .fc-month-view .fc-body {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
}

.calendar_layout .fc-month-view .fc-day-grid-container {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
}

.calendar_layout .fc-month-view .fc-day-grid {
	/* Content determines height - removed flex distribution */
}

.calendar_layout .fc-month-view .fc-day-grid .fc-row {
	min-height: 100px; /* Ensure empty rows have reasonable height */
}

/* Make month view table fill its container using flex layout */
.calendar_layout .fc-month-view > table {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	height: 100%;
}

.calendar_layout .fc-month-view > table > thead {
	flex: 0 0 auto;
}

.calendar_layout .fc-month-view > table > tbody {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
}

.calendar_layout .fc-month-view > table > tbody > tr {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
}

.calendar_layout .fc-month-view > table > tbody > tr > td {
	flex: 1 1 auto;
	position: relative; /* For absolute positioned scroller */
}

/* Scrollable container - absolute positioned to not affect parent sizing */
.calendar_layout .fc-month-view .fc-scroller.fc-day-grid-container {
	position: absolute !important;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	height: auto !important;
	max-height: none !important;
	overflow-y: auto !important;
	scrollbar-width: none;  /* Firefox */
	-ms-overflow-style: none;  /* IE/Edge */
}

.calendar_layout .fc-month-view .fc-scroller.fc-day-grid-container::-webkit-scrollbar {
	display: none;  /* Chrome, Safari, Opera */
}

.calendar_layout .cal_fc_container .cal-list-view {
	flex: 1 1 auto;
	min-height: 0;
	width: 100%;
	display: none;
	flex-direction: column;
	border: 1px solid #ddd;
	border-radius: 12px;
	overflow: hidden;
	box-sizing: border-box;
}

.calendar_layout .cal_fc_container .cal-list-scroller {
	flex: 1 1 auto;
	min-height: 0;
	max-height: none; /* Override .fc-scroller max-height: 73vh */
	overflow: auto;
	position: relative;
	background-color: #fff;
	scrollbar-width: none; /* Firefox */
	-ms-overflow-style: none; /* IE/Edge */
}

.calendar_layout .cal_fc_container .cal-list-scroller::-webkit-scrollbar {
	display: none; /* Chrome/Safari */
}

.calendar_layout .cal_fc_container .cal-list-table {
	width: 100%;
	display: flex;
	flex-direction: column;
	min-height: 100%;
}

.calendar_layout .cal_fc_container .cal-list-table tbody {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

.calendar_layout .cal_fc_container .cal-list-day-header {
	font-family: 'Manrope', sans-serif; font-weight: 500;
}

.calendar_layout .cal_fc_container .cal-list-day-header td {
	background-color: #f5f5f5;
}

.calendar_layout .cal_fc_container .cal-list-no-events td {
	color: #777;
	font-style: normal;
}

.calendar_layout .cal_fc_container .cal-list-no-events,
.calendar_layout .cal_fc_container .cal-list-no-events td {
	border: none !important;
}

.calendar_layout .cal_fc_container .cal-list-loading {
	display: none;
	text-align: center;
	padding: 6px 0;
	color: #666;
	font-size: 12px;
}

/* Sticky day header for list view */
.calendar_layout .cal_fc_container .cal-list-sticky-header {
	position: sticky;
	top: 0;
	z-index: 3;
	background-color: #F3F3F3;
	padding: 8px 14px;
	display: flex;
	align-items: baseline;
	gap: 4px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

/* #1605 CAL-008: a day header sitting at the top makes the sticky label a duplicate; keep the box, hide the text */
.calendar_layout .cal_fc_container .cal-list-sticky-header.cal-list-sticky-header-redundant {
	visibility: hidden;
}
.calendar_layout .cal_fc_container .cal-list-sticky-header-main {
	font-family: 'Manrope', sans-serif; font-weight: 700;
	font-size: 14px;
}

.calendar_layout .cal_fc_container .cal-list-sticky-header-main::after {
	content: ',';
}

.calendar_layout .cal_fc_container .cal-list-sticky-header-alt {
	font-family: 'Manrope', sans-serif; font-weight: 600;
	font-size: 14px;
	color: #666;
}

/* List view rows - true flexbox layout */
.calendar_layout .cal_fc_container .cal-list-item,
.calendar_layout .cal_fc_container .fc-list-heading,
.calendar_layout .cal_fc_container .cal-list-no-events {
	display: flex;
	align-items: center;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.calendar_layout .cal_fc_container .cal-list-item {
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.calendar_layout .cal_fc_container .cal-list-item:hover {
	background-color: rgba(0, 0, 0, 0.04);
}

/* List view cells - override table-cell display */
.calendar_layout .cal_fc_container .cal-list-item td,
.calendar_layout .cal_fc_container .fc-list-heading td,
.calendar_layout .cal_fc_container .cal-list-no-events td {
	display: block;
	box-sizing: border-box;
}

/* No events row - td fills full width */
.calendar_layout .cal_fc_container .cal-list-no-events td {
	flex: 1 1 auto;
	padding: 8px 14px;
	font-family: 'Manrope', sans-serif;
}

/* Time column - fixed width */
.calendar_layout .cal_fc_container .fc-list-item-time {
	flex: 0 0 155px;
	padding: 8px 14px;
	font-family: 'Manrope', sans-serif;
}

/* Marker column - fixed width */
.calendar_layout .cal_fc_container .fc-list-item-marker {
	flex: 0 0 30px;
	padding: 8px 0;
}

/* Title column - fills remaining space */
.calendar_layout .cal_fc_container .fc-list-item-title {
	flex: 1 1 auto;
	padding: 8px 14px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: 'Manrope', sans-serif; font-weight: 500;
}

/* Remove top border from list item cells (inherited from FullCalendar .fc td) */
.calendar_layout .cal_fc_container .cal-list-item td {
	border-top: none;
}

/* Day header - full width with proper internal layout */
.calendar_layout .cal_fc_container .fc-list-heading td {
	flex: 1 1 auto;
	padding: 10px 14px;
	display: flex;
	align-items: baseline;
	gap: 4px;
	font-family: 'Manrope', sans-serif; font-weight: 500;
}

/* Clear floats from FullCalendar defaults */
.calendar_layout .cal_fc_container .fc-list-heading-main,
.calendar_layout .cal_fc_container .fc-list-heading-alt {
	float: none;
	display: inline;
}

.calendar_layout .cal_fc_container .fc-list-heading-main {
	font-family: 'Manrope', sans-serif; font-weight: 700;
}

.calendar_layout .cal_fc_container .fc-list-heading-main::after {
	content: ',';
}

.calendar_layout .cal_fc_container .fc-list-heading-alt {
	font-family: 'Manrope', sans-serif; font-weight: 600;
}

/* List view day header - floating pill style */
.calendar_layout .cal_fc_container .fc-list-heading {
	margin: 20px 12px 8px 12px;
	border-radius: 8px;
	overflow: hidden;
	border: none !important;
}

.calendar_layout .cal_fc_container .fc-list-heading td {
	border-radius: 8px;
}

/* List view appointment items - floating pill style */
.calendar_layout .cal_fc_container .cal-list-item {
	margin: 1px 12px;
	border-radius: 8px;
	overflow: hidden;
	border: none !important;
}

/* #1701: a completed appointment reads as one in List view too, as its pill does in the grid.
   renderListAppointmentRow has always added .strike-through; nothing styled it. */
.calendar_layout .cal_fc_container .cal-list-item.strike-through {
	opacity: 0.6;
}
.calendar_layout .cal_fc_container .cal-list-item.strike-through .fc-list-item-time,
.calendar_layout .cal_fc_container .cal-list-item.strike-through .fc-list-item-title,
.calendar_layout .cal_fc_container .cal-list-item.strike-through .fc-list-item-title a {
	text-decoration: line-through;
}

.calendar_layout .ops_container {
	width: 100%;
	flex: 1 1 auto;
	min-height: 0;
	overflow: auto;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.calendar_layout .cal_ops_container .ops_container {
	width: 100%;
	flex: 1 1 0;
	min-height: 0;
	max-height: none;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	gap: 12px;
	max-height: none;
}

.calendar_layout .cal_ops_container table.wide {
	width: 100%;
}

.calendar_layout .cal_ops_container table.wide td {
	vertical-align: middle;
}

.cal-new-popup {
	z-index: 6; /* IE as usual */
	background-color: #fff;
}

.cal_ops_container {
	vertical-align: top;
	flex: 0 0 clamp(300px, 20vw, 360px);
	min-width: 300px;
	width: clamp(300px, 20vw, 360px);
	height: 100%;
	padding: 16px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	transition: width 0.2s ease;
	background-color: #F3F3F3;
	border-radius: 12px;
}

.cal_ops_container.display_none {
	display: none !important;
}

.cal_ops_container .tk_section_heading {
	margin: 0;
	height: auto;
	line-height: 1.4;
	padding: 12px 13px 12px 10px;
	background-color: #E8E8E8;
	color: #333333;
	font-family: 'Manrope', sans-serif; font-weight: 700;
	font-size: 12px;
	-webkit-text-stroke: 0.7px currentColor;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

/* Toggle switch for section heading checkbox */
.cal_ops_container .tk_section_heading input[type="checkbox"] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 32px;
	height: 18px;
	min-width: 32px;
	border: none;
	border-radius: 9px;
	background-color: #CCCCCC;
	cursor: pointer;
	position: relative;
	transition: background-color 200ms ease;
	margin: 0;
}

.cal_ops_container .tk_section_heading input[type="checkbox"]::after {
	content: '';
	position: absolute;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background-color: white;
	top: 2px;
	left: 2px;
	transition: transform 200ms ease;
	box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.cal_ops_container .tk_section_heading input[type="checkbox"]:checked {
	background-color: #00529b;
}

.cal_ops_container .tk_section_heading input[type="checkbox"]:checked::after {
	transform: translateX(14px);
}

.calendar_layout .cal_ops_container .ops_container > .mini_cal_container {
	flex: 0 0 auto;
}

/* Section wrapper styling - modular cards */
.calendar_layout .cal_ops_container .ops_container > .team_members_section {
	flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	background-color: #FFFFFF;
	border: 1px solid #E0E0E0;
	border-radius: 8px;
	overflow: hidden;
	padding: 10px;
}

.calendar_layout .cal_ops_container .ops_container > .appointment_types_section {
	/* Keep enough room for the heading plus a useful scroll viewport. At shorter
	   browser heights the whole options column scrolls instead of crushing this
	   list down to a few pixels. */
	/* #1661: shrink was 0, so this section could not give up the handful of pixels the rail
	   was over by - the sidebar overflowed and drew a full-height scrollbar beside all three
	   cards for an 8px overrun. It shrinks to its 180px floor now and its own list scrolls
	   from there, which is where the scrolling belongs. */
	flex: 1 1 180px;
	min-height: 180px;
	display: flex;
	flex-direction: column;
	background-color: #FFFFFF;
	border: 1px solid #E0E0E0;
	border-radius: 8px;
	overflow: hidden;
	padding: 10px;
}

/* Headings inside cards */
.team_members_section > .tk_section_heading,
.appointment_types_section > .tk_section_heading {
	flex: 0 0 auto;
}

.appointment_types_section > .tk_section_heading {
	margin-bottom: 8px;
}

.appointment_types_section > .tk_section_heading .cal-btn-flr {
	float: none;
	margin-top: 0;
	margin-left: 0;
	margin-right: 6px;
	order: 1;
}

.appointment_types_section > .tk_section_heading input[type="checkbox"] {
	margin-left: auto;
	order: 2;
}

.team_members_section > .cal_user_filter {
	flex: 0 0 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
	overflow: hidden;
}

/* Draggable splitter between the Team Members and Appointment Types panels */
.calendar_layout .cal_ops_container .ops_container > .cal-ops-splitter {
	flex: 0 0 auto;
	height: 12px;
	margin: 1px 0;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: row-resize;
	border-radius: 6px;
	transition: background-color 0.15s ease;
}
.calendar_layout .cal_ops_container .ops_container > .cal-ops-splitter:hover {
	background-color: rgba(0, 82, 155, 0.08);
}
.cal-ops-splitter > .cal-ops-splitter-grip {
	width: 36px;
	height: 4px;
	border-radius: 2px;
	background-color: #C7C7C7;
	transition: background-color 0.15s ease;
}
.calendar_layout .cal_ops_container .ops_container > .cal-ops-splitter:hover > .cal-ops-splitter-grip {
	background-color: #00529b;
}
body.cal-ops-resizing {
	cursor: row-resize !important;
	user-select: none !important;
}

/* When the user has dragged a custom height, the Team Members section is a fixed-height box and
   its FCUserFilter fills + scrolls inside it (instead of being capped by its own max-height). */
.calendar_layout .cal_ops_container .ops_container > .team_members_section.cal-team-resized > .cal_user_filter {
	flex: 1 1 0;
	min-height: 0;
	max-height: none;
	overflow-y: auto;
	-ms-overflow-style: none;
	scrollbar-width: none;
}
.calendar_layout .cal_ops_container .ops_container > .team_members_section.cal-team-resized > .cal_user_filter::-webkit-scrollbar {
	display: none;
}
.calendar_layout .cal_ops_container .ops_container > .team_members_section.cal-team-resized > .cal_user_filter > ul.cal_flt_users:not(.collapsible_content) {
	flex: 0 0 auto;
	max-height: none;
	overflow: visible;
}

.team_members_section .cal_user_filter ul.cal_ops_list {
	padding-left: 0;
	padding-right: 0;
}

.appointment_types_section > .cal_ops_list {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
}

.appointment_types_section > .cal_ops_list.cal_flt_appointment_types {
	flex: 1 1 0;
	min-height: 0;
	max-height: none !important;
}

/* Tasks view Team Members panel - expand to fit members, scroll when needed */
.tasks-layout-wrapper .cal_user_filter {
	max-height: none;
	overflow: hidden;
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
}

.tasks-layout-wrapper .cal_user_filter > ul.cal_ops_list:not(.collapsible_content),
.tasks-layout-wrapper .cal_user_filter > ul.cal_flt_users:not(.collapsible_content) {
	flex: 1 1 auto;
	min-height: 0;
	max-height: none;
	overflow-y: auto;
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.tasks-layout-wrapper .cal_user_filter > ul.cal_ops_list:not(.collapsible_content)::-webkit-scrollbar {
	display: none;
}

.tasks-layout-wrapper > .cal_ops_container > .ops_container > .cal_ops_list {
	flex: 1 1 auto;
}

/* Tasks tab Team Members section wrapper - matches Calendar tab styling */
.tasks-layout-wrapper > .cal_ops_container > .ops_container > .team_members_section {
	flex: 0 1 auto;
	display: flex;
	flex-direction: column;
	background-color: #FFFFFF;
	border: 1px solid #E0E0E0;
	border-radius: 8px;
	overflow: hidden;
	padding: 10px;
	max-height: 70vh;
}

.cal_ops_list {
    padding: 6px 6px 0 6px;
    margin: 0;
    min-height: 0;
    overflow-y: auto;
    background-color: #FFFFFF;
    border: 1px solid #E0E0E0;
    border-radius: 8px;
}

.cal_ops_list li {
	cursor: pointer;
    list-style-type: none;
    padding: 4px 10px;
    margin-bottom: 0;
    border-radius: 3px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    transition: background-color 150ms ease;
}

.cal_ops_list li:last-child {
    margin-bottom: 0;
}

.cal_ops_list li:hover {
    background-color: #F0F0F0;
}

/* Toggle switch styling for calendar sidebar */
.cal_ops_list li input[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 32px;
    height: 18px;
    min-width: 32px;
    border: none;
    border-radius: 9px;
    background-color: #CCCCCC;
    cursor: pointer;
    position: relative;
    transition: background-color 200ms ease;
    order: 1;
    margin-left: auto;
}

.cal_ops_list li input[type="checkbox"]::after {
    content: '';
    position: absolute;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background-color: white;
    top: 2px;
    left: 2px;
    transition: transform 200ms ease;
    box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.cal_ops_list li input[type="checkbox"]:hover {
    background-color: #BBBBBB;
}

.cal_ops_list li input[type="checkbox"]:checked {
    background-color: #00529b;
}

.cal_ops_list li input[type="checkbox"]:checked::after {
    transform: translateX(14px);
}

/* Appointment types list styling */
.cal_ops_list.cal_flt_appointment_types li {
    border-radius: 6px;
    font-weight: 500;
    transition: background-color 150ms ease;
}

.cal_ops_list.cal_flt_appointment_types li:hover {
    background-color: rgba(255, 255, 255, 0.15);
}

.cal_ops_list.cal_flt_appointment_types li {
    margin-bottom: 4px;
}

.cal_ops_list.cal_flt_appointment_types li:last-child {
    margin-bottom: 0;
}

/* Toggle within color-coded appointment types */
.cal_ops_list.cal_flt_appointment_types li input[type="checkbox"] {
    background-color: rgba(0, 0, 0, 0.2);
}

.cal_ops_list.cal_flt_appointment_types li input[type="checkbox"]:hover {
    background-color: rgba(0, 0, 0, 0.3);
}

.cal_ops_list.cal_flt_appointment_types li input[type="checkbox"]:checked {
    background-color: rgba(0, 0, 0, 0.4);
}

/* Lists inside card wrappers - transparent, no border */
.team_members_section .cal_ops_list {
    background-color: transparent;
    border: none;
    border-radius: 0;
    padding: 2px 4px;
    /* Hide scrollbar but keep scroll functionality */
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.appointment_types_section .cal_ops_list {
    background-color: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    /* Hide scrollbar but keep scroll functionality */
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.team_members_section .cal_ops_list::-webkit-scrollbar,
.appointment_types_section .cal_ops_list::-webkit-scrollbar {
    display: none;
}

.team_members_section .cal_ops_list li,
.appointment_types_section .cal_ops_list li {
    margin-left: 0;
    margin-right: 0;
}

/* #1757: hidden appointment types sit in a collapsed group, styled like Inactive Members. */
.appointment_types_section .cal_ops_list li.cal_flt_inactive_types_trigger {
    background-color: #F5F5F5;
    color: #333;
    cursor: pointer;
    padding: 8px;
    border-radius: 6px;
    font-family: 'Manrope', sans-serif;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: background-color 150ms ease;
}

.appointment_types_section .cal_ops_list li.cal_flt_inactive_types_trigger:hover {
    background-color: #E8E8E8;
}

.appointment_types_section .cal_ops_list li.cal_flt_inactive_types_trigger:after {
    content: '▶';
    font-size: 8px;
    color: #888888;
}

.appointment_types_section .cal_ops_list.cal_flt_inactive_expanded li.cal_flt_inactive_types_trigger:after {
    content: '▼';
}

.appointment_types_section .cal_ops_list li.cal_flt_inactive_type {
    display: none;
}

.appointment_types_section .cal_ops_list.cal_flt_inactive_expanded li.cal_flt_inactive_type {
    display: flex;
}

.cal_ops_list.cal_flt_users li {
    min-height: 28px;
}

.calendar_layout .cal_ops_container div.ops_container {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1 1 auto;
	min-height: 0;
	/* #1661: this said overflow-y: auto while the rule above it said overflow: hidden, and
	   being one element-selector more specific it won - which is what put the scrollbar on
	   the outer rail. The cards size themselves to the rail now and scroll internally, so
	   the rail itself never needs to. */
	overflow: hidden;
}

table.cal_ops_views {
	width: 100%;
	text-align: center;
}

ul.tagit {
	margin: 0px;
}

@media screen and (max-width: 980px) {
	.calendar_layout {
		flex-direction: column;
		height: auto;
		min-height: 0;
		gap: 10px;
		overflow: visible;
	}

	/* FullCalendar sizes its grid from this container (height: 'parent'). Stacked, nothing
	   gave the container a height of its own, so the grid measured only its toolbar and
	   collapsed to zero: the month, week and day views vanished below this width. The
	   calendar takes the visible height here and the sidebar follows underneath it. */
	.calendar_layout .cal_fc_container {
		max-width: 100%;
		flex: 0 0 auto;
		height: max(480px, calc(100vh - 210px));
		min-height: 0;
	}

	.calendar_layout .cal_fc_container .fc {
		flex: 1 1 auto;
		height: auto;
	}

	.calendar_layout .cal_ops_container {
		width: 100%;
		min-width: 0;
		flex: 0 0 auto;
		padding: 0;
		height: auto;
		display: flex;
		flex-direction: column;
	}

	.calendar_layout .cal_ops_container div.ops_container {
		width: 100%;
		display: flex;
		flex-direction: column;
		gap: 16px;
		align-items: stretch;
		flex: 1 1 auto;
		min-height: 0;
	}

	.calendar_layout .cal_ops_container div.ops_container > * {
		min-width: 100%;
	}

	.calendar_layout .cal_ops_container .cal_ops_list {
		width: 100%;
		margin-bottom: 0;
	}
}

.act-lec {
	padding-bottom: 10px;
}

.act-lec > div.lec-buttons {
	float: right;
	margin-top: -28px;
	z-index: 2;
}

div.cal_user_filter {
	text-align: center;
	flex: 0 0 auto;
	min-height: 0;
	max-height: clamp(150px, 22vh, 200px);
	overflow: hidden;
}

div.cal_user_filter ul {
	text-align: left;
}

div.cal_user_filter > ul.cal_ops_list {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	max-height: clamp(100px, 20vh, 180px);
	margin-bottom: 0;
}

div.cal_user_filter span {
	background-color: transparent;
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	flex: 0 0 auto;
	padding: 5px 10px;
	margin-top: 0;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #888888;
	border-radius: 0;
	border-top: 1px solid #EEEEEE;
}

div.cal_user_filter span:first-child {
	border-top: none;
}

div.cal_user_filter .cal-user-avatar {
    width: 25px;
    height: 25px;
    min-width: 25px;
    border: 0;
    border-radius: 50%;
    padding: 0;
    margin: 0;
    background-color: #00529b;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex: 0 0 25px;
    position: relative;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.35);
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
    text-transform: none;
    letter-spacing: 0.02em;
    color: #FFFFFF;
}

div.cal_user_filter .cal-user-avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border-radius: 50%;
    position: relative;
    z-index: 0;
}

div.cal_user_filter .cal-user-avatar span {
    background-color: transparent;
    display: inline !important;
    flex: 0 0 auto;
    padding: 0;
    margin: 0;
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
    text-transform: none;
    letter-spacing: 0.02em;
    color: #FFFFFF;
    border-radius: 0;
    border-top: 0;
    position: relative;
    z-index: 0;
}

div.cal_user_filter .cal-user-avatar-upload {
    cursor: pointer;
    transition: box-shadow 150ms ease, transform 150ms ease, opacity 150ms ease;
}

div.cal_user_filter .cal-user-avatar-upload:hover,
div.cal_user_filter .cal-user-avatar-upload:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 0 0 2px rgba(0,82,155,0.2), inset 0 0 0 1px rgba(255,255,255,0.6);
    outline: none;
}

div.cal_user_filter .cal-user-avatar-upload:after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 13px;
    height: 13px;
    border: 0;
    border-radius: 0;
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 0;
    transform: translate(-50%, -50%);
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.2));
    transition: opacity 150ms ease;
    pointer-events: none;
    z-index: 2;
}

div.cal_user_filter .cal-user-avatar-upload:before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: rgba(0,0,0,0.32);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    opacity: 0;
    transition: opacity 150ms ease;
    pointer-events: none;
    z-index: 1;
}

div.cal_user_filter .cal-user-avatar-upload:hover:after,
div.cal_user_filter .cal-user-avatar-upload:focus-visible:after,
div.cal_user_filter .cal-user-avatar-upload:hover:before,
div.cal_user_filter .cal-user-avatar-upload:focus-visible:before {
    opacity: 1;
}

div.cal_user_filter .cal-user-avatar.is-uploading {
    opacity: 0.55;
    pointer-events: none;
}

div.cal_user_filter .cal-user-avatar-input {
    display: none;
}

div.cal_user_filter .cal-user-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background-color: transparent;
    display: inline-block !important;
    flex: 1 1 auto;
    padding: 0;
    margin: 0;
    font-size: 13px;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
    color: inherit;
    border-radius: 0;
    border-top: 0;
}

div.cal_user_filter span.collapsible_trigger {
	background-color: #F5F5F5;
	cursor: pointer;
	transition: background-color 150ms ease;
	padding: 8px;
	border-radius: 6px;
	border-top: none;
	font-family: 'Manrope', sans-serif; font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

div.cal_user_filter span.collapsible_trigger:hover {
	background-color: #E8E8E8;
}

div.cal_user_filter span.collapsible_trigger:after {
	content: '▶';
	font-size: 8px;
	color: #888888;
	transition: transform 200ms ease;
}

div.cal_user_filter span.collapsible_trigger.active {
	background-color: #F5F5F5;
	border-radius: 6px 6px 0 0;
}

div.cal_user_filter span.collapsible_trigger.active:after {
	content: '▼';
}

div.cal_user_filter span.collapsible_trigger input.inactive_toggle {
	margin-left: 6px;
	margin-right: auto;
}

div.cal_user_filter ul.collapsible_content {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
	background-color: #F5F5F5;
	flex: 0 0 auto;
	border-left: none;
	margin-left: 0;
	border-radius: 0 0 6px 6px;
	padding: 0;
}

/** full calendar style modification **/
div.fc-day-grid-container div.fc-day-grid div.fc-row {
	min-height: clamp(6.5rem, calc((100vh - 260px) / 6), 11rem);
}

td.fc-day-top a.fc-day-number {
    float: right;
    padding-right: 7px;
    font-family: 'Manrope', sans-serif;
}

th.fc-day-header.fc-widget-header {
	vertical-align: middle;
	border: none;
	padding-top: 6px;
	padding-bottom: 6px;
	font-family: 'Manrope', sans-serif; font-weight: 500;
}

th.fc-day-header.fc-widget-header > span,
th.fc-day-header.fc-widget-header > a {
	font-family: inherit;
}

th.fc-week-number.fc-widget-header {
	border: none;
}

/* Time axis labels (8am, 9am, etc.) in week/day views */
td.fc-axis.fc-time.fc-widget-content {
	font-family: 'Manrope', sans-serif;
}

/* All-day label in week/day views */
td.fc-axis.fc-widget-content span {
	font-family: 'Manrope', sans-serif;
}

/* Week number in day view */
th.fc-axis.fc-week-number {
	font-family: 'Manrope', sans-serif;
}

th.fc-axis.fc-week-number > a,
th.fc-axis.fc-week-number > span {
	font-family: inherit;
}

tbody.fc-body > tr > td.fc-widget-content {
	border-left: 0px;
	border-right: 0px;
	border-bottom: 0px;
}

div.fc-content-skeleton table thead tr td.fc-week-number a {
	font-size: 10px;
	font-style: italic;
	color: #888;
}

div.fc-bgevent-skeleton > table > tbody > tr > td.fc-week-number {
	border-left: none;
     background-color: #fcfcfc;
}

th.fc-week-number.fc-widget-header span {
	display: none; /*hide 'W'*/
}

td.fc-widget-header.fc-head-container {
	border: none;
}

div.fc-right span.select2.select2-container {
	min-width: 75px;
}

div.fc-month-view * a.fc-event {
	border: none;
}

div.fc-month-view * a.fc-event.task {
	border: 1px solid black;
}

/* #1697: "+N completed" — the completed items Hide Complete leaves out of a month day.
   Beside the "+N items" link it is plain text; on a day without a link it sits alone under the
   day's pills, or on its date line when they fill the cell, positioned by tkrv_mod_calendar. */
div.fc-month-view .fc-hidden-completed {
	color: #8a8a8a;
	font-size: .85em;
	white-space: nowrap;
}
div.fc-month-view .fc-hidden-completed-alone {
	position: absolute;
	z-index: 4;
	box-sizing: border-box;
	padding: 0 3px;
	overflow: hidden;
	text-overflow: ellipsis;
}
div.fc-month-view .fc-hidden-completed-dateline {
	padding-top: 4px;
}
div.fc-month-view a.fc-hidden-completed-link {
	/* inherit the label's .85em, as a.fc-more has it: the app's link rules set 14px */
	font-size: inherit;
	line-height: inherit;
	color: inherit;
	cursor: pointer;
	text-decoration: none;
}
div.fc-month-view a.fc-hidden-completed-link:hover,
div.fc-month-view a.fc-hidden-completed-link:focus-visible {
	text-decoration: underline;
}
/* ── "+N items": the overflow link and the card it opens ──
   Both were FullCalendar's stock look (underlined small text; a square box with a grey
   title strip). The link is a quiet text button; the card is the calendar's own white
   rounded surface, opened out of the link and folded back into it (the motion is in
   decorateEventLimitPopover / playMorePopoverLeave). */
/* The link is a card the width of the pills above it - a muted sibling of them, so a
   full day ends in one more row instead of a stray line of text. The whole card is the
   link. FullCalendar places the popover from the wrapper's left edge, so the inset is
   padding on the wrapper, not a margin. */
div.fc-month-view td.fc-more-cell > div {
	display: flex;
	align-items: stretch;
	gap: 4px;
	padding: 2px 5px 0;
}
div.fc-month-view a.fc-more {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6px;
	min-width: 0;
	margin: 0;
	padding: 3px 10px;
	overflow: hidden;
	border-radius: 6px;
	background-color: #eef1f4;
	box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.05);
	color: #4b5563;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	text-decoration: none;
	text-overflow: ellipsis;
	white-space: nowrap;
	/* `scale:` - GSAP owns transform on these (arrival fade, the drop pulse) */
	transition: background-color 0.12s var(--cal-arrive), color 0.12s var(--cal-arrive), scale 0.12s var(--cal-arrive);
}
div.fc-month-view a.fc-more:hover,
div.fc-month-view a.fc-more:focus-visible {
	background-color: #e2e7ec;
	color: #1f2937;
	text-decoration: none;
}
div.fc-month-view a.fc-more:active {
	scale: 0.985;
}
/* A small chevron on the right says the card opens. It points right, eases a little
   further that way on hover, and holds there while the list is open. Drawn from two
   borders so it takes the text colour. */
div.fc-month-view a.fc-more::after {
	content: '';
	flex: 0 0 auto;
	width: 5px;
	height: 5px;
	margin-right: 3px;
	border-top: 1.5px solid currentColor;
	border-right: 1.5px solid currentColor;
	opacity: 0.55;
	rotate: 45deg;
	translate: -1.5px 0;
	transition: opacity 0.12s var(--cal-arrive), translate 0.16s var(--cal-arrive);
}
div.fc-month-view a.fc-more:hover::after,
div.fc-month-view a.fc-more:focus-visible::after,
div.fc-month-view a.fc-more.cal-more-open::after {
	opacity: 0.9;
	translate: 0 0;
}
/* its card is open */
div.fc-month-view a.fc-more.cal-more-open {
	background-color: #dbe1e8;
	color: #1f2937;
}
.cal-density-standard div.fc-month-view td.fc-more-cell > div {
	padding-top: 1px;
}
.cal-density-standard div.fc-month-view a.fc-more {
	padding: 2px 8px;
}
.cal-density-compact div.fc-month-view td.fc-more-cell > div {
	padding: 1px 4px 0;
}
.cal-density-compact div.fc-month-view a.fc-more {
	padding: 1px 6px;
	border-radius: 4px;
	font-size: 11px;
	line-height: 15px;
}
.cal-density-compact div.fc-month-view a.fc-more::after {
	width: 4px;
	height: 4px;
}
/* "+N completed" beside it: a second, outlined card. The " - " separator the label
   starts with is not needed between two cards. */
div.fc-month-view td.fc-more-cell .fc-hidden-completed {
	flex: 0 1 auto;
	display: flex;
	min-width: 0;
	font-size: 0;
}
div.fc-month-view .fc-hidden-completed {
	font-family: 'Manrope', sans-serif;
	font-size: 11.5px;
}
div.fc-month-view a.fc-hidden-completed-link {
	padding: 1px 4px;
	border-radius: 5px;
	transition: background-color 0.12s var(--cal-arrive), color 0.12s var(--cal-arrive);
}
div.fc-month-view td.fc-more-cell a.fc-hidden-completed-link {
	display: block;
	padding: 3px 8px;
	overflow: hidden;
	border-radius: 6px;
	box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.12);
	color: #6b7280;
	font-size: 11.5px;
	font-weight: 600;
	line-height: 16px;
	text-overflow: ellipsis;
	white-space: nowrap;
}
div.fc-month-view a.fc-hidden-completed-link:hover,
div.fc-month-view a.fc-hidden-completed-link:focus-visible,
div.fc-month-view a.fc-hidden-completed-link.cal-more-open {
	background-color: rgba(15, 23, 42, 0.07);
	color: #1f2937;
	text-decoration: none;
}

.calendar_layout .fc-popover.fc-more-popover {
	z-index: 8;
	width: 264px;
	overflow: hidden;
	border: 1px solid rgba(15, 23, 42, 0.09);
	border-radius: 12px;
	background-color: #fff;
	/* a tight contact shadow under a wide soft one: it floats, it does not hover far off */
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 14px 34px -8px rgba(15, 23, 42, 0.24);
	font-family: 'Manrope', sans-serif;
}
.calendar_layout .fc-more-popover .fc-header {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 8px 8px 14px;
	background: none;
	border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}
.calendar_layout .fc-more-popover .fc-header .fc-clear {
	display: none;
}
/* the day: also the way into that day's Day view */
.calendar_layout .fc-more-popover .fc-header .fc-title {
	order: 1;
	flex: 0 1 auto;
	float: none;
	min-width: 0;
	margin: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: #111827;
	font-size: 13px;
	font-weight: 700;
	line-height: 20px;
}
.calendar_layout .fc-more-popover .fc-header .fc-title.cal-popover-daylink {
	cursor: pointer;
	transition: color 0.12s var(--cal-arrive);
}
.calendar_layout .fc-more-popover .fc-header .fc-title.cal-popover-daylink::after {
	content: '\203A';
	display: inline-block;
	margin-left: 5px;
	opacity: 0;
	translate: -3px 0;
	font-weight: 600;
	transition: opacity 0.12s var(--cal-arrive), translate 0.16s var(--cal-arrive);
}
.calendar_layout .fc-more-popover .fc-header .fc-title.cal-popover-daylink:hover {
	color: #00529b;
}
.calendar_layout .fc-more-popover .fc-header .fc-title.cal-popover-daylink:hover::after {
	opacity: 1;
	translate: 0 0;
}
.calendar_layout .fc-more-popover .fc-header .fc-close {
	order: 3;
	flex: 0 0 auto;
	float: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	margin: 0 0 0 auto;
	border-radius: 6px;
	color: #6b7280;
	font-size: 14px;
	line-height: 1;
	cursor: pointer;
	transition: background-color 0.12s var(--cal-arrive), color 0.12s var(--cal-arrive), scale 0.12s var(--cal-arrive);
}
.calendar_layout .fc-more-popover .fc-header .fc-close:hover {
	background-color: rgba(15, 23, 42, 0.07);
	color: #111827;
}
.calendar_layout .fc-more-popover .fc-header .fc-close:active {
	scale: 0.92;
}
.calendar_layout .fc-more-popover .fc-event-container {
	padding: 8px 5px 10px;
	overscroll-behavior: contain;
	scrollbar-width: thin;
	scrollbar-color: rgba(15, 23, 42, 0.22) transparent;
}
.calendar_layout .fc-more-popover .fc-event-container::-webkit-scrollbar {
	width: 8px;
}
.calendar_layout .fc-more-popover .fc-event-container::-webkit-scrollbar-thumb {
	border: 2px solid #fff;
	border-radius: 8px;
	background-color: rgba(15, 23, 42, 0.22);
}
/* The copy that stands in while the card closes (playMorePopoverLeave). */
.calendar_layout .fc-popover.cal-popover-leaving {
	pointer-events: none;
}

/* The completed items' popover: the same card, plus a label in its header. */
.fc-hidden-completed-popover .fc-header .fc-hidden-completed-heading {
	order: 2;
	float: none;
	margin: 0;
	padding: 1px 7px;
	border-radius: 999px;
	background-color: rgba(15, 23, 42, 0.06);
	color: #6b7280;
	font-size: 11px;
	font-weight: 600;
	line-height: 16px;
}

/* ========================================
   Month View Pill-Style Appointments
   ======================================== */

/* Base pill styling - only for month view appointments */
div.fc-month-view a.fc-event.appointment.month-pill-style {
    border: none !important;
    border-radius: 6px;
    padding: 5px 10px;
    margin: 2px 5px;
    box-shadow: none;
    /* clip the #1507 secondary-dimension left accent bar to the pill's rounded corners
       so it follows the rounded left edge cleanly instead of poking out square */
    overflow: hidden;
    /* `translate:` not `transform:` - GSAP owns transform on pills (entrance cascade,
       settle pop). A CSS transition on transform would re-ease every GSAP frame and the
       hover state would clobber the tween's value. Same fix the ribbon tabs needed. */
    transition: translate 0.15s var(--cal-arrive), box-shadow 0.15s var(--cal-arrive);
}

/* #1704: Month density. Comfortable is the pill above. Standard tightens it; Compact is one line -
   start time then title (the end time and the second line are dropped) - so about twice as many
   fit a day. With "Max items per day" = "Fit to day" FullCalendar fills the cell at any density. */
.cal-density-standard div.fc-month-view a.fc-event.appointment.month-pill-style {
    padding: 3px 8px;
    margin: 1px 5px;
}
.cal-density-standard div.fc-month-view a.fc-event.month-pill-style .fc-content {
    gap: 0;
}
.cal-density-compact div.fc-month-view a.fc-event.appointment.month-pill-style {
    padding: 1px 6px;
    margin: 1px 4px;
    border-radius: 4px;
}
.cal-density-compact div.fc-month-view a.fc-event.month-pill-style .fc-content {
    flex-direction: row;
    align-items: center;
    gap: 5px;
}
.cal-density-compact div.fc-month-view a.fc-event.month-pill-style .fc-time {
    order: -1;
}
.cal-density-compact div.fc-month-view a.fc-event.month-pill-style .fc-time-rest {
    display: none;
}
.cal-density-compact div.fc-month-view a.fc-event.month-pill-style .fc-pill-titlerow {
    flex: 1 1 auto;
}
.cal-density-compact div.fc-month-view a.fc-event.month-pill-style .cal-appt-secondary-stripe {
    top: 2px;
    bottom: 2px;
}

/* Hover effect for pills */
div.fc-month-view a.fc-event.appointment.month-pill-style:hover {
    translate: 0 -1px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Stacked layout: title row, then time / location / attendees lines */
div.fc-month-view a.fc-event.month-pill-style .fc-content {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 1px;
    overflow: hidden;
    border-right-style: none !important; /* Remove recurrence marker for pill style */
}

/* Title row holds the optional all-day dot + the title on a single line (all views) */
a.fc-event.appointment.month-pill-style .fc-pill-titlerow,
.fc-time-grid-event.appointment.week-style .fc-pill-titlerow {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    white-space: nowrap;
}

/* Secondary info lines below the title (location, attendees) — month pills + week/day events */
a.fc-event.appointment.month-pill-style .fc-pill-info,
.fc-time-grid-event.appointment.week-style .fc-pill-info {
    font-size: 0.85em;
    line-height: 1.25;
    opacity: 0.8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

/* All-day events in week/day use month-pill-style but live in the agenda view, so give their
   content the same stacked column layout the month-view rule provides. */
.fc-agenda-view .fc-event.appointment.month-pill-style .fc-content {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 1px;
    overflow: hidden;
}

/* #1507: attendees row — each attendee is its own neutral mini-pill (chip) that wraps to fit
   and links to that attendee on click. */
.fc-event.appointment .fc-pill-attendees {
    display: flex;
    flex-wrap: wrap;
    gap: 2px 3px;
    min-width: 0;
    margin-top: 1px;
}
.fc-event.appointment .fc-pill-attendee-chip {
    display: inline-block;
    max-width: 100%;
    box-sizing: border-box;
    padding: 0 6px;
    border-radius: 4px;
    background: #eceff1;
    color: #37474f;
    font-size: 0.82em;
    line-height: 1.45;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}
.fc-event.appointment .fc-pill-attendee-chip:hover {
    background: #dfe4e7;
    text-decoration: underline;
}

/* #1507: when the left accent bar is present, nudge the content right so the
   title clears the bar (padding on the right side of the bar). */
div.fc-month-view a.fc-event.month-pill-style.cal-has-accent-bar .fc-content,
.fc-time-grid-event.appointment.week-style.cal-has-accent-bar .fc-content {
    padding-left: 6px;
}

/* The accent bar itself: a rounded capsule inset just inside the pill's left
   edge (Apple Calendar style). Only its colour is set inline, per pill. */
.fc-event .cal-appt-secondary-stripe {
    position: absolute;
    top: 3px;
    bottom: 3px;
    left: 4px;
    width: 4px;
    border-radius: 2px;
    pointer-events: none;
    z-index: 3;
}

/* Colored dot - only shown for all-day events */
div.fc-month-view a.fc-event.month-pill-style .fc-pill-dot {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
}

/* Title - Medium Manrope font, fills available space */
div.fc-month-view a.fc-event.month-pill-style .fc-title {
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

/* Time - medium weight, muted; single line, ellipsis if the range is long */
div.fc-month-view a.fc-event.month-pill-style .fc-time {
    font-weight: 500 !important;
    flex-shrink: 0;
    font-size: 0.9em;
    opacity: 0.75;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

/* Strike-through for completed */
div.fc-month-view a.fc-event.month-pill-style.strike-through .fc-content {
    text-decoration: line-through;
    opacity: 0.6;
}

/* Multi-day event continuation */
div.fc-month-view a.fc-event.month-pill-style.fc-not-start {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-left: 0;
}

div.fc-month-view a.fc-event.month-pill-style.fc-not-end {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    margin-right: 0;
}

/* Month View - Hover Card for New Event */
.cal-month-hover-card {
    position: absolute;
    z-index: 6;
    border: 2px dashed rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    padding: 5px 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.25);
    font-size: 0.9em;
    opacity: 0;
    transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
    pointer-events: auto;
    box-sizing: border-box;
}

.cal-month-hover-card.visible {
    opacity: 1;
}

.cal-month-hover-card:hover {
    border-color: rgba(0, 0, 0, 0.3);
    background-color: rgba(0, 0, 0, 0.02);
    color: rgba(0, 0, 0, 0.4);
}

.fc-month-view .fc-day-grid .fc-row.hover-expanding {
    transition: min-height 0.2s ease;
}

.cal-week-hover-card {
    position: absolute;
    z-index: 3;
    border: 2px dashed rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.25);
    font-size: 0.9em;
    opacity: 0;
    pointer-events: none;
    box-sizing: border-box;
    top: 0;
    left: 2px;
    right: 2.5%;
    /* placed by a transform (setupWeekHoverCards) so it slides from slot to slot */
    transition: opacity 0.15s ease, transform 0.09s cubic-bezier(0.2, 0.8, 0.2, 1), height 0.12s ease;
}
.cal-week-hover-card.visible { opacity: 1; }
/* Arriving in another day it appears in place rather than sliding in from the previous one. */
.cal-week-hover-card.is-arriving { transition: none; }

/* Drag Shadow Card (month view drop target indicator) */
.cal-drag-shadow {
    position: absolute;
    z-index: 6;
    border: 2px dashed rgba(66, 133, 244, 0.4);
    border-radius: 8px;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
    color: rgba(66, 133, 244, 0.5);
    font-size: 0.9em;
    opacity: 0;
    transition: opacity 0.1s ease;
    pointer-events: none;
    box-sizing: border-box;
    background-color: rgba(66, 133, 244, 0.04);
    min-height: 24px;
}
.cal-drag-shadow.visible { opacity: 1; }

/* Active Drag State */
.cal-dragging .cal-month-hover-card,
.cal-dragging .cal-week-hover-card {
    display: none !important;
}
.cal-dragging .fc-highlight {
    background: rgba(66, 133, 244, 0.12);
    opacity: 1;
}
.fc-dragging {
    transition: none !important;
}

/* ── Carried appointments (CalendarDragMotion) ──
   An appointment in the air is the appointment itself, lifted - not a washed-out
   copy and not a dashed outline. --cal-lift runs 0..1 and is written per frame by
   the controller: the pick-up raises it, the landing lowers it. The lift is a
   drop-shadow filter because a pill's box-shadow is its inline seam ring. */
.cal-drag-ghost,
.fc-view .fc-helper.fc-dragging {
    --cal-lift: 0;
    /* !important: a pill cloned mid-arrival still carries the arrival's inline filter. */
    filter: drop-shadow(0 calc(var(--cal-lift) * 10px) calc(var(--cal-lift) * 16px) rgba(15, 23, 42, calc(var(--cal-lift) * 0.3))) !important;
    pointer-events: none;
    transition: none !important;
}
.cal-drag-ghost {
    z-index: 30 !important;
    will-change: transform;
}
/* FullCalendar writes its dragOpacity inline on the follower; a carried pill is solid. */
.cal-drag-ghost:not(.cal-drag-flight) {
    opacity: 1 !important;
}
/* A carried helper is solid too (FullCalendar's inline dragOpacity again); in a time
   grid it stays a touch translucent so the slot lines read through the block. */
.fc-view .fc-helper.fc-dragging {
    opacity: 1 !important;
}
.fc-time-grid .fc-helper-container .fc-helper.fc-dragging {
    opacity: 0.94 !important;
    z-index: 20 !important;
}
/* Where it came from: FullCalendar hides the original inline; it stays, dimmed. */
.fc-event.cal-drag-source {
    visibility: visible !important;
    opacity: 0.32 !important;
    filter: saturate(0.55);
}
/* A flight clone is standing in for this pill until it lands. */
.fc-event.cal-motion-hidden {
    opacity: 0 !important;
}
/* A block dropped in a time grid lowers back onto the surface. */
.fc-event.cal-motion-setdown {
    animation: cal-motion-setdown 0.28s var(--cal-arrive) both;
}
@keyframes cal-motion-setdown {
    from { filter: drop-shadow(0 10px 16px rgba(15, 23, 42, 0.3)); }
    to   { filter: drop-shadow(0 0 0 rgba(15, 23, 42, 0)); }
}
/* The carry's cursor. One transparent element over the page (CalendarDragMotion.raiseShield),
   not a cursor rule on the grid's contents: turning such a rule on and off restyled every
   appointment, a 45ms stall at each pick-up and drop in a busy week. It is always there and
   takes the pointer only while raised. */
.cal-drag-shield {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    cursor: grabbing;
    pointer-events: none;
}
.cal-drag-shield.is-raised {
    pointer-events: auto;
}
.fc-not-allowed .cal-drag-shield {
    cursor: not-allowed;
}
/* The mini-calendar drag moves this instead of the pill (bindLazyPillDraggable). */
.cal-minical-drag-proxy {
    /* Pinned. jQuery UI moves its helper by top/left on every mouse move, and as an absolutely
       positioned child of the body that re-laid-out the page each time - half the frame budget
       of a carry. The drop is decided from the pointer, never from where this element sits. */
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

/* Week/Day View - All-Day Events (pill style) */
.fc-agenda-view .fc-day-grid .fc-event.appointment.month-pill-style {
    border: none !important;
    border-radius: 8px;
    padding: 4px 8px;
    margin: 2px 4px;
    box-shadow: none;
}

/* Multi-day all-day event continuation in week/day views */
.fc-agenda-view .fc-day-grid .fc-event.appointment.month-pill-style.fc-not-start {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-left: 0;
}

.fc-agenda-view .fc-day-grid .fc-event.appointment.month-pill-style.fc-not-end {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    margin-right: 0;
}

.fc-agenda-view .fc-day-grid .fc-event.appointment.month-pill-style .fc-content {
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    overflow: hidden;
    border-right-style: none !important;
}

.fc-agenda-view .fc-day-grid .fc-event.appointment.month-pill-style .fc-pill-dot {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
}

.fc-agenda-view .fc-day-grid .fc-event.appointment.month-pill-style .fc-title {
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.fc-agenda-view .fc-day-grid .fc-event.appointment.month-pill-style .fc-time {
    font-weight: 500 !important;
    flex-shrink: 0;
    font-size: 0.9em;
    opacity: 0.75;
}

/* Week/Day View - Timed Events */
.fc-time-grid-event.appointment.week-style {
    border-radius: 6px;
    border: none !important;
    padding: 4px 8px;
    /* #1507: events stay time-proportional so they line up with the grid (the rows are made tall
       enough — see .fc-slats td below — that most events show their content). Clip overflow so a
       busy event's attendees scroll INSIDE the tile rather than growing it past its slot. */
    overflow: hidden;
    /* Every tile holds a scroll area (the attendee row). Without containment the browser re-walks
       all of them whenever one tile moves, so a week of several hundred appointments dragged at
       about 5 frames a second. Nothing is drawn outside a tile, so containing it changes no pixel. */
    contain: paint;
}

/* Remove white overlay to match month view solid colors */
.fc-time-grid-event.appointment.week-style .fc-bg {
    display: none;
}

.fc-time-grid-event.appointment.week-style .fc-content {
    display: flex;
    flex-direction: column;
    border-right-style: none !important;
    /* Fill the tile so the attendee row can take the leftover space and scroll within it. */
    height: 100%;
    min-height: 0;
}

/* Internal scroll: title / time / location are pinned; only the attendee area scrolls inside the
   (time-proportional) tile, so events never grow past their slot or overlap their neighbours. */
.fc-time-grid-event.appointment.week-style .fc-pill-titlerow,
.fc-time-grid-event.appointment.week-style .fc-time,
.fc-time-grid-event.appointment.week-style .fc-pill-location {
    flex: 0 0 auto;
}
.fc-time-grid-event.appointment.week-style .fc-pill-attendees {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    align-content: flex-start;
}

/* Title - top line, prominent */
.fc-time-grid-event.appointment.week-style .fc-title {
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* #1507: taller time-grid rows (slats). slotDuration is 15 min, so each slat is one 15-min row.
   The default 1.5em (~21px) only fits a single title line, clipping a short event's stacked
   content. Sizing each 15-min slat to 40px (an hour = 160px) gives short events breathing room
   while staying time-proportional, so events still line up exactly with the grid. The week/day
   grid becomes taller and scrolls. Scoped to the calendar's FullCalendar so the Tasks view (and
   any other FC instance) is unaffected. */
.cal_fc_container .fc-time-grid .fc-slats td {
    height: 40px;
}

/* #1704: Week/Day density (Calendar settings, or Ctrl+scroll over the grid). Comfortable is the
   40px above; Standard and Compact shorten the 15-min slat so more of the day fits on screen.
   FullCalendar measures the slats, so the calendar re-measures (updateSize) after a change. */
.cal_fc_container .cal-density-standard .fc-time-grid .fc-slats td {
    height: 28px;
}
.cal_fc_container .cal-density-compact .fc-time-grid .fc-slats td {
    height: 20px;
}
/* A 15-min tile is only 20-28px tall here: tighten the padding so its title line still shows. */
.cal_fc_container .cal-density-standard .fc-time-grid-event.appointment.week-style,
.cal_fc_container .cal-density-compact .fc-time-grid-event.appointment.week-style {
    padding: 2px 6px;
}

/* The agenda (week/day) time-grid renders the native start time via ::before (attr(data-start))
   and a trailing " - " via ::after on .fc-time. We replace .fc-time's text with our own start–end
   range, so suppress those pseudo-elements — otherwise the line reads "8:0008:00 AM - 08:15 AM -". */
.fc-time-grid-event.appointment.week-style .fc-time::before,
.fc-time-grid-event.appointment.week-style .fc-time::after {
    content: none !important;
}

/* Time - below title, muted; single line, ellipsis if the range is long */
.fc-time-grid-event.appointment.week-style .fc-time {
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
    opacity: 0.75;
    display: block;
    font-size: 0.9em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

/* Strike-through for completed events in week view */
.fc-time-grid-event.appointment.week-style.strike-through .fc-content {
    text-decoration: line-through;
    opacity: 0.6;
}

.fc-agenda-view .fc-day-grid .fc-event.appointment.month-pill-style.strike-through .fc-content {
    text-decoration: line-through;
    opacity: 0.6;
}

button.fc-button {
    height: 37px;
    box-shadow: none !important;
    cursor: pointer;
    vertical-align: middle;
    border-radius: 0;
    background-image: none;
    background-color: #E4E4E4;
    border: none;
    border-color: transparent;
    text-shadow: none;
    transition: background-color 0.3s ease;
    font-family: 'Manrope', sans-serif;
}

button.fc-button:hover {
    transition: all 0.3s ease-out;
    background: #B2B2B2;
    color: #FFFFFF;
}

.fc button.fc-prev-button,
.fc button.fc-next-button,
.fc button.fc-prevYear-button,
.fc button.fc-nextYear-button,
.fc button.fc-today-button {
    height: 37px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    /* Match the view-selector track's outer rounding (8px). Specificity note:
       FullCalendar's .fc-state-default.fc-corner-* rules apply 4px per corner
       and out-rank plain button.fc-button, so the radius must live here. */
    border-radius: 8px;
}

.fc button.fc-today-button.fc-state-disabled {
    opacity: 1;
}

.fc-header-toolbar {
    line-height: 31px;
}

/* View selector in FC header toolbar */
.fc-header-toolbar .fc-tb-clone-selector {
    margin-right: 10px;
}

/* Icon buttons in FC header toolbar */
.fc-header-toolbar .fc-tb-clone-buttons {
    margin-left: 10px;
}

/* Search panel in FC header toolbar */
.fc-header-toolbar .fc-tb-clone-search {
    margin-left: 0;
}

/* Collapse button in FC header toolbar */
.fc-header-toolbar .fc-collapse-btn {
    margin-left: 5px;
    cursor: pointer;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.calendar_layout .fc-header-toolbar .fc-center {
    order: 0;  /* Move title to far left, before fc-left */
    margin-left: 0;
    margin-right: 15px;
    min-width: 250px;  /* Accommodate longest header (e.g., "September 21 – 27, 2026") */
}

/* The Month Title in the original FC header */
.fc-header-toolbar .fc-center h2 {
    font-family: 'Manrope', sans-serif; font-weight: 700;
    -webkit-text-stroke: var(--module-title-stroke) currentColor;
    font-size: var(--module-title-size);
    white-space: nowrap;
    padding: 0px;
    margin: 0px;
}

/* ==========================================================================
   STICKY CALENDAR LAYOUT
   Modern CSS approach: sticky header + sticky all-day section + scrolling time grid
   ========================================================================== */

/* FC view container - no overflow to prevent double scrollbar in agenda views */
.calendar_layout .cal_fc_container .fc-view-container {
    overflow: hidden;
    position: relative;
}

/* Header toolbar sticks to top of scroll container */
.calendar_layout .fc-header-toolbar {
    position: sticky;
    top: 0;
    z-index: 4;
    background: #F3F3F3;
    /* Same height and padding tokens as the Tasks / entity-list module headers. */
    box-sizing: border-box;
    height: var(--workspace-module-header-height);
    min-height: var(--workspace-module-header-height);
    padding: var(--workspace-module-header-padding);
    border-radius: 12px;
    flex-wrap: nowrap;
}

/* All-day section styling in agenda views */
.calendar_layout .fc-agenda-view .fc-day-grid {
    z-index: 3;
    background: white;
}

/* Cap all-day section height with internal scroll when many events */
.calendar_layout .fc-agenda-view .fc-day-grid {
    max-height: 150px;
    overflow-y: auto;
    scrollbar-width: none;  /* Firefox */
    -ms-overflow-style: none;  /* IE/Edge */
}

.calendar_layout .fc-agenda-view .fc-day-grid::-webkit-scrollbar {
    display: none;  /* Chrome, Safari, Opera */
}

/* Make day-grid row use flexbox for proper content-driven height */
.calendar_layout .fc-agenda-view .fc-day-grid .fc-row {
    display: flex;
    flex-direction: column;
}

.calendar_layout .fc-agenda-view .fc-day-grid .fc-content-skeleton {
    flex: 0 0 auto;
}

/* Responsive: reduce all-day max-height on short viewports */
@media (max-height: 700px) {
    .calendar_layout .fc-agenda-view .fc-day-grid {
        max-height: 100px;
    }
}

@media (max-height: 500px) {
    .calendar_layout .fc-agenda-view .fc-day-grid {
        max-height: 60px;
    }
}

/* Remove double border below all-day section - keep only bottom border */
.calendar_layout .fc-agenda-view > table > tbody.fc-body > tr > td > hr.fc-divider {
    border-top: none;
}

/* Add consistent borders around entire calendar component in agenda views */
.calendar_layout .fc-agenda-view {
    border: 1px solid #ddd;
    border-radius: 12px;
    overflow: hidden;
}

.calendar_layout .fc-agenda-view .fc-head-container {
    background-color: #F3F3F3;
}

/* Make agenda view table use flex layout to properly constrain heights */
.calendar_layout .fc-agenda-view > table {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    height: 100%;
}

.calendar_layout .fc-agenda-view > table > thead {
    flex: 0 0 auto;
}

.calendar_layout .fc-agenda-view > table > tbody.fc-body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.calendar_layout .fc-agenda-view > table > tbody.fc-body > tr {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.calendar_layout .fc-agenda-view > table > tbody.fc-body > tr > td {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* All-day section stays at natural height */
.calendar_layout .fc-agenda-view .fc-day-grid-container {
    flex: 0 0 auto;
}

/* Time grid fills remaining space */
.calendar_layout .fc-agenda-view .fc-time-grid-container {
    flex: 1 1 auto;
    min-height: 0;
}

.calendar_layout .fc-agenda-view .fc-scroller.fc-time-grid-container {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    max-height: none;
}

/* Add consistent borders around entire calendar component in month view */
.calendar_layout .fc-month-view {
    border: 1px solid #ddd;
    border-radius: 12px;
    overflow: hidden;
}

.calendar_layout .fc-month-view .fc-head-container {
    background-color: #F3F3F3;
}

/* Hide scrollbar in time grid while keeping scroll functionality */
.calendar_layout .fc-scroller.fc-time-grid-container {
    scrollbar-width: none;  /* Firefox */
    -ms-overflow-style: none;  /* IE/Edge */
}

.calendar_layout .fc-scroller.fc-time-grid-container::-webkit-scrollbar {
    display: none;  /* Chrome, Safari, Opera */
}

/* END STICKY CALENDAR LAYOUT */

/* Current time indicator - modern dotted line with circle */
.fc-time-grid .fc-now-indicator-line {
    display: none;
}

.fc-ltr .fc-time-grid .fc-now-indicator.fc-now-indicator-arrow {
    border: none;
    left: var(--fc-axis-width, 52px);
    right: 0;
    height: 3px;
    margin-top: -1px;
    background-image: radial-gradient(circle, #6B7FA3 1px, transparent 1px);
    background-size: 8px 3px;
    background-repeat: repeat-x;
    z-index: 5;
}

.fc-ltr .fc-time-grid .fc-now-indicator.fc-now-indicator-arrow::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #6B7FA3;
}

button.fc-button > span.fc-icon {
	height: auto;
	top: 0px;
	margin-top: 0px;
}

button.fc-today-button {
	font-family: 'Manrope'; font-weight: 400;
	color: #969696;
	margin-top: 0px;
	text-transform: capitalize;
	cursor: pointer;
	height: 37px;
	box-sizing: border-box;
}

button.fc-today-button:hover {
	color: #FFFFFF;
}

div.fc-tb-clone {
	background-color: #ffffff;
	z-index: 2;
	margin-top: -1.4em;
	min-height: 65px;
	position: fixed;
	text-align: center;
	white-space: nowrap;
}

.cal-day-headers-hidden {
	display: none;
}

.cal-day-headers {
	width: 100%;
}

/*td.fc-today { */
	/*background-color: #dcdcdd !important;*/ /* note: this overrides the business hours color background of the day & week views. */
/*}*/

table.fc-tb-head-clone {
	width: 100%;
	table-layout: fixed;
	background-color: #fff;
}

#content_table table.fc-tb-head-clone > thead > tr > th.fc-widget-header, table.fc-tb-head-clone > thead > tr > th.fc-widget-header {
	height: 30px;
}

button.fc-prevYear-button > span.fc-icon.fc-icon-left-double-arrow:after {
	/*content: url(/images/icons/18/double_arrow_l_18x.png);
	opacity: .6;*/
	/*background-image: url(/images/calendar/last_year.svg);
	background-size: 15px 0px;
	display: inline-block;*/
    color: #969696;
    font-weight: normal !important;
	cursor: pointer;

}
button.fc-prev-button > span.fc-icon.fc-icon-left-single-arrow:after {
	/*content: url(/images/icons/18/single_arrow_thick_l_18x.png);
	opacity: .6;*/
	/*background-image: url(/images/calendar/last_month.svg);
	background-size: 15px 0px;
	display: inline-block;*/
	cursor: pointer;
    color: #969696;
    font-weight: normal !important;
    font-size: 165% !important;
    margin-left: 2px;
    margin-right: -3px;
}
button.fc-nextYear-button > span.fc-icon.fc-icon-right-double-arrow:after {
	/*content: url(/images/icons/18/double_arrow_r_18x.png);
	opacity: .6;*/
	/*background-image: url(/images/calendar/next_month.svg);
	background-size: 15px 0px;
	display: inline-block;*/
	cursor: pointer;
    color: #969696;
    font-weight: normal !important;
}
button.fc-next-button > span.fc-icon.fc-icon-right-single-arrow:after {
	/*content: url(/images/icons/18/single_arrow_thick_r_18x.png);
	opacity: .6;*/
	/*background-image: url(/images/calendar/next_year.svg);
	background-size: 15px 0px;
	display: inline-block;*/
	cursor: pointer;
    color: #969696;
    font-weight: normal !important;
    font-size: 165% !important;
    margin-left: -3px;
}

button.fc-prevYear-button:hover > span.fc-icon.fc-icon-left-double-arrow:after,
button.fc-prev-button:hover > span.fc-icon.fc-icon-left-single-arrow:after,
button.fc-nextYear-button:hover > span.fc-icon.fc-icon-right-double-arrow:after,
button.fc-next-button:hover > span.fc-icon.fc-icon-right-single-arrow:after {
    color: #FFFFFF;
}

button.fc-newBtn-button > span.fc-icon.fc-icon-create-new:after {
	content: url(/images/icons/18/gray/add-black.png);
}
button.fc-reloadBtn-button > span.fc-icon.fc-icon-reload:after {
	content: url(/images/icons/18/gray/reload-black.png);
}
button.fc-settings-button > span.fc-icon.fc-icon-settings:after {
	content: url(/images/icons/18/gear-18-black.png);
}
button.fc-printBtn-button > span.fc-icon.fc-icon-print:after {
	content: url(/images/icons/18/gray/print_black.png);
}
button.fc-searchBtn-button > span.fc-icon.fc-icon-search:after {
	content: url(/images/icons/18/gray/zoom_black.png);
}

input.cal-search-input {
	float: left;
	margin-top: 5px;
}

div.cal-export-btn-container {
	float: right;
	display: inline-block;
}

div.cal-export-btn-container > div.cal-export-btn {
	display: inline-block;
	cursor: pointer;
	margin-left: 20px;
	font-size: 12px;
	padding: 3px
}

div.cal-export-btn-container > div.cal-export-btn:hover {
	padding: 2px;
	border: 1px solid #aea89d;
	border-radius: 5px;
	background-color: rgb(0, 99, 166);
    /* transition: all 0.3s ease-out; */
}

div.cal-export-btn-container > div.cal-export-btn > img {
	float: right;
	background-color: white;
	margin-left: 2px;
}

div.cal-export-btn-container.appointment-editor-export-actions {
	float: none;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 8px;
	min-height: 28px;
	margin: 0;
}

div.cal-export-btn-container.appointment-editor-export-actions > span:empty {
	display: none;
}

.appointment-editor-source-badge {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	min-width: 0;
	height: 26px;
	padding: 0 10px 0 8px;
	border: 1px solid #A9C2DC;
	border-radius: 999px;
	background: #F4F8FC;
	color: #1f5f93;
	font-size: 11px !important;
	font-weight: 700;
	line-height: 16px;
	white-space: nowrap;
	box-sizing: border-box;
	cursor: help;
}

.appointment-editor-source-badge:focus-visible {
	outline: none;
	border-color: #A9C2DC;
	box-shadow: 0 0 0 2px rgba(31, 95, 147, .2);
}

.appointment-editor-source-badge-sync-icon {
	display: block;
	width: 12px;
	height: 12px;
	flex: 0 0 12px;
	background-color: currentColor;
	-webkit-mask-image: url('/images/icons/x-sched/appointment-sync-source.svg');
	mask-image: url('/images/icons/x-sched/appointment-sync-source.svg');
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.appointment-editor-source-badge-icon {
	display: block;
	width: 13px;
	height: 13px;
	flex: 0 0 13px;
	object-fit: contain;
}

.appointment-editor-source-badge[data-tooltip]::before,
.appointment-editor-source-badge[data-tooltip]::after {
	position: absolute;
	left: 50%;
	z-index: 10002;
	display: none;
	pointer-events: none;
}

.appointment-editor-source-badge[data-tooltip]::before {
	content: "";
	top: 33px;
	width: 10px;
	height: 10px;
	border-radius: 2px;
	background: #2f3740;
	transform: translateX(-50%) rotate(45deg);
}

.appointment-editor-source-badge[data-tooltip]::after {
	content: attr(data-tooltip);
	top: 38px;
	width: max-content;
	max-width: 280px;
	padding: 7px 9px;
	border-radius: 6px;
	background: #2f3740;
	box-shadow: 0 8px 20px rgba(0, 0, 0, .18);
	color: #fff;
	font-size: 12px !important;
	font-weight: 500;
	line-height: 16px;
	text-align: center;
	white-space: pre-line;
	transform: translateX(-50%);
}

.appointment-editor-source-badge[data-tooltip]:hover::before,
.appointment-editor-source-badge[data-tooltip]:hover::after,
.appointment-editor-source-badge[data-tooltip]:focus-visible::before,
.appointment-editor-source-badge[data-tooltip]:focus-visible::after {
	display: block;
}

td.appointment-editor-title-actions-cell {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	min-height: 46px;
	padding: 8px 10px 8px var(--appointment-editor-panel-gap);
	border-radius: 0 7px 7px 0;
	background: #f3f3f3;
	text-align: right;
	vertical-align: middle;
	box-sizing: border-box;
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-export-action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	margin-left: 0;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 6px;
	background-color: transparent;
	cursor: pointer;
	box-sizing: border-box;
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-export-action:hover {
	padding: 0;
	border-color: #d9dee5;
	background-color: #f5f5f5;
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-export-action.appointment-editor-notes-active {
	border-color: #c9cdd3;
	background-color: #e8e8e8;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .62);
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-export-action:focus-visible {
	outline: none;
	border-color: #b8c0ca;
	box-shadow: 0 0 0 2px rgba(15, 23, 42, .12);
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-export-action > img {
	display: block;
	float: none;
	width: 18px;
	height: 18px;
	margin: 0;
	margin-left: 0;
	background-color: transparent;
	object-fit: contain;
	object-position: center;
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-notes-action > img {
	width: 19px;
	height: 19px;
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-notes-action > .appointment-editor-notes-icon-wrap {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 19px;
	height: 19px;
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-notes-action > .appointment-editor-notes-icon-wrap > img {
	display: block;
	float: none;
	position: relative;
	z-index: 1;
	width: 19px;
	height: 19px;
	margin: 0;
	margin-left: 0;
	background-color: transparent;
	object-fit: contain;
	object-position: center;
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-notes-action.has-notes > .appointment-editor-notes-icon-wrap::after {
	content: attr(data-count);
	position: absolute;
	z-index: 2;
	top: -6px;
	right: -6px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 15px;
	height: 15px;
	padding: 0 4px;
	border: 0;
	border-radius: 999px;
	background: #2f80ed;
	color: #fff;
	font-size: 9px;
	font-weight: 700;
	line-height: 1;
	box-sizing: border-box;
	pointer-events: none;
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-export-action > img[src$="appointment-download-ics.svg"] {
	width: 20px;
	height: 20px;
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-export-action > img[src$="appointment-print.svg"] {
	width: 21px;
	height: 18px;
}

.appointment-editor-alert-select-hidden {
	display: none !important;
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-alert-action {
	/* #1660: the reminder control is a bare icon again, the same 28px square as the actions
	   beside it. It keeps the sizing from .appointment-editor-export-action rather than
	   restating it. What it reports about itself lives in its title and aria-label. */
	position: relative;
}


div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-alert-action > img {
	position: relative;
	z-index: 1;
	width: 18px;
	height: 18px;
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-alert-action.appointment-editor-alert-active::after {
	content: "";
	position: absolute;
	top: 3px;
	right: 3px;
	width: 9px;
	height: 9px;
	border: 1px solid #f3f3f3;
	border-radius: 50%;
	background: #0d83ff;
	box-shadow: 0 0 0 1px rgba(13, 131, 255, .16);
	box-sizing: border-box;
	z-index: 2;
}

div.cal-export-btn-container.appointment-editor-export-actions > div.cal-export-btn.appointment-editor-alert-action.appointment-editor-alert-readonly {
	cursor: default;
	opacity: .55;
}

.appointment-editor-alert-menu {
	position: fixed;
	z-index: 10050;
	width: 176px;
	padding: 6px;
	border: 1px solid #d8dde4;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 12px 28px rgba(27, 39, 53, .18);
	box-sizing: border-box;
}

.appointment-editor-alert-option {
	display: block;
	width: 100%;
	min-height: 30px;
	padding: 0 10px;
	border: 1px solid transparent;
	border-radius: 6px;
	background: transparent;
	color: #3d4650;
	font-size: 13px;
	font-weight: 600;
	line-height: 28px;
	text-align: left;
	cursor: pointer;
	box-sizing: border-box;
}

.appointment-editor-alert-option:hover,
.appointment-editor-alert-option:focus {
	border-color: #cfe1f6;
	background: #f2f7fc;
	outline: none;
}

.appointment-editor-alert-option.appointment-editor-alert-option-selected {
	border-color: #b9d5f5;
	background: #eaf4ff;
	color: #0a559f;
}

/*
.fc-settings-button:after {
	content: "\2699";
	font-size: 25px;
	vertical-align: middle;
	line-height: 13px;
	margin-right: 0.2em;
}
.fc-newBtn-button:after {
	content: "\2d32";
	font-size: 25px;
	vertical-align: middle;
	line-height: 13px;
	margin-right: 0.2em;
}

.fc-reloadBtn-button:after {
	content: "\27F3";
	font-size: 25px;
	vertical-align: middle;
	line-height: 13px;
	margin-right: 0.2em;
}
*/

/** End TK MOD Calendar **/

/** Calendar Header Redesign **/
/* REMOVED: fc-tb-clone-root, fc-tb-clone-top - internal containers no longer used */

/* Flex layout for the FC header toolbar. These rules originally lived in the vendor
   fullcalendar.css (891412bc0) and were lost when #1569 replaced that file with the
   stock FullCalendar 3.10.2 stylesheet (floats). They are the contract the header
   redesign depends on: .fc-center carries the month title and is ordered first (see
   .calendar_layout .fc-header-toolbar .fc-center above), the view selector sits in
   .fc-left, and the icon buttons / search / collapse control sit in .fc-right. Kept
   here, scoped to the calendar layout, so a future vendor upgrade cannot drop them. */
.calendar_layout .fc-toolbar {
	display: flex;
	flex-wrap: nowrap; /* one row; the right-hand controls collapse into the "more" menu instead */
	align-items: center;
	gap: 0.75em;
	text-align: left;
}

.calendar_layout .fc-toolbar .fc-left {
	display: flex;
	align-items: center;
	gap: 0.75em;
	order: 1;
	float: none;
}

.calendar_layout .fc-toolbar .fc-right {
	display: flex;
	align-items: center;
	gap: 0.75em;
	margin-left: auto;
	order: 3;
	float: none;
}

/* No order here: .calendar_layout .fc-header-toolbar .fc-center (above) pins the
   title to the far left with order 0. */
.calendar_layout .fc-toolbar .fc-center {
	display: flex;
	align-items: center;
}

/* Stock 3.10.2 floats each section's children and spaces them with margin-left;
   flexbox gap handles that now. */
.calendar_layout .fc .fc-toolbar > * > * {
	float: none;
	margin-left: 0;
}

/* Float-clearing div is meaningless in a flex row. */
.calendar_layout .fc-toolbar .fc-clear {
	display: none;
}

/* the collapse button (now in fc-header-toolbar) */
.fc-tb-clone-collapse {
	flex-grow: 0;
	margin: 0px;
	background-image: url(/images/calendar/collapse.svg);
	max-width: 20px;
	min-width: 20px;
	height: 20px;
}

.fc-tb-clone-collapse-open {
	background-image: url(/images/calendar/collapse.svg);
}

.fc-tb-clone-collapse-closed {
	background-image: url(/images/calendar/collapse-closed.svg);
}

/* REMOVED: fc-tb-clone-bottom, fc-tb-clone-time - internal containers no longer used */

/* contains the search element as well as the Create New button */
.fc-tb-clone-search {
	display: flex;
	flex-flow: row;
	justify-content: space-between;
	gap: 10px;
	align-items: center;
	flex-grow: 0;
}

/* Collapsed state (default) - constant height to prevent toolbar expansion */
.fc-tb-clone-search-wrapper {
	display: flex;
	flex-flow: row;
	justify-content: center;
	align-items: center;
	background-color: transparent;
	border: none;
	width: 34px;
	min-width: 34px;
	padding: 0;
	overflow: visible;
	height: 34px;
	box-sizing: border-box;
	align-items: center;
	gap: 0;
	cursor: pointer;
	transition: width 0.3s var(--cal-arrive),
	            min-width 0.3s var(--cal-arrive),
	            padding 0.3s var(--cal-arrive),
	            background-color 0.3s var(--cal-arrive),
	            border-radius 0.3s var(--cal-arrive),
	            gap 0.3s var(--cal-arrive);
	overflow: hidden;
	margin: 0 0 0 -5px;
	flex-shrink: 0;
}

/* Compact toolbar (narrow calendar): the search box is not shown at rest — it is opened from
   the "more" menu ("Search events") and collapses again when it loses focus while empty. The
   wide-calendar container query below restores the resting search icon. */
.fc-tb-clone-search-wrapper:not(.expanded) {
	display: none;
}

/* Expanded state - full search box */
.fc-tb-clone-search-wrapper.expanded {
	width: 250px;
	min-width: 150px;
	padding: 0 12px;
	border-radius: 5px;
	background-color: #ffffff;
	justify-content: flex-start;
	gap: 8px;
	cursor: text;
	margin-left: 0;
}

/* Input hidden when collapsed */
.fc-tb-clone-search-wrapper input.fc-tb-clone-search-input {
	font-family: 'Manrope'; font-weight: 300;
	color: #555555;
	outline: none;
	border: none;
	font-size: 14px;
	background: transparent;
	width: 0;
	opacity: 0;
	flex-grow: 0;
	padding: 0;
	transition: opacity 0.2s var(--cal-arrive) 0.1s, width 0.3s var(--cal-arrive), flex-grow 0.3s var(--cal-arrive);
}

/* Input visible when expanded */
.fc-tb-clone-search-wrapper.expanded input.fc-tb-clone-search-input {
	width: auto;
	opacity: 1;
	flex-grow: 1;
}

.fc-tb-clone-search-wrapper input.fc-tb-clone-search-input::placeholder {
	font-family: 'Manrope'; font-weight: 300;
	color: #888888;
}

/* Search icon - sized to match settings icon */
.fc-tb-clone-search-icon {
	background-image: url(/images/calendar/search.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	max-width: 25px;
	min-width: 25px;
	height: 25px;
	cursor: pointer;
	transition: scale 0.2s var(--cal-arrive);
	flex-shrink: 0;
}

.fc-tb-clone-search-icon:hover {
	scale: 1.1;
}

/* Smaller icon when expanded to balance with input */
.fc-tb-clone-search-wrapper.expanded .fc-tb-clone-search-icon {
	max-width: 18px;
	min-width: 18px;
	height: 18px;
}

/* view selector */
.fc-tb-clone-selector {
	display: flex;
	flex-grow: 0;
}

/* view selector wrapper */
/* The track stays flush - it is scenery. Only the pill is raised. Its radius
   nests the pill's: 5px inner + the 3px gap. */
.fc-tb-clone-selector-wrapper {
	border: 3px solid #E4E4E4;
	display: flex;
	flex-flow: row;
	justify-content: space-between;
	align-items: center;
	background-color: #E4E4E4;
	border-radius: 8px;
	position: relative;
}

.fc-tb-clone-selector-btn {
	flex: 1;
	text-align: center;
	font-family: 'Manrope'; font-weight: 400;
	color: #969696;
	background-color: transparent;
	border-radius: 5px;
	padding: 0px 10px;
	align-items: center;
	cursor: pointer;
	white-space: nowrap;
	position: relative;
	z-index: 1;
}

.fc-tb-clone-selector-btn-selected {
	color: #3c3b3b;
}

/* The pill is the one raised object here. Small enough to earn the dark
   underside edge - that cue is what makes it sit ON the track rather than read
   as a hole cut into it. Neutral tokens, light from straight above. */
.fc-tb-clone-selector-indicator {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	border-radius: 5px;
	background-image: var(--btn-neutral-sheen);
	background-color: var(--btn-neutral-fill);
	box-shadow:
		0 1px 1px rgba(23, 43, 71, 0.16),
		0 2px 5px rgba(23, 43, 71, 0.14),
		inset 0 0 0 1px var(--btn-neutral-border),
		inset 0 1px 0 var(--btn-neutral-specular),
		inset 0 -1px 0 var(--btn-neutral-underside);
	pointer-events: none;
	z-index: 0;
	will-change: transform;
}

/* Calendar view switch. Equal segments (a 1fr grid sizes every column to the
   widest label) so the pill only ever translates, and that translate is a CSS
   transition: it runs on the compositor and keeps sliding while the new view's
   pills render on a blocked main thread. GSAP never touches this transform. */
.fc-tb-clone-selector-wrapper.cal-view-switch {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 1fr;
	width: max-content; /* size by max-content, or the fr tracks resolve to the min-content of a flex item */
}
.fc-tb-clone-selector-wrapper.cal-view-switch .fc-tb-clone-selector-indicator {
	transition: transform 0.28s var(--cal-arrive);
}

/* REMOVED: fc-tb-clone-spacer - no longer used */

/* holds misc extra buttons i.e. settings */
.fc-tb-clone-buttons {
	display: flex;
	flex-flow: row;
	justify-content: flex-end;
	align-items: center;
	gap: 10px;
	flex-grow: 0;
	min-height: 37px; /* Fixed height to prevent toolbar expansion on search expand */
}

.fc-tb-clone-buttons-print {
	margin: 0 0 0 -5px;
	cursor: pointer;
	background-size: 25px 25px;
	background-repeat: no-repeat;
	background-position: center;
	width: 34px;
	height: 34px;
	background-color: transparent;
	background-image: url(/images/calendar/print-toolbar.svg);
	transition: scale 0.2s var(--cal-arrive);
}

.fc-tb-clone-buttons-print:hover {
	scale: 1.1;
}

.fc-tb-clone-buttons-reload {
	margin: 0 0 0 -5px;
	cursor: pointer;
	background-size: 25px 25px;
	background-repeat: no-repeat;
	background-position: center;
	width: 34px;
	height: 34px;
	background-color: transparent;
	background-image: url(/images/calendar/reload.svg);
	/* `scale:` is independent of `transform`, so the hover grow and the spinning
	   keyframe (which rotates via transform) no longer fight. */
	transition: scale 0.2s var(--cal-arrive);
}

.fc-tb-clone-buttons-reload:hover {
	scale: 1.1;
}

.fc-tb-clone-buttons-reload.spinning {
	animation: fc-reload-spin 0.8s linear infinite;
}

@keyframes fc-reload-spin {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

.fc-tb-clone-buttons-settings {
	margin: 0 0 0 -5px;
	cursor: pointer;
	background-size: 25px 25px;
	background-repeat: no-repeat;
	background-position: center;
	width: 34px;
	height: 34px;
	background-color: transparent;
	background-image: url(/images/calendar/settings-toolbar.svg);
	transition: scale 0.2s var(--cal-arrive);
}

.fc-tb-clone-buttons-settings:hover {
	scale: 1.1;
}

/* Responsive toolbar actions. The calendar area is a size container; below the breakpoint the
   print / reload / settings icons (and the resting search icon) are hidden and a single "more"
   control offers the same actions from a menu, so the header stays on one row. */
.calendar_layout .cal-content-wrapper {
	container: cal-toolbar / inline-size;
}

.fc-tb-clone-buttons-full {
	display: none;
	align-items: center;
	gap: 10px;
}

@container cal-toolbar (min-width: 1080px) {
	.fc-tb-clone-buttons-full {
		display: flex;
	}

	.fc-tb-clone-buttons-more {
		display: none;
	}

	.fc-tb-clone-search-wrapper:not(.expanded) {
		display: flex;
	}
}

@container cal-toolbar (max-width: 1079.98px) {
	.calendar_layout .fc-header-toolbar,
	.calendar_layout .fc-header-toolbar .fc-left,
	.calendar_layout .fc-header-toolbar .fc-right {
		gap: 6px;
	}

	.calendar_layout .fc-header-toolbar .fc-center {
		min-width: 0;
		flex: 1 1 auto;
		margin-right: 0;
	}

	.calendar_layout .fc-header-toolbar .fc-center h2 {
		min-width: 0;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.calendar_layout .fc-header-toolbar .fc-tb-clone-selector {
		margin-right: 0;
	}

	/* Open search below the compact toolbar without pushing Create Event offscreen. */
	.calendar_layout .fc-header-toolbar .fc-tb-clone-search-wrapper.expanded {
		position: absolute;
		right: 14px;
		top: calc(100% + 8px);
		width: min(300px, calc(100% - 28px));
		min-width: 0;
		max-width: none;
	}

	.calendar_layout .fc-header-toolbar .fc-tb-clone-search-wrapper.expanded input.fc-tb-clone-search-input {
		min-width: 0;
		max-width: none;
	}
}

/* The "more" control: three dots drawn as a mask so the colour matches the other glyphs. */
button.fc-tb-clone-buttons-more {
	cursor: pointer;
	width: 34px;
	height: 34px;
	padding: 0;
	border: 0;
	box-shadow: none;
	flex-shrink: 0;
	background: transparent;
	color: #5a6470;
	transition: color 0.15s ease, scale 0.2s ease;
}

.fc-tb-clone-buttons-more::before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='5' r='2.2'/><circle cx='12' cy='12' r='2.2'/><circle cx='12' cy='19' r='2.2'/></svg>") center / 22px 22px no-repeat;
	mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='5' r='2.2'/><circle cx='12' cy='12' r='2.2'/><circle cx='12' cy='19' r='2.2'/></svg>") center / 22px 22px no-repeat;
}

button.fc-tb-clone-buttons-more:hover {
	background: transparent;
	color: #1f2933;
	scale: 1.1;
}

button.fc-tb-clone-buttons-more:focus-visible {
	outline: 2px solid #0067ac;
	outline-offset: 2px;
}

/* Element-qualified so it out-ranks FullCalendar's own `.fc button`
   sizing (height: 2.1em, padding: 0 .6em). */
button.fc-tb-clone-create-button {
	border: none;
	color: white;
	border-radius: 8px;
	padding: 0px 20px;
	cursor: pointer;
	height: 37px;
	min-width: var(--workspace-primary-action-min-width);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	white-space: nowrap;
	flex-shrink: 0;
	font: inherit;
}

.fc-tb-clone-create-button-text {
	font-weight: inherit;
	color: #ffffff;
}

/** VCModal Base Styles **/

.vc-modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.35);
	z-index: 10000;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	/* Leaving curve at rest, arriving curve in the visible state - same pair the
	   calendar uses, so the modal and the page behind it move as one family. */
	transition: opacity 0.25s var(--cal-leave);
}

.vc-modal-visible.vc-modal-overlay {
	transition: opacity 0.25s var(--cal-arrive);
}

.vc-modal-panel {
	background: #fff;
	border: 1px solid #E0E0E0;
	border-radius: 12px;
	max-height: 85vh;
	overflow-y: auto;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10), 0 2px 6px rgba(0, 0, 0, 0.06);
	transform: scale(0.95);
	opacity: 0;
	transition: transform 0.25s var(--cal-leave), opacity 0.25s var(--cal-leave);
	display: flex;
	flex-direction: column;
}

.vc-modal-visible .vc-modal-panel {
	transform: scale(1);
	opacity: 1;
	transition: transform 0.25s var(--cal-arrive), opacity 0.25s var(--cal-arrive);
}

.vc-modal-visible {
	opacity: 1;
}

.vc-modal-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px 24px 16px;
	border-bottom: 1px solid #E8E8E8;
}

.vc-modal-header-title {
	font-family: 'Manrope', sans-serif; font-weight: 600;
	font-size: 18px;
	color: #2c2c2c;
	margin: 0;
}

.vc-modal-header-close {
	width: 28px;
	height: 28px;
	border-radius: 6px;
	background: transparent;
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.15s ease;
}

.vc-modal-header-close svg {
	width: 14px;
	height: 14px;
	stroke: #969696;
	stroke-width: 2;
	fill: none;
}

.vc-modal-header-close:hover {
	background: #F0F0F0;
}

.vc-modal-header-close:hover svg {
	stroke: #555;
}

.vc-modal-body {
	padding: 8px 24px 24px;
	flex: 1;
	overflow-y: auto;
}

.vc-modal-panel.calendar-settings-modal {
	overflow: hidden;
}

.vc-modal-panel.calendar-settings-modal .vc-modal-body {
	flex: 0 1 auto;
	min-height: 0;
	padding-right: 16px;
	padding-bottom: 12px;
}

.vc-modal-panel.calendar-settings-modal .calendar-settings-scroll-body {
	scrollbar-width: thin;
	scrollbar-color: transparent transparent;
}

.vc-modal-panel.calendar-settings-modal .calendar-settings-scroll-body.calendar-settings-scroll-active {
	scrollbar-color: rgba(67, 78, 92, 0.28) transparent;
}

.vc-modal-panel.calendar-settings-modal .calendar-settings-scroll-body::-webkit-scrollbar {
	width: 8px;
}

.vc-modal-panel.calendar-settings-modal .calendar-settings-scroll-body::-webkit-scrollbar-track {
	background: transparent;
}

.vc-modal-panel.calendar-settings-modal .calendar-settings-scroll-body::-webkit-scrollbar-thumb {
	border: 2px solid transparent;
	border-radius: 999px;
	background-color: transparent;
	background-clip: content-box;
}

.vc-modal-panel.calendar-settings-modal .calendar-settings-scroll-body.calendar-settings-scroll-active::-webkit-scrollbar-thumb {
	background-color: rgba(67, 78, 92, 0.28);
}

.vc-modal-panel.calendar-settings-modal .calendar-settings-scroll-body.calendar-settings-scroll-active::-webkit-scrollbar-thumb:hover {
	background-color: rgba(67, 78, 92, 0.42);
}

/* ------------------------------------------------ Notification banners -- */
/* The app's one notification surface: reminders, Util.notify toasts and administration
   notices. A stack at the top-right of the viewport, under the menu bar, the way system
   banners sit under the macOS menu bar. Dark frosted glass (the menu bar's charcoal, a
   step more opaque than the menus so small text holds over a white page), a lit top
   edge and a two-tier cast shadow - wide surface, so no dark underside edge. Colour
   lives only in the tone chip and the timer hairline; the one raised object on a card
   is its primary action. Entrance, exit and the reflow of neighbours are Web Animations
   driven from notification_banner.ts. */
.vc-notify-stack {
	position: fixed;
	top: 44px;
	right: 16px;
	width: 380px;
	max-width: calc(100vw - 32px);
	display: flex;
	flex-direction: column;
	gap: 10px;
	z-index: 10500;
	pointer-events: none;
}

.vc-notify {
	--vc-notify-tone: 255, 255, 255;
	position: relative;
	display: flex;
	gap: 12px;
	padding: 14px 16px 14px 14px;
	border-radius: 14px;
	pointer-events: auto;
	font-family: 'Manrope', sans-serif;
	color: rgba(255, 255, 255, 0.78);
	background-color: rgba(34, 36, 40, 0.72);
	background-image: linear-gradient(to bottom, rgba(96, 100, 108, 0.30), rgba(20, 22, 26, 0.45));
	-webkit-backdrop-filter: blur(24px) saturate(1.6);
	backdrop-filter: blur(24px) saturate(1.6);
	border: 1px solid rgba(255, 255, 255, 0.14);
	box-shadow:
		0 1px 2px rgba(8, 14, 24, 0.24),
		0 16px 40px rgba(8, 14, 24, 0.36),
		inset 0 1px 0 rgba(255, 255, 255, 0.18);
	will-change: transform;
}

.vc-notify-tone-success { --vc-notify-tone: 110, 231, 164; }
.vc-notify-tone-error   { --vc-notify-tone: 255, 150, 150; }
.vc-notify-tone-warning { --vc-notify-tone: 255, 207, 112; }
.vc-notify-tone-info    { --vc-notify-tone: 142, 197, 255; }

/* A caller's own icon sits on the platform button face. */
.vc-notify-icon {
	flex: 0 0 38px;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background-image: var(--btn-sheen);
	background-color: var(--btn-fill);
	box-shadow:
		inset 0 1px 0 var(--btn-specular),
		inset 0 -1px 0 var(--btn-underside),
		0 1px 2px rgba(8, 14, 24, 0.3);
}

.vc-notify-icon svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.9;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* A tone glyph sits in a chip of its own light instead: tinted glass, never a solid fill. */
.vc-notify[class*="vc-notify-tone-"] .vc-notify-icon {
	color: rgb(var(--vc-notify-tone));
	background-image: none;
	background-color: rgba(var(--vc-notify-tone), 0.16);
	box-shadow:
		inset 0 0 0 1px rgba(var(--vc-notify-tone), 0.26),
		inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.vc-notify-body {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.vc-notify-caption {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.5);
}

.vc-notify-title {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	color: #fff;
	overflow-wrap: anywhere;
	padding-right: 20px; /* clear of the close control */
}

.vc-notify-status {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 3px 0 2px;
	padding: 3px 10px 3px 8px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	color: rgba(255, 255, 255, 0.8);
	background: rgba(255, 255, 255, 0.1);
}

.vc-notify-status::before {
	content: '';
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: currentColor;
}

.vc-notify-status-urgent {
	color: #ff9d9d;
	background: rgba(255, 120, 120, 0.16);
}

.vc-notify-status-urgent::before {
	animation: vc-notify-pulse 1.6s ease-in-out infinite;
}

.vc-notify-status-now {
	color: #7fe3a8;
	background: rgba(90, 210, 140, 0.16);
}

@keyframes vc-notify-pulse {
	0%, 100% { opacity: 0.45; }
	50%      { opacity: 1; }
}

.vc-notify-line {
	font-size: 13px;
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.78);
	overflow-wrap: anywhere;
}

.vc-notify-actions {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	margin-top: 8px;
}

.vc-notify-btn {
	font-family: 'Manrope', sans-serif;
	font-weight: 600;
	font-size: 13px;
	line-height: 1;
	padding: 8px 14px;
	border-radius: 8px;
	cursor: pointer;
	white-space: nowrap;
	color: #fff;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.12);
	transition: background-color 0.15s var(--cal-arrive);
}

.vc-notify-btn:hover {
	background: rgba(255, 255, 255, 0.18);
}

/* The primary action takes the platform button face (tokens from :root). */
.vc-notify-btn-primary {
	color: #fff;
	border: 1px solid var(--btn-border);
	background-image: var(--btn-sheen);
	background-color: var(--btn-fill);
	box-shadow:
		inset 0 1px 0 var(--btn-specular),
		inset 0 -1px 0 var(--btn-underside),
		0 1px 2px rgba(8, 14, 24, 0.3);
}

.vc-notify-btn-primary:hover {
	background-color: var(--btn-fill-hover);
}

/* The compact card - a toast: no eyebrow, a small tone chip, the message as the main line. */
.vc-notify-compact {
	gap: 11px;
	padding: 12px 14px 12px 12px;
}

.vc-notify-compact .vc-notify-icon {
	flex-basis: 28px;
	width: 28px;
	height: 28px;
	border-radius: 8px;
}

.vc-notify-compact .vc-notify-icon svg {
	width: 16px;
	height: 16px;
	stroke-width: 2.2;
}

.vc-notify-compact .vc-notify-body {
	justify-content: center;
	min-height: 28px;
	gap: 2px;
	padding-right: 18px; /* clear of the close control */
}

.vc-notify-compact .vc-notify-title {
	font-size: 13.5px;
	font-weight: 700;
	padding-right: 0;
}

.vc-notify-compact .vc-notify-line {
	font-weight: 500;
	color: rgba(255, 255, 255, 0.94);
}

.vc-notify-compact .vc-notify-title ~ .vc-notify-line {
	color: rgba(255, 255, 255, 0.72);
}

.vc-notify-compact .vc-notify-actions {
	justify-content: flex-start;
	margin-top: 7px;
}

.vc-notify-compact .vc-notify-btn {
	font-size: 12px;
	padding: 6px 10px;
	border-radius: 7px;
}

/* How long a self-dismissing card has left: a hairline draining along the bottom edge,
   stopped while the pointer holds the card. */
.vc-notify-timer {
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: 0;
	height: 2px;
	border-radius: 2px 2px 0 0;
	background: rgba(var(--vc-notify-tone), 0.55);
	transform-origin: left center;
	animation: vc-notify-drain linear forwards;
	pointer-events: none;
}

.vc-notify-held .vc-notify-timer {
	animation-play-state: paused;
}

@keyframes vc-notify-drain {
	from { transform: scaleX(1); }
	to   { transform: scaleX(0); }
}

/* Close control: hidden until the pointer is on the card, as system banners do. */
.vc-notify-close {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	border: none;
	padding: 0;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(255, 255, 255, 0.72);
	background: rgba(255, 255, 255, 0.12);
	opacity: 0;
	transform: scale(0.85);
	transition: opacity 0.15s var(--cal-arrive), transform 0.15s var(--cal-arrive), background-color 0.15s var(--cal-arrive);
}

.vc-notify:hover .vc-notify-close,
.vc-notify-close:focus-visible {
	opacity: 1;
	transform: scale(1);
}

.vc-notify-close:hover {
	background: rgba(255, 255, 255, 0.22);
	color: #fff;
}

.vc-notify-close svg {
	width: 10px;
	height: 10px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
}

@media (prefers-reduced-motion: reduce) {
	.vc-notify-status-urgent::before {
		animation: none;
	}
	.vc-notify-timer {
		display: none;
	}
	.vc-notify-close {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

.session-expired-countdown {
	margin-top: 12px;
	font-weight: 600;
	color: #b3261e;
}

.vc-modal-footer {
	padding: 16px 24px 20px;
	border-top: 1px solid #E8E8E8;
	display: flex;
	justify-content: flex-end;
	gap: 10px;
}

/* File preview viewer (#1387) */
.fpv-body {
	min-height: 320px;
	/* No own scroll/max-height — the modal body (.vc-modal-body) is the single
	   scroller; a second one here produced nested double scrollbars. */
	background: #f3f4f6;
}
.fpv-pages {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	padding: 20px 0 24px;
}
.fpv-page {
	box-shadow: 0 2px 10px rgba(0,0,0,0.12), 0 1px 3px rgba(0,0,0,0.08);
	background: #fff;
	border-radius: 3px;
	max-width: 100%;
}
.fpv-image {
	display: block;
	margin: 12px auto;
	max-width: 100%;
	height: auto;
	box-shadow: 0 1px 4px rgba(0,0,0,0.18);
}
.fpv-status {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 14px;
	min-height: 320px;
	color: #374151;
	font-size: 14px;
}
.fpv-spinner {
	width: 32px;
	height: 32px;
	border: 3px solid #d1d5db;
	border-top-color: #6b7280;
	border-radius: 50%;
	animation: fpv-spin 0.8s linear infinite;
}
@keyframes fpv-spin {
	to { transform: rotate(360deg); }
}
.fpv-download {
	cursor: pointer;
}
/* Native grid view for csv/xls/xlsx (#1387) */
.fpv-grid {
	padding: 16px;
	overflow-x: auto;
}
.fpv-grid-tabs {
	display: flex;
	gap: 4px;
	margin-bottom: 10px;
	flex-wrap: wrap;
}
.fpv-grid-tab {
	border: 1px solid #d1d5db;
	background: #fff;
	border-radius: 6px;
	padding: 4px 12px;
	font-size: 12px;
	cursor: pointer;
	color: #374151;
}
.fpv-grid-tab.active {
	background: #2563eb;
	color: #fff;
	border-color: #2563eb;
}
.fpv-grid-table {
	border-collapse: collapse;
	background: #fff;
	font-size: 13px;
	box-shadow: 0 1px 4px rgba(0,0,0,0.10);
}
.fpv-grid-table th,
.fpv-grid-table td {
	border: 1px solid #e5e7eb;
	padding: 5px 10px;
	text-align: left;
	white-space: nowrap;
	max-width: 320px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.fpv-grid-table th {
	background: #f3f4f6;
	font-weight: 600;
	position: sticky;
	top: 0;
}
.fpv-grid-table tr:nth-child(even) td {
	background: #fafafa;
}
.fpv-grid-truncated {
	margin-top: 10px;
	font-size: 12px;
	color: #6b7280;
	font-style: italic;
}

.vc-modal-btn {
	font-family: 'Manrope', sans-serif; font-weight: 500;
	font-size: 14px;
	border-radius: 10px;
	padding: 9px 24px;
	cursor: pointer;
	transition: 0.15s ease;
	outline: none;
	background: #F3F3F3;
	color: #3c3b3b;
	border: 1px solid #D0D0D0;
}

.vc-modal-btn:hover {
	background: #E4E4E4;
}

.vc-modal-btn-primary {
	color: #fff;
	border-color: var(--btn-border);
	border-radius: 8px;
}


.vc-modal-btn:disabled {
	opacity: 0.45;
	cursor: default;
	pointer-events: none;
}

.vc-modal-panel.calendar-settings-modal .vc-modal-btn-primary:disabled,
.vc-modal-panel.calendar-settings-modal .vc-modal-btn-primary:disabled:hover,
.vc-modal-panel.calendar-settings-modal .vc-modal-btn-primary:disabled:active {
	background: #c8cfd8;
	border-color: #c8cfd8;
	color: #ffffff;
	cursor: not-allowed;
	box-shadow: none;
}

.vc-modal-btn-danger {
	background: #d32f2f;
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 0.18);
	box-shadow: 0 0 0 1px #b71c1c, 0 1px 2px rgba(9, 9, 11, 0.12);
}
.vc-modal-btn-danger:hover {
	background: #c62828;
	transform: scale(1.02);
}
.vc-modal-btn-danger:active {
	background: #b71c1c;
	transform: scale(0.98);
}

/* --------------------------------------------- 2FA wizard (VCModal) -- */

.twofa_wiz_content {
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	color: #3c3b3b;
	line-height: 1.5;
}

.twofa_wiz_content p {
	margin: 0 0 12px;
}

.twofa_choice_option {
	border: 1px solid #D0D0D0;
	border-radius: 10px;
	padding: 14px 16px;
	margin-top: 10px;
	cursor: pointer;
	transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.twofa_choice_option:hover {
	border-color: #9aa4af;
}

.twofa_choice_option.is-selected {
	border-color: #00529b;
	background: #f2f7fc;
	box-shadow: inset 0 0 0 1px #00529b;
}

.twofa_choice_title {
	font-weight: 700;
	margin-bottom: 4px;
}

.twofa_choice_blurb {
	font-size: 13px;
	color: #68717c;
}

.twofa_field_row {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
}

.twofa_field_row .twofa_input {
	flex: 1 1 auto;
	min-width: 0;
}

.twofa_field_row .vc-modal-btn {
	flex: 0 0 auto;
	white-space: nowrap;
}

.twofa_input {
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	padding: 9px 12px;
	border: 1px solid #D0D0D0;
	border-radius: 8px;
	outline: none;
	box-sizing: border-box;
}

.twofa_input:focus {
	border-color: #00529b;
	box-shadow: 0 0 0 3px rgba(0, 82, 155, 0.12);
}

.twofa_code_step {
	margin-top: 4px;
	padding-top: 12px;
	border-top: 1px solid #ECECEC;
}

.fc-settings-delete-confirm {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 120px;
	padding: 24px;
}
.fc-settings-delete-confirm-msg {
	font-family: 'Manrope', sans-serif;
	font-size: 16px;
	font-weight: 500;
	color: #333;
	text-align: center;
}

/** Calendar Settings Styles **/

.fc-settings-section {
	margin-top: 28px;
	padding-top: 12px;
	border-top: 1px solid #e5e5e5;
}

.fc-settings-section:first-child {
	margin-top: 12px;
	border-top: none;
	padding-top: 0;
}

.vc-modal-panel.calendar-settings-modal .fc-settings-section:not(.fc-settings-calendar-sync-section),
.vc-modal-panel.task-settings-modal .fc-settings-section {
	background: #fff;
	border: 1px solid #e4e7eb;
	border-radius: 14px;
	margin-top: 48px;
	padding: 14px 18px 16px;
	position: relative;
}

.vc-modal-panel.calendar-settings-modal .fc-settings-section:not(.fc-settings-calendar-sync-section):first-child,
.vc-modal-panel.task-settings-modal .fc-settings-section:first-child {
	margin-top: 40px;
}

.vc-modal-panel.calendar-settings-modal
	.fc-settings-section:not(.fc-settings-calendar-sync-section)
	> .fc-settings-section-title,
.vc-modal-panel.task-settings-modal .fc-settings-section > .fc-settings-section-title {
	position: absolute;
	top: -28px;
	left: -1px;
	margin: 0;
}

.vc-modal-panel.calendar-settings-modal .fc-settings-section:not(.fc-settings-calendar-sync-section) .fc-settings-time-row:last-child {
	margin-bottom: 0;
}

.vc-modal-panel.task-settings-modal .fc-settings-section-card {
	background: transparent;
	border-radius: 0;
	padding: 0;
}

.fc-settings-section-card {
	background: #F3F3F3;
	border-radius: 10px;
	padding: 12px 20px;
}

.fc-settings-section-card .fc-settings-row {
	margin-bottom: 6px;
	min-height: 30px;
}

.fc-settings-section-title {
	font-family: 'Manrope', sans-serif; font-weight: 700;
	font-size: 14px;
	color: #969696;
	text-transform: uppercase;
	letter-spacing: 0.8px;
	margin: 0 0 12px 0;
}

.fc-settings-section-help {
	margin: -4px 0 14px;
	color: #68717c;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	line-height: 18px;
}

.fc-settings-calendar-sync-section {
	margin-top: 24px;
	padding-top: 24px;
	padding-bottom: 4px;
}

.vc-modal-panel.calendar-settings-modal .fc-settings-calendar-sync-section {
	margin-top: 14px;
	padding-top: 0;
	border-top: none;
}

.calendar-settings-integrations-container {
	min-height: 0;
}

.fc-settings-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
	min-height: 36px;
}

.fc-settings-row:last-child {
	margin-bottom: 0;
}

.fc-settings-label {
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	color: #3c3b3b;
	flex-shrink: 0;
	margin-right: 16px;
}

.fc-settings-label-indented {
	padding-left: 16px;
}

.fc-settings-select-locked .select2-selection__arrow b {
	display: none !important;
}
.fc-settings-select-locked .select2-selection__arrow {
	background: url(/images/icons/18/gray/lock.png) no-repeat center center;
	background-size: 14px 14px;
}

.fc-settings-control {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex: 1;
	min-width: 0;
}

.vc-modal-panel.calendar-settings-modal .fc-settings-preferences-section .fc-settings-control {
	flex: 0 0 237px;
	width: 237px;
}

.vc-modal-panel.calendar-settings-modal .fc-settings-preferences-section .fc-settings-control > select,
.vc-modal-panel.calendar-settings-modal .fc-settings-preferences-section .fc-settings-control > .select2-container,
.vc-modal-panel.calendar-settings-modal .fc-settings-preferences-section .fc-settings-control > .fc-settings-color-input {
	box-sizing: border-box;
	width: 100% !important;
	min-width: 0;
}

.fc-settings-day-pills {
	display: flex;
	gap: 6px;
}

.fc-settings-day-pill {
	width: 36px;
	height: 30px;
	border-radius: 8px;
	border: 1.5px solid #D0D0D0;
	background: #FAFAFA;
	color: #969696;
	font-family: 'Manrope', sans-serif; font-weight: 500;
	font-size: 12px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: 0.15s ease;
	user-select: none;
}

.fc-settings-day-pill:hover {
	border-color: #00529b;
	color: #00529b;
	background: #f0f6fc;
}

.fc-settings-day-pill-active {
	background: #00529b;
	border-color: #00529b;
	color: #fff;
}

.fc-settings-day-pill-active:hover {
	background: #003d73;
}

.fc-settings-time-row {
	display: flex;
	align-items: center;
	margin-bottom: 16px;
}

.fc-settings-time-row .fc-settings-label {
	margin-right: auto;
}

.fc-settings-time-separator {
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	color: #B2B2B2;
	margin: 0 12px;
	flex-shrink: 0;
}

.vc-modal-panel.calendar-settings-modal .fc-settings-time-separator {
	width: 37px;
	margin: 0;
	text-align: center;
}

.fc-settings-time-row input {
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	color: #3c3b3b;
	border: 1.5px solid #D0D0D0;
	border-radius: 8px;
	padding: 6px 10px;
	width: 100px;
	background: #FAFAFA;
	transition: border-color 0.15s ease;
	outline: none;
	box-sizing: border-box;
}

.fc-settings-time-row input:focus {
	border-color: #00529b;
}

.fc-settings-control select {
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	color: #3c3b3b;
	border: 1.5px solid #D0D0D0;
	border-radius: 8px;
	padding: 6px 30px 6px 10px;
	background: #FAFAFA;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23969696' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 10px center;
	cursor: pointer;
	transition: border-color 0.15s ease;
	outline: none;
	min-width: 150px;
}

.fc-settings-control select:focus {
	border-color: #00529b;
}

/* #1507: "My Calendar Color" swatch input in Calendar Settings — shows the chosen colour as its
   own background; opens the hex colorpicker on click. */
.fc-settings-control .fc-settings-color-input {
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-align: center;
	border: 1.5px solid #D0D0D0;
	border-radius: 8px;
	padding: 6px 10px;
	min-width: 150px;
	cursor: pointer;
	outline: none;
	transition: border-color 0.15s ease;
}
.fc-settings-control .fc-settings-color-input:focus {
	border-color: #00529b;
}

.fc-settings-control .select2-container {
	min-width: 150px;
}

.fc-settings-control .select2-container .select2-selection--single {
	border: 1.5px solid #D0D0D0;
	border-radius: 8px;
	padding: 2px 10px;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	background: #FAFAFA;
	height: auto;
}

.fc-settings-control .select2-container .select2-selection--single .select2-selection__rendered {
	line-height: 26px;
}

.fc-settings-control .select2-container .select2-selection--single .select2-selection__arrow {
	height: 32px;
}

.fc-settings-toggle {
	position: relative;
	width: 42px;
	height: 24px;
	flex-shrink: 0;
	cursor: pointer;
}

.fc-settings-toggle input {
	opacity: 0;
	width: 0;
	height: 0;
	position: absolute;
}

.fc-settings-toggle-track {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	/* #1605 CAL-025: the off track was #D0D0D0, about 1.6:1 against its own white thumb and
	   fainter still on a white panel - under the 3:1 WCAG asks of a control that carries
	   meaning by colour. #8E8E8E is 3.3:1 against white, so off reads as deliberate rather
	   than disabled, while staying clearly distinct from the blue of on. */
	background: #8E8E8E;
	border-radius: 12px;
	transition: background 0.2s ease;
}

.fc-settings-toggle input:checked + .fc-settings-toggle-track {
	background: #00529b;
}

.fc-settings-toggle-thumb {
	position: absolute;
	top: 3px;
	left: 3px;
	width: 18px;
	height: 18px;
	background: #fff;
	border-radius: 50%;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
	transition: transform 0.2s ease;
	pointer-events: none;
}

.fc-settings-toggle input:checked ~ .fc-settings-toggle-thumb {
	transform: translateX(18px);
}

/* Select2 dropdowns above VCModal overlay */
.select2-container--open .select2-dropdown {
	z-index: 10001;
}

.select2-results__options {
	overflow-x: hidden;
}

/* ParetoTimePicker dropdowns above VCModal overlay */

/* Configure button in settings */
.fc-settings-configure-btn {
	font-family: 'Manrope', sans-serif;
	font-weight: 600;
	font-size: 13px;
	color: #00529b;
	background: transparent;
	border: 1.5px solid #00529b;
	border-radius: 8px;
	padding: 5px 16px;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}

.fc-settings-configure-btn:hover {
	background: #00529b;
	color: #fff;
}

/* Color config view */
.fc-settings-color-config-header {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
	margin-bottom: 12px;
}
.fc-settings-color-config-header .fc-settings-section-title {
	margin: 0;
}
.fc-settings-add-status-btn {
	width: 26px; height: 26px;
	border-radius: 50%;
	border: 1.5px solid #ccc;
	background: #fff;
	color: #888;
	font-size: 16px; line-height: 1;
	cursor: pointer;
	display: flex; align-items: center; justify-content: center;
	transition: all 0.15s;
	padding: 0;
}
.fc-settings-add-status-btn:hover {
	border-color: #3b82f6; color: #3b82f6;
}
.fc-settings-status-menu-btn {
	background: none;
	border: none;
	cursor: pointer;
	color: #94a3b8;
	padding: 2px 4px;
	border-radius: 4px;
	line-height: 1;
	margin-left: 6px;
}
.fc-settings-status-menu-btn:hover {
	background: #f1f5f9;
	color: #475569;
}
.fc-settings-status-menu-spacer {
	display: inline-block;
	width: 24px;
	margin-left: 6px;
}
.fc-settings-status-label-text {
	cursor: text;
}
.fc-settings-status-label-input {
	font: inherit;
	border: 1px solid #3b82f6;
	border-radius: 4px;
	padding: 1px 4px;
	outline: none;
	width: 120px;
	background: #fff;
}
.fc-settings-pending-label {
	display: inline-block !important;
}
.fc-settings-color-config {
	padding: 0;
	position: relative;
}

.fc-settings-color-config .fc-settings-row {
	min-height: 32px;
	margin-bottom: 8px;
	background: #f3f3f3;
	border-radius: 10px;
	padding: 8px 16px 8px 12px;
}

.fc-settings-color-config .fc-settings-row:last-child {
	margin-bottom: 0;
}

/* Drag handle: CSS-drawn bars (thicker stroke + wider gaps than fa-bars) */
.fc-settings-drag-handle {
	color: #b0b0b0;
	cursor: grab;
	padding: 2px 2px 2px 0;
	flex-shrink: 0;
	line-height: 1;
}
.fc-settings-drag-handle i {
	display: none;
}
.fc-settings-drag-handle::before {
	content: '';
	display: block;
	width: 14px;
	/* three 2px bars with 3px gaps */
	height: 12px;
	background: repeating-linear-gradient(to bottom, currentColor 0, currentColor 2px, transparent 2px, transparent 5px);
}
.fc-settings-drag-handle:hover {
	color: #888;
}
.ui-sortable-helper .fc-settings-drag-handle {
	cursor: grabbing;
}

/* Sortable placeholder */
.fc-settings-row-placeholder {
	background: #f3f3f3;
	border-radius: 10px;
	min-height: 38px;
	margin-bottom: 8px;
}

/* Dragging state */
.fc-settings-color-config .ui-sortable-helper {
	background: #f3f3f3;
	border-radius: 10px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}

.vc-modal-body-centered {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-top: 24px;
}

.fc-settings-color-config .fc-settings-label {
	display: flex;
	align-items: center;
	gap: 8px;
}

/* Color dot in settings label */
.fc-settings-color-dot {
	display: inline-block;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	flex-shrink: 0;
}

/* Select2 color swatch in dropdown */
.fc-settings-color-option {
	display: flex;
	align-items: center;
	gap: 8px;
}

.fc-settings-color-option-swatch {
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex-shrink: 0;
}

/* Visibility toggle spacing in color config */
.fc-settings-color-config .fc-settings-toggle {
	margin-left: 10px;
}

/* Disabled toggle (Completed status — always on, not editable) */
.fc-settings-toggle-disabled {
	cursor: default;
	opacity: 0.4;
}

/* Dimmed row when status is hidden from Board */
.fc-settings-status-hidden .fc-settings-label,
.fc-settings-status-hidden .select2-container {
	opacity: 0.45;
}

/** End Calendar Header Redesign **/

/* ======================================================= CALENDAR MOTION == */
/* The house easing ladder from jq_overrides.css, named locally. GSAP owns
   entrances (landing, navigation arrival, pill cascade, settle pops); CSS owns
   rest, hover and press. Anything GSAP tweens reserves `transform` for GSAP -
   CSS states on those elements use `translate:` and `scale:` instead. */
:root {
	--cal-arrive: cubic-bezier(0.32, 0.72, 0, 1);
	--cal-leave:  cubic-bezier(0.4, 0, 0.6, 1);
	--cal-settle: cubic-bezier(0.34, 1.32, 0.64, 1);
}

/* While a GSAP cascade runs, stylesheet transitions on the pills are suspended so
   the tween's per-frame opacity writes are not re-eased by .fade / .cal-search-miss. */
.cal-gsap-owns-opacity .cal-activity,
.cal-gsap-owns-opacity .cal-activity.fade,
.cal-gsap-owns-opacity .cal-activity.cal-search-miss {
	transition: none !important;
}

/* Settings modal: business-day pills and the switch thumbs move instead of swapping. */
.fc-settings-day-pill {
	transition: background-color 0.15s var(--cal-arrive), color 0.15s var(--cal-arrive), border-color 0.15s var(--cal-arrive);
}
.fc-settings-toggle-track {
	transition: background-color 0.2s var(--cal-arrive);
}
.fc-settings-toggle-thumb {
	transition: transform 0.2s var(--cal-arrive);
}

/* List view: the loading labels breathe instead of hard-toggling. */
.cal-list-loading-top,
.cal-list-loading-bottom,
.task-board-loading,
.tasks-container .task-infinite-status.loading,
.entity-infinite-status.loading,
.contact-infinite-status.loading,
.record-view-addon-shell .record-view-addon-status {
	animation: cal-list-loading-breathe 1.2s ease-in-out infinite;
}
@keyframes cal-list-loading-breathe {
	0%, 100% { opacity: 0.35; }
	50%      { opacity: 0.9; }
}

/* Removes the ANIMATION, not the elevation: shadows, borders, the cream today cell
   and the raised pill still distinguish state - only the travel between states is
   dropped. .calendar_layout holds the toolbar (inside FullCalendar's header), the
   grid and the sidebar. The hover popup and the create menu render outside it, into
   the tab content, so they are listed explicitly. GSAP calls are gated separately
   through DragMotionController.motionOk(). */
@media (prefers-reduced-motion: reduce) {
	.calendar_layout *,
	.calendar_layout *::before,
	.calendar_layout *::after,
	.tasks-layout-wrapper *,
	.tasks-layout-wrapper *::before,
	.tasks-layout-wrapper *::after,
	.entity-list-main-content *,
	.entity-list-main-content *::before,
	.entity-list-main-content *::after,
	.entity-list-quick-filter-popover *,
	.processes-module-root *,
	.processes-module-root *::before,
	.services-module-root *,
	.services-module-root *::before,
	.filters-module-root *,
	.filters-module-root *::before,
	.fs-layout-container *,
	.fs-layout-container *::before,
	.scheduler-workspace *,
	.scheduler-workspace *::before,
	.fb_v4_content_wrapper *,
	.fb_v4_content_wrapper *::before,
	.email-ws-root *,
	.email-ws-root *::before,
	.history-module-root *,
	.history-module-root *::before,
	.rb-root *,
	.rb-root *::before,
	.fs-move-overlay *,
	.workflow-builder-container *,
	.workflow-builder-container *::before,
	.record-shell *,
	.record-shell *::before,
	.record-shell *::after,
	.task-board-drag-helper,
	.task-back-to-top,
	.bubble-popup.bp-override,
	.fc-popover,
	.vc-modal-overlay,
	.vc-modal-panel {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}
/* ==================================================== END CALENDAR MOTION == */


/** Pagination **/

table.pagination {
	width: auto;
}

table.pagination * select {
	width: auto;
}

table.pagination * td {
	text-align: center;
}

.panel_content_rv_tab_content {
	position: relative;
	flex: 1 1 auto;
	min-height: 0;
	min-width: 0;
	overflow: auto;
	background-color: #f0feff;
	box-sizing: border-box;
	padding: 5px var(--toolkit-shell-gutter) var(--toolkit-shell-gutter) !important;
}

/* ── DataTable list view: flex layout with internal table scroll ── */

.tkrv-list-view {
	height: 100%;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.tkrv-list-view > .tk_section_heading {
	flex-shrink: 0;
}

/* DataTable container (GeneralizedTypeDataTable.containerElement) */
.tkrv-list-view > div:not(.tk_section_heading):not(.bulk-action-bar) {
	flex: 1;
	min-height: 0;
	display: flex;
	flex-direction: column;
	overflow-y: hidden;
}

.tkrv-list-view .custom_table_select {
	flex-shrink: 0;
	align-self: flex-end;
}

.tkrv-list-view .dataTables_wrapper {
	flex: 1;
	min-height: 0;
	display: flex;
	flex-direction: column;
}

.tkrv-list-view .dataTables_length,
.tkrv-list-view .dataTables_filter {
	flex-shrink: 0;
}

.tkrv-list-view .dt-table-scroll {
	flex: 1;
	min-height: 0;
	overflow: auto;
}

.tkrv-list-view .dataTables_info,
.tkrv-list-view .dataTables_paginate {
	flex-shrink: 0;
}

/* File Store: prevent parent from scrolling, let internal areas handle it */
.panel_content_rv_tab_content.fs-tab-content {
	overflow: hidden;
	height: calc(100% - 166px);
}

/* File Store flexbox layout (replaces table) */
.fs-layout-container {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 0;
	box-sizing: border-box;
}

.fs-layout-columns {
	display: flex;
	flex-direction: row;
	flex: 1;
	min-height: 0;
	gap: 15px;
}

/** popup (used in calendar so far) **/

.popup_tip {
	position: absolute;
    border-radius: 15px;
    padding: 20px;
    border: 2px solid #0080ff;
    min-width: 200px;
    min-height: 40px;
    background-color: #fff;
    color: #333;
}

/** basically a placeholder **/

.vc_internal_link {
	white-space: nowrap;
}

/** mobile styling **/

#menubar.mobile {
	height: 96px;
	line-height: 96px;
	font-size: 48px;
}

.mobile_button {
	cursor: pointer;
	background-size: cover;
	width: 60px;
	height: 60px;
	/*display: inline-block;*/
	z-index: 10;
	vertical-align: middle;
	background-color: transparent;
}

.mobile_menu {
	margin: 0px 20px 0px 20px;
	background-image: url(/images/icons/menu-white-32.png);
}

.mobile_menu:active {
	background-image: url(/images/icons/menu-blue-32.png);
}

.side_menu_mobile {
	left: 0px;
	top: 96px;
	position: fixed;
	overflow: auto;
	width: 100%;
	height: 100%;
    background-color: rgba(0,0,0,0.9);
    color: rgb(100, 200, 230);
}

.side_menu_mobile > ul {
    list-style-type: none;
    padding-left: 0px;
}

.side_menu_mobile > ul > li {
	height: 200px;
	line-height: 200px;
	color: #efefef;
	border-bottom: 5px solid #61B9C8;
	white-space: nowrap;
}

.side_menu_mobile > ul > li.mobile_menu_book_li {
    font-size: 70px;
	padding-left: 10px;
	background-color: #337C9D;
}

.side_menu_mobile > ul > li.mobile_menu_section_li {
    font-size: 50px;
	padding-left: 30px;
	background-color: #3FA3BA;
}

#mobile_vertical_menu_icon {
	font-size: 50px;
	margin-right: 20px;
}

.mobile_vertical_menu_container {
	position: fixed;
	top: 96px;
	left: 0px;
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	overflow: auto;
	text-align: center;
	background-color: #eee;
}

.mobile_vertical_menu_tile {
	position:relative;
    color: #ffffff;
    background-color: #0080ff;
    border: 5px solid #004090;
    width: 80%;
    display: inline-block;
    cursor: pointer;
    vertical-align: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 70px;
    box-shadow: black 25px 25px 35px;
}


.mobile_vertical_menu_tile > div {
	font-size: 50px;
    position: absolute;
    bottom: 2px;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    padding: 5px 0px 5px 0px;
}

.mobile_vertical_menu_home_button {
	width: 80%;
	height: 100px;
	line-height: 100px;
	margin-bottom: 70px;
	margin-top: 20px;
	border: 5px solid #064899;
	display: inline-block;
    box-shadow: black 25px 25px 35px;
	background-color: rgba(5, 90, 114, 0.671);
}

.mobile_vertical_menu_home_button > span {
    font-size:50px;
    color: #fff;
	vertical-align: top;
	margin-left: 20px;
}

.mobile_vertical_menu_home_button > img  {
	height: 80%;
	display: inline-block;
	margin-top: 10px;
}

/* resources menu */

.resource_menu {
	margin: 0px 20px 0px 20px;
	background-image: url(/images/icons/attachment_white_32.png);
}

.resource_menu:active {
	background-image: url(/images/icons/attachment_blue_32.png);
}

.mobile_resource_menu_container {
	position: fixed;
	top: 96px;
	left: 0px;
	width: 100%;
	background-color: #1e4a6f;
	color: #fff;
	overflow: auto;
}

.mobile_resource_menu_container > ul > li {
	padding-bottom: 30px;
	padding-top: 30px;
}

.mobile_resource_menu_container > ul > li:not(:last-child) {
	border-bottom: 3px solid #fff;
}

.mobile_resource_menu_container > ul > li > span {
	font-size: 40px;
}

.mobile_resource_menu_item_image {
	margin-bottom: -7px;
	margin-right: 15px;
	margin-left: 15px;
	cursor: pointer;
	height: 40px;
}

/** end mobile styling **/

/** toolkit section headings **/

.tk_section_heading {
	height: 35px;
	line-height: 35px;
	padding-left: 10px;
	padding-right: 10px;
	/*background-color: #2b5b83;*/
	font-size: 15px;
	/*color: #efefef;*/
	font-weight: bold;
	vertical-align: middle;
	margin-bottom: 10px;
	margin-left: -10px;
	margin-right: -10px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.tk_section_heading > .tk_section_heading_right_panel {
	display: flex;
	align-items: center;
}

.tk_section_heading > .tk_section_heading_right_panel > button {
	margin-left: 10px;
}
/*
h1.tk_section_heading {
}

h2.tk_section_heading {
}
*/

h3.tk_section_heading {
	/*color: #efefef;*/
	/*background-color: #2b5b83;*/
	color: #0c0c0c;
	background-color: #d6e4f0;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
}


.cal_ops_container > div.ops_container > div.tk_section_heading {
	color: #333333;
	background-color: #E8E8E8;
}

/* hover state now handled by .cal_ops_list li:hover */

.fixed_heading {
	position: fixed;
	right: 50px;
	z-index: 2;
	color: #efefef;
	padding-left: 1px;
	/*transform: translateX(-50%);*/
}

.fixed_heading div.fixed_name {
	background-color: #00529b;
}

.fixed_name_span {
	padding-right: 30px;
	margin-left: 20px;
	margin-top: 0px;
}

.tk_section_heading.fixed_heading {
	height: 35px;
}


@media only screen and (max-width: 1450px) {

	.tk_section_heading.fixed_heading {
		z-index: 2;
		width: 25px;
  		/*transition: 0.3s;*/
  		height: 40px;
  		padding-top: 3px;
  		border-top-left-radius: 10px;
  		border-bottom-left-radius: 10px;
		background-color: #00529b;
	}

	.tk_section_heading.fixed_heading:after {
  		content: "\27FA";
	}

	.tk_section_heading.fixed_heading > div {
		display: none;
		transition: 0.3s;
	}

	.tk_section_heading.fixed_heading:hover {
		width: unset;
  		/*transition: 0.3s;*/
  		padding-top: 0px;
  		height: unset;
  		border-top-left-radius: unset;
  		border-bottom-left-radius: unset;
  		margin-top: unset;
  		background: none;
	}

	.tk_section_heading.fixed_heading:hover > div {
		display: block;
	}

	.tk_section_heading.fixed_heading:hover:after {
  		content: unset;
	}
}

div.gtype-page-add-btn {
	font-size: 16px;
	font-weight: normal;
	background-color: #e38c3d;
	color: #fff;
	display: inline-block;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 12px;
	padding-right: 12px;
	cursor: pointer;
	/*border: 1px solid #c0c0c0;*/
	border-radius: 2px;
	line-height: 16px;
}

div.gtype-page-add-btn:hover {
    transition: all 0.3s ease-out;
	background: #f8a060;
}

div.gtype-page-add-btn > div.button.add {
	background-image: url(/images/icons/18/white/add.png);
}

div.gtype-page-add-btn > div.button {
	float: left;
	margin-right: 7px;
}

.tk_mod_sm_disable_all_btn {
	font-size: 14px;
	font-weight: normal;
	background-color: #c0392b;
	color: #fff;
	border: none;
	border-radius: 2px;
	padding: 8px 14px;
	cursor: pointer;
	margin-left: auto;
	line-height: 16px;
}

.tk_mod_sm_disable_all_btn:hover:not([disabled]) {
	background-color: #e74c3c;
	transition: all 0.3s ease-out;
}

.tk_mod_sm_disable_all_btn[disabled] {
	opacity: 0.4;
	cursor: default;
}

div.gtype-page-btn {
	font-size: 16px;
	font-weight: normal;
	background-color: #c0c0c0;
	color: #008040;
	display: inline-block;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 12px;
	padding-right: 12px;
	cursor: pointer;
	/*border: 1px solid #c0c0c0;*/
	border-radius: 2px;
	line-height: 16px;
	margin-left: 5px;
}

div.gtype-page-btn:hover {
    transition: all 0.3s ease-out;
	background: #f8a060;
}

div.gtype-page-btn > div.button.reload {
	background-image: url(/images/icons/18/color/reload.png);
}

div.gtype-page-btn > div.button.calculate {
	background-image: url(/images/icons/18/color/calculator.png);
}

div.gtype-page-btn > div.button {
	float: left;
	margin-right: 7px;
}

div.gtype-page-btn > div.button.import-templates {
	background-image: url(/images/icons/18/color/spreadsheet.png);
}

div.gtype-page-btn > div.button.right {
	float:right;
}

div.gtype-page-btn > div.button.white-icon {
    background-color: white;
    border-radius: 17px;
    width: 25px;
    height: 25px;
    margin: -5px;
    margin-right: 5px;
    background-size: 15px;
    background-position: center;
    background-repeat: no-repeat;
}

/** Event Styling **/
.event_questionnaire_section {
	border-top: 1px solid black;
	padding-top: 10px;
	padding-bottom: 10px;
}

.event_questionnaire_section input:not([type=checkbox]):not([type=radio]) {
	width: 400px;
}

.event_questionnaire_section select {
	width: 400px;
}

.event_questionnaire_output * textarea {
	height: 100px;
	width: 500px;
}

.event_questionnaire_section textarea {
	height: 100px;
	width: 500px;
}

.event_questionnaire_section_name {
	font-size: 14px;
	color: #23598f;
	font-weight: bold;
	padding-right: 5px;
}

/*
.vc_event_mc_list {

}
*/

.event_questionnaire_question_label {
	color: #2e52b1;
	font-weight: bold;
	vertical-align: top;
}

.event_questionnaire_question_label_right {
	color: #2e52b1;
	font-weight: bold;
	vertical-align: top;
	text-align: right;
}

.event_questionnaire_question_label::after {
	content: ":";
}

.event_questionnaire_output {
	margin: 10px;
	margin-top: 0px;
	width: 1000px;
	border: 1px solid #444;
	padding: 5px;
}

.event_questionnaire_output h3 {
	font-weight: 700;
	font-size: 18px;
	color: #23598f;
}

.event_questionnaire_output h4 {
	font-weight: 700;
	font-size: 15px;
}

/** First Trust Events **/
.FT_Peer_Data_Table {
	padding: 0px;
	margin: 0px;
}

.FT_Peer_Data_Table * tr:nth-child(odd):NOT(.ft-label) {
	background-color: #f5f5f5;
}

.FT_Peer_Data_Table * td {
	padding: 4px;
	text-align:center;
}

.FT_Peer_Data_Table * td.ft-label {
	min-width: 150px;
	text-align:left;
}

.FT_Peer_Data_Table * td.dark-border-left {
	border-left: 2px solid black;
}

.FT_Peer_Data_Table * td.dark-border-right {
	border-right: 2px solid black;
}

.FT_Peer_Data_Table * td.dark-border-top {
	border-top: 2px solid black;
}

.FT_Peer_Data_Table * td.dark-border-bottom {
	border-bottom: 2px solid black;
}

.FT_Peer_Data_Table * td.light-border-left {
	border-left: 1px solid black;
}

.FT_Peer_Data_Table * td.light-border-right {
	border-right: 1px solid black;
}

.FT_Peer_Data_Table * td.centered {
	text-align:center;
}

.FT_Peer_Data_Table * td.header {
	font-weight: bold;
	text-align:center;
}

.FT_Peer_Data_Table * td.top-header {
	font-weight: bold;
	text-align:center;
	background-color: #c1c1c1;
}

.ft_analytics_blank_row {
	height: 30px;
}

/*
.vc_event_invite {
}
*/

.vc_event_invite a::after {
	background-image: url('/images/icons/18/color/link.png');
	background-size: 12px 12px;
	display: inline-block;
	height: 12px;
	width: 12px;
	margin-left: 5px;
	content: "";
}

.accepted {
	background-color: #bed1c7;
}

/** End First Trust Events **/

.addon_section {
	margin-top: 20px;
	/*border: 1px solid #ccc;*/
	padding: 5px;
}

/* Fix button positioning in addon section headings - group buttons near title */
.addon_section .tk_section_heading {
	justify-content: flex-start;
}

.addon_section .tk_section_heading .button {
	flex-shrink: 0;
	margin-left: 4px;
}

.addon_section .tk_section_heading .button:first-of-type {
	margin-left: 8px;
}

/** Organization File Browser **/
.org_fb_tree_container {
	float: left;
	width: 20%;
}

.org_fb_file_list_container {
	float: right;
	width: 78%;
}

.org_fb_drop_container {
	display: inline-block;
	width: 100%;
	margin-top: 50px;

}
/** End Organization File Browser **/

.vc_events_mc_options_input {
	margin-bottom: 3px;
}


/**Bubble Popup**/

.bubble-popup  {
	padding: 5px;
	margin: 5px;
	border: 1px solid #f5f5f5;
	border-radius: 3px;
	box-shadow: 2px 2px 4px #555;
	color: #222;
	background-color: #fff;
	/*opacity: 0.95;*/
	z-index: 32767;
	text-align: left;
    max-width: 300px;
    min-width: 300px;

	/*
	border: .5px solid #444;
	overflow: hidden;
    text-overflow: ellipsis;
    */
}

/*.bubble-popup div:first-child {*/
	/*white-space: nowrap;*/
	/*overflow: hidden;
    text-overflow: ellipsis;
	max-width: 300px;*/
/*}*/


/* top arrow */
.bubble-popup.arrow-top:after, .bubble-popup.arrow-top:before {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.bubble-popup.arrow-top:after {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #ffffff;
	border-width: 15px;
	margin-left: -15px;
}

.bubble-popup.arrow-top:before {
	border-color: rgba(245, 245, 245, 0);
	border-bottom-color: #f5f5f5;
	border-width: 16px;
	margin-left: -16px;
}

/* right arrow */

.bubble-popup.arrow-right:after, .bubble-popup.arrow-right:before {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.bubble-popup.arrow-right:after {
	border-color: rgba(255, 255, 255, 0);
	border-left-color: #ffffff;
	border-width: 15px;
	margin-top: -15px;
}

.bubble-popup.arrow-right:before {
	border-color: rgba(245, 245, 245, 0);
	border-left-color: #f5f5f5;
	border-width: 16px;
	margin-top: -16px;
}

/* bottom arrow */

.bubble-popup.arrow-bottom:after, .bubble-popup.arrow-bottom:before {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.bubble-popup.arrow-bottom:after {
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #ffffff;
	border-width: 15px;
	margin-left: -15px;
}

.bubble-popup.arrow-bottom:before {
	border-color: rgba(245, 245, 245, 0);
	border-top-color: #f5f5f5;
	border-width: 16px;
	margin-left: -16px;
}

/* left arrow */

.bubble-popup.arrow-left:after, .bubble-popup.arrow-left:before {
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.bubble-popup.arrow-left:after {
	border-color: rgba(255, 255, 255, 0);
	border-right-color: #ffffff;
	border-width: 15px;
	margin-top: -15px;
}

.bubble-popup.arrow-left:before {
	border-color: rgba(245, 245, 245, 0);
	border-right-color: #f5f5f5;
	border-width: 16px;
	margin-top: -16px;
}

/**End Bubble Popup**/

/** Menu Maker **/

/* Base container — overrides jQuery UI .ui-widget-content defaults */
ul.menu-maker {
    /* Size to the longest item (a fixed 200px clipped labels under jQuery UI 1.14). */
    width: max-content;
    min-width: 200px;
    max-width: min(360px, calc(100vw - 16px));
    z-index: 10000;
    border: 1px solid #E0E0E0;
    border-radius: 10px;
    background: #ffffff;
    background-image: none;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10),
                0 2px 6px rgba(0, 0, 0, 0.06);
    padding: 5px 0;
    font-family: 'Manrope', 'Segoe UI', sans-serif;
    overflow: hidden;
}

/* Title header — muted uppercase label */
ul.menu-maker > div.title {
    height: auto;
    padding: 9px 14px 7px;
    text-align: left;
    font-family: 'Manrope', 'Segoe UI', sans-serif; font-weight: 600;
    font-size: 11px;
    font-weight: normal;
    color: #999999;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    background: none;
    border-bottom: 1px solid #EEEEEE;
    line-height: 1.3;
    margin-bottom: 5px;
}

/* Menu items — override jQuery UI .ui-menu-item padding/margin */
ul.menu-maker.ui-menu > li.ui-menu-item {
    padding: 8px 14px;
    margin: 1px 5px;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: background-color 0.15s ease;
    white-space: nowrap;
    border: none;
    background: none;
    background-image: none;
}

/* Hover/focus — override jQuery UI .ui-state-focus */
ul.menu-maker.ui-menu > li.ui-menu-item.ui-state-focus,
ul.menu-maker.ui-menu > li.ui-menu-item:hover {
    background: none;
    background-color: #F0F0F0;
    background-image: none;
    border: none;
    font-weight: normal;
    color: inherit;
    margin: 1px 5px;
}

/* jQuery UI 1.12+ wraps BOTH children in .ui-menu-item-wrapper and pads them (3px 1em 3px .4em):
   the 16px icon became 36px wide and the label picked up extra padding, pushing text off the
   right edge (#1569 regression, seen on the record-header Actions menu). Our li carries the padding. */
ul.menu-maker.ui-menu > li.ui-menu-item > .ui-menu-item-wrapper {
    padding: 0;
    margin: 0;
    line-height: inherit;
}
/* Item text */
ul.menu-maker > li > span {
    font-family: 'Manrope', 'Segoe UI', sans-serif;
    font-weight: normal;
    font-size: 13px;
    color: #333333;
    line-height: 1;
}

/* Item icon (div.button) — override base .button sizing for menu context */
ul.menu-maker > li > div.button {
    width: 16px;
    height: 16px;
    min-width: 16px;
    margin: 0;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.55;
}

ul.menu-maker > li.ui-state-focus > div.button,
ul.menu-maker > li:hover > div.button {
    opacity: 0.75;
}

/* Calendar-specific menu item icons */
.menu-icon-appointment {
    background-image: url(/images/calendar/menu-appointment.svg) !important;
    opacity: 0.7 !important;
}

.menu-icon-task {
    background-image: url(/images/calendar/menu-task.svg) !important;
    opacity: 0.7 !important;
}

.menu-icon-recurrence {
    background-image: url(/images/calendar/menu-recurrence.svg) !important;
    opacity: 0.7 !important;
}

/** End Menu Maker **/

/** DFB Customization **/

td.input_cell.email {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	gap: 0 !important;
	position: relative !important;
}

td.input_cell.email input.forminput {
	flex: 1 !important;
	margin-right: 0px !important;
	padding-right: 20px !important;
}

td.input_cell.email div.button.mail {
	position: absolute !important;
	right: 7px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	z-index: 1 !important;
	margin: 0 !important;
}

td.input_cell.url-input-c {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	gap: 0 !important;
	position: relative !important;
}

td.input_cell.url-input-c input.forminput {
	flex: 1 !important;
	margin-right: 0px !important;
	padding-right: 20px !important;
}

td.input_cell.url-input-c div.button.go {
	position: absolute !important;
	right: 7px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	z-index: 1 !important;
	margin: 0 !important;
}

/* Override v3_form.css negative margins for v3-section-table */
.v3-section-table td.input_cell.email input.forminput {
	margin-right: 0px !important;
	display: inline-block !important;
	width: calc(100% - 25px) !important;
}

.v3-section-table td.input_cell.email div.button.mail {
	margin-top: 0px !important;
	display: inline-block !important;
	vertical-align: top !important;
}

.v3-section-table td.input_cell.url-input-c input.forminput {
	margin-right: 0px !important;
	display: inline-block !important;
	width: calc(100% - 25px) !important;
}

.v3-section-table td.input_cell.url-input-c div.button.go {
	margin-top: 0px !important;
	display: inline-block !important;
	vertical-align: top !important;
}

/* Legacy form table row height protection to prevent overlapping */
table tr td.input_cell {
	min-height: 30px;
	vertical-align: top;
	padding: 4px;
}

table tr td.label {
	min-height: 30px;
	vertical-align: top;
	padding: 4px;
}

/* Appointment editor: adapt legacy DFB fields to the modern record-field treatment. */
.appointment-editor-dialog.ui-dialog {
	padding: 0;
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 18px 45px rgba(0, 0, 0, .18), 0 4px 12px rgba(0, 0, 0, .08);
	overflow: hidden;
}

.appointment-editor-dialog .ui-dialog-titlebar {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 4;
	width: auto;
	height: 30px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.appointment-editor-dialog .ui-dialog-titlebar:empty {
	display: none;
}

.appointment-editor-dialog .ui-dialog-title {
	display: none;
}

.appointment-editor-dialog .ui-dialog-titlebar-maximize {
	display: none !important;
}

.appointment-editor-dialog .ui-dialog-titlebar-close {
	position: static;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	margin: 0;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 7px;
	background: transparent;
	color: #6f7782;
	box-sizing: border-box;
	cursor: pointer;
}

.appointment-editor-dialog .appointment-editor-header-close.ui-dialog-titlebar-close {
	flex: 0 0 auto;
	width: 28px;
	height: 28px;
	border-radius: 6px;
	color: #6f7782;
}

.appointment-editor-dialog .ui-dialog-titlebar-close:hover {
	border-color: #d9dee5;
	background: #f5f5f5;
	color: #252a31;
}

.appointment-editor-dialog .ui-dialog-titlebar-close:focus-visible {
	outline: none;
	border-color: #b8c0ca;
	box-shadow: 0 0 0 2px rgba(15, 23, 42, .12);
}

.appointment-editor-dialog .ui-dialog-titlebar-close .ui-icon,
.appointment-editor-dialog .ui-dialog-titlebar-close .ui-button-icon,
.appointment-editor-dialog .ui-dialog-titlebar-close .ui-button-icon-primary,
.appointment-editor-dialog .ui-dialog-titlebar-close .ui-button-text {
	display: none;
}

.appointment-editor-dialog .ui-dialog-titlebar-close:before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.appointment-editor-dialog {
	--appointment-editor-link-panel-width: 450px;
	--appointment-editor-panel-gap: 10px;
	overflow: hidden;
}

.appointment-editor-dialog .ui-dialog-content {
	padding: 14px 14px 0;
	border: 0;
	background: #fff;
	overflow: hidden;
}

.appointment-editor-dialog .ui-dialog-content > a.metadata-link,
.appointment-editor-dialog .appointment-editor-form > a {
	display: none !important;
}

.appointment-editor-dialog .ui-dialog-buttonpane {
	margin: 0;
	padding: 10px 14px 12px;
	border-width: 1px 0 0;
	border-style: solid;
	border-color: #e7ebef;
	background: #fff;
	box-sizing: border-box;
}

.appointment-editor-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	float: none;
	width: 100%;
	min-height: 34px;
}

.appointment-editor-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > div {
	display: flex;
	align-items: center;
	gap: 8px;
}

.appointment-editor-dialog .ui-dialog-buttonpane button.ui-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	height: 32px;
	margin: 0;
	padding: 0 14px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background: #fff;
	color: #395066;
	box-shadow: none;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	box-sizing: border-box;
}

.appointment-editor-dialog .ui-dialog-buttonpane button.ui-button:hover {
	border-color: #bfcad6;
	background: #f5f8fb;
	color: #23384f;
}

.appointment-editor-dialog .ui-dialog-buttonpane button.ui-button:focus {
	outline: none;
	border-color: #8cb2e5;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .16);
}

.appointment-editor-dialog .ui-dialog-buttonpane button.ui-button .ui-button-text {
	padding: 0;
	line-height: 1;
}

.appointment-editor-dialog .ui-dialog-buttonpane button#save_button,
.appointment-editor-dialog .ui-dialog-buttonpane button#save_and_edit_button {
	border-color: #00529b;
	background: #00529b;
	color: #fff;
}

.appointment-editor-dialog .ui-dialog-buttonpane button#save_button:hover,
.appointment-editor-dialog .ui-dialog-buttonpane button#save_and_edit_button:hover {
	border-color: #003d73;
	background: #003d73;
	color: #fff;
}

.appointment-editor-save-split {
	background: #00529b;
	border-radius: 8px;
	box-shadow: 0 1px 4px rgba(20, 32, 46, .10);
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 0;
	height: 32px;
	position: relative;
}

.appointment-editor-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > div.appointment-editor-save-split {
	gap: 0;
}

.appointment-editor-dialog .ui-dialog-buttonpane button#save_button.appointment-editor-save-main {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: 8px 0 0 8px;
	box-shadow: none;
	color: #fff;
	display: inline-flex;
	font-size: 13px;
	font-weight: 600;
	height: 32px;
	line-height: 1;
	padding: 0 10px 0 13px;
	white-space: nowrap;
}

.appointment-editor-dialog .ui-dialog-buttonpane button#save_button.appointment-editor-save-main:hover,
.appointment-editor-dialog .ui-dialog-buttonpane button#save_button.appointment-editor-save-main:focus,
.appointment-editor-dialog .ui-dialog-buttonpane button#save_button.appointment-editor-save-main.ui-state-hover {
	background: #003d73;
	border: 0;
	color: #fff;
	outline: none;
}

.appointment-editor-dialog .ui-dialog-buttonpane button#save_button.appointment-editor-save-main .ui-button-text {
	align-items: center;
	display: inline-flex;
	gap: 0;
	line-height: 1;
	padding: 0;
}

.appointment-editor-save-icon {
	align-items: center;
	display: inline-flex;
	flex: 0 0 auto;
	justify-content: center;
	line-height: 0;
}

.appointment-editor-save-icon svg {
	display: block;
}

.appointment-editor-save-split-divider {
	align-self: stretch;
	background: rgba(255, 255, 255, .28);
	flex: 0 0 auto;
	width: 1px;
}

.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-save-menu-button {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: 0 8px 8px 0;
	color: #fff;
	cursor: pointer;
	display: inline-flex;
	box-sizing: border-box;
	height: 32px;
	justify-content: center;
	margin: 0;
	padding: 0 7px;
	width: 26px;
}

.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-save-menu-button:hover,
.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-save-menu-button:focus,
.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-save-menu-button.ui-state-hover {
	background: #003d73;
	border: 0;
	color: #fff;
	outline: none;
}

.appointment-editor-save-menu {
	position: absolute;
	right: 0;
	bottom: calc(100% + 8px);
	z-index: 10020;
	width: 260px;
	padding: 6px;
	border: 1px solid #e4e7eb;
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 10px 28px rgba(20, 32, 46, .14);
	box-sizing: border-box;
}

.appointment-editor-save-menu-item {
	align-items: center;
	display: flex;
	gap: 9px;
	width: 100%;
	margin: 0;
	padding: 8px 10px;
	border: 0;
	border-radius: 7px;
	background: transparent;
	color: #3d4b5c;
	font-family: Manrope, "Segoe UI", Verdana, Arial, sans-serif;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 16px;
	text-align: left;
	white-space: nowrap;
	cursor: pointer;
	box-sizing: border-box;
}

.appointment-editor-dialog .ui-dialog-buttonpane .appointment-editor-save-menu button.appointment-editor-save-menu-item {
	margin: 0;
	padding: 8px 10px;
	border: 0;
	font-size: 12.5px;
	line-height: 16px;
}

.appointment-editor-save-menu-item:hover,
.appointment-editor-save-menu-item:focus {
	outline: none;
	background: #f3f3f3;
	color: #14202e;
}

.appointment-editor-save-menu-item .appointment-editor-save-icon {
	color: #5c6b7c;
	width: 14px;
}

.appointment-editor-save-menu-item:hover .appointment-editor-save-icon,
.appointment-editor-save-menu-item:focus .appointment-editor-save-icon {
	color: #00529b;
}

.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-complete-button {
	border-color: #a9c2dc;
	background: #f4f8fc;
	color: #174d82;
}

.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-complete-button:hover {
	border-color: #8eb1d2;
	background: #eaf3fb;
	color: #174d82;
}

.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-create-next-action-button {
	border-color: #00529b;
	background: #fff;
	color: #00529b;
}

.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-create-next-action-button:hover,
.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-create-next-action-button.ui-state-hover {
	border-color: #003d73;
	background: #eef6fd;
	color: #003d73;
}

.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-completed-lock-button,
.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-completed-lock-button:disabled,
.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-completed-lock-button:hover,
.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-completed-lock-button:focus {
	border-color: #00529b;
	border-radius: 8px;
	background: #00529b;
	color: #fff;
	cursor: default;
	min-width: 100px;
	opacity: 0.5;
	pointer-events: none;
}

.appointment-editor-dialog .ui-dialog-buttonpane button.appointment-editor-completed-lock-button .ui-button-text {
	align-items: center;
	display: inline-flex;
	gap: 6px;
	justify-content: center;
}

.appointment-editor-dialog .ui-dialog-buttonpane button#delete_button {
	border-color: #ef4444;
	background: #ef4444;
	color: #fff;
}

.appointment-editor-dialog .ui-dialog-buttonpane button#delete_button:hover {
	border-color: #dc2626;
	background: #dc2626;
	color: #fff;
}

.appointment-editor-form {
	position: relative;
	box-sizing: border-box;
	--appointment-editor-label-width: 146px;
	--appointment-editor-description-width: 100%;
}

.appointment-editor-form-has-link-panel {
	--appointment-editor-description-width: 100%;
}

.appointment-editor-field-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0 6px;
	table-layout: fixed;
}

.appointment-editor-form-scroll-layout .appointment-editor-field-table > tbody {
	display: block;
	width: 100%;
	max-height: var(--appointment-editor-body-scroll-max-height, none);
	padding-bottom: 12px;
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: none;
	-ms-overflow-style: none;
	overscroll-behavior: contain;
	box-sizing: border-box;
}

.appointment-editor-form-scroll-layout .appointment-editor-field-table > tbody::-webkit-scrollbar {
	display: none;
}

.appointment-editor-form-scroll-layout.appointment-editor-form-has-link-panel .appointment-editor-field-table > tbody {
	width: calc(100% - var(--appointment-editor-link-panel-width));
}

.appointment-editor-form-scroll-layout .appointment-editor-field-table > tbody > tr {
	display: grid !important;
	grid-template-columns: var(--appointment-editor-label-width) minmax(0, 1fr);
	width: 100%;
	margin-bottom: 6px;
	table-layout: fixed;
}

.appointment-editor-form-scroll-layout .appointment-editor-field-table > tbody > tr[style*="display: none"] {
	display: none !important;
}

.appointment-editor-form-scroll-layout .appointment-editor-field-table > tbody > tr:last-child {
	margin-bottom: 0;
}

.appointment-editor-field-table > thead {
	display: table-caption;
	caption-side: top;
	width: 100%;
}

.appointment-editor-field-table > thead > tr {
	display: flex;
	width: 100%;
	margin-bottom: 4px;
}

.appointment-editor-field-table > thead > tr > td.formtitle {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	flex: 1 1 auto;
	min-width: 0;
	min-height: 46px;
	padding: 8px 12px !important;
	border-radius: 7px 0 0 7px;
	background: #f3f3f3;
	color: #24282d;
	font-size: 17px;
	font-weight: 700;
	line-height: 20px;
	-webkit-text-stroke: 0.7px currentColor;
	vertical-align: middle;
	box-sizing: border-box;
}

.appointment-editor-title-label {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
}

.appointment-visibility-switch {
	position: relative;
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	height: 26px;
	margin-left: 8px;
	padding: 2px;
	border: 0;
	border-radius: 6px;
	background: #E4E4E4;
	-webkit-text-stroke: 0;
	box-sizing: border-box;
}

.appointment-visibility-switch-option {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	min-width: 54px;
	height: 22px;
	margin: 0;
	padding: 0 7px;
	border: 0;
	border-radius: 5px;
	background: transparent;
	box-shadow: none;
	color: #7a828a;
	font-family: 'Manrope';
	font-size: 11px !important;
	font-weight: 600;
	line-height: 16px;
	white-space: nowrap;
	cursor: pointer;
	transition: color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.appointment-visibility-switch-icon {
	display: inline-block;
	width: 11px;
	height: 11px;
	flex: 0 0 11px;
	background-color: currentColor;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.appointment-visibility-switch-icon-private {
	-webkit-mask-image: url('/images/icons/integrations/private-icon.svg');
	mask-image: url('/images/icons/integrations/private-icon.svg');
}

.appointment-visibility-switch-icon-shared {
	-webkit-mask-image: url('/images/icons/integrations/shared-icon.svg');
	mask-image: url('/images/icons/integrations/shared-icon.svg');
}

.appointment-visibility-switch-option:hover:not(.appointment-visibility-switch-option-readonly):not(:disabled) {
	color: #69727b;
}

.appointment-visibility-switch-option:active:not(.appointment-visibility-switch-option-readonly):not(:disabled) {
	transform: scale(.98);
}

.appointment-visibility-switch-option-selected {
	background: #fff;
	box-shadow: 1px 2px 4px -1px #d1d1d1;
	color: #69727b;
}

.appointment-visibility-switch-option:focus-visible {
	position: relative;
	z-index: 1;
	outline: none;
	box-shadow: 0 0 0 2px rgba(31, 95, 147, .28), 1px 2px 4px -1px #d1d1d1;
}

.appointment-visibility-switch-option-readonly {
	cursor: default;
}

.appointment-visibility-switch-readonly {
	background: #E4E4E4;
}

.appointment-visibility-switch-readonly .appointment-visibility-switch-option {
	opacity: .55;
}

.appointment-visibility-switch-pending {
	margin-right: 22px;
}

.appointment-visibility-switch-pending::after {
	content: "";
	position: absolute;
	top: 6px;
	right: -18px;
	width: 10px;
	height: 10px;
	border: 2px solid rgba(31, 95, 147, .2);
	border-top-color: #1f5f93;
	border-radius: 50%;
	animation: appointment-visibility-spin .75s linear infinite;
}

@keyframes appointment-visibility-spin {
	to { transform: rotate(360deg); }
}

.appointment-visibility-switch-status {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.appointment-visibility-auto-shared-notice {
	position: absolute;
	top: 34px;
	left: 50%;
	z-index: 10002;
	width: max-content;
	max-width: min(320px, calc(100vw - 32px));
	padding: 8px 10px;
	border-radius: 6px;
	background: #2f3740;
	box-shadow: 0 8px 20px rgba(0, 0, 0, .18);
	color: #fff;
	font-size: 12px !important;
	font-weight: 500;
	line-height: 16px;
	text-align: left;
	white-space: normal;
	pointer-events: none;
	opacity: 0;
	transform: translate(-50%, -4px);
	transition: opacity 180ms ease, transform 180ms ease;
}

.appointment-visibility-auto-shared-notice::before {
	content: "";
	position: absolute;
	top: -5px;
	left: 50%;
	width: 10px;
	height: 10px;
	border-radius: 2px;
	background: #2f3740;
	transform: translateX(-50%) rotate(45deg);
}

.appointment-visibility-auto-shared-notice.is-visible {
	opacity: 1;
	transform: translate(-50%, 0);
}

@media (max-width: 760px) {
	.appointment-editor-field-table > thead > tr > td.formtitle {
		row-gap: 6px;
	}

	.appointment-visibility-switch {
		order: 2;
	}

	.appointment-editor-field-table .recurrence-summary,
	.appointment-editor-field-table .appointment-editor-next-action-summary,
	.appointment-editor-field-table .appointment-editor-completed-summary {
		order: 3;
	}
}

@media (prefers-reduced-motion: reduce) {
	.appointment-visibility-switch-option {
		transition: none;
	}

	.appointment-visibility-auto-shared-notice {
		transition: none;
	}

	.appointment-visibility-switch-pending::after {
		animation: none;
	}
}

.appointment-editor-field-table > thead > tr > td.formtitle:only-child {
	border-radius: 7px;
}

.appointment-editor-field-table .recurrence-summary {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	gap: 5px;
	height: 24px;
	margin-left: 7px;
	padding: 0 8px 0 6px;
	border: 1px solid #A9C2DC;
	border-radius: 999px;
	background: #F4F8FC;
	color: #1f5f93;
	cursor: help;
	-webkit-text-stroke: 0;
	outline: none;
	box-sizing: border-box;
	vertical-align: middle;
}

.appointment-editor-field-table .recurrence-summary.recurrence-summary-clickable {
	cursor: pointer;
}

.appointment-editor-field-table .recurrence-summary:hover,
.appointment-editor-field-table .recurrence-summary:focus {
	border-color: #A9C2DC;
	background: #F4F8FC;
}

.appointment-editor-field-table .recurrence-summary.recurrence-summary-last-in-series {
	border-color: #F5B8BC;
	background: #FFF1F2;
	color: #B4232A;
}

.appointment-editor-field-table .recurrence-summary.recurrence-summary-last-in-series:hover,
.appointment-editor-field-table .recurrence-summary.recurrence-summary-last-in-series:focus {
	border-color: #F0A6AB;
	background: #FFE8EA;
}

.appointment-editor-field-table .recurrence-summary-icon {
	display: block;
	width: 13px;
	height: 13px;
	object-fit: contain;
	flex: 0 0 auto;
}

.appointment-editor-field-table .recurrence-summary-label {
	display: block;
	color: #1f5f93;
	font-size: 12px;
	font-weight: 700;
	line-height: 16px;
	letter-spacing: 0;
	white-space: nowrap;
}

.appointment-editor-field-table .recurrence-summary-last-in-series .recurrence-summary-icon {
	filter: brightness(0) saturate(100%) invert(21%) sepia(75%) saturate(2276%) hue-rotate(338deg) brightness(86%) contrast(88%);
}

.appointment-editor-field-table .recurrence-summary-last-in-series .recurrence-summary-label {
	color: #B4232A;
}

.appointment-editor-field-table .appointment-editor-next-action-summary {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	gap: 5px;
	height: 24px;
	margin-left: 7px;
	padding: 0 8px 0 6px;
	border: 1px solid #F2B36D;
	border-radius: 999px;
	background: #FFF4E8;
	color: #B35A13;
	cursor: default;
	-webkit-text-stroke: 0;
	outline: none;
	box-sizing: border-box;
	vertical-align: middle;
}

.appointment-editor-field-table .appointment-editor-next-action-summary-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 13px;
	height: 13px;
	flex: 0 0 auto;
	color: #D97706;
	line-height: 0;
}

.appointment-editor-field-table .appointment-editor-next-action-summary-icon svg {
	display: block;
}

.appointment-editor-field-table .appointment-editor-next-action-summary-label {
	display: block;
	color: #B35A13;
	font-size: 12px;
	font-weight: 700;
	line-height: 16px;
	letter-spacing: 0;
	white-space: nowrap;
}

.appointment-editor-field-table .appointment-editor-completed-summary {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	gap: 5px;
	height: 24px;
	margin-left: 7px;
	padding: 0 8px 0 6px;
	border: 1px solid #9DD7B1;
	border-radius: 999px;
	background: #ECFDF3;
	color: #177245;
	cursor: default;
	-webkit-text-stroke: 0;
	outline: none;
	box-sizing: border-box;
	vertical-align: middle;
}

.appointment-editor-field-table .appointment-editor-completed-summary-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 13px;
	height: 13px;
	flex: 0 0 auto;
	color: #16A34A;
	font-size: 10px;
	line-height: 1;
}

.appointment-editor-field-table .appointment-editor-completed-summary-label {
	display: block;
	color: #177245;
	font-size: 12px;
	font-weight: 700;
	line-height: 16px;
	letter-spacing: 0;
	white-space: nowrap;
}

.appointment-editor-field-table .recurrence-summary-tooltip {
	display: none;
	position: absolute;
	top: calc(100% + 8px);
	left: -6px;
	z-index: 10070;
	width: 360px;
	max-width: min(360px, calc(100vw - 40px));
	padding: 10px 12px;
	border: 1px solid rgba(31, 41, 55, .12);
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 14px 34px rgba(15, 23, 42, .16), 0 2px 8px rgba(15, 23, 42, .08);
	color: #3f4651;
	font-size: 12px;
	font-weight: 500;
	line-height: 17px;
	white-space: normal;
	-webkit-text-stroke: 0;
	text-align: left;
	box-sizing: border-box;
	pointer-events: none;
}

.appointment-editor-field-table .recurrence-summary-tooltip-summary,
.appointment-editor-field-table .recurrence-summary-tooltip-status,
.appointment-editor-field-table .recurrence-summary-tooltip-origin {
	display: block;
}

.appointment-editor-field-table .recurrence-summary-tooltip-status {
	margin-top: 7px;
	color: #4f6173;
	font-weight: 600;
}

.appointment-editor-field-table .recurrence-summary-tooltip-origin {
	margin-top: 7px;
	padding-top: 7px;
	border-top: 1px solid #edf0f4;
	color: #687181;
	font-weight: 600;
}

.appointment-editor-field-table > thead > tr > td.appointment-editor-title-actions-cell {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex: 0 0 auto;
	gap: 8px;
	min-height: 46px;
	padding: 8px 10px 8px var(--appointment-editor-panel-gap);
	border-radius: 0 7px 7px 0;
	background: #f3f3f3;
	text-align: right;
	vertical-align: middle;
	box-sizing: border-box;
}

.appointment-editor-field-table > tbody > tr > td.label,
.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) {
	background-color: #f3f3f3;
	min-height: 0;
	vertical-align: middle;
}

.appointment-editor-field-table > tbody > tr > td.label {
	width: var(--appointment-editor-label-width);
	min-width: var(--appointment-editor-label-width);
	max-width: var(--appointment-editor-label-width);
	/* Top and bottom match the 12px left inset, so a label sits the same distance from every
	   edge of its row. The appointment, task and recurring editors all share this, and each
	   dialog's height is sized for the 43px rows it gives. */
	padding: 12px 8px 12px 12px !important;
	border-radius: 6px 0 0 6px;
	color: #777;
	font-size: 14px;
	font-weight: 600;
	text-align: left;
	box-sizing: border-box;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.appointment-editor-field-table > tbody > tr > td.label label {
	display: block;
	width: 100%;
	padding: 0;
	color: #777;
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.appointment-editor-field-table > tbody > tr > td.label label.required::before {
	content: none;
}

.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) {
	/* 8px centres a 27px control in the 43px row the label sets; align-content does the same
	   for shorter controls such as the toggles. */
	padding: 8px 10px 8px 0 !important;
	align-content: center;
	border-radius: 0 6px 6px 0;
	box-sizing: border-box;
}

.appointment-editor-field-table > tbody > tr > td.appointment-editor-link-panel-cell {
	background-color: #fff;
	padding-left: var(--appointment-editor-panel-gap);
	width: var(--appointment-editor-link-panel-width) !important;
	min-width: var(--appointment-editor-link-panel-width);
	max-width: var(--appointment-editor-link-panel-width);
	box-sizing: border-box;
	vertical-align: top;
}

.appointment-editor-link-panel-cell {
	padding-top: 0;
	min-width: 0;
}

.appointment-editor-link-panel-column {
	position: absolute;
	top: var(--appointment-editor-body-scroll-top, 56px);
	right: 0;
	width: var(--appointment-editor-link-panel-width);
	max-width: var(--appointment-editor-link-panel-width);
	padding-left: var(--appointment-editor-panel-gap);
	box-sizing: border-box;
}

.appointment-editor-link-panel-scroll {
	width: 100%;
	max-height: var(--appointment-editor-link-panel-max-height, none);
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: none;
	-ms-overflow-style: none;
	overscroll-behavior: contain;
}

.appointment-editor-link-panel-scroll::-webkit-scrollbar {
	display: none;
}

.appointment-editor-link-section {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
	max-width: 100%;
	min-height: 76px;
	margin-bottom: 6px;
	padding: 12px;
	border-radius: 7px;
	background: #f3f3f3;
	box-sizing: border-box;
}

.appointment-editor-link-section:last-child {
	margin-bottom: 0;
}

.recurring-activity-host-select {
	box-sizing: border-box;
	width: 100%;
	height: 34px;
	padding: 0 10px;
	border: 1px solid #d7d9dc;
	border-radius: 8px;
	background: #fff;
	color: #24282d;
}

.recurring-activity-organizer-command-readonly {
	position: relative;
	justify-self: start;
	cursor: help;
}

.appointment-editor-link-section .appointment-editor-link-section-title.tk_section_heading {
	display: block;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: #777;
	font-size: 14px;
	font-weight: 600;
	line-height: 18px;
	text-align: left;
}

.appointment-editor-calendar-sync-section {
	gap: 8px;
	min-height: 0;
}

.appointment-editor-imported-meeting-link {
	align-self: flex-start;
	color: #1263a3;
	font-size: 12px;
	font-weight: 650;
	line-height: 17px;
	text-decoration: none;
}

.appointment-editor-imported-meeting-link:hover,
.appointment-editor-imported-meeting-link:focus-visible {
	text-decoration: underline;
}

.appointment-editor-calendar-sync-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 9px;
	min-width: 0;
	min-height: 20px;
}

.appointment-editor-calendar-sync-header .appointment-editor-link-section-title.tk_section_heading {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
}

.appointment-editor-calendar-sync-toggle-row,
.appointment-editor-calendar-sync-invite-row {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0;
	color: #3f4750;
	font-size: 13px;
	font-weight: 600;
	line-height: 18px;
	cursor: pointer;
}

.appointment-editor-calendar-sync-toggle-row {
	position: relative;
}

.appointment-editor-calendar-sync-header .appointment-editor-calendar-sync-toggle-row {
	flex: 0 0 auto;
	margin-left: auto;
}

.appointment-editor-calendar-sync-section-ineligible .appointment-editor-calendar-sync-toggle-row,
.appointment-visibility-switch-readonly[data-tooltip],
.appointment-visibility-switch-readonly[data-tooltip] .appointment-visibility-switch-option {
	cursor: help;
}

.appointment-editor-calendar-sync-section-ineligible .appointment-editor-calendar-sync-toggle-row[data-tooltip]:before,
.appointment-editor-calendar-sync-section-ineligible .appointment-editor-calendar-sync-toggle-row[data-tooltip]:after,
.appointment-editor-calendar-sync-calendar-tab[data-tooltip]:before,
.appointment-visibility-switch-readonly[data-tooltip]:before,
.appointment-editor-calendar-sync-calendar-tab[data-tooltip]:after,
.appointment-visibility-switch-readonly[data-tooltip]:after {
	position: absolute;
	right: 0;
	z-index: 10002;
	display: none;
	pointer-events: none;
}

.appointment-editor-calendar-sync-section-ineligible .appointment-editor-calendar-sync-toggle-row[data-tooltip]:before,
.appointment-editor-calendar-sync-calendar-tab[data-tooltip]:before,
.appointment-visibility-switch-readonly[data-tooltip]:before {
	content: "";
	top: 26px;
	right: 12px;
	width: 10px;
	height: 10px;
	background: #2f3740;
	border-radius: 2px;
	transform: rotate(45deg);
}

.appointment-editor-calendar-sync-section-ineligible .appointment-editor-calendar-sync-toggle-row[data-tooltip]:after,
.appointment-editor-calendar-sync-calendar-tab[data-tooltip]:after,
.appointment-visibility-switch-readonly[data-tooltip]:after {
	content: attr(data-tooltip);
	top: 30px;
	width: max-content;
	max-width: 260px;
	padding: 7px 9px;
	border-radius: 6px;
	background: #2f3740;
	box-shadow: 0 8px 20px rgba(0, 0, 0, .18);
	color: #fff;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	text-align: left;
	white-space: normal;
}

.appointment-editor-calendar-sync-section-ineligible .appointment-editor-calendar-sync-toggle-row[data-tooltip]:hover:before,
.appointment-editor-calendar-sync-section-ineligible .appointment-editor-calendar-sync-toggle-row[data-tooltip]:hover:after,
.appointment-editor-calendar-sync-section-ineligible .appointment-editor-calendar-sync-toggle-row[data-tooltip]:focus-within:before,
.appointment-editor-calendar-sync-section-ineligible .appointment-editor-calendar-sync-toggle-row[data-tooltip]:focus-within:after,
.appointment-editor-calendar-sync-calendar-tab[data-tooltip]:hover:before,
.appointment-visibility-switch-readonly[data-tooltip]:hover:before,
.appointment-editor-calendar-sync-calendar-tab[data-tooltip]:hover:after,
.appointment-visibility-switch-readonly[data-tooltip]:hover:after,
.appointment-editor-calendar-sync-calendar-tab[data-tooltip]:focus-within:before,
.appointment-visibility-switch-readonly[data-tooltip]:focus-within:before,
.appointment-editor-calendar-sync-calendar-tab[data-tooltip]:focus-within:after,
.appointment-visibility-switch-readonly[data-tooltip]:focus-within:after {
	display: block;
}

.appointment-visibility-switch-auto-shared-notice-active[data-tooltip]:before,
.appointment-visibility-switch-auto-shared-notice-active[data-tooltip]:after {
	display: none !important;
}

.appointment-editor-calendar-sync-eligibility-message {
	display: none;
	margin-top: 1px;
	padding: 8px 9px;
	border: 1px solid #dce3ea;
	border-radius: 6px;
	background: #f6f8fa;
	color: #68717c;
	font-size: 12px;
	font-weight: 500;
	line-height: 17px;
}

.appointment-editor-calendar-sync-invite-row {
	position: relative;
	justify-content: flex-end;
	width: 100%;
}

.appointment-editor-calendar-sync-invite-row-sent {
	cursor: default;
}

.appointment-editor-calendar-sync-invite-row-readonly[data-tooltip] {
	cursor: help;
}

.appointment-editor-calendar-sync-invite-row-readonly[data-tooltip]::before,
.appointment-editor-calendar-sync-invite-row-readonly[data-tooltip]::after {
	position: absolute;
	right: 0;
	z-index: 10002;
	pointer-events: none;
	opacity: 0;
	transition: opacity 140ms ease;
}

.appointment-editor-calendar-sync-invite-row-readonly[data-tooltip]::before {
	content: "";
	top: 25px;
	right: 12px;
	width: 10px;
	height: 10px;
	border-radius: 2px;
	background: #2f3740;
	transform: rotate(45deg);
}

.appointment-editor-calendar-sync-invite-row-readonly[data-tooltip]::after {
	content: attr(data-tooltip);
	top: 29px;
	width: max-content;
	max-width: 280px;
	padding: 7px 9px;
	border-radius: 6px;
	background: #2f3740;
	box-shadow: 0 8px 20px rgba(0, 0, 0, .18);
	color: #fff;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	text-align: left;
	white-space: normal;
}

.appointment-editor-calendar-sync-invite-row-readonly[data-tooltip]:hover::before,
.appointment-editor-calendar-sync-invite-row-readonly[data-tooltip]:hover::after,
.appointment-editor-calendar-sync-invite-row-readonly[data-tooltip]:focus-within::before,
.appointment-editor-calendar-sync-invite-row-readonly[data-tooltip]:focus-within::after {
	opacity: 1;
}

.appointment-editor-calendar-sync-invite-row-readonly[data-tooltip]:focus-visible {
	outline: 2px solid rgba(31, 95, 147, .42);
	outline-offset: 2px;
}

.appointment-editor-calendar-sync-invite-label {
	min-width: 0;
	color: #777;
	font-weight: 500;
}

.appointment-editor-calendar-sync-toggle-row input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.appointment-editor-calendar-sync-invite-row input[type="checkbox"] {
	width: 14px;
	height: 14px;
	margin: 0;
	flex: 0 0 14px;
	accent-color: #00529b;
	cursor: pointer;
}

.appointment-editor-calendar-sync-toggle-visual {
	position: relative;
	width: 34px;
	height: 20px;
	border-radius: 10px;
	background: #b2b2b2;
	transition: background-color .16s ease;
	flex: 0 0 34px;
}

.appointment-editor-calendar-sync-toggle-visual:after {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .18);
	transition: transform .16s ease;
}

.appointment-editor-calendar-sync-toggle-row input:checked + .appointment-editor-calendar-sync-toggle-visual {
	background: #00529b;
}

.appointment-editor-calendar-sync-toggle-row input:checked + .appointment-editor-calendar-sync-toggle-visual:after {
	transform: translateX(14px);
}

.appointment-editor-calendar-sync-toggle-row input:focus-visible + .appointment-editor-calendar-sync-toggle-visual {
	outline: 2px solid rgba(31, 95, 147, .45);
	outline-offset: 2px;
}

.appointment-editor-calendar-sync-toggle-row-busy .appointment-editor-calendar-sync-toggle-visual:before {
	content: "";
	position: absolute;
	top: 4px;
	left: 11px;
	z-index: 1;
	width: 8px;
	height: 8px;
	border: 2px solid rgba(255, 255, 255, .45);
	border-top-color: #fff;
	border-radius: 50%;
	animation: appointment-visibility-spin .75s linear infinite;
}

.appointment-editor-calendar-sync-toggle-row input:disabled + .appointment-editor-calendar-sync-toggle-visual,
.appointment-editor-calendar-sync-invite-row input:disabled {
	opacity: .75;
	cursor: default;
}

.appointment-editor-calendar-sync-section-ineligible .appointment-editor-calendar-sync-toggle-row input:disabled + .appointment-editor-calendar-sync-toggle-visual {
	cursor: help;
}

.appointment-editor-calendar-sync-details {
	display: flex;
	flex-direction: column;
	gap: 9px;
	min-width: 0;
}

.appointment-editor-calendar-sync-field {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.appointment-editor-calendar-sync-select {
	position: relative;
	z-index: 1;
	width: 100%;
	min-width: 0;
	height: 34px;
	border: 1px solid #d4d9df;
	border-radius: 6px;
	box-shadow: 0 1px 2px rgba(23, 43, 71, 0.14);
	appearance: none;
	-webkit-appearance: none;
	padding: 0 34px 0 9px;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9L12 15L18 9' stroke='%23708090' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 15px 15px;
	color: #26323e;
	font-size: 13px;
	box-sizing: border-box;
}

.appointment-editor-calendar-sync-destination-summary {
	padding: 7px 9px;
	border: 1px solid #d8e5ef;
	border-radius: 6px;
	background: #f3f8fc;
	color: #405568;
	font-size: 12px;
	line-height: 16px;
}

.appointment-editor-calendar-sync-calendar-tab[data-tooltip] {
	cursor: help;
}

/* Preserve the field appearance while showing the imported source without a dropdown. */
.appointment-editor-calendar-sync-source-summary {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	min-height: 34px;
	padding: 8px 9px;
	border: 1px solid #d4d9df;
	border-radius: 6px;
	box-shadow: 0 1px 2px rgba(23, 43, 71, 0.14);
	background: #fff;
	color: #26323e;
	font-size: 13px;
	line-height: 16px;
}

/* The calendar inside the chosen account hangs off the bottom of the account row as a tab:
   narrower than the row, square where it meets it, and a step darker than the section so
   the white row stays the one raised object (the row's bottom shadow falls onto it). It is a menu trigger only while there is a
   choice to make (-interactive); otherwise it is a plain label. */
.appointment-editor-calendar-sync-calendar-tab {
	position: relative;
	display: flex;
	align-items: center;
	gap: 6px;
	box-sizing: border-box;
	min-width: 0;
	height: 24px;
	margin: 0 10px;
	padding: 0 9px;
	border: 1px solid #d2d2d2;
	border-top: 0;
	border-radius: 0 0 8px 8px;
	background-color: #e4e4e4;
	color: #3f4750;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	cursor: default;
	transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.appointment-editor-calendar-sync-calendar-tab-icon {
	display: flex;
	flex: 0 0 13px;
	width: 13px;
	height: 13px;
	color: #6b7785;
}

.appointment-editor-calendar-sync-calendar-tab-icon svg {
	width: 13px;
	height: 13px;
	/* The shared glyph is drawn at 2; at 13px beside 600-weight text it needs more. */
	stroke-width: 2.6;
}

.appointment-editor-calendar-sync-calendar-tab-value {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.appointment-editor-calendar-sync-calendar-tab-chevron {
	display: none;
	flex: 0 0 13px;
	width: 13px;
	height: 13px;
	background: center / contain no-repeat url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9L12 15L18 9' stroke='%23596573' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	transition: transform 0.15s ease;
}

.appointment-editor-calendar-sync-calendar-tab-interactive {
	cursor: pointer;
}

.appointment-editor-calendar-sync-calendar-tab-interactive .appointment-editor-calendar-sync-calendar-tab-chevron {
	display: block;
}

.appointment-editor-calendar-sync-calendar-tab-interactive:hover,
.appointment-editor-calendar-sync-calendar-tab-open {
	background-color: #d8d8d8;
}

.appointment-editor-calendar-sync-calendar-tab-open .appointment-editor-calendar-sync-calendar-tab-chevron {
	transform: rotate(180deg);
}

.appointment-editor-calendar-sync-calendar-tab:focus {
	outline: none;
}

.appointment-editor-calendar-sync-calendar-tab:focus-visible {
	border-color: #8cb2e5;
	box-shadow: 0 0 0 3px rgba(140, 178, 229, 0.25);
}

/* The shared tooltip is placed for a 30px field; the tab is 24px tall. */
.appointment-editor-calendar-sync-calendar-tab[data-tooltip]:before {
	top: 20px;
}

.appointment-editor-calendar-sync-calendar-tab[data-tooltip]:after {
	top: 24px;
}

.appointment-editor-calendar-sync-calendar-menu .appointment-editor-calendar-sync-calendar-menu-item .vc-context-menu-icon {
	visibility: hidden;
}

.appointment-editor-calendar-sync-calendar-menu .appointment-editor-calendar-sync-calendar-menu-item-selected {
	color: #0d417c;
}

.appointment-editor-calendar-sync-calendar-menu .appointment-editor-calendar-sync-calendar-menu-item-selected .vc-context-menu-icon {
	color: #0d417c;
}

.appointment-editor-calendar-sync-sent-status {
	display: none;
	flex: 0 0 auto;
	box-sizing: border-box;
	/* As tall as the title row (20px) and no taller, so the row keeps its height. */
	height: 20px;
	padding: 0 8px;
	border: 1px solid #b8e2c5;
	border-radius: 999px;
	background: #effaf2;
	color: #28603a;
	font-size: 11px;
	font-weight: 600;
	line-height: 18px;
	white-space: nowrap;
}

.calendar-sync-invite-confirm-dialog .ui-dialog-content {
	padding: 18px 20px 10px;
}

.calendar-provider-update-decision-dialog .ui-dialog-content {
	padding: 18px 20px 10px;
}

.calendar-provider-update-decision-body {
	margin: 0;
	color: #24282d;
	font-size: 13px;
	font-weight: 500;
	line-height: 20px;
}

.appointment-editor-provider-fields-readonly input[aria-readonly="true"],
.appointment-editor-provider-fields-readonly select[aria-readonly="true"],
.appointment-editor-provider-fields-readonly textarea[aria-readonly="true"] {
	cursor: help;
}

.appointment-organizer-migration-confirm p {
	margin: 0 0 14px;
	font-size: 13px;
	line-height: 1.55;
	color: #24282d;
}

.appointment-organizer-migration-confirm-meta {
	padding: 10px 12px;
	border-radius: 8px;
	background: #f3f6fa;
	font-weight: 600;
}

.appointment-organizer-migration-progress {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 14px 16px;
	padding: 14px 16px;
	border: 1px solid #c9d8e8;
	border-radius: 10px;
	background: #f4f8fc;
	box-sizing: border-box;
}

.appointment-organizer-migration-spinner {
	width: 18px;
	height: 18px;
	margin-top: 2px;
	border: 2px solid #c8d7e8;
	border-top-color: #00529b;
	border-radius: 50%;
	animation: appointment-organizer-migration-spin .8s linear infinite;
	flex: 0 0 18px;
}

.appointment-organizer-migration-spinner-stopped {
	border-color: #d59b2d;
	animation: none;
}

@keyframes appointment-organizer-migration-spin {
	to { transform: rotate(360deg); }
}

.appointment-organizer-migration-copy {
	display: flex;
	min-width: 0;
	flex: 1;
	flex-direction: column;
	gap: 4px;
	color: #4c5763;
	font-size: 12px;
	line-height: 1.45;
}

.appointment-organizer-migration-copy strong {
	color: #1e2935;
	font-size: 13px;
}

.appointment-organizer-migration-actions {
	display: flex;
	gap: 8px;
	margin-top: 8px;
}

.appointment-organizer-migration-actions button {
	min-width: 84px;
	padding: 6px 12px;
	border: 1px solid #aebdcb;
	border-radius: 6px;
	background: #fff;
	cursor: pointer;
}

.calendar-sync-invite-confirm-content {
	color: #303942;
	font-size: 13px;
	line-height: 19px;
}

.calendar-sync-invite-confirm-summary {
	margin: 0 0 10px;
	color: #303942;
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;
}

.calendar-sync-invite-confirm-recipient-list {
	display: flex;
	flex-direction: column;
	gap: 7px;
	margin: 0 -8px 0 -4px;
}

.calendar-sync-invite-confirm-recipient-card,
.calendar-sync-invite-confirm-recipient-empty {
	padding: 9px 10px;
	border: 1px solid #e1e6ec;
	border-radius: 6px;
	background: #f6f8fa;
	box-sizing: border-box;
}

.calendar-sync-invite-confirm-recipient-name {
	color: #26323e;
	font-size: 13px;
	font-weight: 700;
	line-height: 17px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.calendar-sync-invite-confirm-recipient-email,
.calendar-sync-invite-confirm-recipient-empty {
	color: #68717c;
	font-size: 12px;
	line-height: 17px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.appointment-editor-link-control.act-lec {
	padding-bottom: 0;
	min-width: 0;
	max-width: 100%;
}

.appointment-editor-link-control > div:first-child {
	min-width: 0;
	max-width: 100%;
}

.appointment-editor-link-control > div.lec-buttons {
	display: none !important;
}

.appointment-editor-link-control ul.tagit {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 7px;
	width: 100%;
	min-width: 0;
	max-width: 100%;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	overflow: visible;
	box-sizing: border-box;
	list-style: none;
}

.appointment-editor-link-control ul.tagit li {
	list-style: none;
}

.appointment-editor-link-control li.tagit-choice.appointment-editor-link-pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	flex: 0 1 auto;
	min-width: 0;
	max-width: 100%;
	min-height: 32px;
	margin: 0;
	padding: 4px 8px 4px 5px;
	border: 0;
	border-radius: 7px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .06), 0 3px 8px rgba(15, 23, 42, .07);
	color: #475569;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.2;
	box-sizing: border-box;
}

.appointment-editor-link-control li.tagit-choice.appointment-editor-link-pill.appointment-editor-link-pill-clickable {
	cursor: pointer;
}

.appointment-editor-link-control li.tagit-choice.appointment-editor-link-pill.appointment-editor-link-pill-clickable:hover {
	box-shadow: 0 1px 2px rgba(15, 23, 42, .08), 0 4px 10px rgba(15, 23, 42, .1);
}

.appointment-editor-link-control li.tagit-choice.appointment-editor-link-pill.appointment-editor-link-pill-clickable:focus {
	outline: none;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .18), 0 1px 2px rgba(15, 23, 42, .08);
}

.appointment-editor-link-control li.tagit-choice.appointment-editor-link-pill.lec-provider-representation:not(.appointment-editor-calendar-host-pill) {
	border: 1px solid rgba(148, 163, 184, .18);
	background: rgba(255, 255, 255, .55);
	box-shadow: none;
	color: #6f7b89;
}

.appointment-editor-link-control li.tagit-choice.appointment-editor-link-pill.lec-provider-representation:not(.appointment-editor-calendar-host-pill):hover {
	background: rgba(255, 255, 255, .72);
	box-shadow: none;
}

.appointment-editor-link-control li.tagit-choice.appointment-editor-link-pill.lec-provider-representation:not(.appointment-editor-calendar-host-pill) .appointment-editor-link-pill-avatar {
	opacity: .58;
	filter: saturate(.45);
}

.appointment-editor-link-control li.tagit-choice.appointment-editor-link-pill.lec-provider-representation:not(.appointment-editor-calendar-host-pill) .tagit-close {
	opacity: .45;
}

.appointment-editor-link-pill-avatar,
.appointment-editor-link-pill-avatar .lookup-dropdown-avatar-image {
	width: 22px;
	height: 22px;
	border-radius: 50%;
	flex: 0 0 22px;
}

.appointment-editor-link-pill-avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	background: #6f879d;
	color: #fff;
	font-size: 9px;
	font-weight: 700;
	text-transform: uppercase;
}

.appointment-editor-link-pill-avatar span {
	color: #fff;
	font-size: 9px;
	font-weight: 700;
	line-height: 1;
}

.appointment-editor-link-pill-label {
	display: block;
	flex: 1 1 auto;
	min-width: 0;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* An unidentified attendee rests as avatar + name (+ Organizer badge). The address is
   detail: collapsed to nothing at rest, it slides out beside the name while the pointer or
   focus is on the pill. The negative margin cancels the pill's gap while it is collapsed. */
.appointment-editor-external-contact-pill .appointment-editor-link-pill-label {
	flex: 0 1 auto;
}

/* The badge is added after the address, but reads last: name, address, then Organizer. */
.appointment-editor-external-contact-pill .appointment-editor-host-marker {
	order: 1;
}

.appointment-editor-external-contact-email {
	flex: 0 1 auto;
	min-width: 0;
	max-width: 0;
	margin-left: -6px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	color: #6f7b89;
	font-size: 12px;
	font-weight: 500;
	opacity: 0;
	transition: opacity 0.16s ease;
}

/* The widths (this address, and the names of the other pills on the row, which give up
   room down to avatar-only) are driven together from dfb_mod_appointments.ts. */
.appointment-editor-external-contact-pill:hover .appointment-editor-external-contact-email,
.appointment-editor-external-contact-pill:focus-visible .appointment-editor-external-contact-email {
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	.appointment-editor-external-contact-email {
		transition: none;
	}
}

.appointment-editor-organizer-options-trigger {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 22px;
	width: 22px;
	height: 22px;
	padding: 0;
	border: 0;
	border-radius: 5px;
	background: transparent;
	color: #536273;
	font: 700 16px/1 Arial, sans-serif;
	cursor: pointer;
}

.appointment-editor-organizer-options-trigger:hover,
.appointment-editor-organizer-options-trigger:focus-visible {
	background: #edf3f8;
	outline: none;
}

.appointment-editor-organizer-options-trigger:focus-visible {
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .24);
}

.appointment-editor-host-marker {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-left: 6px;
	padding: 1px 6px;
	border-radius: 4px;
	background: #3B82F6;
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	line-height: 14px;
	vertical-align: 1px;
}

.appointment-editor-host-menu {
	position: fixed;
	top: 0;
	left: 0;
	visibility: hidden;
	z-index: 11050;
	min-width: 126px;
	padding: 5px;
	border: 1px solid #d4d9df;
	border-radius: 6px;
	background: #fff;
	box-shadow: 0 8px 22px rgba(15, 23, 42, .16);
	box-sizing: border-box;
}

.appointment-editor-host-menu button {
	display: block;
	width: 100%;
	min-height: 28px;
	padding: 5px 9px;
	border: 0;
	border-radius: 4px;
	background: transparent;
	color: #26323e;
	font-size: 13px;
	font-weight: 600;
	line-height: 18px;
	text-align: left;
	cursor: pointer;
}

.appointment-editor-host-menu button:hover:not(:disabled),
.appointment-editor-host-menu button:focus:not(:disabled) {
	background: #f2f6fb;
	outline: none;
}

.appointment-editor-host-menu button:disabled {
	color: #87919d;
	cursor: default;
}

button.appointment-editor-organizer-command-readonly {
	position: relative;
	color: #87919d;
	cursor: help;
}

button.appointment-editor-organizer-command-readonly[data-tooltip]::before,
button.appointment-editor-organizer-command-readonly[data-tooltip]::after {
	position: absolute;
	left: 50%;
	z-index: 11052;
	pointer-events: none;
	opacity: 0;
	transition: opacity 140ms ease;
}

button.appointment-editor-organizer-command-readonly[data-tooltip]::before {
	content: "";
	top: calc(100% + 5px);
	width: 10px;
	height: 10px;
	border-radius: 2px;
	background: #2f3740;
	transform: translateX(-50%) rotate(45deg);
}

button.appointment-editor-organizer-command-readonly[data-tooltip]::after {
	content: attr(data-tooltip);
	top: calc(100% + 10px);
	width: max-content;
	max-width: min(310px, calc(100vw - 32px));
	padding: 8px;
	border-radius: 6px;
	background: #2f3740;
	box-shadow: 0 8px 20px rgba(0, 0, 0, .18);
	color: #fff;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	text-align: center;
	white-space: pre-line;
	transform: translateX(-50%);
}

button.appointment-editor-organizer-command-readonly[data-tooltip]:hover::before,
button.appointment-editor-organizer-command-readonly[data-tooltip]:hover::after,
button.appointment-editor-organizer-command-readonly[data-tooltip]:focus-visible::before,
button.appointment-editor-organizer-command-readonly[data-tooltip]:focus-visible::after {
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	.appointment-editor-calendar-sync-invite-row-readonly[data-tooltip]::before,
	.appointment-editor-calendar-sync-invite-row-readonly[data-tooltip]::after,
	button.appointment-editor-organizer-command-readonly[data-tooltip]::before,
	button.appointment-editor-organizer-command-readonly[data-tooltip]::after {
		transition: none;
	}
}

.appointment-editor-link-control li.tagit-choice.appointment-editor-link-pill .tagit-close {
	position: static;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	margin: 0 0 0 1px;
	color: #666;
	text-decoration: none;
	opacity: .75;
}

.appointment-editor-link-control li.tagit-choice.appointment-editor-link-pill .tagit-close .text-icon {
	display: block;
	color: inherit;
	font-size: 16px;
	line-height: 16px;
	font-family: Arial, sans-serif;
}

.appointment-editor-link-control li.tagit-choice.appointment-editor-link-pill .tagit-close .ui-icon {
	display: none;
}

.appointment-editor-link-control li.tagit-choice.appointment-editor-link-pill .tagit-close:hover {
	color: #3f3f3f;
	opacity: 1;
}

/* Server-enforced links (e.g. the Organizer on an imported appointment)
   cannot be removed; hide the affordance while keeping the tag visible. */
.appointment-editor-link-control li.tagit-choice.lec-non-removable .tagit-close {
	display: none;
}

.appointment-editor-link-control li.tagit-new {
	position: relative;
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	width: 92px;
	max-width: 92px;
	height: 29px;
	min-width: 92px;
	min-height: 29px;
	margin: 0;
	padding: 0;
	border: 1.5px dashed #B2B2B2;
	border-radius: 7px;
	background: transparent;
	color: #B2B2B2;
	box-sizing: border-box;
	cursor: text;
}

.appointment-editor-link-control li.tagit-new:before {
	content: "+ Connect";
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 8px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	pointer-events: none;
}

.appointment-editor-link-control li.tagit-new:hover {
	border-color: #B2B2B2;
	color: #B2B2B2;
	background: rgba(255, 255, 255, .32);
}

.appointment-editor-link-control li.tagit-new:focus-within {
	width: min(100%, 180px);
	max-width: 180px;
	border-style: solid;
	border-color: #8cb2e5;
	background: #fff;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .14);
	color: #24282d;
}

.appointment-editor-link-control li.tagit-new:focus-within:before {
	display: none;
}

.appointment-editor-link-control li.tagit-new input {
	width: 0 !important;
	min-width: 0;
	height: 27px;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: #24282d;
	font-size: 13px;
	line-height: 27px;
	opacity: 0;
	box-sizing: border-box;
}

.appointment-editor-link-control li.tagit-new:focus-within input {
	width: 100% !important;
	padding: 0 8px !important;
	opacity: 1;
}

.appointment-editor-link-control li.tagit-new input:focus {
	outline: none;
}

.appointment-editor-dialog > .tagit-autocomplete.ui-autocomplete {
	position: fixed !important;
	z-index: 10020 !important;
	max-width: calc(100vw - 32px);
	max-height: 220px;
	padding: 4px;
	border: 0;
	border-radius: 10px;
	background: #fff;
	box-shadow: rgba(10, 10, 10, .1) 0 0 0 1px, rgba(0, 0, 0, .1) 0 4px 6px -1px, rgba(0, 0, 0, .1) 0 2px 4px -2px;
	overflow-y: auto;
	overflow-x: hidden;
	box-sizing: border-box;
}

.appointment-editor-dialog > .tagit-autocomplete.ui-autocomplete .ui-menu-item {
	margin: 0;
	padding: 6px 10px;
	border: 1px solid transparent;
	border-radius: 6px;
	color: #334155;
	font-size: 13px;
	font-weight: 600;
	line-height: 17px;
}

.appointment-editor-dialog > .tagit-autocomplete.ui-autocomplete .ui-menu-item.ui-state-focus,
.appointment-editor-dialog > .tagit-autocomplete.ui-autocomplete .ui-menu-item:hover {
	border-color: #cfe1f6;
	background: #F2F7FC;
	color: #334155;
}

/* Task editor: same modal language as appointments, scoped to task forms. */
.task-editor-dialog.ui-dialog {
	padding: 0;
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 18px 45px rgba(0, 0, 0, .18), 0 4px 12px rgba(0, 0, 0, .08);
	overflow: hidden;
}

.task-editor-dialog .ui-dialog-titlebar {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 4;
	width: auto;
	height: 30px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.task-editor-dialog .ui-dialog-titlebar:empty {
	display: none;
}

.task-editor-dialog .ui-dialog-title,
.task-editor-dialog .ui-dialog-titlebar-maximize {
	display: none !important;
}

.task-editor-dialog .ui-dialog-titlebar-close {
	position: static;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	margin: 0;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 7px;
	background: transparent;
	color: #6f7782;
	box-sizing: border-box;
	cursor: pointer;
}

.task-editor-dialog .task-editor-header-close.ui-dialog-titlebar-close {
	flex: 0 0 auto;
	width: 28px;
	height: 28px;
	border-radius: 6px;
	color: #6f7782;
}

.task-editor-dialog .ui-dialog-titlebar-close:hover {
	border-color: #d9dee5;
	background: #f5f5f5;
	color: #252a31;
}

.task-editor-dialog .ui-dialog-titlebar-close:focus-visible {
	outline: none;
	border-color: #b8c0ca;
	box-shadow: 0 0 0 2px rgba(15, 23, 42, .12);
}

.task-editor-dialog .ui-dialog-titlebar-close .ui-icon,
.task-editor-dialog .ui-dialog-titlebar-close .ui-button-icon,
.task-editor-dialog .ui-dialog-titlebar-close .ui-button-icon-primary,
.task-editor-dialog .ui-dialog-titlebar-close .ui-button-text {
	display: none;
}

.task-editor-dialog .ui-dialog-titlebar-close:before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.task-editor-dialog {
	--appointment-editor-link-panel-width: 450px;
	--appointment-editor-panel-gap: 10px;
	overflow: hidden;
}

.task-editor-dialog .ui-dialog-content {
	padding: 14px 14px 0;
	border: 0;
	background: #fff;
	overflow: hidden;
}

.task-editor-dialog .ui-dialog-content > a.metadata-link,
.task-editor-dialog .task-editor-form > a {
	display: none !important;
}

.task-editor-dialog .ui-dialog-buttonpane {
	margin: 0;
	padding: 10px 14px 12px;
	border-width: 1px 0 0;
	border-style: solid;
	border-color: #e7ebef;
	background: #fff;
	box-sizing: border-box;
}

.task-editor-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	float: none;
	width: 100%;
	min-height: 34px;
}

.task-editor-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > div {
	display: flex;
	align-items: center;
	gap: 8px;
}

.task-editor-dialog .ui-dialog-buttonpane button.ui-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	height: 32px;
	margin: 0;
	padding: 0 14px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background: #fff;
	color: #395066;
	box-shadow: none;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	box-sizing: border-box;
}

.task-editor-dialog .ui-dialog-buttonpane button.ui-button:hover {
	border-color: #bfcad6;
	background: #f5f8fb;
	color: #23384f;
}

.task-editor-dialog .ui-dialog-buttonpane button.ui-button:focus {
	outline: none;
	border-color: #8cb2e5;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .16);
}

.task-editor-dialog .ui-dialog-buttonpane button.ui-button .ui-button-text {
	padding: 0;
	line-height: 1;
}

.task-editor-dialog .ui-dialog-buttonpane button#save_button {
	border-color: #00529b;
	background: #00529b;
	color: #fff;
}

.task-editor-dialog .ui-dialog-buttonpane button#save_button:hover {
	border-color: #003d73;
	background: #003d73;
	color: #fff;
}

.task-editor-save-split {
	background: #00529b;
	border-radius: 8px;
	box-shadow: 0 1px 4px rgba(20, 32, 46, .10);
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 0;
	height: 32px;
	position: relative;
}

.task-editor-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > div.task-editor-save-split {
	gap: 0;
}

.task-editor-dialog .ui-dialog-buttonpane button#save_button.task-editor-save-main {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: 8px 0 0 8px;
	box-shadow: none;
	color: #fff;
	display: inline-flex;
	font-size: 13px;
	font-weight: 600;
	height: 32px;
	line-height: 1;
	padding: 0 10px 0 13px;
	white-space: nowrap;
}

.task-editor-dialog .ui-dialog-buttonpane button#save_button.task-editor-save-main:hover,
.task-editor-dialog .ui-dialog-buttonpane button#save_button.task-editor-save-main:focus,
.task-editor-dialog .ui-dialog-buttonpane button#save_button.task-editor-save-main.ui-state-hover {
	background: #003d73;
	border: 0;
	color: #fff;
	outline: none;
}

.task-editor-dialog .ui-dialog-buttonpane button#save_button.task-editor-save-main .ui-button-text {
	align-items: center;
	display: inline-flex;
	gap: 0;
	line-height: 1;
	padding: 0;
}

.task-editor-save-icon {
	align-items: center;
	display: inline-flex;
	flex: 0 0 auto;
	justify-content: center;
	line-height: 0;
}

.task-editor-save-icon svg {
	display: block;
}

.task-editor-save-split-divider {
	align-self: stretch;
	background: rgba(255, 255, 255, .28);
	flex: 0 0 auto;
	width: 1px;
}

.task-editor-dialog .ui-dialog-buttonpane button.task-editor-save-menu-button {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: 0 8px 8px 0;
	color: #fff;
	cursor: pointer;
	display: inline-flex;
	box-sizing: border-box;
	height: 32px;
	justify-content: center;
	margin: 0;
	padding: 0 7px;
	width: 26px;
}

.task-editor-dialog .ui-dialog-buttonpane button.task-editor-save-menu-button:hover,
.task-editor-dialog .ui-dialog-buttonpane button.task-editor-save-menu-button:focus,
.task-editor-dialog .ui-dialog-buttonpane button.task-editor-save-menu-button.ui-state-hover {
	background: #003d73;
	border: 0;
	color: #fff;
	outline: none;
}

.task-editor-save-menu {
	position: absolute;
	right: 0;
	bottom: calc(100% + 8px);
	z-index: 10020;
	width: 260px;
	padding: 6px;
	border: 1px solid #e4e7eb;
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 10px 28px rgba(20, 32, 46, .14);
	box-sizing: border-box;
}

.task-editor-save-menu-item {
	align-items: center;
	display: flex;
	gap: 9px;
	width: 100%;
	margin: 0;
	padding: 8px 10px;
	border: 0;
	border-radius: 7px;
	background: transparent;
	color: #3d4b5c;
	font-family: Manrope, "Segoe UI", Verdana, Arial, sans-serif;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 16px;
	text-align: left;
	white-space: nowrap;
	cursor: pointer;
	box-sizing: border-box;
}

.task-editor-dialog .ui-dialog-buttonpane .task-editor-save-menu button.task-editor-save-menu-item {
	margin: 0;
	padding: 8px 10px;
	border: 0;
	font-size: 12.5px;
	line-height: 16px;
}

.task-editor-save-menu-item:hover,
.task-editor-save-menu-item:focus {
	outline: none;
	background: #f3f3f3;
	color: #14202e;
}

.task-editor-save-menu-item .task-editor-save-icon {
	color: #5c6b7c;
	width: 14px;
}

.task-editor-save-menu-item:hover .task-editor-save-icon,
.task-editor-save-menu-item:focus .task-editor-save-icon {
	color: #00529b;
}

.task-editor-dialog .ui-dialog-buttonpane button.task-editor-complete-button {
	border-color: #a9c2dc;
	background: #f4f8fc;
	color: #174d82;
}

.task-editor-dialog .ui-dialog-buttonpane button.task-editor-complete-button:hover {
	border-color: #8eb1d2;
	background: #eaf3fb;
	color: #174d82;
}

.task-editor-dialog .ui-dialog-buttonpane button#delete_button {
	border-color: #ef4444;
	background: #ef4444;
	color: #fff;
}

.task-editor-dialog .ui-dialog-buttonpane button#delete_button:hover {
	border-color: #dc2626;
	background: #dc2626;
	color: #fff;
}

.task-editor-dialog .act-completed,
.task-editor-dialog .act-end-of-series {
	display: inline-flex;
	align-items: center;
	min-height: 22px;
	margin-left: 8px;
	padding: 2px 8px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	-webkit-text-stroke: 0;
}

.task-editor-dialog .act-completed {
	background: #e8f7ed;
	color: #177245;
}

.task-editor-dialog .act-end-of-series {
	background: #fff2f2;
	color: #b42318;
}

.task-editor-dialog .slider-input {
	width: calc(100% - 4px);
	height: 6px;
	margin: 9px 2px;
	border: 0;
	border-radius: 999px;
	background: #d7dde5;
}

.task-editor-dialog .slider-input .ui-slider-range {
	border-radius: 999px;
	background: #00529b;
}

.task-editor-dialog .slider-input > div.ui-slider-handle {
	top: -9px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 22px;
	margin-left: -14px;
	border: 1px solid #c9d3df;
	border-radius: 7px;
	background: #fff;
	box-shadow: 0 2px 6px rgba(15, 23, 42, .12);
	color: #334155;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	box-sizing: border-box;
}

.task-editor-dialog > .tagit-autocomplete.ui-autocomplete {
	position: fixed !important;
	z-index: 10020 !important;
	max-width: calc(100vw - 32px);
	max-height: 220px;
	padding: 4px;
	border: 0;
	border-radius: 10px;
	background: #fff;
	box-shadow: rgba(10, 10, 10, .1) 0 0 0 1px, rgba(0, 0, 0, .1) 0 4px 6px -1px, rgba(0, 0, 0, .1) 0 2px 4px -2px;
	overflow-y: auto;
	overflow-x: hidden;
	box-sizing: border-box;
}

.task-editor-dialog > .tagit-autocomplete.ui-autocomplete .ui-menu-item {
	margin: 0;
	padding: 6px 10px;
	border: 1px solid transparent;
	border-radius: 6px;
	color: #334155;
	font-size: 13px;
	font-weight: 600;
	line-height: 17px;
}

.task-editor-dialog > .tagit-autocomplete.ui-autocomplete .ui-menu-item.ui-state-focus,
.task-editor-dialog > .tagit-autocomplete.ui-autocomplete .ui-menu-item:hover {
	border-color: #cfe1f6;
	background: #F2F7FC;
	color: #334155;
}

.tagit-autocomplete.ui-autocomplete {
	position: fixed !important;
	z-index: 10020 !important;
	max-width: calc(100vw - 32px);
	max-height: 220px !important;
	padding: 4px !important;
	border: 0 !important;
	border-radius: 10px !important;
	background: #fff !important;
	box-shadow: rgba(10, 10, 10, .1) 0 0 0 1px, rgba(0, 0, 0, .1) 0 4px 6px -1px, rgba(0, 0, 0, .1) 0 2px 4px -2px !important;
	overflow-y: auto !important;
	overflow-x: hidden !important;
	box-sizing: border-box;
}

.tagit-autocomplete.ui-autocomplete .ui-menu-item {
	margin: 0;
	padding: 6px 10px !important;
	border: 1px solid transparent;
	border-radius: 6px;
	color: #334155;
	font-size: 13px;
	font-weight: 600;
	line-height: 17px;
}

.tagit-autocomplete.ui-autocomplete .ui-menu-item.ui-state-focus,
.tagit-autocomplete.ui-autocomplete .ui-menu-item:hover {
	border-color: #cfe1f6 !important;
	background: #F2F7FC !important;
	color: #334155 !important;
}

/* Recurring activity editor: modern shell matching the appointment editor without sharing dialog classes. */
.recurring-activity-dialog.ui-dialog,
.recurrence-action-dialog.ui-dialog {
	padding: 0;
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 18px 45px rgba(0, 0, 0, .18), 0 4px 12px rgba(0, 0, 0, .08);
	overflow: hidden;
}

.recurring-activity-dialog .ui-dialog-titlebar,
.recurrence-action-dialog .ui-dialog-titlebar {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 4;
	width: auto;
	height: 30px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.recurring-activity-dialog .ui-dialog-title,
.recurrence-action-dialog .ui-dialog-title,
.recurring-activity-dialog .ui-dialog-titlebar-maximize,
.recurrence-action-dialog .ui-dialog-titlebar-maximize {
	display: none !important;
}

.recurring-activity-dialog .ui-dialog-titlebar-close,
.recurrence-action-dialog .ui-dialog-titlebar-close {
	position: static;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	margin: 0;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 7px;
	background: transparent;
	color: #6f7782;
	box-sizing: border-box;
	cursor: pointer;
}

.recurring-activity-dialog .recurring-activity-header-close.ui-dialog-titlebar-close {
	flex: 0 0 auto;
	width: 28px;
	height: 28px;
	border-radius: 6px;
	color: #6f7782;
}

.recurring-activity-dialog .ui-dialog-titlebar-close:hover,
.recurrence-action-dialog .ui-dialog-titlebar-close:hover {
	border-color: #d9dee5;
	background: #f5f5f5;
	color: #252a31;
}

.recurring-activity-dialog .ui-dialog-titlebar-close:focus-visible,
.recurrence-action-dialog .ui-dialog-titlebar-close:focus-visible {
	outline: none;
	border-color: #b8c0ca;
	box-shadow: 0 0 0 2px rgba(15, 23, 42, .12);
}

.recurring-activity-dialog .ui-dialog-titlebar-close .ui-icon,
.recurring-activity-dialog .ui-dialog-titlebar-close .ui-button-icon,
.recurring-activity-dialog .ui-dialog-titlebar-close .ui-button-icon-primary,
.recurring-activity-dialog .ui-dialog-titlebar-close .ui-button-text,
.recurrence-action-dialog .ui-dialog-titlebar-close .ui-icon,
.recurrence-action-dialog .ui-dialog-titlebar-close .ui-button-icon,
.recurrence-action-dialog .ui-dialog-titlebar-close .ui-button-icon-primary,
.recurrence-action-dialog .ui-dialog-titlebar-close .ui-button-text {
	display: none;
}

.recurring-activity-dialog .ui-dialog-titlebar-close:before,
.recurrence-action-dialog .ui-dialog-titlebar-close:before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.recurring-activity-dialog {
	--appointment-editor-link-panel-width: 450px;
	--appointment-editor-panel-gap: 10px;
	overflow: hidden;
}

.recurring-activity-dialog .ui-dialog-content,
.recurrence-action-dialog .ui-dialog-content {
	padding: 14px 14px 0;
	border: 0;
	background: #fff;
	overflow: hidden;
}

.recurring-activity-dialog .ui-dialog-content > a.metadata-link,
.recurring-activity-dialog .recurring-activity-form > a {
	display: none !important;
}

.recurring-activity-dialog .ui-dialog-buttonpane,
.recurrence-action-dialog .ui-dialog-buttonpane {
	margin: 0;
	padding: 10px 14px 12px;
	border-width: 1px 0 0;
	border-style: solid;
	border-color: #e7ebef;
	background: #fff;
	box-sizing: border-box;
}

.recurring-activity-dialog .ui-dialog-buttonpane .ui-dialog-buttonset,
.recurrence-action-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	float: none;
	width: 100%;
	min-height: 34px;
}

.recurring-activity-dialog .ui-dialog-buttonpane button.ui-button,
.recurrence-action-dialog .ui-dialog-buttonpane button.ui-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	height: 32px;
	margin: 0;
	padding: 0 14px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background: #fff;
	color: #395066;
	box-shadow: none;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	box-sizing: border-box;
}

.recurring-activity-dialog .ui-dialog-buttonpane button.ui-button:hover,
.recurrence-action-dialog .ui-dialog-buttonpane button.ui-button:hover {
	border-color: #bfcad6;
	background: #f5f8fb;
	color: #23384f;
}

.recurring-activity-dialog .ui-dialog-buttonpane button.ui-button:focus,
.recurrence-action-dialog .ui-dialog-buttonpane button.ui-button:focus {
	outline: none;
	border-color: #8cb2e5;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .16);
}

.recurring-activity-dialog .ui-dialog-buttonpane button.ui-button .ui-button-text,
.recurrence-action-dialog .ui-dialog-buttonpane button.ui-button .ui-button-text {
	padding: 0;
	line-height: 1;
}

.recurring-activity-dialog .ui-dialog-buttonpane button#save_button,
.recurring-activity-dialog .ui-dialog-buttonpane button#save_and_edit_button,
.recurring-activity-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > button:last-child {
	border-color: #00529b;
	background: #00529b;
	color: #fff;
}

.recurring-activity-dialog .ui-dialog-buttonpane button#save_button:hover,
.recurring-activity-dialog .ui-dialog-buttonpane button#save_and_edit_button:hover,
.recurring-activity-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > button:last-child:hover {
	border-color: #003d73;
	background: #003d73;
	color: #fff;
}

/* Delete lines up with the field column, as it does in the appointment and task editors; the
   shared left-button rule would inset it a further 20px. */
.recurring-activity-dialog .ui-dialog-buttonpane .jq_diag_left_button {
	left: 0;
}

.recurring-activity-dialog .ui-dialog-buttonpane button#delete_button,
.recurrence-action-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > button:first-child {
	border-color: #ef4444;
	background: #ef4444;
	color: #fff;
}

.recurring-activity-dialog .ui-dialog-buttonpane button#delete_button:hover,
.recurrence-action-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > button:first-child:hover {
	border-color: #dc2626;
	background: #dc2626;
	color: #fff;
}

.recurring-pattern-confirm-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > button:first-child {
	border-color: #00529b;
	background: #00529b;
	color: #fff;
}

.recurring-pattern-confirm-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > button:first-child:hover {
	border-color: #003d73;
	background: #003d73;
	color: #fff;
}

.appointment-editor-field-table > tbody > tr.recurring-activity-pattern-row,
.recurring-activity-field-table > tbody > tr.recurring-activity-pattern-row {
	height: auto;
}

.recurring-activity-pattern-control {
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
	padding: 2px 0 4px;
	box-sizing: border-box;
}

.recurring-activity-pattern-type {
	width: 100% !important;
	height: 27px !important;
	min-width: 0 !important;
	padding: 3px 28px 3px 10px !important;
	border: 1px solid #d5dce4 !important;
	border-radius: 7px;
	background-color: #fff !important;
	line-height: 20px;
	box-sizing: border-box;
}

.recurring-activity-pattern-body,
.recurring-activity-pattern-options {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}

.recurring-activity-pattern-line {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	min-height: 27px;
	margin: 0;
	color: #475569;
	font-size: 13px;
	line-height: 18px;
}

.recurring-activity-pattern-line input[type=number],
.recurring-activity-pattern-line select {
	width: auto !important;
	min-width: 48px !important;
	height: 26px;
	padding: 2px 6px !important;
	border: 1px solid #d5dce4 !important;
	border-radius: 6px;
	background-color: #fff !important;
	font-size: 13px;
}

.recurring-activity-pattern-line select {
	min-width: 132px !important;
	padding-right: 24px !important;
}

.recurring-activity-pattern-line input[type=radio],
.recurring-activity-pattern-line input[type=checkbox] {
	width: auto !important;
	min-width: 0 !important;
	height: auto;
	margin: 0 2px 0 0;
}

.recurring-activity-pattern-line label {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-right: 6px;
	color: #475569;
	font-size: 12px;
	font-weight: 600;
}

.recurring-activity-pattern-options hr {
	width: 100%;
	margin: 1px 0;
	border: 0;
	border-top: 1px solid #e1e6ec;
}

.recurring-activity-pattern-choice-group {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.recurring-activity-pattern-option {
	display: flex !important;
	align-items: flex-start;
	gap: 8px;
	width: 100%;
	margin: 0;
	padding: 8px;
	border: 1px solid transparent;
	border-radius: 7px;
	background: rgba(255, 255, 255, .44);
	text-align: left !important;
	white-space: normal !important;
	box-sizing: border-box;
	cursor: pointer;
	transition: border-color 120ms ease, background-color 120ms ease;
}

.recurring-activity-pattern-option.is-active {
	border-color: #c7d7e8;
	background: #fff;
}

.recurring-activity-pattern-option input[type=radio] {
	flex: 0 0 auto;
	display: inline-block !important;
	width: 13px !important;
	min-width: 13px !important;
	max-width: 13px !important;
	height: 13px !important;
	margin-top: 2px !important;
}

.recurring-activity-pattern-option-copy {
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
}

.recurring-activity-pattern-option-title {
	color: #777;
	font-size: 13px;
	font-weight: 600;
	line-height: 17px;
}

.recurring-activity-pattern-option-summary {
	color: #64748b;
	font-size: 11px;
	font-weight: 500;
	line-height: 15px;
}

.recurring-activity-pattern-choice-panel {
	display: flex;
	flex-direction: column;
	gap: 7px;
	padding: 8px;
	border: 1px solid #e1e6ec;
	border-radius: 7px;
	background: rgba(255, 255, 255, .65);
	box-sizing: border-box;
}

.recurring-activity-pattern-field-row {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin: 0;
	color: #475569;
	font-size: 13px;
	line-height: 18px;
}

.recurring-activity-pattern-field-label {
	color: #777;
	font-size: 12px;
	font-weight: 600;
	line-height: 15px;
}

.recurring-activity-pattern-field-control {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	min-height: 27px;
}

.recurring-activity-pattern-field-control input[type=number],
.recurring-activity-pattern-field-control select {
	width: auto !important;
	min-width: 48px !important;
	height: 26px;
	padding: 2px 6px !important;
	border: 1px solid #d5dce4 !important;
	border-radius: 6px;
	background-color: #fff !important;
	font-size: 13px;
}

.recurring-activity-pattern-field-control select {
	min-width: 132px !important;
	padding-right: 24px !important;
}

.recurring-activity-pattern-field-control input[type=radio],
.recurring-activity-pattern-field-control input[type=checkbox] {
	width: auto !important;
	min-width: 0 !important;
	height: auto;
	margin: 0 2px 0 0;
}

.recurring-activity-pattern-field-control label {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-right: 6px;
	color: #475569;
	font-size: 12px;
	font-weight: 600;
}

.recurring-activity-pattern-field-row-days .recurring-activity-pattern-field-control > div {
	display: inline-grid !important;
	grid-template-columns: 1fr;
	gap: 2px;
}

.appointment-editor-field-table select.activity-modal-native-select,
.modern-entity-editor-field-table select.activity-modal-native-select {
	display: none !important;
}

.activity-modal-select {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	width: 100%;
	min-width: 0;
	height: 27px;
	padding: 0 6px 0 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: #24282d;
	font-size: 14px;
	font-weight: 500;
	line-height: 27px;
	text-align: left;
	box-shadow: none;
	cursor: pointer;
	box-sizing: border-box;
	transition: background-color 120ms ease, box-shadow 120ms ease;
}

.activity-modal-select::after {
	content: "";
	flex: 0 0 auto;
	width: 12px;
	height: 12px;
	background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%2378869a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 16px 16px;
	transition: transform 120ms ease;
}

.activity-modal-select:hover:not(:disabled) {
	background: transparent;
	outline: none;
	box-shadow: none;
}

.activity-modal-select:focus-visible {
	background: rgba(255, 255, 255, .3);
	outline: none;
	box-shadow: 0 0 0 2px rgba(47, 115, 173, .16);
}

.activity-modal-select.activity-modal-select-open {
	background: transparent;
	outline: none;
	box-shadow: none;
}

.activity-modal-select.activity-modal-select-open::after {
	transform: rotate(180deg);
}

.activity-modal-select:disabled,
.activity-modal-select.activity-modal-select-disabled {
	cursor: default;
	opacity: .62;
}

.activity-modal-select-label {
	display: block;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.activity-modal-select-label-empty {
	color: #8b96a3;
}

.recurring-activity-pattern-line .activity-modal-select,
.recurring-activity-pattern-field-control .activity-modal-select {
	width: auto;
	min-width: 132px;
	height: 26px;
	padding: 0 6px 0 0;
	font-size: 13px;
	line-height: 26px;
}

.recurring-activity-pattern-choice-panel .recurring-activity-pattern-line .activity-modal-select {
	min-width: 88px;
}

.recurring-activity-pattern-type + .activity-modal-select,
.recurring-activity-pattern-choice-panel .recurring-activity-pattern-line .activity-modal-select,
.recurring-activity-pattern-field-control .activity-modal-select {
	padding: 0 7px 0 9px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background: #fff;
	box-shadow: 0 1px 1px rgba(15, 23, 42, .03);
	line-height: 24px;
	transition: border-color 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
}

.recurring-activity-pattern-type + .activity-modal-select:hover:not(:disabled),
.recurring-activity-pattern-choice-panel .recurring-activity-pattern-line .activity-modal-select:hover:not(:disabled),
.recurring-activity-pattern-field-control .activity-modal-select:hover:not(:disabled) {
	border-color: #c4d1de;
	background: #fff;
	box-shadow: 0 1px 1px rgba(15, 23, 42, .04);
}

.recurring-activity-pattern-type + .activity-modal-select:focus-visible,
.recurring-activity-pattern-type + .activity-modal-select.activity-modal-select-open,
.recurring-activity-pattern-choice-panel .recurring-activity-pattern-line .activity-modal-select:focus-visible,
.recurring-activity-pattern-choice-panel .recurring-activity-pattern-line .activity-modal-select.activity-modal-select-open,
.recurring-activity-pattern-field-control .activity-modal-select:focus-visible,
.recurring-activity-pattern-field-control .activity-modal-select.activity-modal-select-open {
	border-color: #a9c2dc;
	background: #fff;
	outline: none;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .12);
}

.recurring-activity-pattern-type + .activity-modal-select {
	width: 100%;
}

.recurring-activity-pattern-weekend + .activity-modal-select {
	flex: 0 0 184px;
	width: 184px;
	max-width: 184px;
	padding: 0 7px 0 9px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background: #fff;
	box-shadow: 0 1px 1px rgba(15, 23, 42, .03);
	line-height: 24px;
	transition: border-color 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
}

.recurring-activity-pattern-weekend + .activity-modal-select:hover:not(:disabled) {
	border-color: #c4d1de;
	background: #fff;
	box-shadow: 0 1px 1px rgba(15, 23, 42, .04);
}

.recurring-activity-pattern-weekend + .activity-modal-select:focus-visible,
.recurring-activity-pattern-weekend + .activity-modal-select.activity-modal-select-open {
	border-color: #a9c2dc;
	background: #fff;
	outline: none;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .12);
}

.activity-modal-select-menu {
	position: fixed;
	z-index: 10070;
	display: none;
	padding: 5px;
	border: 1px solid #d8dde4;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 16px 36px rgba(20, 30, 42, .18), 0 4px 10px rgba(20, 30, 42, .08);
	overflow-x: hidden;
	overflow-y: auto;
	box-sizing: border-box;
}

.activity-modal-select-option {
	display: flex;
	align-items: center;
	width: 100%;
	min-height: 30px;
	padding: 6px 10px;
	border: 1px solid transparent;
	border-radius: 6px;
	background: transparent;
	color: #334155;
	font-size: 13px;
	font-weight: 600;
	line-height: 17px;
	text-align: left;
	white-space: normal;
	cursor: pointer;
	box-sizing: border-box;
}

.activity-modal-select-option:hover:not(:disabled),
.activity-modal-select-option:focus {
	border-color: #cfe1f6;
	background: #f2f7fc;
	outline: none;
}

.activity-modal-select-option.activity-modal-select-option-selected {
	border-color: #b9d5f5;
	background: #eaf4ff;
	color: #0a559f;
}

.activity-modal-select-option:disabled {
	cursor: default;
	opacity: .5;
}

.recurring-activity-dialog > .tagit-autocomplete.ui-autocomplete {
	position: fixed !important;
	z-index: 10020 !important;
	max-width: calc(100vw - 32px);
	max-height: 220px;
	padding: 4px;
	border: 0;
	border-radius: 10px;
	background: #fff;
	box-shadow: rgba(10, 10, 10, .1) 0 0 0 1px, rgba(0, 0, 0, .1) 0 4px 6px -1px, rgba(0, 0, 0, .1) 0 2px 4px -2px;
	overflow-y: auto;
	overflow-x: hidden;
	box-sizing: border-box;
}

.recurring-activity-dialog > .tagit-autocomplete.ui-autocomplete .ui-menu-item {
	margin: 0;
	padding: 6px 10px;
	border: 1px solid transparent;
	border-radius: 6px;
	color: #334155;
	font-size: 13px;
	font-weight: 600;
	line-height: 17px;
}

.recurring-activity-dialog > .tagit-autocomplete.ui-autocomplete .ui-menu-item.ui-state-focus,
.recurring-activity-dialog > .tagit-autocomplete.ui-autocomplete .ui-menu-item:hover {
	border-color: #cfe1f6;
	background: #F2F7FC;
	color: #334155;
}

.recurrence-action-dialog .ui-dialog-content {
	padding: 44px 16px 0;
	color: #334155;
	font-size: 13px;
	line-height: 18px;
}

.recurrence-delete-scope-dialog .ui-dialog-content {
	padding: 22px 18px 18px;
}

.recurrence-delete-scope-content {
	color: #263342;
}

.recurrence-delete-scope-heading {
	margin: 0 34px 6px 0;
	color: #151d29;
	font-size: 17px;
	font-weight: 700;
	line-height: 22px;
}

.recurrence-delete-scope-intro {
	margin: 0 34px 14px 0;
	color: #526171;
	font-size: 13px;
	line-height: 18px;
}

.recurrence-delete-scope-note {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 10px 0 0;
	padding: 9px 10px;
	border: 1px solid #cfe8d8;
	border-radius: 8px;
	background: #EEF8F1;
	color: #315f46;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
}

.recurrence-delete-scope-note-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 17px;
	height: 17px;
	background-color: #2f8f5b;
	-webkit-mask: url('/images/icons/protected-icon.svg') center / contain no-repeat;
	mask: url('/images/icons/protected-icon.svg') center / contain no-repeat;
}

.recurrence-delete-scope-note-text {
	min-width: 0;
}

.recurrence-delete-scope-options {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
}

.recurrence-delete-scope-option {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	padding: 10px 12px;
	border: 1px solid #d7e0ea;
	border-radius: 8px;
	background: #fff;
	box-sizing: border-box;
	cursor: pointer;
	transition: border-color .12s ease, background-color .12s ease, box-shadow .12s ease;
}

.recurrence-delete-scope-option:hover {
	border-color: #b9c9d9;
	background: #f8fbfe;
}

.recurrence-delete-scope-option-selected {
	border-color: #A9C2DC;
	background: #F4F8FC;
	box-shadow: 0 0 0 1px rgba(169, 194, 220, .35);
}

.recurrence-delete-scope-option input[type="radio"] {
	flex: 0 0 auto;
	width: 15px;
	height: 15px;
	margin: 2px 0 0;
	accent-color: #00529b;
}

.recurrence-delete-scope-option-body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-width: 0;
	gap: 2px;
}

.recurrence-delete-scope-option-title {
	color: #23384f;
	font-size: 13px;
	font-weight: 700;
	line-height: 17px;
}

.recurrence-delete-scope-option-description {
	color: #667789;
	font-size: 12px;
	line-height: 16px;
}

.recurrence-delete-scope-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > button:first-child {
	border-color: #d5dce4;
	background: #fff;
	color: #395066;
}

.recurrence-delete-scope-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > button:first-child:hover {
	border-color: #bfcad6;
	background: #f5f8fb;
	color: #23384f;
}

.recurrence-delete-scope-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > button:last-child {
	border-color: #ef4444;
	background: #ef4444;
	color: #fff;
}

.recurrence-delete-scope-dialog .ui-dialog-buttonpane .ui-dialog-buttonset > button:last-child:hover {
	border-color: #dc2626;
	background: #dc2626;
	color: #fff;
}

.recurrence-action-dialog-content p,
.recurring-pattern-confirm-content {
	margin: 0 0 12px;
	color: #334155;
	font-size: 13px;
	line-height: 18px;
}

.recurrence-action-select,
.recurring-pattern-confirm-content input {
	width: 100% !important;
	min-width: 0 !important;
	height: 32px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background-color: #fff;
	color: #24282d;
	font-size: 13px;
	box-sizing: border-box;
}

.appointment-editor-notes-host {
	position: absolute;
	top: 70px;
	right: var(--appointment-editor-content-scrollbar-width, 0px);
	bottom: 58px;
	left: 0;
	z-index: 10010;
	opacity: 0;
	pointer-events: none;
	transition: opacity 180ms ease;
}

.appointment-editor-notes-host.is-open {
	opacity: 1;
}

.appointment-editor-notes-panel {
	--appointment-editor-notes-panel-bg: #f3f3f3;
	position: absolute;
	top: 0;
	right: 14px;
	bottom: 0;
	display: flex;
	flex-direction: column;
	width: min(calc(var(--appointment-editor-link-panel-width, 450px) - var(--appointment-editor-panel-gap, 10px)), calc(100% - 28px));
	padding: 14px 16px 0;
	border: 1px solid #e5e5e5;
	border-radius: 12px;
	background: var(--appointment-editor-notes-panel-bg);
	box-shadow: 0 24px 56px rgba(21, 28, 37, 0.18);
	box-sizing: border-box;
	pointer-events: auto;
	transform: translateX(calc(100% + 18px));
	transition: transform 220ms ease;
}

.appointment-editor-notes-host.is-open .appointment-editor-notes-panel {
	transform: translateX(0);
}

.appointment-editor-notes-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	flex: 0 0 auto;
	min-height: 30px;
	margin-bottom: 10px;
}

.appointment-editor-notes-title-block {
	display: flex;
	align-items: center;
	min-width: 0;
	min-height: 30px;
}

.appointment-editor-notes-title {
	color: rgba(0, 0, 0, 0.72);
	font-size: 14px;
	font-weight: 700;
	line-height: 18px;
}

.appointment-editor-notes-composer {
	display: none;
	flex: 0 0 auto;
	flex-direction: column;
	min-height: 0;
	margin-bottom: 12px;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	box-sizing: border-box;
}

.appointment-editor-notes-composer.is-visible {
	display: flex;
}

.appointment-editor-notes-panel-composing .appointment-editor-notes-composer {
	flex: 1 1 auto;
	margin-bottom: 16px;
}

.appointment-editor-notes-panel-composing .appointment-editor-notes-list,
.appointment-editor-notes-panel-composing .appointment-editor-notes-status {
	display: none;
}

.appointment-editor-notes-title-input {
	width: 100%;
	height: 34px;
	margin: 0 0 10px;
	padding: 0 10px;
	border: 1px solid #d9e0e8;
	border-radius: 8px;
	background: #fff;
	color: #1f2937;
	font-size: 14px;
	font-weight: 600;
	box-sizing: border-box;
}

.appointment-editor-notes-title-input:focus {
	border-color: #8cb2e5;
	background: #fff;
	outline: none;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, 0.14);
}

.appointment-editor-notes-body-input {
	flex: 0 0 auto;
	width: 100%;
	min-height: 98px;
	max-height: 150px;
	padding: 10px;
	border: 1px solid #d9e0e8;
	border-radius: 9px;
	background: #fff;
	color: #1f2937;
	font: inherit;
	font-size: 14px;
	line-height: 20px;
	resize: none;
	outline: none;
	overflow-y: auto;
	box-sizing: border-box;
}

.appointment-editor-notes-panel-composing .appointment-editor-notes-body-input {
	flex: 1 1 auto;
	min-height: 0;
	max-height: none;
}

.appointment-editor-notes-body-input:focus {
	border-color: #8cb2e5;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, 0.14);
}

.appointment-editor-notes-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	margin-top: 12px;
}

.appointment-editor-notes-composer-body-shell {
	flex: 1 1 auto;
	width: 100%;
	min-height: 98px;
}

.appointment-editor-notes-composer-body-shell .appointment-editor-notes-body-input {
	display: block;
	flex: 1 1 auto;
	min-height: 0;
	max-height: none;
	margin: 0;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.appointment-editor-notes-composer-body-shell .appointment-editor-notes-body-input:focus {
	box-shadow: none;
}

.appointment-editor-notes-composer-body-shell.is-attachment-panel-open .appointment-editor-notes-body-input {
	display: none;
}

.appointment-editor-notes-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 31px;
	padding: 0 12px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	box-sizing: border-box;
}

.appointment-editor-notes-btn:disabled {
	cursor: default;
	opacity: 0.55;
}

.appointment-editor-notes-btn-secondary {
	background: #fff;
	color: #395066;
}

.appointment-editor-notes-btn-secondary:hover:not(:disabled),
.appointment-editor-notes-btn-secondary:focus:not(:disabled) {
	border-color: #bfcad6;
	background: #f5f8fb;
	outline: none;
}

.appointment-editor-notes-btn-primary {
	border-color: #a9c2dc;
	background: #f4f8fc;
	color: #174d82;
}

.appointment-editor-notes-btn-primary:hover:not(:disabled),
.appointment-editor-notes-btn-primary:focus:not(:disabled) {
	border-color: #8eb1d2;
	background: #eaf3fb;
	outline: none;
}

.appointment-editor-notes-add-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	height: 29px;
	padding: 0 10px;
	border: none;
	border-radius: 7px;
	background: #3B82F6;
	color: #ffffff;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	box-sizing: border-box;
}

.appointment-editor-notes-header .appointment-editor-notes-add-btn {
	font-size: 12px;
}

.appointment-editor-notes-add-btn:hover:not(:disabled),
.appointment-editor-notes-add-btn:focus:not(:disabled) {
	background: #2563EB;
	color: #ffffff;
	outline: none;
}

.appointment-editor-notes-add-btn:disabled {
	cursor: default;
	opacity: 0.55;
}

.appointment-editor-notes-list {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 8px;
	min-height: 0;
	padding: 0 0 48px;
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: none;
}

.appointment-editor-notes-list.has-expanded-note {
	padding-bottom: 0;
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card-row:not(.is-expanded-row) {
	display: none;
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-date-divider {
	display: none;
}

.appointment-editor-notes-list::-webkit-scrollbar {
	display: none;
}

.appointment-editor-notes-date-divider {
	flex: 0 0 auto;
	width: 100%;
	margin: 12px 0 8px;
	color: #64748b;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	text-align: center;
	box-sizing: border-box;
}

.appointment-editor-notes-list .appointment-editor-notes-date-divider:first-child {
	margin-top: 0;
}

.appointment-editor-notes-card-row {
	display: grid;
	grid-template-columns: 22px minmax(0, 1fr) 22px;
	align-items: start;
	flex: 0 0 auto;
	gap: 8px;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.appointment-editor-notes-card-row.has-note-author {
	padding-top: 22px;
}

.appointment-editor-notes-card-row.is-expanded-row {
	grid-template-columns: minmax(0, 1fr);
	gap: 0;
	flex: 1 1 auto;
	min-height: 0;
	margin-bottom: 16px;
	padding-top: 0;
}

.appointment-editor-notes-card-row.is-expanded-row .appointment-editor-notes-card {
	height: 100%;
	margin-bottom: 0;
}

.appointment-editor-notes-card-avatar-slot {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	margin-top: 4px;
	overflow: visible;
	pointer-events: none;
}

.appointment-editor-notes-card-row.has-note-author .appointment-editor-notes-card-avatar-slot {
	position: relative;
	z-index: 1;
	margin-top: -22px;
}

.appointment-editor-notes-card-avatar-slot-left {
	justify-content: flex-start;
}

.appointment-editor-notes-card-avatar-slot-right {
	justify-content: flex-end;
}

.appointment-editor-notes-card-row.is-expanded-row .appointment-editor-notes-card-avatar-slot {
	display: none;
}

.appointment-editor-notes-card-author {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	gap: 8px;
	max-width: 168px;
	min-width: 0;
	color: #64748b;
	font-size: 11px;
	font-weight: 700;
	line-height: 16px;
	letter-spacing: 0;
	white-space: nowrap;
	box-sizing: border-box;
}

.appointment-editor-notes-card-author-right {
	justify-content: flex-end;
	text-align: right;
}

.appointment-editor-notes-card-author-left {
	justify-content: flex-start;
	text-align: left;
}

.appointment-editor-notes-card-author-name {
	display: block;
	min-width: 0;
	max-width: 140px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.appointment-editor-notes-card-avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 22px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: #d1d5db;
	color: #fff;
	font-size: 8px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.14);
	overflow: hidden;
}

.appointment-editor-notes-card-avatar .lookup-dropdown-avatar-image {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	object-fit: cover;
}

.appointment-editor-notes-card {
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	width: 100%;
	max-height: 100%;
	min-height: 0;
	padding: 11px 12px;
	border: 1px solid #e6ebf1;
	border-radius: 9px;
	background: #fff;
	color: inherit;
	text-align: left;
	cursor: pointer;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
	box-sizing: border-box;
}

.appointment-editor-notes-card.is-expanded {
	position: relative;
	flex: 1 1 auto;
	margin-bottom: 16px;
	padding: 0;
	border-color: transparent;
	background: transparent;
	box-shadow: none;
	cursor: default;
}

.appointment-editor-notes-card.is-expanded:hover,
.appointment-editor-notes-card.is-expanded:focus {
	border-color: transparent;
	background: transparent;
}

.appointment-editor-notes-card:hover,
.appointment-editor-notes-card:focus {
	border-color: #cfd9e4;
	background: #fbfdff;
	outline: none;
}

.appointment-editor-notes-card.is-draft-note:not(.is-expanded) {
	border: 1px dashed #d4d4d4;
}

.appointment-editor-notes-card.is-draft-note:not(.is-expanded):hover,
.appointment-editor-notes-card.is-draft-note:not(.is-expanded):focus {
	border-color: #d4d4d4;
}

.appointment-editor-notes-card-title {
	flex: 0 0 auto;
	min-width: 0;
	color: #1f2937;
	font-size: 14px;
	font-weight: 700;
	line-height: 18px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.appointment-editor-notes-card-title-text {
	display: block;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.appointment-editor-notes-card.is-expanded .appointment-editor-notes-card-title {
	white-space: normal;
}

.appointment-editor-notes-card-editor-header {
	display: none;
	flex: 0 0 auto;
	align-items: center;
	gap: 6px;
	width: 100%;
	height: 34px;
	margin-bottom: 10px;
	padding: 0 6px;
	border: 1px solid #d9e0e8;
	border-radius: 8px;
	background: #fff;
	box-sizing: border-box;
}

.appointment-editor-notes-card.is-expanded .appointment-editor-notes-card-editor-header {
	display: flex;
}

.appointment-editor-notes-card-editor-header:focus-within {
	border-color: #8cb2e5;
	background: #fff;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, 0.14);
}

.appointment-editor-notes-card-back-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 24px;
	height: 24px;
	margin: 0;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 50%;
	background: transparent;
	color: #64748b;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
	box-sizing: border-box;
}

.appointment-editor-notes-card-back-btn:hover,
.appointment-editor-notes-card-back-btn:focus {
	border-color: #cbd5e1;
	background: #f1f5f9;
	color: #334155;
	outline: none;
}

.appointment-editor-notes-card-title-input {
	display: none;
	flex: 0 0 auto;
	width: 100%;
	height: 34px;
	margin: 0 0 10px;
	padding: 0 10px;
	border: 1px solid #d9e0e8;
	border-radius: 8px;
	background: #f8fafc;
	color: #1f2937;
	font-size: 14px;
	font-weight: 600;
	outline: none;
	box-sizing: border-box;
}

.appointment-editor-notes-card.is-expanded .appointment-editor-notes-card-title-input {
	display: block;
}

.appointment-editor-notes-card-editor-header .appointment-editor-notes-card-title-input {
	flex: 1 1 auto;
	min-width: 0;
	height: 32px;
	margin: 0;
	padding: 0 4px;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.appointment-editor-notes-card-title-input:focus {
	border-color: #8cb2e5;
	background: #fff;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, 0.14);
}

.appointment-editor-notes-card-editor-header .appointment-editor-notes-card-title-input:focus {
	border-color: transparent;
	background: transparent;
	box-shadow: none;
}

.appointment-editor-notes-card-preview {
	display: -webkit-box;
	flex: 0 0 auto;
	margin-top: 4px;
	color: #596579;
	font-size: 13px;
	font-weight: 500;
	line-height: 18px;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.appointment-editor-notes-card.is-expanded .appointment-editor-notes-card-preview {
	display: none;
}

.appointment-editor-notes-card-meta {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
	margin-top: 8px;
	margin-bottom: 0;
	color: #8390a2;
	font-size: 11px;
	font-weight: 700;
	line-height: 15px;
	text-transform: uppercase;
}

.appointment-editor-notes-card-meta-text {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	text-transform: none;
}

.appointment-editor-notes-card-meta-label,
.appointment-editor-notes-card-meta-by {
	display: inline-block;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.appointment-editor-notes-card-meta-by {
	flex: 0 0 auto;
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}

.appointment-editor-notes-card-meta-avatar {
	flex: 0 0 16px;
	width: 16px;
	height: 16px;
	font-size: 6px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.1);
}

.appointment-editor-notes-card-indicators {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-left: auto;
	flex: 0 0 auto;
}

.appointment-editor-notes-card-indicator {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: #b0b0b0;
	font-size: 10px;
	font-weight: 500;
	line-height: 1.3;
	text-transform: none;
}

.appointment-editor-notes-card-indicator svg {
	width: 11px;
	height: 11px;
	flex-shrink: 0;
}

.appointment-editor-notes-card-created-info {
	position: relative;
	width: 14px;
	height: 14px;
	justify-content: center;
	color: #a7b0bd;
	cursor: help;
}

.appointment-editor-notes-card-created-info:hover {
	color: #64748b;
}

.appointment-editor-notes-card-created-info svg {
	width: 13px;
	height: 13px;
}

.appointment-editor-notes-card-created-info::after {
	content: attr(data-tooltip);
	position: absolute;
	right: 0;
	bottom: calc(100% + 6px);
	z-index: 3;
	min-width: 220px;
	max-width: 300px;
	padding: 6px 8px;
	border: 1px solid #d6dde6;
	border-radius: 6px;
	background: #fff;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.12);
	color: #2f3b49;
	font-size: 11px;
	font-weight: 700;
	line-height: 14px;
	text-align: left;
	text-transform: none;
	white-space: normal;
	overflow-wrap: normal;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(2px);
	transition: opacity 0.12s ease, transform 0.12s ease, visibility 0.12s ease;
}

.appointment-editor-notes-card-created-info:hover::after,
.appointment-editor-notes-card-created-info:focus-visible::after,
.appointment-editor-notes-card-created-info.is-tooltip-visible::after {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.appointment-editor-notes-card.is-expanded .appointment-editor-notes-card-meta {
	display: none;
}

.appointment-editor-notes-card-body {
	display: none;
	min-height: 0;
	margin-top: 0;
	padding: 10px;
	border: 1px solid #d9e0e8;
	border-radius: 9px;
	background: #fff;
	color: #2f3b49;
	font-size: 13px;
	font-weight: 500;
	line-height: 19px;
	overflow-y: auto;
	scrollbar-width: thin;
	box-sizing: border-box;
	white-space: pre-wrap;
}

.appointment-editor-notes-card.is-expanded .appointment-editor-notes-card-body {
	display: block;
	flex: 1 1 auto;
}

.appointment-editor-notes-card-body-shell {
	position: relative;
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-height: 0;
	border: 1px solid #d9e0e8;
	border-radius: 9px;
	background: #fff;
	overflow: hidden;
	box-sizing: border-box;
}

.appointment-editor-notes-card-body-shell:focus-within {
	border-color: #8cb2e5;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, 0.14);
}

.appointment-editor-notes-card-body-shell .appointment-editor-notes-card-body {
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.appointment-editor-notes-card-body-input {
	display: none;
	flex: 1 1 auto;
	width: 100%;
	min-height: 0;
	margin-top: 0;
	padding: 10px;
	border: 0;
	border-radius: 0;
	background: #fff;
	color: #1f2937;
	font: inherit;
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
	resize: none;
	outline: none;
	overflow-y: auto;
	box-sizing: border-box;
}

.appointment-editor-notes-card.is-expanded .appointment-editor-notes-card-body-input {
	display: block;
}

.appointment-editor-notes-card-body-input:focus {
	box-shadow: none;
}

.appointment-editor-notes-file-input {
	display: none;
}

.appointment-editor-notes-attachment-strip {
	display: none;
	flex: 0 0 auto;
	align-items: center;
	gap: 6px;
	width: 100%;
	min-height: 0;
	margin-top: 8px;
	overflow-x: auto;
	overflow-y: hidden;
	scrollbar-width: none;
	box-sizing: border-box;
}

.appointment-editor-notes-attachment-strip::-webkit-scrollbar {
	display: none;
}

.appointment-editor-notes-card-body-shell.is-attachment-panel-open .appointment-editor-notes-attachment-strip.has-items {
	display: flex;
}

.appointment-editor-notes-card-body-shell.is-attachment-panel-open .appointment-editor-notes-card-body,
.appointment-editor-notes-card-body-shell.is-attachment-panel-open .appointment-editor-notes-card-body-input {
	display: none;
}

.appointment-editor-notes-comments-panel {
	display: none;
	flex: 1 1 auto;
	flex-direction: column;
	width: 100%;
	min-height: 0;
	background: #fff;
	box-sizing: border-box;
}

.appointment-editor-notes-card-body-shell.is-comments-panel-open .appointment-editor-notes-comments-panel {
	display: flex;
}

.appointment-editor-notes-card-body-shell.is-comments-panel-open .appointment-editor-notes-card-body,
.appointment-editor-notes-card-body-shell.is-comments-panel-open .appointment-editor-notes-card-body-input,
.appointment-editor-notes-card-body-shell.is-comments-panel-open .appointment-editor-notes-attachment-strip {
	display: none;
}

.appointment-editor-notes-comments-timeline {
	flex: 1 1 auto;
	min-height: 0;
	width: 100%;
	padding: 8px 10px;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: rgba(0, 0, 0, 0.12) transparent;
	box-sizing: border-box;
}

.appointment-editor-notes-comments-timeline::-webkit-scrollbar {
	width: 5px;
}

.appointment-editor-notes-comments-timeline::-webkit-scrollbar-track {
	background: transparent;
}

.appointment-editor-notes-comments-timeline::-webkit-scrollbar-thumb {
	border-radius: 3px;
	background: rgba(0, 0, 0, 0.12);
}

.appointment-editor-notes-comments-empty {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 90px;
	color: #94a3b8;
	font-size: 13px;
	font-weight: 600;
	text-align: center;
}

.appointment-editor-notes-comment-date {
	margin: 4px 0 9px;
	color: #64748b;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	text-align: center;
}

.appointment-editor-notes-comment-row-item {
	display: flex;
	flex-direction: column;
	margin-bottom: 12px;
}

.appointment-editor-notes-comment-row-item.mine {
	align-items: flex-end;
}

.appointment-editor-notes-comment-row-item.theirs {
	align-items: flex-start;
}

.appointment-editor-notes-comment-row-content {
	display: flex;
	align-items: flex-start;
	gap: 6px;
	max-width: 100%;
}

.appointment-editor-notes-comment-row-item.mine .appointment-editor-notes-comment-row-content {
	flex-direction: row-reverse;
}

.appointment-editor-notes-comment-avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 24px;
	width: 24px;
	height: 24px;
	margin-top: 2px;
	border-radius: 50%;
	overflow: hidden;
	color: #fff;
	font-size: 9px;
	font-weight: 700;
	line-height: 1;
}

.appointment-editor-notes-comment-avatar img,
.appointment-editor-notes-comment-avatar .lookup-dropdown-avatar-image {
	width: 100%;
	height: 100%;
	border-radius: inherit;
	object-fit: cover;
}

.appointment-editor-notes-comment-bubble {
	max-width: 86%;
	padding: 10px 14px;
	border-radius: 18px;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.4;
	white-space: pre-wrap;
	word-break: break-word;
	box-sizing: border-box;
}

.appointment-editor-notes-comment-row-item.mine .appointment-editor-notes-comment-bubble {
	border-top-right-radius: 4px;
	background: #3b82f6;
	color: #fff;
}

.appointment-editor-notes-comment-row-item.theirs .appointment-editor-notes-comment-bubble {
	border: 1px solid #dcdcdc;
	border-top-left-radius: 4px;
	background: #fff;
	color: #334155;
}

.appointment-editor-notes-comment-meta {
	margin-top: 4px;
	padding: 0 4px;
	color: #94a3b8;
	font-size: 10.5px;
	font-weight: 600;
	line-height: 13px;
}

.appointment-editor-notes-comment-row-item.mine .appointment-editor-notes-comment-meta {
	padding-right: 30px;
}

.appointment-editor-notes-comment-row-item.theirs .appointment-editor-notes-comment-meta {
	padding-left: 30px;
}

.appointment-editor-notes-comment-composer {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 8px;
	padding: 8px;
	border-top: 1px solid #e6ebf1;
	background: #fff;
	box-sizing: border-box;
}

.appointment-editor-notes-comment-input {
	flex: 1 1 auto;
	min-width: 0;
	height: 36px;
	padding: 8px 10px;
	border: 1px solid #dcdcdc;
	border-radius: 8px;
	background: #fff;
	color: #334155;
	font-size: 13px;
	font-weight: 500;
	line-height: 18px;
	outline: none;
	box-sizing: border-box;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.appointment-editor-notes-comment-input:focus {
	border-color: #8cb2e5;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, 0.12);
}

.appointment-editor-notes-comment-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 36px;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #3b82f6;
	cursor: pointer;
	transition: background-color 0.15s ease, opacity 0.15s ease;
}

.appointment-editor-notes-comment-submit img {
	filter: brightness(0) invert(1);
}

.appointment-editor-notes-comment-submit:hover:not(:disabled),
.appointment-editor-notes-comment-submit:focus-visible:not(:disabled) {
	background: #2563eb;
	outline: none;
}

.appointment-editor-notes-comment-submit:disabled {
	cursor: default;
	opacity: 0.5;
}

.appointment-editor-notes-card-body-shell .appointment-editor-notes-attachment-strip {
	flex: 1 1 auto;
	flex-direction: column;
	align-items: stretch;
	gap: 10px;
	width: 100%;
	height: 100%;
	min-height: 0;
	max-height: none;
	margin-top: 0;
	padding: 10px;
	border: 0;
	border-radius: 0;
	background: #fff;
	box-shadow: none;
	overflow-y: hidden;
	overflow-x: hidden;
	scrollbar-width: thin;
}

.appointment-editor-notes-attachment-list {
	display: flex;
	align-content: flex-start;
	align-items: flex-start;
	flex: 1 1 auto;
	flex-wrap: wrap;
	gap: 6px;
	min-height: 0;
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: thin;
}

.appointment-editor-notes-attachment-list::-webkit-scrollbar {
	width: 8px;
}

.appointment-editor-notes-attachment-chip {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	gap: 5px;
	max-width: 100%;
	height: 28px;
	padding: 4px 8px;
	border: 0;
	border-radius: 6px;
	background: #f5f5f5;
	color: #475569;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	white-space: nowrap;
	cursor: pointer;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 8px rgba(0, 0, 0, 0.05);
	transition: background-color 0.15s ease, transform 0.15s ease;
	box-sizing: border-box;
}

.appointment-editor-notes-attachment-chip:hover,
.appointment-editor-notes-attachment-chip:focus {
	background: #dcdcdc;
	outline: none;
	transform: translateY(-1px);
}

.appointment-editor-notes-attachment-chip-icon {
	flex: 0 0 auto;
	width: 14px;
	height: 14px;
}

.appointment-editor-notes-attachment-chip-text {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
}

.appointment-editor-notes-attachment-chip-delete {
	display: none;
	flex: 0 0 auto;
	padding: 0 2px;
	color: #94a3b8;
	font-size: 11px;
	cursor: pointer;
	transition: color 0.15s ease;
}

.appointment-editor-notes-attachment-chip-delete:hover {
	color: #ef4444;
}

.appointment-editor-notes-attachment-chip.deletable:hover .appointment-editor-notes-attachment-chip-delete,
.appointment-editor-notes-attachment-chip.deletable:focus .appointment-editor-notes-attachment-chip-delete {
	display: inline-flex;
	align-items: center;
}

.appointment-editor-notes-attachment-chip-uploading {
	cursor: default;
	opacity: 0.72;
}

.appointment-editor-notes-attachment-chip-uploading:hover,
.appointment-editor-notes-attachment-chip-uploading:focus {
	background: #f5f5f5;
	transform: none;
}

.appointment-editor-notes-attachment-upload-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 100%;
	min-height: 34px;
	height: 34px;
	padding: 0 10px;
	border: 1px dashed #9fb8d3;
	border-radius: 7px;
	background: #fff;
	color: #174d82;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	box-sizing: border-box;
}

.appointment-editor-notes-attachment-upload-btn:hover,
.appointment-editor-notes-attachment-upload-btn:focus {
	border-style: solid;
	background: #eef5fc;
	outline: none;
}

.appointment-editor-notes-attachment-empty {
	display: inline-flex;
	align-items: center;
	height: 28px;
	color: #7a8796;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
}

.appointment-editor-notes-floating-bar {
	display: none;
	position: absolute;
	right: 10px;
	bottom: 10px;
	left: 10px;
	transform: none;
	align-items: center;
	justify-content: space-between;
	flex: 0 0 auto;
	gap: 5px;
	height: 34px;
	padding: 4px 6px;
	border: 1px solid rgba(224, 230, 238, 0.95);
	border-radius: 8px;
	background: rgba(248, 250, 252, 0.94);
	box-shadow: 0 8px 22px rgba(15, 23, 42, 0.12);
	backdrop-filter: blur(6px);
	z-index: 3;
	box-sizing: border-box;
}

.appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-bar {
	display: inline-flex;
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-bar {
	position: static;
	right: auto;
	bottom: auto;
	left: auto;
	display: flex;
	align-items: center;
	width: 100%;
	height: auto;
	margin-top: 12px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	backdrop-filter: none;
	justify-content: flex-end;
	gap: 8px;
	transform: none;
}

.appointment-editor-notes-floating-action {
	width: 25px;
	height: 25px;
	padding: 0;
	border: none;
	border-radius: 6px;
	background-color: transparent;
	background-position: center;
	background-repeat: no-repeat;
	background-size: 15px 15px;
	cursor: pointer;
	opacity: 0.72;
	box-sizing: border-box;
}

.appointment-editor-notes-floating-action:hover:not(:disabled),
.appointment-editor-notes-floating-action:focus-visible:not(:disabled) {
	background-color: #f3f3f3;
	opacity: 1;
	outline: none;
	box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.1);
}

.appointment-editor-notes-floating-action:disabled {
	cursor: default;
	opacity: 0.32;
}

.appointment-editor-notes-floating-action-attachment {
	--appointment-editor-attachment-icon: url("data:image/svg+xml,%3Csvg width='13' height='20' viewBox='0 0 13 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_213_766)'%3E%3Cpath d='M4.47282 6.7857V14.0103C4.48126 14.5386 4.69938 15.0424 5.08011 15.4131C5.46084 15.7837 5.97365 15.9915 6.50788 15.9915C7.04211 15.9915 7.55492 15.7837 7.93565 15.4131C8.31638 15.0424 8.5345 14.5386 8.54294 14.0103L8.54954 4.54072C8.55508 4.08918 8.46994 3.64104 8.29905 3.22228C8.12817 2.80353 7.87494 2.42248 7.55404 2.10124C7.23315 1.78 6.85097 1.52494 6.42967 1.35087C6.00836 1.17679 5.55631 1.08716 5.09972 1.08716C4.64312 1.08716 4.19107 1.17679 3.76977 1.35087C3.34846 1.52494 2.96628 1.78 2.64539 2.10124C2.32449 2.42248 2.07126 2.80353 1.90038 3.22228C1.72949 3.64104 1.64435 4.08918 1.64989 4.54072V14.0741C1.64059 14.7098 1.75916 15.341 1.9987 15.931C2.23824 16.5209 2.59397 17.0579 3.04523 17.5107C3.49648 17.9635 4.03424 18.3231 4.62724 18.5685C5.22025 18.8139 5.85667 18.9403 6.4995 18.9403C7.14233 18.9403 7.77875 18.8139 8.37176 18.5685C8.96476 18.3231 9.50252 17.9635 9.95377 17.5107C10.405 17.0579 10.7608 16.5209 11.0003 15.931C11.2398 15.341 11.3584 14.7098 11.3491 14.0741V5.1655' stroke='%23B3B3B3' stroke-width='1.8' stroke-miterlimit='10' stroke-linecap='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_213_766'%3E%3Crect width='13' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
	background-image: var(--appointment-editor-attachment-icon);
	background-size: 16px 16px;
}

.appointment-editor-notes-floating-action-comment {
	background-image: url('/images/contacts/chat.svg');
	background-size: 15px 15px;
}

.appointment-editor-notes-floating-action-delete {
	background-image: url('/images/icons/18/gray/trash_can.png');
}

.appointment-editor-notes-floating-action-save {
	background-image: url('/images/glyphicons/png/glyphicons-415-disk-save.png');
}

.appointment-editor-notes-floating-action-complete {
	background-image: url('/images/icons/18/gray/checkmark.png');
}

/* #1686: connect an appointment/task note to other records, as a contact's notes can. */
.appointment-editor-notes-floating-action-regarding {
	background-image: url(/images/contacts/related.svg);
	background-size: 19px 19px;
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-bar .appointment-editor-notes-floating-action-regarding {
	width: 31px;
	min-width: 31px;
	padding: 0;
	background-image: url(/images/contacts/related.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 19px 19px;
}

.appointment-editor-notes-regarding-strip {
	display: none;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 8px;
}

.appointment-editor-notes-regarding-strip.has-items {
	display: flex;
}

.appointment-editor-notes-regarding-chip {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	max-width: 220px;
	padding: 3px 8px;
	border: 1px solid #d5dce4;
	border-radius: 12px;
	background-color: #f5f8fb;
	color: #174d82;
	font-size: 12px;
	line-height: 16px;
}

.appointment-editor-notes-regarding-chip-label {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.appointment-editor-notes-regarding-chip-remove {
	padding: 0 2px;
	border: 0;
	background: transparent;
	color: #6b7785;
	font-size: 14px;
	line-height: 1;
	cursor: pointer;
}

/* #1692: a record's own create form ("New Contact" / "New Household" / "New Company") in a dialog
   opened from another editor. The form needs a definite height to lay out; it closes on save, so
   the plain Save (which would switch it to edit mode in place), the quick-nav column and the
   "save to unlock record tools" note are left out. */
.record-create-dialog .ui-dialog-content.record-create-dialog-body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	/* Fill the rounded dialog rather than the height jQuery UI computed at open. */
	height: auto !important;
	min-height: 0;
	padding: 0;
	overflow: hidden;
}

.record-create-dialog .record-create-dialog-content {
	flex: 1 1 auto;
	height: 100%;
	/* White like the system's other rounded dialogs, not the record tab's tinted canvas. */
	background-color: #fff;
}

/* The rounded dialog floats its close button in the top-right corner; keep the record header's
   Save & Close clear of it. */
.record-create-dialog .contact_header {
	padding-right: 44px;
}

.record-create-dialog .ct-hd-save-btn,
.record-create-dialog .contact_left,
.record-create-dialog .contact-create-helper {
	display: none !important;
}

/* #1690: older notes load a page at a time, below the newest. */
.appointment-editor-notes-load-more {
	display: block;
	margin: 12px auto 4px;
	padding: 0 14px;
	height: 31px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background-color: #fff;
	color: #174d82;
	font-size: 12px;
	font-weight: 700;
	cursor: pointer;
}

.appointment-editor-notes-load-more:hover:not(:disabled),
.appointment-editor-notes-load-more:focus-visible:not(:disabled) {
	background-color: #f3f6f9;
	outline: none;
}

.appointment-editor-notes-load-more:disabled {
	cursor: default;
	opacity: 0.6;
}

.appointment-editor-notes-regarding-chip-remove:hover,
.appointment-editor-notes-regarding-chip-remove:focus-visible {
	color: #b42318;
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action,
.appointment-editor-notes-composer .appointment-editor-notes-composer-attachment-btn,
.appointment-editor-notes-composer .appointment-editor-notes-composer-action-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: auto;
	min-width: 0;
	height: 31px;
	padding: 0 12px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background-color: #fff;
	background-image: none;
	color: #174d82;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	opacity: 1;
	white-space: nowrap;
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-attachment,
.appointment-editor-notes-composer .appointment-editor-notes-composer-attachment-btn {
	position: relative;
	width: 31px;
	min-width: 31px;
	padding: 0;
	background-image: var(--appointment-editor-attachment-icon);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 16px 16px;
	color: transparent;
	font-size: 0;
}

/* #1741: Set Regarding on a note that hasn't been saved yet, beside its attach button. */
.appointment-editor-notes-composer .appointment-editor-notes-composer-regarding-btn {
	width: 31px;
	min-width: 31px;
	padding: 0;
	background-image: url(/images/contacts/related.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 19px 19px;
	color: transparent;
	font-size: 0;
}

.appointment-editor-notes-composer-regarding-strip.has-items {
	margin: 0 0 8px;
}

/* #1742: a Contact or Account chip opens its record. */
.appointment-editor-notes-regarding-chip.appointment-editor-link-pill-clickable {
	cursor: pointer;
}

.appointment-editor-notes-regarding-chip.appointment-editor-link-pill-clickable:hover .appointment-editor-notes-regarding-chip-label,
.appointment-editor-notes-regarding-chip.appointment-editor-link-pill-clickable:focus-visible .appointment-editor-notes-regarding-chip-label {
	text-decoration: underline;
}

.appointment-editor-notes-regarding-chip.appointment-editor-link-pill-clickable:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .18);
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-comment {
	position: relative;
	width: 31px;
	min-width: 31px;
	padding: 0;
	background-image: url('/images/contacts/chat.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: 15px 15px;
	color: transparent;
	font-size: 0;
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-comment.has-comments::before,
.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-attachment.has-attachments::before,
.appointment-editor-notes-composer .appointment-editor-notes-composer-attachment-btn.has-attachments::before {
	content: attr(data-count);
	position: absolute;
	top: -6px;
	right: -6px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 15px;
	height: 15px;
	padding: 0 4px;
	border: 0;
	border-radius: 999px;
	background: #2f80ed;
	color: #fff;
	font-size: 9px;
	font-weight: 700;
	line-height: 1;
	box-sizing: border-box;
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-attachment.is-active,
.appointment-editor-notes-composer .appointment-editor-notes-composer-attachment-btn.is-active {
	border-color: #c9cdd3;
	background-color: #e8e8e8;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .62);
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-comment.is-active {
	border-color: #c9cdd3;
	background-color: #e8e8e8;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .62);
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-delete {
	margin-right: auto;
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action:after {
	content: none;
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action:hover:not(:disabled),
.appointment-editor-notes-composer .appointment-editor-notes-composer-attachment-btn:hover:not(:disabled),
.appointment-editor-notes-composer .appointment-editor-notes-composer-action-btn:hover:not(:disabled) {
	border-color: #d9dee5;
	background-color: #f5f5f5;
	box-shadow: none;
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action:focus-visible:not(:disabled),
.appointment-editor-notes-composer .appointment-editor-notes-composer-attachment-btn:focus-visible:not(:disabled),
.appointment-editor-notes-composer .appointment-editor-notes-composer-action-btn:focus-visible:not(:disabled) {
	border-color: #b8c0ca;
	background-color: #f5f5f5;
	outline: none;
	box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.08);
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-attachment.is-active:hover:not(:disabled),
.appointment-editor-notes-composer .appointment-editor-notes-composer-attachment-btn.is-active:hover:not(:disabled),
.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-comment.is-active:hover:not(:disabled) {
	border-color: #c9cdd3;
	background-color: #e8e8e8;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .62);
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-attachment.is-active:focus-visible:not(:disabled),
.appointment-editor-notes-composer .appointment-editor-notes-composer-attachment-btn.is-active:focus-visible:not(:disabled),
.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-comment.is-active:focus-visible:not(:disabled) {
	border-color: #c9cdd3;
	background-color: #e8e8e8;
	outline: none;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .62), 0 0 0 2px rgba(15, 23, 42, 0.08);
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-delete,
.appointment-editor-notes-composer .appointment-editor-notes-composer-action-cancel {
	border-color: #f2cbc9;
	color: #bb2f2a;
}

.appointment-editor-notes-composer .appointment-editor-notes-composer-action-cancel {
	margin-right: auto;
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-complete,
.appointment-editor-notes-composer .appointment-editor-notes-floating-action-complete {
	border-color: #00529b;
	background-color: #00529b;
	color: #fff;
}

.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-complete:hover:not(:disabled),
.appointment-editor-notes-list.has-expanded-note .appointment-editor-notes-card.is-expanded .appointment-editor-notes-floating-action-complete:focus-visible:not(:disabled),
.appointment-editor-notes-composer .appointment-editor-notes-floating-action-complete:hover:not(:disabled),
.appointment-editor-notes-composer .appointment-editor-notes-floating-action-complete:focus-visible:not(:disabled) {
	border-color: #174d82;
	background-color: #174d82;
}

.appointment-editor-notes-card-body p {
	margin: 0 0 10px;
}

.appointment-editor-notes-card-body p:last-child,
.appointment-editor-notes-card-body ul:last-child,
.appointment-editor-notes-card-body ol:last-child {
	margin-bottom: 0;
}

.appointment-editor-notes-card-body ul,
.appointment-editor-notes-card-body ol {
	margin: 0 0 10px 18px;
	padding: 0;
}

.appointment-editor-notes-card-body a {
	color: #174d82;
	text-decoration: underline;
}

.appointment-editor-notes-status {
	position: absolute;
	right: 16px;
	bottom: 18px;
	left: 16px;
	z-index: 2;
	min-height: 18px;
	color: #78869a;
	font-size: 13px;
	font-weight: 700;
	line-height: 18px;
	pointer-events: none;
}

.appointment-editor-notes-status-empty {
	top: 50%;
	bottom: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	transform: translateY(-50%);
}

.appointment-editor-notes-status-error {
	color: #a33b32;
	pointer-events: auto;
}

.appointment-editor-notes-card.is-staged-note {
	border-color: #b8d2eb;
}

.appointment-editor-notes-upload-error-title {
	margin-bottom: 8px;
	font-weight: 600;
}

.appointment-editor-notes-upload-error-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	align-items: center;
	gap: 6px;
	padding: 6px 0;
	border-top: 1px solid rgba(165, 42, 42, 0.16);
}

.appointment-editor-notes-upload-error-row > span {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.appointment-editor-notes-upload-error-row button {
	min-height: 26px;
	padding: 3px 9px;
	border: 1px solid #b9c8d8;
	border-radius: 5px;
	background: #fff;
	color: #244d72;
	cursor: pointer;
}

.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) input.forminput,
.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) input.pareto_picker_input,
.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) select,
.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) textarea {
	width: 100% !important;
	min-width: 0 !important;
	border: none;
	background-color: transparent;
	box-shadow: none;
	color: #24282d;
	font-size: 14px;
	line-height: 19px;
	box-sizing: border-box;
}

.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) input.forminput,
.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) input.pareto_picker_input,
.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) select {
	height: 27px;
	padding: 4px 0;
}

.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) select {
	-webkit-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%2378869a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 4px center;
	background-size: 16px 16px;
	padding-right: 20px;
}

.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) input:focus,
.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) select:focus,
.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) textarea:focus {
	outline: none;
	border: none;
	box-shadow: none;
}

.appointment-editor-field-table > tbody > tr > td:not(.label):not(.appointment-editor-link-panel-cell) input[type=checkbox] {
	width: auto !important;
	height: auto;
	min-width: 0 !important;
	margin: 3px 0;
}

.recurring-activity-pattern-line input.recurring-activity-pattern-frequency {
	flex: 0 0 48px;
	width: 48px !important;
	min-width: 48px !important;
	max-width: 48px !important;
	height: 26px !important;
	padding: 2px 4px !important;
	line-height: 16px !important;
	text-align: center;
	box-sizing: border-box !important;
}

.recurring-activity-field-table .recurring-activity-pattern-line select.recurring-activity-pattern-weekend {
	flex: 0 0 184px;
	width: 184px !important;
	min-width: 0 !important;
	max-width: 184px !important;
	padding: 2px 24px 2px 6px !important;
}

.appointment-editor-field-table > tbody > tr#tr_AllDay input[type=checkbox],
.appointment-editor-field-table > tbody > tr#tr_RollOver input[type=checkbox],
.appointment-editor-field-table > tbody > tr#tr_InlineRecurring input[type=checkbox] {
	appearance: none;
	position: relative;
	width: 34px !important;
	height: 18px;
	min-width: 34px !important;
	margin: 0;
	border: 0;
	border-radius: 999px;
	background-color: #b2b2b2;
	cursor: pointer;
	vertical-align: middle;
	transition: background-color 120ms ease, box-shadow 120ms ease;
}

.appointment-editor-field-table > tbody > tr#tr_AllDay input[type=checkbox]::before,
.appointment-editor-field-table > tbody > tr#tr_RollOver input[type=checkbox]::before,
.appointment-editor-field-table > tbody > tr#tr_InlineRecurring input[type=checkbox]::before {
	content: "";
	position: absolute;
	top: 2px;
	left: 2px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background-color: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
	transition: transform 120ms ease;
}

.appointment-editor-field-table > tbody > tr#tr_AllDay input[type=checkbox]:checked,
.appointment-editor-field-table > tbody > tr#tr_RollOver input[type=checkbox]:checked,
.appointment-editor-field-table > tbody > tr#tr_InlineRecurring input[type=checkbox]:checked {
	background-color: #2f73ad;
}

.appointment-editor-field-table > tbody > tr#tr_AllDay input[type=checkbox]:checked::before,
.appointment-editor-field-table > tbody > tr#tr_RollOver input[type=checkbox]:checked::before,
.appointment-editor-field-table > tbody > tr#tr_InlineRecurring input[type=checkbox]:checked::before {
	transform: translateX(16px);
}

.appointment-editor-field-table > tbody > tr#tr_AllDay input[type=checkbox]:focus,
.appointment-editor-field-table > tbody > tr#tr_RollOver input[type=checkbox]:focus,
.appointment-editor-field-table > tbody > tr#tr_InlineRecurring input[type=checkbox]:focus {
	box-shadow: 0 0 0 2px rgba(47, 115, 173, 0.24);
}

.appointment-editor-field-table > tbody > tr#tr_AllDay input[type=checkbox]:disabled,
.appointment-editor-field-table > tbody > tr#tr_RollOver input[type=checkbox]:disabled,
.appointment-editor-field-table > tbody > tr#tr_InlineRecurring input[type=checkbox]:disabled {
	cursor: default;
	opacity: 0.55;
}

.appointment-editor-field-table > tbody > tr#tr_AllDay input[type=checkbox],
.appointment-editor-field-table > tbody > tr#tr_RollOver input[type=checkbox],
.appointment-editor-field-table > tbody > tr#tr_InlineRecurring input[type=checkbox] {
	width: 34px !important;
	height: 20px;
	min-width: 34px !important;
	background-color: #b2b2b2;
	transition: background-color .16s ease;
}

.appointment-editor-field-table > tbody > tr#tr_AllDay input[type=checkbox]::before,
.appointment-editor-field-table > tbody > tr#tr_RollOver input[type=checkbox]::before,
.appointment-editor-field-table > tbody > tr#tr_InlineRecurring input[type=checkbox]::before {
	top: 3px;
	left: 3px;
	transition: transform .16s ease;
}

.appointment-editor-field-table > tbody > tr#tr_AllDay input[type=checkbox]:checked::before,
.appointment-editor-field-table > tbody > tr#tr_RollOver input[type=checkbox]:checked::before,
.appointment-editor-field-table > tbody > tr#tr_InlineRecurring input[type=checkbox]:checked::before {
	transform: translateX(14px);
}

.appointment-editor-field-table > tbody > tr#tr_Description {
	position: relative;
	/* A 38px label block (12 + 19 + 7) over a 132px text block (120 + 12). */
	height: 170px;
}

.appointment-editor-field-table > tbody > tr#tr_Description > td.label,
.appointment-editor-field-table > tbody > tr#tr_Description > td:not(.label):not(.appointment-editor-link-panel-cell) {
	display: block;
	position: absolute;
	left: 0;
	width: var(--appointment-editor-description-width) !important;
	max-width: none;
	padding-left: 12px !important;
	padding-right: 12px !important;
	border-radius: 6px 6px 0 0;
}

/* The label's lower edge is the gap to the text beneath it, not an edge of the card. */
.appointment-editor-field-table > tbody > tr#tr_Description > td.label {
	padding-bottom: 7px !important;
}

.appointment-editor-field-table > tbody > tr#tr_Description > td:not(.label):not(.appointment-editor-link-panel-cell) {
	top: 38px;
	height: 132px;
	padding-top: 0 !important;
	padding-bottom: 12px !important;
	border-radius: 0 0 6px 6px;
}

.appointment-editor-field-table > tbody > tr#tr_Description textarea {
	display: block;
	height: 120px !important;
	min-height: 120px;
	max-height: 120px;
	padding: 0;
	resize: none;
	overflow-x: hidden;
	overflow-y: auto;
	overflow-wrap: anywhere;
	word-break: break-word;
	white-space: pre-wrap;
}

.appointment-editor-field-table .lookup_input_link_container {
	border: none;
	background-color: transparent;
	min-height: 27px;
}

.appointment-editor-field-table .lookup-dropdown-trigger {
	gap: 8px;
	background-color: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	height: 27px;
	min-height: 27px;
	padding: 0 6px 0 0;
	transition: none;
}

.appointment-editor-field-table .lookup-dropdown-trigger:hover {
	background-color: transparent;
	box-shadow: none;
}

.appointment-editor-field-table .lookup-dropdown-trigger-left {
	gap: 7px;
}

.appointment-editor-field-table .lookup-dropdown-trigger-name {
	color: #24282d;
	font-size: 14px;
	font-weight: 500;
	line-height: 27px;
}

.appointment-editor-field-table .lookup-dropdown-trigger-name.placeholder {
	color: #8b96a3;
}

.appointment-editor-field-table .lookup-dropdown-trigger-chevron {
	width: 12px;
	height: 12px;
	color: #78869a;
}

.appointment-editor-field-table .lookup-dropdown-trigger-clear {
	width: 16px;
	height: 16px;
	color: #78869a;
}

.activity-modal-lookup-panel.lookup-dropdown-panel {
	min-width: 0;
	max-width: calc(100vw - 16px);
	padding: 5px;
	border: 1px solid #d8dde4;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 16px 36px rgba(20, 30, 42, .18), 0 4px 10px rgba(20, 30, 42, .08);
	overflow-x: hidden;
	overflow-y: auto;
	box-sizing: border-box;
}

.activity-modal-lookup-panel .lookup-dropdown-search {
	padding: 0 0 5px;
}

.activity-modal-lookup-panel .lookup-dropdown-search-input {
	height: 30px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background: #fff;
	color: #24282d;
	font-size: 13px;
	font-weight: 600;
}

.activity-modal-lookup-panel .lookup-dropdown-search-input:focus {
	border-color: #a9c2dc;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .12);
}

.activity-modal-lookup-panel .lookup-dropdown-results {
	max-height: 220px;
	padding: 0;
	scrollbar-width: thin;
	scrollbar-color: #c5ccd5 transparent;
}

.activity-modal-lookup-panel .lookup-dropdown-results::-webkit-scrollbar {
	display: block;
	width: 8px;
	height: 8px;
}

.activity-modal-lookup-panel .lookup-dropdown-results::-webkit-scrollbar-track {
	background: transparent;
}

.activity-modal-lookup-panel .lookup-dropdown-results::-webkit-scrollbar-thumb {
	border: 2px solid #fff;
	border-radius: 999px;
	background: #c5ccd5;
}

.activity-modal-lookup-panel .lookup-dropdown-option {
	min-height: 30px;
	padding: 6px 10px;
	border: 1px solid transparent;
	border-radius: 6px;
	background: transparent;
	color: #334155;
	box-sizing: border-box;
}

.activity-modal-lookup-panel .lookup-dropdown-option:hover {
	border-color: #cfe1f6;
	background: #f2f7fc;
}

.activity-modal-lookup-panel .lookup-dropdown-option.selected {
	border-color: #b9d5f5;
	background: #eaf4ff;
	color: #0a559f;
}

.activity-modal-lookup-panel .lookup-dropdown-option-name {
	color: inherit;
	font-size: 13px;
	font-weight: 600;
	line-height: 17px;
}

.activity-modal-lookup-panel .lookup-dropdown-option-email {
	color: #64748b;
	font-size: 12px;
	line-height: 15px;
}

.activity-modal-lookup-panel .lookup-dropdown-option-check {
	color: #0a559f;
}

.activity-modal-lookup-panel .lookup-dropdown-loading,
.activity-modal-lookup-panel .lookup-dropdown-empty {
	padding: 10px;
	color: #64748b;
	font-size: 13px;
	font-weight: 600;
}

.appointment-editor-field-table .activity-modal-select2-container.select2-container {
	min-width: 0;
	width: 100% !important;
}

.appointment-editor-field-table .activity-modal-select2-container .select2-selection--single,
.appointment-editor-field-table .select2-selection--single.activity-modal-select2-container {
	height: 27px;
	min-height: 27px;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.appointment-editor-field-table .activity-modal-select2-container.select2-container--open .select2-selection--single,
.appointment-editor-field-table .activity-modal-select2-container .select2-selection--single:focus,
.appointment-editor-field-table .select2-selection--single.activity-modal-select2-container:focus {
	outline: none;
}

.appointment-editor-field-table .activity-modal-select2-container .select2-selection__rendered,
.appointment-editor-field-table .select2-selection--single.activity-modal-select2-container .select2-selection__rendered {
	padding: 0 28px 0 0;
	color: #24282d;
	font-size: 14px;
	font-weight: 500;
	line-height: 27px;
}

.appointment-editor-field-table .activity-modal-select2-container .select2-selection__arrow,
.appointment-editor-field-table .select2-selection--single.activity-modal-select2-container .select2-selection__arrow {
	top: 0;
	right: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 27px;
}

.appointment-editor-field-table .activity-modal-select2-container .select2-selection__arrow b,
.appointment-editor-field-table .select2-selection--single.activity-modal-select2-container .select2-selection__arrow b {
	display: none;
}

.appointment-editor-field-table .activity-modal-select2-container .select2-selection__arrow::before,
.appointment-editor-field-table .select2-selection--single.activity-modal-select2-container .select2-selection__arrow::before {
	content: "";
	width: 12px;
	height: 12px;
	background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%2378869a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 16px 16px;
}

.activity-modal-select2-dropdown.select2-dropdown {
	z-index: 10070;
	min-width: 0;
	max-width: calc(100vw - 16px);
	padding: 5px;
	border: 1px solid #d8dde4 !important;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 16px 36px rgba(20, 30, 42, .18), 0 4px 10px rgba(20, 30, 42, .08);
	overflow: hidden;
	box-sizing: border-box;
}

.activity-modal-select2-dropdown.select2-dropdown--below,
.activity-modal-select2-dropdown.select2-dropdown--above {
	border-radius: 8px;
}

.activity-modal-select2-dropdown .select2-search--dropdown {
	padding: 0 0 5px;
}

.activity-modal-select2-dropdown .select2-search--dropdown input.select2-search__field {
	height: 30px;
	padding: 0 10px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background: #fff;
	color: #24282d;
	font-size: 13px;
	font-weight: 600;
	box-sizing: border-box;
	outline: none;
}

.activity-modal-select2-dropdown .select2-search--dropdown input.select2-search__field:focus {
	border-color: #a9c2dc;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .12);
}

.activity-modal-select2-dropdown .select2-results__options {
	max-height: 220px;
	padding: 0;
	scrollbar-width: thin;
	scrollbar-color: #c5ccd5 transparent;
}

.activity-modal-select2-dropdown .select2-results__options::-webkit-scrollbar {
	display: block;
	width: 8px;
	height: 8px;
}

.activity-modal-select2-dropdown .select2-results__options::-webkit-scrollbar-track {
	background: transparent;
}

.activity-modal-select2-dropdown .select2-results__options::-webkit-scrollbar-thumb {
	border: 2px solid #fff;
	border-radius: 999px;
	background: #c5ccd5;
}

.activity-modal-select2-dropdown .select2-results__option {
	min-height: 30px;
	padding: 6px 10px;
	border: 1px solid transparent;
	border-radius: 6px;
	background: transparent;
	color: #334155;
	font-size: 13px;
	font-weight: 600;
	line-height: 17px;
	box-sizing: border-box;
}

.activity-modal-select2-dropdown .select2-results__option--highlighted[aria-selected],
.activity-modal-select2-dropdown .select2-results__option:hover {
	border-color: #cfe1f6;
	background: #f2f7fc;
	color: #334155;
}

.activity-modal-select2-dropdown .select2-results__option[aria-selected="true"] {
	border-color: #b9d5f5;
	background: #eaf4ff;
	color: #0a559f;
}

.activity-modal-select2-dropdown .select2-results__option[aria-selected="true"].select2-results__option--highlighted {
	border-color: #b9d5f5;
	background: #eaf4ff;
	color: #0a559f;
}

/* Modern Entity Editor: opt-in generated forms that should follow the activity editor design system. */
.modern-entity-editor-dialog.ui-dialog {
	display: flex !important;
	flex-direction: column;
	height: var(--modern-entity-editor-dialog-height, 605px) !important;
	padding: 0;
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 18px 45px rgba(0, 0, 0, .18), 0 4px 12px rgba(0, 0, 0, .08);
	overflow: hidden;
	box-sizing: border-box;
}

.modern-entity-editor-dialog.modern-entity-editor-logical-client_class.ui-dialog {
	width: 560px !important;
	height: 331px !important;
}

.modern-entity-editor-dialog.modern-entity-editor-logical-advocate_process.ui-dialog {
	width: 560px !important;
	height: 380px !important;
}

/* Height comes from the size-sync var: visible rows differ between the Processes module
   (full form) and record-scoped opens (Apply To Type / Contact rows hidden) */
.modern-entity-editor-dialog.modern-entity-editor-logical-applied_advocate_process.ui-dialog {
	width: 640px !important;
}

/* "Weekend Avoidance" needs a wider label column than the 146px default */
.modern-entity-editor-logical-applied_advocate_process .modern-entity-editor-field-table {
	--modern-entity-editor-label-width: 170px;
}

/* Process-group dialogs (tkrv_mod_advocate_process): Name + Description rows only. */
.modern-entity-editor-dialog.modern-entity-editor-logical-advocate_process_group.ui-dialog {
	--modern-entity-editor-dialog-height: 330px;
}

/* "Create & Move" variant carries a one-line note under the field table. */
.modern-entity-editor-dialog.modern-entity-editor-logical-advocate_process_group.modern-entity-editor-has-note.ui-dialog {
	--modern-entity-editor-dialog-height: 362px;
}

.modern-entity-editor-form-note {
	flex: 0 0 auto;
	padding: 0 2px 12px;
	color: #6b7785;
	font-size: 12px;
	line-height: 16px;
}

.modern-entity-editor-dialog.modern-entity-editor-logical-client_class .modern-entity-editor-field-table > tbody {
	padding-bottom: 10px;
}

.modern-custom-entity-editor-dialog.ui-dialog {
	/* Width via variable so a user drag-resize (which sets the variable) can take effect;
	   defaults to the original fixed 560px when never resized. */
	width: var(--modern-entity-editor-dialog-width, 560px) !important;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_entity_field.ui-dialog {
	--modern-entity-editor-dialog-height: 501px;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_entity.ui-dialog {
	--modern-entity-editor-dialog-height: 405px;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_form.ui-dialog {
	--modern-entity-editor-dialog-height: 335px;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_table_layout.ui-dialog {
	--modern-entity-editor-dialog-height: 160px;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_drop_down.ui-dialog {
	--modern-entity-editor-dialog-height: 250px;
	height: auto !important;
	min-height: 250px;
	max-height: calc(100vh - 70px);
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_drop_down_option.ui-dialog {
	--modern-entity-editor-dialog-height: 300px;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_form_section.ui-dialog {
	--modern-entity-editor-dialog-height: 330px;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_form_field.ui-dialog {
	--modern-entity-editor-dialog-height: 360px;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_table_field.ui-dialog {
	--modern-entity-editor-dialog-height: 330px;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_nav_position.ui-dialog {
	--modern-entity-editor-dialog-height: 300px;
}

/* Read-only "Field Properties" popup (system fields in the Custom Entity Editor):
   modern-card variant for a plain labeled table instead of an entry form */
.modern-entity-editor-dialog.modern-entity-editor-readonly-dialog.ui-dialog {
	width: 560px !important;
	height: auto !important;
	min-height: 0;
}

.modern-entity-editor-readonly-dialog .modern-entity-editor-readonly-title {
	flex: 0 0 auto;
	height: 28px;
	margin-bottom: 12px;
	color: #24282d;
	font-size: 17px;
	font-weight: 700;
	line-height: 28px;
	-webkit-text-stroke: 0.7px currentColor;
}

.modern-entity-editor-readonly-dialog table.table_builder_labeled {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0 6px;
	margin-bottom: 8px;
}

.modern-entity-editor-readonly-dialog table.table_builder_labeled > tbody > tr > td {
	border: none;
	background-color: #f3f3f3;
	padding: 9px 10px 9px 12px !important; /* base labeled-table padding is !important */
	font-size: 14px;
	vertical-align: middle;
	box-sizing: border-box;
}

/* Multiline values (Description): block-style row that wraps and keeps line breaks */
.modern-entity-editor-readonly-dialog table.table_builder_labeled > tbody > tr.modern-entity-editor-readonly-multiline > td {
	height: 64px;
	vertical-align: top;
}

.modern-entity-editor-readonly-dialog table.table_builder_labeled > tbody > tr.modern-entity-editor-readonly-multiline > td:last-child {
	white-space: pre-wrap;
	overflow-wrap: anywhere;
	line-height: 1.4;
}

.modern-entity-editor-readonly-dialog table.table_builder_labeled > tbody > tr > td:first-child {
	width: 146px;
	min-width: 146px;
	border-radius: 6px 0 0 6px;
	color: #777;
	font-weight: 600;
	text-align: left;
	white-space: nowrap;
}

.modern-entity-editor-readonly-dialog table.table_builder_labeled > tbody > tr > td:last-child {
	border-radius: 0 6px 6px 0;
	color: #24282d;
}

.modern-entity-editor-dialog .ui-dialog-titlebar {
	position: absolute;
	top: 14px;
	right: 14px;
	z-index: 4;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 6px;
	width: auto;
	height: 28px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.modern-entity-editor-dialog .ui-dialog-title {
	display: none;
}

.modern-entity-editor-dialog .ui-dialog-titlebar-close,
.modern-entity-editor-dialog .ui-dialog-titlebar-maximize {
	position: static !important;
	top: auto !important;
	right: auto !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px !important;
	height: 28px !important;
	margin: 0 !important;
	padding: 0 !important;
	transform: none !important;
	border: 1px solid transparent;
	border-radius: 6px;
	background: transparent;
	color: #6f7782;
	box-sizing: border-box;
	cursor: pointer;
}

.modern-entity-editor-dialog .ui-dialog-titlebar-maximize {
	display: none !important;
}

.modern-entity-editor-dialog .ui-dialog-titlebar-close:hover,
.modern-entity-editor-dialog .ui-dialog-titlebar-maximize:hover {
	border-color: #d9dee5;
	background: #f5f5f5;
	color: #252a31;
}

.modern-entity-editor-dialog .ui-dialog-titlebar-close:focus-visible,
.modern-entity-editor-dialog .ui-dialog-titlebar-maximize:focus-visible {
	outline: none;
	border-color: #b8c0ca;
	box-shadow: 0 0 0 2px rgba(15, 23, 42, .12);
}

.modern-entity-editor-dialog .ui-dialog-titlebar-close .ui-icon,
.modern-entity-editor-dialog .ui-dialog-titlebar-close .ui-button-icon,
.modern-entity-editor-dialog .ui-dialog-titlebar-close .ui-button-icon-primary,
.modern-entity-editor-dialog .ui-dialog-titlebar-close .ui-button-text,
.modern-entity-editor-dialog .ui-dialog-titlebar-maximize .ui-button-text {
	display: none;
}

.modern-entity-editor-dialog .ui-dialog-titlebar-close:before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.modern-entity-editor-dialog .ui-dialog-titlebar-maximize img.maximize-button-icon {
	width: 15px !important;
	height: 15px !important;
	opacity: .78;
	filter: grayscale(1);
}

/* A user-defined entity's record dialog (EntityEditorUtils.applyModernRecordChrome): the modern card
   and footer around the entity's own custom form. The full editor draws its heading inside its form;
   a custom form has none, so the dialog's own title shows, in the same type as that heading. */
.modern-entity-editor-dialog.modern-entity-record-dialog .ui-dialog-titlebar {
	position: static;
	justify-content: space-between;
	height: auto;
	padding: 14px 14px 4px 20px;
}

.modern-entity-editor-dialog.modern-entity-record-dialog .ui-dialog-title {
	display: block;
	float: none;
	flex: 1 1 auto;
	min-width: 0;
	width: auto;
	margin: 0;
	color: #24282d;
	font-size: 17px;
	font-weight: 700;
	line-height: 20px;
	-webkit-text-stroke: 0.7px currentColor;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.modern-entity-editor-dialog.modern-entity-record-dialog .ui-dialog-content {
	flex: 1 1 auto;
	height: auto !important;
	min-height: 0;
	overflow: auto;
	padding: 6px 20px 12px;
	border: 0;
	background: #fff;
}

.modern-entity-editor-dialog .ui-dialog-content.modern-entity-editor-content {
	display: flex !important;
	flex: 1 1 auto;
	flex-direction: column;
	height: auto !important;
	min-height: 0;
	padding: 14px 14px 0 !important;
	border: 0;
	background: #fff;
	overflow: hidden !important;
	box-sizing: border-box;
}

.modern-entity-editor-dialog .ui-dialog-content > a.metadata-link,
.modern-entity-editor-dialog .modern-entity-editor-form > a {
	display: none !important;
}

.modern-entity-editor-dialog .ui-dialog-buttonpane {
	flex: 0 0 auto;
	margin: 0;
	padding: 10px 14px 12px;
	border-width: 1px 0 0;
	border-style: solid;
	border-color: #e7ebef;
	background: #fff;
	box-sizing: border-box;
}

.modern-entity-editor-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	float: none;
	width: 100%;
	min-height: 34px;
}

.modern-entity-editor-dialog .ui-dialog-buttonpane button.ui-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	height: 32px;
	margin: 0;
	padding: 0 14px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background: #fff;
	color: #395066;
	box-shadow: none;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	box-sizing: border-box;
}

.modern-entity-editor-dialog .ui-dialog-buttonpane button.ui-button:hover {
	border-color: #bfcad6;
	background: #f5f8fb;
	color: #23384f;
}

.modern-entity-editor-dialog .ui-dialog-buttonpane button.ui-button:focus {
	outline: none;
	border-color: #8cb2e5;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .16);
}

.modern-entity-editor-dialog .ui-dialog-buttonpane button.ui-button .ui-button-text {
	padding: 0;
	line-height: 1;
}

.modern-entity-editor-dialog .ui-dialog-buttonpane button#save_button {
	border-color: #00529b;
	background: #00529b;
	color: #fff;
}

.modern-entity-editor-dialog .ui-dialog-buttonpane button#save_button:hover {
	border-color: #003d73;
	background: #003d73;
	color: #fff;
}

.modern-entity-editor-dialog .ui-dialog-buttonpane button#delete_button {
	position: static;
	margin-right: auto;
	border-color: #ef4444;
	background: #ef4444;
	color: #fff;
}

.modern-entity-editor-dialog .ui-dialog-buttonpane button#delete_button:hover {
	border-color: #dc2626;
	background: #dc2626;
	color: #fff;
}

/* A form row whose value is fixed after creation (e.g. a custom field's Data Type):
   help cursor + tooltip explain the inert control. The disabled inputs must not
   swallow hover, or the row never sees the mouse. */
.modern-entity-editor-immutable-cell {
	cursor: help;
}

.modern-entity-editor-immutable-cell .activity-modal-select-disabled,
.modern-entity-editor-immutable-cell select[disabled] {
	pointer-events: none;
}

.modern-entity-editor-tooltip.ui-tooltip {
	max-width: 260px;
	padding: 8px 10px;
	border: 1px solid #d8dee6;
	border-radius: 6px;
	background: #fff;
	box-shadow: 0 10px 24px rgba(15, 23, 42, .12), 0 2px 6px rgba(15, 23, 42, .08);
	color: #27313d;
	font-size: 12px;
	line-height: 1.35;
}

.modern-entity-editor-form {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-height: 0;
	box-sizing: border-box;
	--modern-entity-editor-label-width: 146px;
}

.modern-entity-editor-field-table {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	width: 100%;
	height: 100%;
	min-height: 0;
	border-collapse: separate;
	border-spacing: 0 6px;
	table-layout: fixed;
	box-sizing: border-box;
}

/* When an inline picklist editor is injected into a CustomEntityField form, the field table must NOT
   fill the form (its default flex:1/height:100%) or it squeezes/overlaps the picklist. Give it natural
   height so the field properties sit above and the picklist flows below (mirrors the CustomDropDown rule). */
.modern-entity-editor-field-table.has-inline-picklist {
	flex: 0 0 auto;
	height: auto;
}

/* Keep the jQuery-UI resize handles INSIDE the dialog's overflow:hidden clip (along the straight edges,
   away from the rounded corners) so they stay grabbable — this enables resize without needing
   overflow:visible, which caused a window-resize feedback loop. */
.modern-entity-editor-dialog.ui-resizable > .ui-resizable-e { right: 0; }
.modern-entity-editor-dialog.ui-resizable > .ui-resizable-w { left: 0; }
.modern-entity-editor-dialog.ui-resizable > .ui-resizable-s { bottom: 0; }
.modern-entity-editor-dialog.ui-resizable > .ui-resizable-n { top: 0; }

.modern-entity-editor-field-table > thead {
	display: block;
	flex: 0 0 auto;
	width: 100%;
}

.modern-entity-editor-field-table > thead > tr {
	display: flex;
	align-items: center;
	width: 100%;
	margin-bottom: 6px;
}

.modern-entity-editor-field-table > thead > tr > td.formtitle {
	display: flex;
	align-items: center;
	flex: 1 1 auto;
	min-width: 0;
	height: 28px;
	min-height: 28px;
	padding: 0 !important;
	border-radius: 7px;
	background: transparent;
	color: #24282d;
	font-size: 17px;
	font-weight: 700;
	line-height: 20px;
	-webkit-text-stroke: 0.7px currentColor;
	vertical-align: middle;
	box-sizing: border-box;
}

.modern-entity-editor-field-table > tbody {
	display: block;
	flex: 1 1 auto;
	width: 100%;
	min-height: 0;
	padding-bottom: 12px;
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: none;
	-ms-overflow-style: none;
	overscroll-behavior: contain;
	box-sizing: border-box;
}

.modern-entity-editor-field-table > tbody::-webkit-scrollbar {
	display: none;
}

.modern-entity-editor-field-table > tbody > tr {
	display: grid !important;
	grid-template-columns: var(--modern-entity-editor-label-width) minmax(0, 1fr);
	width: 100%;
	margin-bottom: 6px;
	table-layout: fixed;
	box-sizing: border-box;
}

.modern-entity-editor-field-table > tbody > tr[style*="display: none"] {
	display: none !important;
}

.modern-entity-editor-field-table > tbody > tr:last-child {
	margin-bottom: 0;
}

.modern-entity-editor-field-table > tbody > tr > td.label,
.modern-entity-editor-field-table > tbody > tr > td:not(.label) {
	background-color: #f3f3f3;
	min-height: 0;
	vertical-align: middle;
}

.modern-entity-editor-field-table > tbody > tr > td.label {
	width: var(--modern-entity-editor-label-width);
	min-width: var(--modern-entity-editor-label-width);
	max-width: var(--modern-entity-editor-label-width);
	padding: 7px 8px 7px 12px !important;
	border-radius: 6px 0 0 6px;
	color: #777;
	font-size: 14px;
	font-weight: 600;
	text-align: left;
	box-sizing: border-box;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.modern-entity-editor-field-table > tbody > tr > td.label label {
	display: block;
	width: 100%;
	padding: 0;
	color: #777;
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.modern-entity-editor-field-table > tbody > tr > td.label label.required::before {
	content: none;
}

.modern-entity-editor-field-table > tbody > tr > td:not(.label) {
	min-width: 0;
	padding: 5px 10px 5px 0 !important;
	border-radius: 0 6px 6px 0;
	box-sizing: border-box;
}

.modern-entity-editor-field-table > tbody > tr > td:not(.label) input.forminput,
.modern-entity-editor-field-table > tbody > tr > td:not(.label) input.pareto_picker_input,
.modern-entity-editor-field-table > tbody > tr > td:not(.label) select,
.modern-entity-editor-field-table > tbody > tr > td:not(.label) textarea {
	width: 100% !important;
	min-width: 0 !important;
	border: none;
	background-color: transparent;
	box-shadow: none;
	color: #24282d;
	font-size: 14px;
	line-height: 19px;
	box-sizing: border-box;
}

.modern-entity-editor-field-table > tbody > tr > td:not(.label) input.forminput,
.modern-entity-editor-field-table > tbody > tr > td:not(.label) input.pareto_picker_input,
.modern-entity-editor-field-table > tbody > tr > td:not(.label) select {
	height: 27px;
	padding: 4px 0;
}

.modern-entity-editor-field-table > tbody > tr > td:not(.label) select {
	-webkit-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%2378869a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 4px center;
	background-size: 16px 16px;
	padding-right: 20px;
}

.modern-entity-editor-field-table > tbody > tr > td:not(.label) input:focus,
.modern-entity-editor-field-table > tbody > tr > td:not(.label) select:focus,
.modern-entity-editor-field-table > tbody > tr > td:not(.label) textarea:focus {
	outline: none;
	border: none;
	box-shadow: none;
}

.modern-entity-editor-field-table > tbody > tr#tr_Description {
	position: relative;
	display: block !important;
	height: 167px;
}

.modern-entity-editor-field-table > tbody > tr#tr_Description[style*="display: none"] {
	display: none !important;
}

.modern-entity-editor-field-table > tbody > tr#tr_Description > td.label,
.modern-entity-editor-field-table > tbody > tr#tr_Description > td:not(.label) {
	display: block;
	position: absolute;
	left: 0;
	width: 100% !important;
	max-width: none;
	padding-left: 12px !important;
	padding-right: 12px !important;
	border-radius: 6px 6px 0 0;
}

.modern-entity-editor-field-table > tbody > tr#tr_Description > td:not(.label) {
	top: 33px;
	height: 134px;
	padding-top: 0 !important;
	padding-bottom: 10px !important;
	border-radius: 0 0 6px 6px;
}

.modern-entity-editor-field-table > tbody > tr#tr_Description textarea {
	display: block;
	height: 120px !important;
	min-height: 120px;
	max-height: 120px;
	padding: 0;
	resize: none;
	overflow-x: hidden;
	overflow-y: auto;
	overflow-wrap: anywhere;
	word-break: break-word;
	white-space: pre-wrap;
}

.modern-entity-editor-field-table > tbody > tr > td:not(.label) input[type=checkbox] {
	width: auto !important;
	height: auto;
	min-width: 0 !important;
	margin: 3px 0;
}

.modern-entity-editor-field-table > tbody > tr#tr_AllDay input[type=checkbox],
.modern-entity-editor-field-table > tbody > tr#tr_RollOver input[type=checkbox],
.modern-entity-editor-field-table > tbody > tr#tr_DynamicProcess input[type=checkbox],
.modern-entity-editor-field-table > tbody > tr#tr_WeekendAvoidance input[type=checkbox] {
	appearance: none;
	position: relative;
	width: 34px !important;
	height: 18px;
	min-width: 34px !important;
	margin: 0;
	border: 0;
	border-radius: 999px;
	background-color: #b2b2b2;
	cursor: pointer;
	vertical-align: middle;
	transition: background-color 120ms ease, box-shadow 120ms ease;
}

.modern-entity-editor-field-table > tbody > tr#tr_AllDay input[type=checkbox]::before,
.modern-entity-editor-field-table > tbody > tr#tr_RollOver input[type=checkbox]::before,
.modern-entity-editor-field-table > tbody > tr#tr_DynamicProcess input[type=checkbox]::before,
.modern-entity-editor-field-table > tbody > tr#tr_WeekendAvoidance input[type=checkbox]::before {
	content: "";
	position: absolute;
	top: 2px;
	left: 2px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background-color: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
	transition: transform 120ms ease;
}

.modern-entity-editor-field-table > tbody > tr#tr_AllDay input[type=checkbox]:checked,
.modern-entity-editor-field-table > tbody > tr#tr_RollOver input[type=checkbox]:checked,
.modern-entity-editor-field-table > tbody > tr#tr_DynamicProcess input[type=checkbox]:checked,
.modern-entity-editor-field-table > tbody > tr#tr_WeekendAvoidance input[type=checkbox]:checked {
	background-color: #2f73ad;
}

.modern-entity-editor-field-table > tbody > tr#tr_AllDay input[type=checkbox]:checked::before,
.modern-entity-editor-field-table > tbody > tr#tr_RollOver input[type=checkbox]:checked::before,
.modern-entity-editor-field-table > tbody > tr#tr_DynamicProcess input[type=checkbox]:checked::before,
.modern-entity-editor-field-table > tbody > tr#tr_WeekendAvoidance input[type=checkbox]:checked::before {
	transform: translateX(16px);
}

.modern-custom-entity-editor-dialog .modern-entity-editor-field-table {
	--modern-entity-editor-label-width: 142px;
}

.modern-custom-entity-editor-dialog .modern-entity-editor-field-table > tbody {
	padding-bottom: 14px;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_drop_down .modern-entity-editor-field-table {
	flex: 0 0 auto;
	height: auto;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_drop_down .modern-entity-editor-field-table > tbody {
	flex: 0 0 auto;
	padding-bottom: 8px;
	overflow: visible;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_drop_down .modern-entity-editor-form {
	overflow: hidden;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_drop_down .cust_drop_down_options {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-height: 0;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_drop_down .cust_drop_down_options > div:last-child {
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
}

.modern-custom-entity-editor-dialog .modern-entity-editor-field-table > tbody > tr#tr_FormLayoutOptions {
	display: block !important;
	width: 100%;
}

.modern-custom-entity-editor-dialog .modern-entity-editor-field-table > tbody > tr#tr_FormLayoutOptions > td {
	display: block;
	width: 100% !important;
	max-width: none;
	padding: 10px 12px !important;
	border-radius: 6px;
	background-color: #f3f3f3;
	box-sizing: border-box;
}

.modern-custom-entity-editor-dialog #tr_FormLayoutOptions h4 {
	margin: 0 0 8px;
	color: #777;
	font-size: 13px;
	font-weight: 700;
	line-height: 18px;
}

.modern-custom-entity-editor-dialog .form-layout-option {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 8px;
	padding: 9px 10px;
	border: 1px solid #dce1e7;
	border-radius: 6px;
	background-color: #fff;
	box-shadow: none;
	box-sizing: border-box;
}

.modern-custom-entity-editor-dialog .form-layout-option:last-child {
	margin-bottom: 0;
}

.modern-custom-entity-editor-dialog .form-layout-option label {
	flex: 1 1 auto;
	min-width: 0;
	color: #27313d;
	font-size: 13px;
	font-weight: 600;
	line-height: 17px;
	cursor: pointer;
}

.modern-custom-entity-editor-dialog .form-layout-option label .description {
	display: block;
	margin-top: 2px;
	color: #7b8794;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
}

.modern-custom-entity-editor-dialog .form-layout-option input[type="radio"] {
	flex: 0 0 auto;
	width: 16px !important;
	height: 16px;
	margin: 0;
	cursor: pointer;
}

.modern-custom-entity-editor-dialog .modern-entity-editor-field-table > tbody > tr > td:not(.label) input[type=checkbox] {
	appearance: none;
	position: relative;
	width: 34px !important;
	height: 18px;
	min-width: 34px !important;
	margin: 0;
	border: 0;
	border-radius: 999px;
	background-color: #b2b2b2;
	cursor: pointer;
	vertical-align: middle;
	transition: background-color 120ms ease, box-shadow 120ms ease;
}

.modern-custom-entity-editor-dialog .modern-entity-editor-field-table > tbody > tr > td:not(.label) input[type=checkbox]::before {
	content: "";
	position: absolute;
	top: 2px;
	left: 2px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background-color: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .18);
	transition: transform 120ms ease;
}

.modern-custom-entity-editor-dialog .modern-entity-editor-field-table > tbody > tr > td:not(.label) input[type=checkbox]:checked {
	background-color: #2f73ad;
}

.modern-custom-entity-editor-dialog .modern-entity-editor-field-table > tbody > tr > td:not(.label) input[type=checkbox]:checked::before {
	transform: translateX(16px);
}

.modern-custom-entity-editor-dialog .modern-entity-editor-field-table > tbody > tr > td:not(.label) input[type=checkbox]:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .16);
}

.modern-custom-entity-editor-dialog .cust_drop_down_options,
.modern-custom-entity-editor-dialog #cust-editor-picklist-options {
	margin: 0 0 14px !important;
	padding: 10px 12px !important;
	border: 0 !important;
	border-radius: 6px;
	background-color: #f3f3f3;
	box-sizing: border-box;
}

.modern-custom-entity-editor-dialog .cust_drop_down_options > div:first-child {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
}

.modern-custom-entity-editor-dialog .cust_drop_down_options > div:last-child {
	margin: 0;
}

.modern-custom-entity-editor-dialog .cust_drop_down_options .title,
.modern-custom-entity-editor-dialog #cust-editor-picklist-options h4 {
	order: 1;
	flex: 1 1 auto;
	margin: 0 !important;
	padding: 0;
	color: #777;
	font-size: 13px;
	font-weight: 700;
	line-height: 18px;
}

.modern-custom-entity-editor-dialog .cust_drop_down_options .add.button,
.modern-custom-entity-editor-dialog #cust-editor-picklist-options button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 28px;
	min-width: 30px;
	padding: 0 10px;
	border: 1px solid #00529b;
	border-radius: 6px;
	background: #00529b;
	color: #fff;
	box-shadow: none;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
}

.modern-custom-entity-editor-dialog .cust_drop_down_options .add.button {
	order: 2;
	float: none !important;
	flex: 0 0 auto;
	width: auto;
	margin-left: auto;
	padding: 0 10px;
	gap: 6px;
}

.modern-custom-entity-editor-dialog .cust_drop_down_options .add.button:hover,
.modern-custom-entity-editor-dialog #cust-editor-picklist-options button:hover {
	border-color: #003d73;
	background: #003d73;
}

.modern-custom-entity-editor-dialog .cust_drop_down_options .add.button::before {
	content: "+";
	display: block;
	font-size: 17px;
	font-weight: 700;
	line-height: 1;
}

.modern-custom-entity-editor-dialog .cust_drop_down_options .add.button::after {
	content: "Add Option";
	display: block;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
}

.modern-custom-entity-editor-dialog #cust-editor-picklist-options > div:last-child {
	display: flex !important;
	gap: 8px !important;
	margin-top: 8px !important;
}

.modern-custom-entity-editor-dialog #cust-editor-picklist-input {
	flex: 1 1 auto;
	height: 28px;
	min-width: 0;
	padding: 4px 8px !important;
	border: 1px solid #dce1e7 !important;
	border-radius: 6px !important;
	background: #fff !important;
	box-shadow: none !important;
	color: #27313d;
	font-size: 13px;
	box-sizing: border-box;
}

.modern-custom-entity-editor-dialog .custom_drop_down_list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_drop_down .custom_drop_down_list {
	max-height: max(140px, calc(100vh - 345px));
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: none;
	-ms-overflow-style: none;
	overscroll-behavior: contain;
}

.modern-custom-entity-editor-dialog.modern-entity-editor-logical-custom_drop_down .custom_drop_down_list::-webkit-scrollbar {
	display: none;
}

.modern-custom-entity-editor-dialog .custom_drop_down_list li {
	display: flex;
	align-items: center;
	gap: 6px;
	min-height: 30px;
	margin: 0 0 6px;
	padding: 7px 9px;
	border: 1px solid #dce1e7;
	border-radius: 6px;
	background-color: #fff;
	color: #27313d;
	font-size: 13px;
	line-height: 16px;
	box-sizing: border-box;
	cursor: default;
}

.modern-custom-entity-editor-dialog .custom_drop_down_list li:last-child {
	margin-bottom: 0;
}

.modern-custom-entity-editor-dialog .custom-drop-down-option-label {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.modern-custom-entity-editor-dialog .custom-drop-down-option-actions {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	gap: 6px;
	margin-left: auto;
}

.modern-custom-entity-editor-dialog .custom_drop_down_list li.custom-drop-down-empty-state {
	border-color: #e2e6ec;
	background-color: #fff;
	color: #8b96a3;
	font-weight: 600;
	cursor: default;
}

.modern-custom-entity-editor-dialog .custom_drop_down_list li.custom-drop-down-inline-editor {
	padding: 4px 6px;
	border-color: #b9d5f5;
	background-color: #fff;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .12);
	cursor: text;
}

.modern-custom-entity-editor-dialog .custom-drop-down-option-inline-input {
	flex: 1 1 auto;
	width: 100%;
	min-width: 0;
	height: 24px;
	padding: 2px 4px;
	border: 0;
	background: transparent;
	box-shadow: none;
	color: #27313d;
	font-size: 13px;
	font-weight: 600;
	line-height: 18px;
	box-sizing: border-box;
}

.modern-custom-entity-editor-dialog .custom-drop-down-option-inline-input:focus {
	outline: none;
	border: 0;
	box-shadow: none;
}

.modern-custom-entity-editor-dialog .custom-drop-down-inline-editor-saving {
	opacity: .68;
}

.modern-custom-entity-editor-dialog .custom_drop_down_list .edit.button,
.modern-custom-entity-editor-dialog .custom_drop_down_list .delete.button {
	flex: 0 0 auto;
	width: 20px;
	height: 20px;
	margin-left: 0;
	border-radius: 5px;
	opacity: .74;
}

.modern-entity-editor-field-table .lookup_input_link_container {
	border: none;
	background-color: transparent;
	min-height: 27px;
}

.modern-entity-editor-field-table .lookup-dropdown-trigger {
	gap: 8px;
	background-color: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	height: 27px;
	min-height: 27px;
	padding: 0 6px 0 0;
	transition: none;
}

.modern-entity-editor-field-table .lookup-dropdown-trigger:hover {
	background-color: transparent;
	box-shadow: none;
}

.modern-entity-editor-field-table .lookup-dropdown-trigger-name {
	color: #24282d;
	font-size: 14px;
	font-weight: 500;
	line-height: 27px;
}

.modern-entity-editor-field-table .lookup-dropdown-trigger-name.placeholder {
	color: #8b96a3;
}

.modern-entity-editor-field-table .activity-modal-select::after {
	width: 16px;
	height: 16px;
	background-size: 16px 16px;
}

.modern-entity-editor-field-table .modern-entity-editor-select2-container.select2-container,
.modern-entity-editor-field-table .activity-modal-select2-container.select2-container {
	min-width: 0;
	width: 100% !important;
}

.modern-entity-editor-field-table .modern-entity-editor-select2-container .select2-selection--single,
.modern-entity-editor-field-table .activity-modal-select2-container .select2-selection--single {
	height: 27px;
	min-height: 27px;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.modern-entity-editor-field-table .modern-entity-editor-select2-container.select2-container--classic .select2-selection--single,
.modern-entity-editor-field-table .activity-modal-select2-container.select2-container--classic .select2-selection--single {
	border: 0 !important;
	background: transparent !important;
	background-image: none !important;
	box-shadow: none !important;
	outline: none;
}

.modern-entity-editor-field-table .modern-entity-editor-select2-container .select2-selection__rendered,
.modern-entity-editor-field-table .activity-modal-select2-container .select2-selection__rendered {
	padding: 0 28px 0 0;
	color: #24282d;
	font-size: 14px;
	font-weight: 500;
	line-height: 27px;
}

.modern-entity-editor-field-table .modern-entity-editor-select2-container .select2-selection__arrow,
.modern-entity-editor-field-table .activity-modal-select2-container .select2-selection__arrow {
	top: 0;
	right: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 27px;
	border: 0 !important;
	border-radius: 0;
	background: transparent !important;
}

.modern-entity-editor-field-table .modern-entity-editor-select2-container .select2-selection__arrow b,
.modern-entity-editor-field-table .activity-modal-select2-container .select2-selection__arrow b {
	display: none;
}

.modern-entity-editor-field-table .modern-entity-editor-select2-container .select2-selection__arrow::before,
.modern-entity-editor-field-table .activity-modal-select2-container .select2-selection__arrow::before {
	content: "";
	width: 16px;
	height: 16px;
	background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%2378869a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 16px 16px;
}

@media (max-width: 900px) {
	.appointment-editor-notes-host {
		top: 64px;
		bottom: 56px;
	}

	.appointment-editor-notes-panel {
		right: 10px;
		width: calc(100% - 20px);
		padding-right: 16px;
		padding-left: 16px;
	}
}

div.vc_multi_text_input_wrapper input.vc_multi_text_input {
	margin-right: -32px;
}

table.org-file-layout {
	width: 100%;
}

table.org-file-layout > tbody > tr > td {
	vertical-align: top;
}

div.org-file-center-parent {
	text-align: center;
	margin-top: 50px;
	margin-bottom: 50px;
}

/** End DFB Customization **/

	/*
	.administration_search_wrapper {

	}

	.administration_result_wrapper {

	}

	.administration_result_row {

	}
	*/

.administration_result_row:hover {
	background-color: lightgray;
}

/** Lookup Selector Popup **/
.gel-gtable {
	padding-top: 10px;
}
.gel-gtable div.dt_multiline {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-height: none;
}

.exact_print {
	-webkit-print-color-adjust: exact;
	print-color-adjust: exact;
    width:100%;
    table-layout:fixed;
}

/** File Store **/
.fs-tree-layout-cell {
	width: auto;
	min-width: var(--workspace-sidebar-min-width);
	max-width: var(--workspace-sidebar-max-width);
	flex: 0 0 var(--workspace-sidebar-basis);
}

div.fs-tree-container {
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding: var(--workspace-sidebar-padding);
	box-sizing: border-box;
	background: #F3F3F3;
	border-radius: 12px;
}

div.fs-tree-container::-webkit-scrollbar {
	display: none;
}

.fs-tree-wrapper {
	height: 100%;
	width: 100%;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 15px;
	overflow: hidden;
}

.fs-tree-header-section {
	flex-shrink: 0;
	height: var(--workspace-module-header-height);
	min-height: var(--workspace-module-header-height);
	padding: var(--workspace-module-header-padding);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	background: #F3F3F3;
	border-radius: 12px;
}

.fs-tree-header {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 22px;
	font-weight: 700;
	color: #25282d;
}

.fs-tree-title-icon {
	width: 34px;
	height: 34px;
}

.fs-tree-title {
	font-size: var(--module-title-size);
	letter-spacing: -0.03em;
	-webkit-text-stroke: var(--module-title-stroke) currentColor;
}

.fs-tree-new-folder-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: var(--workspace-toolbar-control-height);
	padding: 0 var(--workspace-primary-action-padding-inline);
	border: 1px solid transparent;
	border-radius: 8px;
	cursor: pointer;
	font-size: 14px;
	font-weight: 500;
	color: #fff;
	font-family: inherit;
	appearance: none;
	box-sizing: border-box;
}

.fs-manage-shares-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 35px;
	margin-left: 8px;
	padding: 0 12px;
	background: #fff;
	border: 1px solid #00529B;
	border-radius: 8px;
	cursor: pointer;
	font-size: 14px;
	font-weight: 500;
	color: #00529B;
	font-family: inherit;
	appearance: none;
	box-sizing: border-box;
}

.fs-manage-shares-btn:hover {
	background: #eaf2fa;
}

/* Manage-shared-files dialog (#1244) */
.fs-mng-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-bottom: 10px;
	border-bottom: 1px solid #e6e9ee;
	margin-bottom: 12px;
}
.fs-mng-count { font-weight: 600; color: #333; }
.fs-mng-toggle { font-size: 13px; color: #555; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.fs-mng-list { font-size: 13px; }
.fs-mng-empty { padding: 32px 0; text-align: center; color: #888; }

.fs-mng-card {
	border: 1px solid #e6e9ee;
	border-left: 4px solid #cbd2da;
	border-radius: 8px;
	padding: 12px 14px;
	margin-bottom: 10px;
	background: #fff;
	transition: box-shadow .12s ease;
}
.fs-mng-card:hover { box-shadow: 0 2px 10px rgba(0,0,0,.07); }
.fs-mng-card-active { border-left-color: #2e7d32; }
.fs-mng-card-revoked { border-left-color: #c62828; opacity: .72; }
.fs-mng-card-expired { border-left-color: #ef6c00; opacity: .9; }

.fs-mng-card-head { display: flex; align-items: center; gap: 10px; }
.fs-mng-icon { font-size: 18px; line-height: 1; flex: 0 0 auto; }
.fs-mng-titlewrap { flex: 1 1 auto; min-width: 0; }
.fs-mng-title { font-weight: 600; font-size: 14px; color: #1a1a1a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fs-mng-sub { font-size: 12px; color: #777; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.fs-mng-badge {
	flex: 0 0 auto;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .03em;
	padding: 3px 9px;
	border-radius: 999px;
}
.fs-mng-badge-active { background: #e6f4ea; color: #1e7e34; }
.fs-mng-badge-revoked { background: #fdecea; color: #c62828; }
.fs-mng-badge-expired { background: #fff3e0; color: #ef6c00; }

.fs-mng-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0 28px; }
.fs-mng-chip {
	font-size: 12px;
	color: #4a5563;
	background: #f1f3f6;
	border-radius: 6px;
	padding: 2px 8px;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.fs-mng-chip-mail { background: #e8f0fb; color: #00529B; }
.fs-mng-chip-lock { background: #fef6e0; color: #8a6d1a; }

.fs-mng-actions { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 0 28px; }
.fs-mng-btn {
	font-size: 12px;
	font-weight: 500;
	height: 28px;
	padding: 0 12px;
	background: #fff;
	border: 1px solid #c7ced8;
	border-radius: 6px;
	color: #333;
	cursor: pointer;
	font-family: inherit;
}
.fs-mng-btn:hover { background: #f3f5f8; border-color: #00529B; color: #00529B; }
.fs-mng-btn:disabled { opacity: .45; cursor: not-allowed; background: #f7f8fa; }
.fs-mng-btn:disabled:hover { border-color: #c7ced8; color: #333; background: #f7f8fa; }
.fs-mng-btn-danger { color: #c62828; border-color: #e3b4b1; }
.fs-mng-btn-danger:hover { background: #fdecea; border-color: #c62828; color: #c62828; }

/* Share dialog (#1244) */
.fs-share-form {
	background: #f7f9fc;
	border: 1px solid #e6e9ee;
	border-radius: 10px;
	padding: 14px 16px;
}
.fs-share-intro { color: #555; font-size: 13px; margin-bottom: 12px; }
.fs-share-field { display: flex; align-items: center; gap: 10px; margin: 8px 0; }
.fs-share-field > label { flex: 0 0 110px; font-size: 13px; color: #555; }
.fs-share-field > input,
.fs-share-field > select {
	flex: 1 1 auto;
	height: 32px;
	padding: 0 8px;
	border: 1px solid #c7ced8;
	border-radius: 6px;
	font-size: 13px;
	font-family: inherit;
	box-sizing: border-box;
	background: #fff;
}
.fs-share-email-row { flex: 1 1 auto; display: flex; gap: 6px; min-width: 0; }
.fs-share-email-row > input {
	flex: 1 1 auto;
	min-width: 0;
	height: 32px;
	padding: 0 8px;
	border: 1px solid #c7ced8;
	border-radius: 6px;
	font-size: 13px;
	box-sizing: border-box;
}
.fs-share-email-row > .fs-mng-btn { height: 32px; flex: 0 0 auto; }
.fs-share-createrow { margin-top: 12px; }
.fs-share-create {
	height: 35px;
	padding: 0 16px;
	color: #fff;
	border: 1px solid transparent;
	border-radius: 8px;
	cursor: pointer;
	font-size: 14px;
	font-weight: 500;
	font-family: inherit;
}
.fs-share-new:not(:empty) {
	margin-top: 12px;
	padding: 10px 12px;
	background: #e6f4ea;
	border: 1px solid #b7dfc3;
	border-radius: 8px;
	font-size: 13px;
}
.fs-share-new p { margin: 0 0 6px; }
.fs-share-new input { width: 100%; height: 30px; padding: 0 8px; border: 1px solid #c7ced8; border-radius: 6px; font-size: 12px; box-sizing: border-box; }
.fs-share-sectionhead { font-weight: 600; font-size: 13px; color: #333; margin: 16px 0 10px; }
/* Keep the share form static at the top and scroll only the existing-links list,
   so the dialog stays compact instead of growing with every link. */
.fs-share-existing {
	max-height: 300px;
	overflow-y: auto;
	padding-right: 4px;
}

.fs-file-list-cell {
	flex: 1;
	min-width: 0;
	border-radius: 12px;
}

.fs-file-list-container {
	height: 100%;
}

/** Scheduler workspace **/
.panel_content_rv_tab_content.scheduler-tab-content {
	overflow: hidden;
	height: calc(100% - 166px);
}

.scheduler-workspace {
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 0;
	box-sizing: border-box;
	padding: 0;
	background: #fff;
}

.scheduler-layout-columns {
	display: flex;
	flex: 1;
	min-height: 0;
	gap: 15px;
	box-sizing: border-box;
}

.scheduler-sidebar {
	width: auto;
	min-width: var(--workspace-sidebar-min-width);
	max-width: var(--workspace-sidebar-max-width);
	flex: 0 0 var(--workspace-sidebar-basis);
	display: flex;
	flex-direction: column;
	gap: 15px;
	min-height: 0;
	padding: 0 0 0 0;
	box-sizing: border-box;
}

.scheduler-sidebar-header-section {
	flex-shrink: 0;
	height: var(--workspace-module-header-height);
	min-height: var(--workspace-module-header-height);
	padding: var(--workspace-module-header-padding);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	background: #F3F3F3;
	border-radius: 12px;
}

.scheduler-sidebar-header {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 22px;
	font-weight: 700;
	color: #25282d;
}

.scheduler-sidebar-title-icon {
	position: relative;
	width: 34px;
	height: 34px;
	flex-shrink: 0;
	border-radius: 7px;
	background: #1976d2;
	box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .12);
}

.scheduler-sidebar-title-icon::before {
	content: "";
	position: absolute;
	left: 7px;
	right: 7px;
	top: 9px;
	height: 3px;
	border-radius: 2px;
	background: rgba(255, 255, 255, .95);
	box-shadow: 0 7px 0 rgba(255, 255, 255, .95), 0 14px 0 rgba(255, 255, 255, .95);
}

.scheduler-sidebar-title-icon::after {
	content: "";
	position: absolute;
	right: -3px;
	bottom: -3px;
	width: 15px;
	height: 15px;
	border: 2px solid #F3F3F3;
	border-radius: 50%;
	background: #1976d2;
}

.scheduler-sidebar-title {
	font-size: var(--module-title-size);
	letter-spacing: -0.03em;
	-webkit-text-stroke: var(--module-title-stroke) currentColor;
}

.scheduler-sidebar-section {
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding: var(--workspace-sidebar-padding);
	box-sizing: border-box;
	background: #F3F3F3;
	border-radius: 12px;
}

.scheduler-sidebar-section::-webkit-scrollbar {
	display: none;
}

.scheduler-sidebar-item {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 38px;
	padding: 8px 10px;
	margin: 0 0 4px 0;
	border: 0;
	border-radius: 8px;
	background: transparent;
	color: #3c4043;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 500;
	text-align: left;
	cursor: pointer;
	box-sizing: border-box;
}

.scheduler-sidebar-item:hover {
	background: #e8eaed;
}

.scheduler-sidebar-item.active {
	background: #fff;
	color: #202124;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
}

.scheduler-nav-icon {
	position: relative;
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	color: currentColor;
}

.scheduler-sidebar-icon-meeting-types,
.scheduler-sidebar-icon-bookings,
.scheduler-sidebar-icon-company-profile,
.scheduler-sidebar-icon-public-profile {
	background-color: currentColor;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.scheduler-sidebar-icon-meeting-types {
	-webkit-mask-image: url('/images/icons/x-sched/sidebar-meeting-types.svg');
	mask-image: url('/images/icons/x-sched/sidebar-meeting-types.svg');
}

.scheduler-sidebar-icon-bookings {
	-webkit-mask-image: url('/images/icons/x-sched/sidebar-bookings.svg');
	mask-image: url('/images/icons/x-sched/sidebar-bookings.svg');
}

.scheduler-sidebar-icon-public-profile {
	-webkit-mask-image: url('/images/icons/x-sched/sidebar-public-profile.svg');
	mask-image: url('/images/icons/x-sched/sidebar-public-profile.svg');
}

.scheduler-sidebar-icon-company-profile {
	-webkit-mask-image: url('/images/icons/x-sched/sidebar-company-profile.svg');
	mask-image: url('/images/icons/x-sched/sidebar-company-profile.svg');
}

.scheduler-nav-icon-link::before,
.scheduler-nav-icon-link::after {
	content: "";
	position: absolute;
	width: 11px;
	height: 6px;
	border: 2px solid currentColor;
	border-radius: 8px;
	top: 5px;
}

.scheduler-nav-icon-link::before {
	left: 0;
	transform: rotate(-35deg);
}

.scheduler-nav-icon-link::after {
	right: 0;
	transform: rotate(-35deg);
}

.scheduler-nav-icon-calendar {
	border: 2px solid currentColor;
	border-radius: 4px;
	box-sizing: border-box;
}

.scheduler-nav-icon-calendar::before {
	content: "";
	position: absolute;
	left: 2px;
	right: 2px;
	top: 5px;
	border-top: 2px solid currentColor;
}

.scheduler-nav-icon-clock {
	border: 2px solid currentColor;
	border-radius: 50%;
	box-sizing: border-box;
}

.scheduler-nav-icon-clock::before {
	content: "";
	position: absolute;
	width: 2px;
	height: 6px;
	left: 7px;
	top: 3px;
	background: currentColor;
}

.scheduler-nav-icon-clock::after {
	content: "";
	position: absolute;
	width: 5px;
	height: 2px;
	left: 7px;
	top: 8px;
	background: currentColor;
	transform: rotate(25deg);
	transform-origin: left center;
}

.scheduler-nav-icon-profile {
	border: 2px solid currentColor;
	border-radius: 50%;
	box-sizing: border-box;
}

.scheduler-nav-icon-profile::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 3px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: currentColor;
}

.scheduler-nav-icon-profile::after {
	content: "";
	position: absolute;
	left: 3px;
	right: 3px;
	bottom: 2px;
	height: 5px;
	border-radius: 8px 8px 0 0;
	background: currentColor;
}

.scheduler-main-content {
	flex: 1;
	min-width: 0;
	min-height: 0;
	height: 100%;
	display: flex;
	flex-direction: column;
	overflow-y: auto;
	overflow-x: hidden;
	border-radius: 12px;
	background: #F3F3F3;
	box-sizing: border-box;
	padding: 25px;
}

.scheduler-main-content-editing {
	position: relative;
	overflow: hidden;
	padding-bottom: 0;
}

.scheduler-main-content-editing::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
	height: 28px;
	pointer-events: none;
	background: linear-gradient(to bottom, rgba(243, 243, 243, 0), #F3F3F3);
}

.scheduler-main-content-public-profile {
	overflow: hidden;
	position: relative;
	padding-bottom: 0;
}

.scheduler-main-content-public-profile::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
	height: 28px;
	pointer-events: none;
	background: linear-gradient(to bottom, rgba(243, 243, 243, 0), #F3F3F3);
}

/* Meeting Types: the header (title, subtitle, action) stays put while the
   card list scrolls independently under a bottom fade */
.scheduler-main-content:has(> .scheduler-meeting-list) {
	position: relative;
	overflow-y: hidden;
	padding-bottom: 0;
}

.scheduler-main-content:has(> .scheduler-meeting-list) > .scheduler-meeting-list {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	overflow-x: hidden;
	/* breathing room inside the scroll clip so card borders/shadows aren't cut;
	   negative margins keep the cards aligned with the header */
	padding: 4px 4px 44px;
	margin: -4px -4px 0;
}

/* The list is now a height-constrained flex column — rows must keep their
   natural height instead of compressing to their min-height floor */
.scheduler-main-content:has(> .scheduler-meeting-list) > .scheduler-meeting-list > .scheduler-meeting-row {
	flex: 0 0 auto;
}

.scheduler-main-content:has(> .scheduler-meeting-list)::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
	height: 28px;
	pointer-events: none;
	background: linear-gradient(to bottom, rgba(243, 243, 243, 0), #F3F3F3);
}

.scheduler-main-content,
.scheduler-editor-rail,
.scheduler-meeting-list {
	scrollbar-width: thin;
	scrollbar-color: rgba(60, 64, 67, .28) transparent;
}

.scheduler-main-content::-webkit-scrollbar,
.scheduler-editor-rail::-webkit-scrollbar,
.scheduler-meeting-list::-webkit-scrollbar {
	width: 9px;
	height: 9px;
}

.scheduler-main-content::-webkit-scrollbar-track,
.scheduler-editor-rail::-webkit-scrollbar-track,
.scheduler-meeting-list::-webkit-scrollbar-track {
	background: transparent;
}

.scheduler-main-content::-webkit-scrollbar-thumb,
.scheduler-editor-rail::-webkit-scrollbar-thumb,
.scheduler-meeting-list::-webkit-scrollbar-thumb {
	min-height: 44px;
	border: 2px solid transparent;
	border-radius: 999px;
	background: rgba(60, 64, 67, .26);
	background-clip: padding-box;
}

.scheduler-main-content::-webkit-scrollbar-thumb:hover,
.scheduler-editor-rail::-webkit-scrollbar-thumb:hover,
.scheduler-meeting-list::-webkit-scrollbar-thumb:hover {
	background: rgba(60, 64, 67, .42);
	background-clip: padding-box;
}

.scheduler-content-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 18px;
}

.scheduler-content-copy h2 {
	margin: 0;
	font-size: 20px;
	line-height: 28px;
	font-weight: 700;
	color: #202124;
	letter-spacing: -0.01em;
}

.scheduler-content-description {
	margin-top: 3px;
	font-size: 13px;
	line-height: 20px;
	color: #5f6368;
}

.scheduler-primary-action {
	flex-shrink: 0;
	min-height: 36px;
	padding: 8px 14px;
	border: 0;
	border-radius: 8px;
	color: #fff;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	box-sizing: border-box;
}

.scheduler-content-header .scheduler-primary-action {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	height: var(--workspace-toolbar-control-height);
	min-height: var(--workspace-toolbar-control-height);
	padding: 0 var(--workspace-primary-action-padding-inline);
	font-weight: 500;
	white-space: nowrap;
}

.scheduler-content-header .scheduler-primary-action::before {
	content: '';
	width: 13px;
	height: 13px;
	flex: 0 0 13px;
	background-color: currentColor;
	-webkit-mask: url(/images/plus.svg) center / contain no-repeat;
	mask: url(/images/plus.svg) center / contain no-repeat;
}

.scheduler-booking-controls {
	display: flex;
	gap: 6px;
	margin-bottom: 16px;
}

.scheduler-public-profile-shell {
	display: grid;
	grid-template-columns: minmax(430px, 1fr) 360px;
	gap: 22px;
	align-items: start;
}

.scheduler-main-content-public-profile .scheduler-public-profile-shell {
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
	align-items: stretch;
}

.scheduler-public-profile-content {
	min-width: 0;
}

.scheduler-main-content-public-profile .scheduler-public-profile-content {
	height: 100%;
	min-height: 0;
	overflow-y: auto;
	overflow-x: hidden;
	padding-right: 2px;
	padding-bottom: 24px;
	box-sizing: border-box;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.scheduler-main-content-public-profile .scheduler-public-profile-content::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}

.scheduler-public-profile-panel,
.scheduler-public-profile-preview {
	border: 1px solid #e2e5e9;
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}

.scheduler-public-profile-panel {
	padding: 20px;
}

.scheduler-public-profile-section-title {
	font-family: Manrope, sans-serif;
	font-size: 15px;
	font-weight: 700;
	color: #202124;
	margin-bottom: 10px;
}

.scheduler-public-profile-meetings-title {
	margin-top: 24px;
}

.scheduler-public-profile-link-section-title {
	margin-top: 26px;
}

.scheduler-public-profile-link-line {
	display: flex;
	align-items: center;
	width: 100%;
	margin-top: 10px;
}

.scheduler-public-profile-url-row {
	display: flex;
	align-items: center;
	flex: 1 1 auto;
	min-width: 0;
	min-height: 42px;
	border: 1px solid #d8dde3;
	border-radius: 8px;
	background: #fff;
	overflow: hidden;
}

.scheduler-public-profile-url-prefix {
	flex-shrink: 0;
	padding-left: 12px;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	color: #6b7280;
	white-space: nowrap;
}

.scheduler-public-profile-username {
	min-width: 0;
	flex: 1;
	height: 40px;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 12px 0 2px !important;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: #202124;
}

.scheduler-public-profile-actions {
	display: flex;
	align-items: center;
	flex: 0 0 auto;
	align-self: stretch;
	margin-left: auto;
	padding: 8px;
	gap: 8px;
	background: transparent;
}

.scheduler-public-profile-actions .scheduler-primary-action {
	height: 32px;
	min-height: 32px;
	padding: 0 12px;
	border-radius: 6px;
	font-size: 12px;
	white-space: nowrap;
}

.scheduler-public-profile-actions .scheduler-primary-action:disabled,
.scheduler-public-profile-actions .scheduler-primary-action:disabled:hover {
	background: #9bb7d4;
	opacity: .72;
	cursor: default;
}

.scheduler-public-profile-actions .scheduler-icon-action {
	width: 32px;
	height: 32px;
	min-width: 32px;
	min-height: 32px;
	padding: 0;
	border: 1px solid #d8dde3;
	border-radius: 6px;
	background-color: #fff;
	background-position: center;
	background-repeat: no-repeat;
	background-size: 15px 15px;
}

.scheduler-public-profile-actions .scheduler-icon-action:hover {
	border-color: #c7cdd4;
	background-color: #f1f3f4;
}

.scheduler-public-profile-actions .scheduler-profile-copy-action {
	background-image: url("/images/icons/x-sched/link-icon.svg");
	background-size: 16px 16px;
}

.scheduler-public-profile-actions .scheduler-profile-open-action {
	background-image: url("/images/icons/x-sched/preview-icon.svg");
	background-size: 16px 16px;
}

.scheduler-public-profile-actions .scheduler-profile-copy-action.scheduler-copy-confirmed,
.scheduler-public-profile-actions .scheduler-profile-copy-action.scheduler-copy-confirmed:hover {
	background-color: #e6f4ea;
	background-image: url("/images/icons/x-sched/link-icon.svg");
}

.scheduler-public-profile-status {
	min-height: 18px;
	margin-top: 8px;
	font-size: 12px;
	line-height: 18px;
	color: #4b5563;
}

.scheduler-public-profile-status:empty {
	display: none;
	min-height: 0;
	margin-top: 0;
}

.scheduler-public-profile-status.error {
	color: #b42318;
}

.scheduler-public-profile-status.checking {
	color: #6b7280;
}

.scheduler-public-profile-status.success {
	color: #067647;
}

.scheduler-username-suggestion {
	display: inline-block;
	margin-left: 6px;
	padding: 0 6px;
	border: 1px solid #d0d5dd;
	border-radius: 10px;
	background: #f9fafb;
	font-size: 12px;
	line-height: 16px;
	color: #175cd3;
	cursor: pointer;
}

.scheduler-username-suggestion:hover {
	background: #eff4ff;
	border-color: #b2ccff;
}

.scheduler-public-profile-identity {
	display: grid;
	grid-template-columns: 112px minmax(0, 1fr);
	gap: 24px;
	align-items: center;
	padding: 16px;
	border: 1px solid #edf0f3;
	border-radius: 10px;
	background: #fff;
	box-sizing: border-box;
}

.scheduler-public-profile-media-row {
	min-width: 0;
	width: 112px;
	gap: 0;
}

.scheduler-public-profile-media-row .scheduler-profile-media-content {
	gap: 0;
}

.scheduler-public-profile-media-row .scheduler-profile-media-preview {
	width: 112px;
	height: 112px;
}

.scheduler-public-profile-media-row .scheduler-profile-media-preview span {
	font-size: 26px;
}

.scheduler-public-profile-avatar-shell {
	position: relative;
	width: 112px;
	height: 112px;
	flex: 0 0 112px;
	border-radius: 50%;
	cursor: pointer;
}

.scheduler-public-profile-avatar-shell .scheduler-profile-media-preview {
	width: 100%;
	height: 100%;
	border: 0;
	background: transparent;
}

.scheduler-public-profile-avatar-overlay {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border-radius: 50%;
	background: rgba(17, 24, 39, .34);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	opacity: 0;
	pointer-events: none;
	transition: opacity .15s ease;
}

.scheduler-public-profile-avatar-shell:hover .scheduler-public-profile-avatar-overlay,
.scheduler-public-profile-avatar-shell:focus-within .scheduler-public-profile-avatar-overlay,
.scheduler-public-profile-media-row.is-uploading .scheduler-public-profile-avatar-overlay {
	opacity: 1;
	pointer-events: auto;
}

.scheduler-public-profile-avatar-action {
	width: 32px;
	height: 32px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .72);
	border-radius: 50%;
	background: rgba(255, 255, 255, .94);
	color: #202124;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .16);
	transition: background .15s ease, color .15s ease, transform .15s ease;
}

.scheduler-public-profile-avatar-action:hover {
	background: #ffffff;
	transform: translateY(-1px);
}

.scheduler-public-profile-avatar-action:focus-visible {
	outline: 2px solid rgba(26, 94, 168, .34);
	outline-offset: 2px;
}

.scheduler-public-profile-avatar-action:disabled {
	cursor: default;
	opacity: .7;
	transform: none;
}

.scheduler-public-profile-avatar-action-disabled {
	cursor: default;
	opacity: .72;
}

.scheduler-public-profile-avatar-action-disabled:hover {
	color: #202124;
	transform: none;
}

.scheduler-public-profile-avatar-remove-action:hover {
	color: #b42318;
}

.scheduler-public-profile-avatar-action svg {
	width: 17px;
	height: 17px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.scheduler-public-profile-media-row .scheduler-profile-media-file-input {
	display: none;
}

.scheduler-public-profile-identity-fields {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 14px;
	min-width: 0;
}

.scheduler-public-profile-field .scheduler-profile-field-control {
	margin-top: 6px;
}

.scheduler-public-profile-meeting-list {
	display: flex;
	flex-direction: column;
	border: 1px solid #edf0f3;
	border-radius: 10px;
	overflow: hidden;
}

.scheduler-public-profile-meeting-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 42px;
	gap: 16px;
	align-items: center;
	min-height: 68px;
	padding: 12px 14px;
	border-bottom: 1px solid #edf0f3;
	background: #fff;
	cursor: pointer;
	box-sizing: border-box;
}

.scheduler-public-profile-meeting-row:last-child {
	border-bottom: 0;
}

.scheduler-public-profile-meeting-row:hover {
	background: #fafbfc;
}

.scheduler-public-profile-meeting-row.disabled {
	opacity: .62;
	cursor: default;
}

.scheduler-public-profile-meeting-row.is-saving {
	opacity: .72;
}

.scheduler-public-profile-meeting-copy {
	min-width: 0;
}

.scheduler-public-profile-meeting-name {
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 700;
	color: #202124;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-public-profile-meeting-meta {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
	margin-top: 6px;
}

.scheduler-public-profile-toggle {
	position: relative;
	justify-self: end;
	width: 38px;
	height: 22px;
	margin: 0;
	border: 0;
	border-radius: 999px;
	background: #cfd6df;
	box-shadow: inset 0 0 0 1px rgba(31, 41, 55, .08);
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
	transition: background .16s ease, opacity .16s ease;
}

.scheduler-public-profile-toggle::after {
	content: '';
	position: absolute;
	top: 3px;
	left: 3px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 3px rgba(15, 23, 42, .24);
	transition: transform .16s ease;
}

.scheduler-public-profile-toggle:checked {
	background: #00529b;
}

.scheduler-public-profile-toggle:checked::after {
	transform: translateX(16px);
}

.scheduler-public-profile-toggle:disabled {
	cursor: default;
	opacity: .72;
}

.scheduler-public-profile-preview {
	position: static;
	align-self: start;
	height: calc(100% - 93px);
	margin-top: 69px;
	margin-bottom: 24px;
	max-height: none;
	padding: 0;
	border: 0;
	box-shadow: none;
	background: #f6f7f9;
	overflow: hidden;
}

.scheduler-public-profile-preview-browser {
	height: 100%;
	min-height: 0;
	border: 0;
	border-radius: 12px;
	background: #eef0f3;
	box-shadow: none;
	display: flex;
	flex-direction: column;
}

.scheduler-public-profile-preview-page {
	flex: 1 1 auto;
	min-height: 0;
	margin: 0;
	padding: 24px 18px;
	border: 0;
	border-radius: 0;
	background: #eef0f3;
	box-sizing: border-box;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: rgba(60, 64, 67, .25) transparent;
}

.scheduler-public-profile-preview-page::-webkit-scrollbar {
	width: 8px;
}

.scheduler-public-profile-preview-page::-webkit-scrollbar-track {
	background: transparent;
}

.scheduler-public-profile-preview-page::-webkit-scrollbar-thumb {
	min-height: 44px;
	border: 2px solid transparent;
	border-radius: 999px;
	background: rgba(60, 64, 67, .24);
	background-clip: padding-box;
}

.scheduler-public-profile-preview-identity {
	padding: 20px 16px;
	border-radius: 10px;
	background: #fff;
	border: 1px solid #e4e7eb;
}

.scheduler-public-profile-preview-avatar {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-family: Manrope, sans-serif;
	font-size: 18px;
	font-weight: 700;
}

.scheduler-public-profile-preview-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.scheduler-public-profile-preview-name {
	margin-top: 18px;
	font-family: Manrope, sans-serif;
	font-size: 19px;
	font-weight: 700;
	line-height: 24px;
	color: #111827;
}

.scheduler-public-profile-preview-title {
	margin-top: 4px;
	min-height: 18px;
	font-size: 13px;
	line-height: 18px;
	color: #6b7280;
}

.scheduler-public-profile-preview-card {
	margin-top: 22px;
	border-radius: 10px;
	background: #fff;
	border: 1px solid #e4e7eb;
	overflow: hidden;
}

.scheduler-public-profile-preview-row {
	position: relative;
	min-height: 74px;
	padding: 16px 18px;
	border-bottom: 1px solid #e5e7eb;
	box-sizing: border-box;
}

.scheduler-public-profile-preview-row:last-child {
	border-bottom: 0;
}

.scheduler-public-profile-preview-row-title {
	max-width: calc(100% - 62px);
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 700;
	color: #30343a;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-public-profile-preview-row-description {
	max-width: calc(100% - 62px);
	margin-top: 6px;
	font-size: 13px;
	line-height: 18px;
	color: #6b7280;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-public-profile-preview-duration {
	position: absolute;
	right: 18px;
	bottom: 16px;
	padding: 2px 7px;
	border-radius: 5px;
	background: #eef0f2;
	font-size: 12px;
	font-weight: 700;
	color: #30343a;
}

.scheduler-public-profile-preview-empty {
	padding: 28px 18px;
	text-align: center;
	font-size: 13px;
	color: #6b7280;
}

/* Company Profile: the organisation's booking hub and its opt-in team members. */
.scheduler-public-profile-section-caption {
	margin: -4px 0 12px;
	font-size: 13px;
	line-height: 18px;
	color: #6b7280;
}

/* The logo tile fills the card's content height (a square as tall as the fields beside it). */
.scheduler-company-profile-identity {
	grid-template-columns: var(--scheduler-company-logo-size, 130px) minmax(0, 1fr);
	align-items: stretch;
}

/* The fields column sets the row height; the tile stretches to it without feeding back into it. */
.scheduler-company-profile-identity .scheduler-company-logo-row {
	width: 100%;
	height: 0;
	min-height: 100%;
}

.scheduler-company-profile-identity .scheduler-company-logo-row .scheduler-profile-media-content {
	width: 100%;
	height: 100%;
	align-items: stretch;
}

.scheduler-company-profile-identity .scheduler-company-logo-shell {
	width: 100%;
	height: 100%;
	flex: 1 1 auto;
	border-radius: 18px;
}

.scheduler-company-profile-identity .scheduler-company-logo-shell .scheduler-public-profile-avatar-overlay {
	border-radius: 18px;
}

.scheduler-company-logo-shell .scheduler-company-logo-preview {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	border-radius: 18px;
	overflow: hidden;
	background: #f3f4f6;
	color: #fff;
	font-family: Manrope, sans-serif;
	font-size: 26px;
	font-weight: 700;
}

.scheduler-company-logo-shell .scheduler-company-logo-preview img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
}

.scheduler-company-member-list {
	display: flex;
	flex-direction: column;
	border: 1px solid #edf0f3;
	border-radius: 10px;
	overflow: hidden;
	background: #fff;
}

.scheduler-company-member-row {
	border-bottom: 1px solid #edf0f3;
}

.scheduler-company-member-row:last-child {
	border-bottom: 0;
}

.scheduler-company-member-row.is-saving {
	opacity: .72;
}

.scheduler-company-member-list .ui-sortable-helper,
.scheduler-company-member-row.is-dragging {
	border-bottom: 0;
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 10px 26px rgba(16, 24, 40, .16), 0 0 0 1px rgba(16, 24, 40, .06);
}

.scheduler-company-member-placeholder {
	min-height: 66px;
	margin: 6px 10px;
	border: 1px dashed #c5cfdb;
	border-radius: 10px;
	background: #f6f9fd;
	box-sizing: border-box;
}

.scheduler-company-member-head {
	display: grid;
	grid-template-columns: 24px 40px minmax(0, 1fr) 38px 24px;
	gap: 10px;
	align-items: center;
	min-height: 66px;
	padding: 11px 14px 11px 8px;
	box-sizing: border-box;
}

.scheduler-company-member-row.has-meetings .scheduler-company-member-head {
	cursor: pointer;
}

.scheduler-company-member-row.has-meetings .scheduler-company-member-head:hover {
	background: #fafbfc;
}

/* Grip: a crisp 2x3 dot glyph on a 24x32 hit area. Hidden until a row is on the page. */
.scheduler-company-member-handle {
	--scheduler-grip-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='16' viewBox='0 0 10 16'%3E%3Ccircle cx='2.5' cy='2.5' r='1.6'/%3E%3Ccircle cx='7.5' cy='2.5' r='1.6'/%3E%3Ccircle cx='2.5' cy='8' r='1.6'/%3E%3Ccircle cx='7.5' cy='8' r='1.6'/%3E%3Ccircle cx='2.5' cy='13.5' r='1.6'/%3E%3Ccircle cx='7.5' cy='13.5' r='1.6'/%3E%3C/svg%3E");
	position: relative;
	display: block;
	width: 24px;
	height: 32px;
	border-radius: 6px;
	opacity: 0;
	pointer-events: none;
	transition: opacity .14s ease, background-color .14s ease;
}

.scheduler-company-member-handle::before {
	content: "";
	position: absolute;
	top: 8px;
	left: 7px;
	width: 10px;
	height: 16px;
	background-color: #aeb7c3;
	-webkit-mask-image: var(--scheduler-grip-icon);
	mask-image: var(--scheduler-grip-icon);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	transition: background-color .14s ease;
}

.scheduler-company-member-row.is-enabled .scheduler-company-member-handle {
	opacity: .7;
	pointer-events: auto;
	cursor: grab;
}

.scheduler-company-member-row.is-enabled .scheduler-company-member-head:hover .scheduler-company-member-handle {
	opacity: 1;
}

.scheduler-company-member-row.is-enabled .scheduler-company-member-handle:hover {
	background-color: #eef1f5;
}

.scheduler-company-member-row.is-enabled .scheduler-company-member-handle:hover::before {
	background-color: #4b5563;
}

.scheduler-company-member-list .ui-sortable-helper .scheduler-company-member-handle,
.scheduler-company-member-row.is-dragging .scheduler-company-member-handle {
	opacity: 1;
	background-color: #e6ebf2;
	cursor: grabbing;
}

.scheduler-company-member-list .ui-sortable-helper .scheduler-company-member-handle::before,
.scheduler-company-member-row.is-dragging .scheduler-company-member-handle::before {
	background-color: #1f2732;
}

.scheduler-company-member-avatar {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	overflow: hidden;
	color: #fff;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 700;
}

.scheduler-company-member-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.scheduler-company-member-copy {
	min-width: 0;
}

.scheduler-company-member-name {
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 700;
	color: #202124;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-company-member-row:not(.is-enabled) .scheduler-company-member-name {
	color: #4b5563;
}

.scheduler-company-member-title {
	margin-top: 3px;
	font-size: 13px;
	line-height: 18px;
	color: #6b7280;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-company-member-expand {
	width: 24px;
	height: 24px;
	padding: 0;
	border: 0;
	border-radius: 6px;
	background: transparent;
	position: relative;
	cursor: pointer;
}

.scheduler-company-member-expand::before {
	content: "";
	position: absolute;
	top: 7px;
	left: 8px;
	width: 7px;
	height: 7px;
	border-right: 2px solid #6b7280;
	border-bottom: 2px solid #6b7280;
	transform: rotate(45deg);
	transition: transform .16s ease;
}

.scheduler-company-member-row.is-expanded .scheduler-company-member-expand::before {
	top: 10px;
	transform: rotate(-135deg);
}

/* Left edge under the avatar: head padding (8) + handle column (24) + gap (10). */
.scheduler-company-member-meetings.scheduler-public-profile-meeting-list {
	margin: 0 14px 14px 42px;
	border-radius: 8px;
}

/* Preview: the hub as the visitor sees it. */
.scheduler-company-preview-header {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px;
	border-radius: 10px;
	background: #fff;
	border: 1px solid #e4e7eb;
}

.scheduler-company-preview-logo {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 48px;
	height: 48px;
	border-radius: 12px;
	overflow: hidden;
	background: #f3f4f6;
	color: #fff;
	font-family: Manrope, sans-serif;
	font-size: 16px;
	font-weight: 700;
}

.scheduler-company-preview-logo img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
}

.scheduler-company-preview-header-copy {
	min-width: 0;
}

.scheduler-company-preview-name {
	font-family: Manrope, sans-serif;
	font-size: 17px;
	font-weight: 700;
	line-height: 22px;
	color: #111827;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-company-preview-intro {
	margin-top: 2px;
	font-size: 12px;
	line-height: 16px;
	color: #6b7280;
}

.scheduler-company-preview-body {
	margin-top: 20px;
}

.scheduler-company-preview-step-title {
	padding: 13px 16px;
	border-bottom: 1px solid #e5e7eb;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	font-weight: 700;
	color: #373b43;
}

.scheduler-company-preview-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	padding: 12px;
}

.scheduler-company-preview-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	padding: 16px 10px 14px;
	border: 1px solid #e4e7eb;
	border-radius: 10px;
	background: #fff;
	font: inherit;
	text-align: center;
	cursor: pointer;
	transition: box-shadow .16s ease, border-color .16s ease, transform .16s ease;
}

.scheduler-company-preview-card:hover {
	border-color: #c5ccd6;
	box-shadow: 0 4px 14px rgba(15, 23, 42, .08);
	transform: translateY(-1px);
}

.scheduler-company-preview-card-avatar {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	margin-bottom: 6px;
	border-radius: 50%;
	overflow: hidden;
	color: #fff;
	font-family: Manrope, sans-serif;
	font-size: 15px;
	font-weight: 700;
}

.scheduler-company-preview-card-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.scheduler-company-preview-card-name {
	max-width: 100%;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	font-weight: 700;
	line-height: 18px;
	color: #202124;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-company-preview-card-title {
	max-width: 100%;
	min-height: 16px;
	font-size: 12px;
	line-height: 16px;
	color: #6b7280;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-company-preview-member {
	margin-top: 20px;
}

.scheduler-company-preview-back {
	display: flex;
	align-items: center;
	gap: 6px;
	width: 100%;
	padding: 9px 14px;
	border: 0;
	border-bottom: 1px solid #e5e7eb;
	background: #fafbfc;
	font: inherit;
	font-size: 12px;
	font-weight: 700;
	color: #6b7280;
	text-align: left;
	cursor: pointer;
	transition: color .14s ease;
}

.scheduler-company-preview-back:hover {
	color: #373b43;
}

.scheduler-company-preview-back svg {
	width: 14px;
	height: 14px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2.2;
	stroke-linecap: round;
	stroke-linejoin: round;
	flex: 0 0 auto;
}

.scheduler-company-preview-person {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	border-bottom: 1px solid #e5e7eb;
	text-align: left;
}

.scheduler-company-preview-person .scheduler-company-preview-card-avatar {
	margin-bottom: 0;
}

.scheduler-company-preview-person .scheduler-company-preview-card-name {
	font-size: 15px;
	line-height: 20px;
}

.scheduler-filter-pill {
	padding: 8px 12px;
	border: 1px solid #dadce0;
	border-radius: 9px;
	background: #f1f3f4;
	color: #3c4043;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
}

.scheduler-filter-pill:hover {
	background: #e9ecef;
	color: #202124;
}

.scheduler-filter-pill.active {
	background: #fff;
	color: #202124;
	border-color: #cfd5dc;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .06);
}

.scheduler-filter-pill.active:hover {
	background: #fff;
	color: #202124;
}

.scheduler-list {
	display: flex;
	flex-direction: column;
	border: 1px solid #e1e4e8;
	border-radius: 12px;
	background: #fff;
	overflow: hidden;
}

.scheduler-bookings-list {
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: thin;
	scrollbar-color: rgba(60, 64, 67, .28) transparent;
}

.scheduler-bookings-list::-webkit-scrollbar {
	width: 9px;
	height: 9px;
}

.scheduler-bookings-list::-webkit-scrollbar-track {
	background: transparent;
}

.scheduler-bookings-list::-webkit-scrollbar-thumb {
	min-height: 44px;
	border: 2px solid transparent;
	border-radius: 999px;
	background: rgba(60, 64, 67, .26);
	background-clip: padding-box;
}

.scheduler-bookings-list::-webkit-scrollbar-thumb:hover {
	background: rgba(60, 64, 67, .42);
	background-clip: padding-box;
}

.scheduler-meeting-list {
	gap: 12px;
	border: 0;
	border-radius: 0;
	background: transparent;
	overflow: visible;
}

.scheduler-meeting-row,
.scheduler-booking-row {
	display: flex;
	align-items: center;
	gap: 18px;
	min-height: 86px;
	padding: 16px 18px;
	box-sizing: border-box;
}

.scheduler-meeting-row {
	border: 1px solid #e1e4e8;
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
	cursor: pointer;
}

.scheduler-booking-row {
	border-bottom: 1px solid #edf0f2;
	cursor: pointer;
}

.scheduler-booking-row:last-child {
	border-bottom: 0;
}

.scheduler-meeting-row:hover {
	border-color: #cfd5dc;
	background: #fff;
	box-shadow: 0 3px 8px rgba(0, 0, 0, .06);
}

.scheduler-meeting-row.scheduler-row-busy {
	opacity: .68;
	pointer-events: none;
}

.scheduler-booking-row:hover {
	background: #fafafa;
}

.scheduler-meeting-main,
.scheduler-booking-details {
	flex: 1;
	min-width: 0;
}

.scheduler-row-title {
	font-size: 14px;
	line-height: 22px;
	font-weight: 600;
	color: #202124;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-row-meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 7px;
}

.scheduler-chip {
	display: inline-flex;
	align-items: center;
	max-width: 260px;
	min-height: 22px;
	padding: 3px 7px;
	border-radius: 6px;
	background: #f1f3f4;
	color: #3c4043;
	font-size: 12px;
	line-height: 16px;
	font-weight: 500;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	box-sizing: border-box;
}

.scheduler-participant-chip {
	gap: 5px;
	padding-left: 4px;
}

.scheduler-participant-chip-avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	flex: 0 0 16px;
	border-radius: 50%;
	overflow: hidden;
	color: #fff;
	font-size: 8px;
	font-weight: 700;
	line-height: 1;
	text-transform: uppercase;
}

.scheduler-participant-chip-avatar img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
}

.scheduler-participant-chip-name {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-row-preview {
	margin-top: 7px;
	max-width: 720px;
	color: #5f6368;
	font-size: 13px;
	line-height: 19px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-row-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	flex-shrink: 0;
	min-width: 88px;
}

.scheduler-meeting-actions {
	gap: 10px;
	min-width: 146px;
}

.scheduler-meeting-action-buttons {
	display: flex;
	align-items: center;
	gap: 0;
}

.scheduler-meeting-activation-toggle {
	flex: 0 0 40px;
}

.scheduler-icon-action {
	position: relative;
	min-width: 36px;
	min-height: 34px;
	padding: 7px 10px;
	border: 1px solid #dadce0;
	border-radius: 8px;
	background: #fff;
	color: #3c4043;
	font-family: Manrope, sans-serif;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	box-sizing: border-box;
	transition: background-color .15s ease, color .15s ease;
}

.scheduler-meeting-actions .scheduler-icon-action {
	width: 32px;
	height: 32px;
	min-width: 32px;
	min-height: 32px;
	padding: 0;
	border-radius: 0;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}

.scheduler-meeting-actions .scheduler-icon-action + .scheduler-icon-action {
	margin-left: -1px;
}

.scheduler-meeting-actions .scheduler-icon-action:first-child {
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
}

.scheduler-meeting-actions .scheduler-icon-action:last-child {
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
}

.scheduler-icon-action:hover {
	background-color: #f1f3f4;
}

.scheduler-preview-action,
.scheduler-copy-action,
.scheduler-more-action {
	background-position: center;
	background-repeat: no-repeat;
}

.scheduler-preview-action {
	background-image: url("/images/popups/open_external_icon.svg");
	background-size: 13px 13px;
}

.scheduler-copy-action {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #292f33;
	background-image: none;
}

.scheduler-copy-action::before {
	content: "";
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: url("/images/icons/x-sched/link-icon.svg") center / contain no-repeat;
	mask: url("/images/icons/x-sched/link-icon.svg") center / contain no-repeat;
}

.scheduler-copy-action.scheduler-copy-confirmed,
.scheduler-copy-action.scheduler-copy-confirmed:hover {
	color: #188038;
	background-color: #e6f4ea;
}

.scheduler-more-action {
	background-image: url("/images/icons/x-sched/horizontal-dots-icon.svg");
	background-size: 17px 17px;
}

.scheduler-booking-date {
	width: 190px;
	flex-shrink: 0;
	padding-left: 6px;
	box-sizing: border-box;
}

.scheduler-booking-day {
	font-size: 14px;
	line-height: 22px;
	font-weight: 600;
	color: #202124;
}

.scheduler-booking-time,
.scheduler-booking-location {
	margin-top: 2px;
	font-size: 13px;
	line-height: 18px;
	color: #5f6368;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-loading,
.scheduler-empty-state {
	padding: 34px 28px;
	color: #5f6368;
	font-size: 14px;
	line-height: 22px;
}

.scheduler-empty-title {
	font-size: 16px;
	line-height: 24px;
	font-weight: 700;
	color: #202124;
}

.scheduler-empty-message {
	margin-top: 4px;
	max-width: 440px;
	color: #5f6368;
}

.scheduler-editor {
	display: flex;
	flex-direction: column;
	gap: 14px;
	min-height: 100%;
	height: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.scheduler-editor-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	padding: 0 0 12px 0;
	border-bottom: 1px solid #e1e4e8;
}

.scheduler-editor-title-group {
	display: flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
}

.scheduler-editor-back {
	flex-shrink: 0;
	min-height: 32px;
	padding: 7px 11px;
	border: 1px solid #dadce0;
	border-radius: 8px;
	background: #fff;
	color: #3c4043;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
}

.scheduler-editor-back:hover {
	background: #f8f9fa;
}

.scheduler-editor-title-copy {
	min-width: 0;
}

.scheduler-editor-title {
	margin: 0;
	max-width: 560px;
	font-size: 20px;
	line-height: 28px;
	font-weight: 700;
	color: #202124;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-editor-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	flex-shrink: 0;
}

.scheduler-editor-activation-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 32px;
	width: 40px;
	margin: 0;
	cursor: pointer;
}

.scheduler-editor-activation-toggle.is-saving {
	opacity: .58;
	cursor: default;
}

.scheduler-editor-activation-input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
	pointer-events: none;
}

.scheduler-editor-activation-track {
	position: relative;
	display: inline-flex;
	align-items: center;
	width: 36px;
	height: 22px;
	flex: 0 0 36px;
	border: 1px solid #d1d9e5;
	border-radius: 999px;
	background: #e9eef5;
	box-shadow: inset 0 1px 2px rgba(31, 41, 55, .08);
	transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.scheduler-editor-activation-thumb {
	position: absolute;
	left: 2px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 4px rgba(15, 23, 42, .22);
	transition: transform .16s ease;
}

.scheduler-editor-activation-input:checked + .scheduler-editor-activation-track {
	border-color: #00529B;
	background: #00529B;
	box-shadow: inset 0 1px 2px rgba(0, 61, 115, .18);
}

.scheduler-editor-activation-input:checked + .scheduler-editor-activation-track .scheduler-editor-activation-thumb {
	transform: translateX(14px);
}

.scheduler-editor-activation-input:focus-visible + .scheduler-editor-activation-track {
	box-shadow: 0 0 0 3px rgba(68, 115, 202, .18), inset 0 1px 2px rgba(31, 41, 55, .08);
}

.scheduler-editor-action-divider {
	width: 2px;
	height: 22px;
	margin: 0 8px 0 8px;
	border-radius: 999px;
	background: #a8b0bd;
	flex: 0 0 2px;
}

.scheduler-editor-unsaved-indicator {
	display: none;
	align-items: center;
	gap: 6px;
	min-height: 32px;
	padding: 0 4px 0 0;
	color: #5f6368;
	font-family: Manrope, sans-serif;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	white-space: nowrap;
}

.scheduler-editor-unsaved-indicator.active {
	display: inline-flex;
}

.scheduler-editor-unsaved-dot {
	width: 7px;
	height: 7px;
	border-radius: 999px;
	background: #c27b00;
	box-shadow: 0 0 0 3px rgba(194, 123, 0, .13);
}

.scheduler-editor-actions .scheduler-icon-action {
	width: 36px;
	height: 36px;
	min-width: 36px;
	min-height: 36px;
	padding: 0;
	border-radius: 8px;
}

.scheduler-editor-actions .scheduler-icon-action:disabled {
	opacity: .42;
	cursor: default;
}

.scheduler-secondary-action {
	min-height: 36px;
	padding: 8px 14px;
	border: 1px solid #dadce0;
	border-radius: 8px;
	background: #fff;
	color: #3c4043;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	box-sizing: border-box;
}

.scheduler-secondary-action:hover {
	background: #f8f9fa;
}

.scheduler-secondary-action:disabled,
.scheduler-primary-action:disabled {
	opacity: .58;
	cursor: default;
}

.scheduler-editor-body {
	position: relative;
	display: flex;
	gap: 24px;
	flex: 1;
	min-height: 0;
	overflow: hidden;
}

.scheduler-editor-rail {
	position: sticky;
	top: 0;
	width: 256px;
	min-width: 256px;
	max-height: 100%;
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
	overflow-y: auto;
	padding-right: 2px;
	box-sizing: border-box;
}

.scheduler-editor-rail-item {
	width: 100%;
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 10px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	color: #3c4043;
	font-family: Manrope, sans-serif;
	text-align: left;
	cursor: pointer;
	box-sizing: border-box;
}

.scheduler-editor-rail-item:hover {
	background: #e8eaed;
}

.scheduler-editor-rail-item.active {
	background: #fff;
	color: #202124;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
}

.scheduler-editor-rail-item.disabled {
	opacity: .55;
	cursor: default;
}

.scheduler-editor-rail-icon {
	margin-top: 1px;
}

.scheduler-editor-icon-basics,
.scheduler-editor-icon-profile-new,
.scheduler-editor-icon-limits,
.scheduler-editor-icon-questions-new,
.scheduler-editor-icon-availability,
.scheduler-editor-icon-reminders,
.scheduler-editor-icon-appointments {
	background-color: currentColor;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.scheduler-editor-icon-basics {
	-webkit-mask-image: url('/images/icons/x-sched/editor-basics.svg');
	mask-image: url('/images/icons/x-sched/editor-basics.svg');
}

.scheduler-editor-icon-profile-new {
	-webkit-mask-image: url('/images/icons/x-sched/editor-profile.svg');
	mask-image: url('/images/icons/x-sched/editor-profile.svg');
}

.scheduler-editor-icon-limits {
	-webkit-mask-image: url('/images/icons/x-sched/editor-limits.svg');
	mask-image: url('/images/icons/x-sched/editor-limits.svg');
}

.scheduler-editor-icon-availability {
	-webkit-mask-image: url('/images/icons/x-sched/editor-availability.svg');
	mask-image: url('/images/icons/x-sched/editor-availability.svg');
}

.scheduler-editor-icon-questions-new {
	-webkit-mask-image: url('/images/icons/x-sched/editor-questions.svg');
	mask-image: url('/images/icons/x-sched/editor-questions.svg');
}

.scheduler-editor-icon-reminders {
	-webkit-mask-image: url('/images/icons/x-sched/editor-reminders.svg');
	mask-image: url('/images/icons/x-sched/editor-reminders.svg');
}

.scheduler-editor-icon-appointments {
	-webkit-mask-image: url('/images/icons/x-sched/editor-appointments.svg');
	mask-image: url('/images/icons/x-sched/editor-appointments.svg');
}

.scheduler-editor-icon-profile::before,
.scheduler-editor-icon-reminder::before,
.scheduler-editor-icon-advanced::before,
.scheduler-editor-icon-questions::before,
.scheduler-editor-icon-appointments-legacy::before {
	content: "";
	position: absolute;
	box-sizing: border-box;
}

.scheduler-editor-icon-profile::before {
	left: 4px;
	top: 3px;
	width: 10px;
	height: 10px;
	border: 2px solid currentColor;
	border-radius: 50%;
}

.scheduler-editor-icon-profile::after {
	content: "";
	position: absolute;
	left: 1px;
	bottom: 1px;
	width: 16px;
	height: 8px;
	border: 2px solid currentColor;
	border-radius: 10px 10px 4px 4px;
	box-sizing: border-box;
}

.scheduler-editor-icon-reminder::before {
	left: 3px;
	top: 2px;
	width: 12px;
	height: 14px;
	border: 2px solid currentColor;
	border-radius: 3px;
}

.scheduler-editor-icon-reminder::after {
	content: "";
	position: absolute;
	left: 6px;
	top: 6px;
	width: 6px;
	height: 2px;
	background: currentColor;
	box-shadow: 0 4px 0 currentColor;
}

.scheduler-editor-icon-advanced::before {
	left: 2px;
	top: 3px;
	width: 14px;
	height: 12px;
	border: 2px solid currentColor;
	border-radius: 4px;
}

.scheduler-editor-icon-advanced::after {
	content: "";
	position: absolute;
	left: 6px;
	top: 0;
	width: 6px;
	height: 18px;
	border-left: 2px solid currentColor;
	border-right: 2px solid currentColor;
}

.scheduler-editor-icon-questions::before {
	left: 2px;
	top: 2px;
	width: 14px;
	height: 14px;
	border: 2px solid currentColor;
	border-radius: 50%;
}

.scheduler-editor-icon-questions::after {
	content: "?";
	position: absolute;
	left: 0;
	top: 1px;
	width: 18px;
	color: currentColor;
	font-size: 12px;
	line-height: 18px;
	font-weight: 700;
	text-align: center;
}

.scheduler-editor-icon-appointments-legacy::before {
	left: 2px;
	top: 3px;
	width: 14px;
	height: 13px;
	border: 2px solid currentColor;
	border-radius: 3px;
}

.scheduler-editor-icon-appointments-legacy::after {
	content: "";
	position: absolute;
	left: 5px;
	top: 7px;
	width: 8px;
	height: 2px;
	background: currentColor;
	box-shadow: 0 4px 0 currentColor;
}

.scheduler-editor-rail-copy {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.scheduler-editor-rail-title {
	font-size: 14px;
	line-height: 18px;
	font-weight: 700;
	color: inherit;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-editor-rail-summary {
	margin-top: 3px;
	font-size: 12px;
	line-height: 16px;
	font-weight: 500;
	color: #5f6368;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-editor-detail {
	flex: 1;
	min-width: 0;
	min-height: 0;
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
	padding-bottom: 36px;
	box-sizing: border-box;
	scrollbar-width: none;
	-ms-overflow-style: none;
	container-type: inline-size;
}

.scheduler-editor-detail::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}

.scheduler-editor-pane {
	display: none;
}

.scheduler-editor-pane.active {
	display: block;
}

.scheduler-editor-pane-heading {
	margin-bottom: 14px;
}

.scheduler-editor-pane-heading h3 {
	margin: 0;
	font-size: 18px;
	line-height: 26px;
	font-weight: 700;
	color: #202124;
}

.scheduler-editor-pane-description {
	margin-top: 3px;
	max-width: 720px;
	font-size: 13px;
	line-height: 20px;
	color: #5f6368;
}

.scheduler-editor-url-card,
.scheduler-editor-field-table,
.scheduler-editor-reminders,
.scheduler-editor-pane .extern_sched_activities_area {
	width: 100%;
	margin: 0 0 14px 0;
	border: 1px solid #e1e4e8;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .035);
	box-sizing: border-box;
	overflow: hidden;
}

.scheduler-editor-url-card {
	padding: 12px 14px;
}

.scheduler-editor-url-label {
	margin-bottom: 6px;
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
	color: #202124;
}

.scheduler-editor-url-line {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 34px;
	padding: 6px 8px 6px 10px;
	border: 1px solid #dadce0;
	border-radius: 8px;
	background: #fff;
	box-sizing: border-box;
}

.scheduler-editor-url-line.disabled {
	background: #f8f9fa;
	color: #80868b;
}

.scheduler-editor-url-text {
	min-width: 0;
	flex: 1;
	color: #1967d2;
	font-size: 13px;
	line-height: 18px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-editor-url-line.disabled .scheduler-editor-url-text {
	color: #80868b;
}

.scheduler-basics-layout {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.scheduler-editor-section-group {
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
	min-width: 0;
}

.scheduler-basics-section {
	width: 100%;
	border: 1px solid #e1e4e8;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .035);
	box-sizing: border-box;
	padding: 16px;
	overflow: hidden;
}

.scheduler-basics-section-heading {
	margin: 0;
	padding: 0;
	border-bottom: 0;
	background: transparent;
}

.scheduler-basics-section-heading h4,
.scheduler-limits-section-heading h4,
.scheduler-availability-card-heading h4,
.scheduler-profile-card-heading h4,
.scheduler-reminders-title {
	margin: 0;
	color: #1f2937;
	font-size: 14px;
	line-height: 18px;
	font-weight: 700;
	letter-spacing: 0;
}

.scheduler-basics-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 14px 16px;
	padding: 0;
	box-sizing: border-box;
}

.scheduler-basics-grid-identity {
	grid-template-columns: minmax(0, 1fr) 180px;
	align-items: start;
}

.scheduler-basics-grid-event-details {
	grid-template-columns: minmax(0, 1fr);
}

.scheduler-basics-grid-booking-details {
	grid-template-columns: 180px minmax(0, 1fr) minmax(0, 1fr);
	align-items: start;
}

.scheduler-basics-grid-location {
	grid-template-columns: minmax(0, 1fr);
}

.scheduler-limits-layout {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.scheduler-limits-section {
	width: 100%;
	border: 1px solid #e3e5ea;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(20, 31, 55, .04);
	box-sizing: border-box;
	padding: 16px;
	overflow: hidden;
}

.scheduler-limits-accordion {
	padding: 0;
}

.scheduler-limits-accordion-header {
	display: grid;
	grid-template-columns: 32px minmax(0, 1fr) auto 18px;
	align-items: center;
	gap: 12px;
	width: 100%;
	padding: 15px 16px;
	border: 0;
	background: #fff;
	color: inherit;
	font-family: Manrope, sans-serif;
	text-align: left;
	cursor: pointer;
	box-sizing: border-box;
	transition: background-color .14s ease;
}

.scheduler-limits-accordion-header:hover {
	background: #fafbfc;
}

.scheduler-limits-accordion-header:focus-visible {
	outline: none;
	box-shadow: inset 0 0 0 3px rgba(11, 102, 178, 0.14);
}

.scheduler-limits-accordion-icon {
	display: block;
	align-self: stretch;
	width: 32px;
	min-height: 39px;
	border-radius: 9px;
	background-image: url('/images/icons/x-sched/advanced-icon.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 28px 28px;
	opacity: .72;
}

.scheduler-limits-accordion-copy {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.scheduler-limits-accordion-title {
	color: #202124;
	font-size: 13px;
	font-weight: 700;
	line-height: 19px;
}

.scheduler-limits-accordion-description {
	margin-top: 2px;
	color: #5f6368;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
}

.scheduler-limits-accordion-summary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 24px;
	padding: 0 9px;
	border-radius: 999px;
	background: #f2f4f7;
	color: #5f6368;
	font-size: 11px;
	font-weight: 700;
	line-height: 16px;
	white-space: nowrap;
}

.scheduler-limits-accordion-summary.has-active-rules {
	background: #e8f1fb;
	color: #0b579a;
}

.scheduler-limits-accordion-chevron {
	width: 8px;
	height: 8px;
	border-right: 2px solid #7b8490;
	border-bottom: 2px solid #7b8490;
	transform: rotate(45deg);
	transform-origin: center;
	transition: transform .14s ease;
}

.scheduler-limits-accordion.is-open .scheduler-limits-accordion-chevron {
	transform: rotate(225deg);
}

.scheduler-limits-accordion-panel {
	max-height: 0;
	overflow: hidden;
	border-top: 1px solid transparent;
	opacity: 0;
	visibility: hidden;
	transition: max-height .18s ease, opacity .14s ease, visibility 0s linear .18s, border-color .14s ease;
}

.scheduler-limits-accordion.is-open .scheduler-limits-accordion-panel {
	max-height: 720px;
	border-top-color: #edf0f2;
	opacity: 1;
	visibility: visible;
	transition: max-height .18s ease, opacity .14s ease, border-color .14s ease;
}

.scheduler-limits-accordion .scheduler-limits-rule-list {
	margin: 0;
}

.scheduler-limits-section-heading {
	margin: 0;
	padding: 0;
	border-bottom: 0;
	background: transparent;
}

.scheduler-limits-rule-list {
	display: flex;
	flex-direction: column;
	margin: -16px -16px -16px;
}

.scheduler-limits-rule {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 10px 16px;
	padding: 15px 16px;
	border-top: 1px solid #edf0f2;
	background: #fff;
	box-sizing: border-box;
	transition: background-color 0.16s ease;
}

.scheduler-limits-rule:first-child {
	border-top: 0;
}

.scheduler-limits-rule-copy {
	min-width: 0;
}

.scheduler-limits-rule-title {
	color: #202124;
	font-size: 13px;
	line-height: 19px;
	font-weight: 700;
}

.scheduler-limits-rule-description {
	margin-top: 2px;
	color: #5f6368;
	font-size: 12px;
	line-height: 18px;
}

.scheduler-limits-rule-actions {
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
}

.scheduler-limits-toggle {
	position: relative;
	display: inline-flex;
	width: 34px;
	height: 20px;
	cursor: pointer;
}

.scheduler-limits-toggle-input {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.scheduler-limits-toggle-track {
	position: relative;
	width: 34px;
	height: 20px;
	border-radius: 999px;
	background: #d9e2ef;
	box-shadow: inset 0 0 0 1px rgba(62, 82, 112, 0.18);
	transition: background-color 0.16s ease, box-shadow 0.16s ease;
}

.scheduler-limits-toggle-thumb {
	position: absolute;
	top: 3px;
	left: 3px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: #ffffff;
	box-shadow: 0 1px 4px rgba(24, 42, 62, 0.2);
	transition: transform 0.16s ease;
}

.scheduler-limits-toggle-input:checked + .scheduler-limits-toggle-track {
	background: #0b66b2;
	box-shadow: inset 0 0 0 1px rgba(11, 102, 178, 0.2);
}

.scheduler-limits-toggle-input:checked + .scheduler-limits-toggle-track .scheduler-limits-toggle-thumb {
	transform: translateX(14px);
}

.scheduler-limits-toggle-input:focus-visible + .scheduler-limits-toggle-track {
	box-shadow: 0 0 0 3px rgba(11, 102, 178, 0.18), inset 0 0 0 1px rgba(11, 102, 178, 0.2);
}

.scheduler-limits-rule-control {
	grid-column: 1 / -1;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
}

.scheduler-limits-native-control,
.scheduler-limits-notice-control {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
}

.scheduler-limits-native-control input[type="text"],
.scheduler-limits-native-control input[type="number"],
.scheduler-limits-native-control select,
.scheduler-limits-notice-control input,
.scheduler-limits-notice-control select {
	height: 34px;
	max-width: 100%;
	border: 1px solid #d4dae3;
	border-radius: 7px;
	background: #fff;
	color: #202124;
	font-size: 13px;
	box-sizing: border-box;
}

.scheduler-limits-native-control input[type="text"],
.scheduler-limits-native-control input[type="number"],
.scheduler-limits-notice-control input {
	width: 150px;
	padding: 6px 8px;
}

.scheduler-limits-native-control select,
.scheduler-limits-notice-control select {
	min-width: 128px;
	padding: 6px 8px;
}

.scheduler-limits-native-control input:focus,
.scheduler-limits-native-control select:focus,
.scheduler-limits-notice-control input:focus,
.scheduler-limits-notice-control select:focus {
	border-color: #0b66b2;
	box-shadow: 0 0 0 3px rgba(11, 102, 178, 0.12);
	outline: none;
}

.scheduler-limits-unit {
	color: #5f6368;
	font-size: 12px;
	line-height: 18px;
}

.scheduler-basics-field {
	min-width: 0;
}

.scheduler-basics-field-wide {
	grid-column: 1 / -1;
}

.scheduler-basics-field-label {
	margin-bottom: 6px;
	color: #202124;
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
}

.scheduler-basics-field-label label {
	color: inherit;
	font-size: inherit;
	line-height: inherit;
	font-weight: inherit;
}

.scheduler-basics-field-no-label .scheduler-basics-field-label {
	display: none;
}

.scheduler-basics-field-control {
	min-width: 0;
}

.scheduler-basics-field-control input[type="text"],
.scheduler-basics-field-control input[type="number"],
.scheduler-basics-field-control textarea,
.scheduler-basics-field-control select {
	width: 100%;
	max-width: 100%;
	min-height: 34px;
	padding: 7px 10px;
	border: 1px solid #cfd4da;
	border-radius: 7px;
	background: #fff;
	color: #202124;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	line-height: 18px;
	box-sizing: border-box;
	outline: none;
}

.scheduler-basics-field-control input[type="text"]:focus,
.scheduler-basics-field-control input[type="number"]:focus,
.scheduler-basics-field-control textarea:focus,
.scheduler-basics-field-control select:focus {
	border-color: #1a5ea8;
	box-shadow: 0 0 0 2px rgba(26, 94, 168, .12);
}

.scheduler-basics-field-compact .scheduler-basics-field-control select,
.scheduler-basics-field-compact .scheduler-basics-field-control input {
	max-width: 180px;
}

.scheduler-duration-control {
	display: inline-flex;
	align-items: center;
	width: 180px;
	max-width: 100%;
	min-height: 34px;
	border: 1px solid #cfd4da;
	border-radius: 7px;
	background: #fff;
	box-sizing: border-box;
	overflow: hidden;
}

.scheduler-duration-control:focus-within {
	border-color: #1a5ea8;
	box-shadow: 0 0 0 2px rgba(26, 94, 168, .12);
}

.scheduler-basics-field-control input[type="number"].scheduler-duration-number {
	width: 78px;
	min-height: 32px;
	padding: 7px 8px 7px 10px;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	background: transparent;
	font-weight: 700;
}

.scheduler-basics-field-control input[type="number"].scheduler-duration-number:focus {
	border: 0;
	box-shadow: none;
}

.scheduler-duration-unit {
	padding: 0 10px 0 2px;
	color: #5f6368;
	font-size: 13px;
	line-height: 18px;
	white-space: nowrap;
}

.scheduler-location-field-upgraded {
	grid-column: span 2;
}

.scheduler-location-hidden-field {
	display: none !important;
}

.scheduler-location-selector {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.scheduler-location-selected {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 48px;
	padding: 8px;
	border: 1px solid #d6dbe1;
	border-radius: 7px;
	background: #fff;
	box-sizing: border-box;
	cursor: pointer;
}

.scheduler-location-selected:hover {
	border-color: #b9c1cb;
	background: #fbfcfd;
}

.scheduler-location-icon,
.scheduler-location-option-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 6px;
	background: #eef2f6;
	color: #3f4a56;
	font-size: 16px;
	line-height: 1;
	font-weight: 700;
	flex-shrink: 0;
}

.scheduler-location-icon-zoom {
	background-color: transparent;
	background-image: url('/images/icons/x-sched/location-zoom.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: 36px 36px;
	color: transparent;
	font-size: 0;
}

.scheduler-location-selected-text {
	min-width: 0;
	flex: 1 1 auto;
}

.scheduler-location-title {
	display: flex;
	align-items: center;
	gap: 4px;
	min-width: 0;
	color: #202124;
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
}

.scheduler-location-title-text,
.scheduler-location-zoom-email {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.scheduler-location-zoom-email {
	color: #4b5563;
}

.scheduler-location-zoom-status-dot {
	width: 7px;
	height: 7px;
	border-radius: 999px;
	background: #20a464;
	box-shadow: 0 0 0 2px #e8f7ef;
	flex: 0 0 auto;
}

.scheduler-location-detail {
	margin-top: 1px;
	color: #6b7280;
	font-size: 12px;
	line-height: 17px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.scheduler-location-actions {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.scheduler-location-change,
.scheduler-location-remove,
.scheduler-location-connect-zoom,
.scheduler-location-disconnect-zoom,
.scheduler-location-settings {
	height: 28px;
	padding: 0 10px;
	border: 1px solid #d6dbe1;
	border-radius: 7px;
	background: #fff;
	color: #202124;
	font-family: Manrope, sans-serif;
	font-size: 12px;
	line-height: 26px;
	font-weight: 700;
	cursor: pointer;
}

.scheduler-location-change:hover,
.scheduler-location-remove:hover,
.scheduler-location-connect-zoom:hover,
.scheduler-location-disconnect-zoom:hover,
.scheduler-location-settings:hover {
	background: #f3f5f7;
	border-color: #b9c1cb;
}

.scheduler-location-connect-zoom {
	color: #fff;
	white-space: nowrap;
}

.scheduler-location-connect-zoom:disabled {
	opacity: 0.72;
	cursor: default;
}

.scheduler-location-remove {
	color: #8a2b20;
}

.scheduler-location-settings {
	width: 28px;
	padding: 0;
	border-color: transparent;
	background-color: transparent;
	background-image: url('/images/icons/x-sched/zoom-settings-icon.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 18px 18px;
	color: transparent;
	font-size: 0;
	line-height: 26px;
	transition: opacity .12s ease, transform .12s ease;
}

.scheduler-location-settings:hover {
	border-color: transparent;
	background-color: transparent;
	background-image: url('/images/icons/x-sched/zoom-settings-icon.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 18px 18px;
	opacity: .9;
	transform: translateY(-1px);
}

.scheduler-location-disconnect-zoom {
	color: #8a2b20;
	border-color: #f0c2bb;
	background: #fff8f7;
	white-space: nowrap;
}

.scheduler-location-disconnect-zoom:hover {
	background: #fff0ee;
	border-color: #d89a91;
}

.scheduler-location-selector.zoom-disconnected .scheduler-location-detail {
	color: #8a2b20;
	white-space: normal;
}

.scheduler-basics-field-control input[type="text"].scheduler-location-detail-input {
	display: none;
}

.scheduler-location-selector.requires-detail input[type="text"].scheduler-location-detail-input {
	display: block;
}

.appointment-location-selector input[type="text"].scheduler-location-detail-input {
	display: none;
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
	height: 27px;
	padding: 0 8px;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-sizing: border-box;
	color: #24282d;
	font-size: 14px;
	line-height: 27px;
	box-shadow: none;
}

.appointment-location-selector.requires-detail input[type="text"].scheduler-location-detail-input {
	display: block;
}

.appointment-location-selector input[type="text"].scheduler-location-detail-input:focus {
	outline: none;
	box-shadow: none;
}

.appointment-location-selector .scheduler-location-selected {
	width: 100%;
	min-height: 27px;
	padding: 0;
	border: 0;
	background: transparent;
	gap: 8px;
	overflow: hidden;
}

.appointment-location-selector .scheduler-location-selected:hover {
	border-color: transparent;
	background: transparent;
}

.appointment-location-selector .scheduler-location-icon {
	display: none;
}

.appointment-location-selector.empty .scheduler-location-title {
	color: #6b7280;
	font-weight: 500;
}

.appointment-location-selector .scheduler-location-title {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: #0A0A0A;
	font-size: 14px;
	font-weight: 400;
	line-height: 19px;
}

.appointment-location-selector .scheduler-location-selected-text {
	display: flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
	flex: 1 1 auto;
}

.appointment-location-selector.requires-detail .scheduler-location-selected-text {
	flex: 0 1 auto;
	max-width: 46%;
}

.appointment-location-selector .scheduler-location-detail {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 12px;
	line-height: 16px;
}

.appointment-location-selector:not(.zoom-location) .scheduler-location-detail {
	display: none;
}

.appointment-location-selector .scheduler-location-change {
	display: none;
}

.appointment-location-selector .scheduler-location-detail:empty {
	display: none;
}

.appointment-location-selector .scheduler-location-actions {
	gap: 4px;
	margin-left: auto;
	flex-wrap: nowrap;
}

.appointment-location-selector .scheduler-location-remove {
	height: 24px;
	padding: 0 8px;
	border-color: transparent;
	background: rgba(255, 255, 255, .72);
	font-size: 12px;
	line-height: 22px;
}

.appointment-location-selector .scheduler-location-remove:hover {
	border-color: #d6dbe1;
	background: #fff;
}

.appointment-location-settings {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	padding: 0;
	border: 1px solid #d6dbe1;
	border-radius: 7px;
	background: #fff;
	color: #475569;
	font-size: 0;
	line-height: 1;
	cursor: pointer;
}

.appointment-location-settings:hover {
	background: #f3f5f7;
	border-color: #b9c1cb;
	color: #202124;
}

.appointment-location-settings:before {
	content: "";
	display: block;
	width: 15px;
	height: 15px;
	background-color: currentColor;
	-webkit-mask: url('/images/icons/x-sched/settings-icon.svg') center / contain no-repeat;
	mask: url('/images/icons/x-sched/settings-icon.svg') center / contain no-repeat;
}

.scheduler-location-provider-picker {
	display: none;
	padding: 8px;
	border: 1px solid #d6dbe1;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 12px 28px rgba(15, 23, 42, .12);
}

.scheduler-location-zoom-panel {
	position: absolute;
	top: calc(100% + 6px);
	right: 0;
	z-index: 40;
	width: 380px;
	max-width: min(100%, 380px);
	box-sizing: border-box;
}

.scheduler-location-provider-picker.open {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.scheduler-location-provider-picker-title {
	padding: 2px 2px 4px;
	color: #6b7280;
	font-size: 11px;
	line-height: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .03em;
}

.scheduler-location-provider-picker-empty {
	padding: 8px 6px;
	color: #6b7280;
	font-size: 12px;
	line-height: 17px;
}

.scheduler-location-provider-option {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	width: 100%;
	padding: 8px;
	border: 1px solid transparent;
	border-radius: 7px;
	background: transparent;
	color: #202124;
	text-align: left;
	cursor: pointer;
	box-sizing: border-box;
}

.scheduler-location-provider-option:hover {
	background: #f5f7f9;
}

.scheduler-location-provider-option.selected {
	border-color: #d6dbe1;
	background: #FAFAFA;
}

.scheduler-location-provider-option:disabled {
	cursor: default;
	opacity: .62;
}

.scheduler-location-provider-option.disabled {
	cursor: default;
	opacity: .62;
}

.scheduler-location-provider-copy {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-width: 0;
}

.scheduler-location-provider-name {
	min-width: 0;
	overflow: hidden;
	color: #202124;
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.scheduler-location-provider-email {
	min-width: 0;
	overflow: hidden;
	color: #6b7280;
	font-size: 12px;
	line-height: 16px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.scheduler-location-provider-meta {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
}

.scheduler-location-provider-status {
	flex: 0 0 auto;
	color: #6b7280;
	font-size: 12px;
	line-height: 17px;
}

.scheduler-location-provider-status.connected {
	color: #0f7a4f;
}

.scheduler-location-provider-connect,
.scheduler-location-provider-disconnect {
	height: 28px;
	border: 1px solid #d6dbe1;
	border-radius: 7px;
	background: #fff;
	font-family: Manrope, sans-serif;
	font-size: 12px;
	line-height: 26px;
	font-weight: 700;
	cursor: pointer;
}

.scheduler-location-provider-connect {
	width: 100%;
	margin-top: 4px;
	color: #00529b;
}

.scheduler-location-provider-disconnect {
	padding: 0 8px;
	color: #8a2b20;
	border-color: #f0c2bb;
	background: #fff8f7;
	font-weight: 500;
	white-space: nowrap;
}

.scheduler-location-provider-connect:hover,
.scheduler-location-provider-disconnect:hover {
	background: #f3f5f7;
	border-color: #b9c1cb;
}

.scheduler-zoom-disconnect-modal {
	position: fixed;
	inset: 0;
	z-index: 9998;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(0, 0, 0, 0.45);
	box-sizing: border-box;
}

.scheduler-zoom-disconnect-modal-content {
	width: 460px;
	max-width: 100%;
	padding: 24px;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 20px 50px rgba(15, 23, 42, 0.28);
	box-sizing: border-box;
}

.scheduler-zoom-disconnect-modal-content h3 {
	margin: 0 0 10px;
	color: #202124;
	font-size: 18px;
	line-height: 24px;
	font-weight: 700;
}

.scheduler-zoom-disconnect-modal-content p {
	margin: 0;
	color: #4b5563;
	font-size: 13px;
	line-height: 20px;
}

.scheduler-zoom-disconnect-modal-actions {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	margin-top: 22px;
}

.scheduler-zoom-disconnect-cancel,
.scheduler-zoom-disconnect-confirm {
	height: 34px;
	padding: 0 14px;
	border-radius: 7px;
	border: 1px solid #d6dbe1;
	background: #fff;
	color: #202124;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	line-height: 32px;
	font-weight: 700;
	cursor: pointer;
}

.scheduler-zoom-disconnect-cancel:hover {
	background: #f3f5f7;
	border-color: #b9c1cb;
}

.scheduler-zoom-disconnect-confirm {
	border-color: #ba3a2a;
	background: #ba3a2a;
	color: #fff;
}

.scheduler-zoom-disconnect-confirm:hover {
	background: #9d2f23;
	border-color: #9d2f23;
}

.scheduler-zoom-disconnect-confirm:disabled {
	opacity: 0.7;
	cursor: default;
}

.scheduler-location-notification {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 10000;
	max-width: 360px;
	padding: 12px 14px;
	border-radius: 8px;
	box-shadow: 0 10px 28px rgba(15, 23, 42, 0.18);
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
}

.scheduler-location-notification.success {
	background: #e8f7ef;
	color: #176b3b;
}

.scheduler-location-notification.error {
	background: #fde8e5;
	color: #8a2b20;
}

.scheduler-location-menu {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	z-index: 30;
	display: none;
	width: min(360px, 100%);
	padding: 6px;
	border: 1px solid #d6dbe1;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 12px 28px rgba(15, 23, 42, .16);
	box-sizing: border-box;
}

.scheduler-location-menu.open {
	display: block;
	position: static;
	width: 100%;
	margin-top: -2px;
}

.appointment-location-selector .scheduler-location-menu.open {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	z-index: 2000;
	width: 100%;
	margin-top: 0;
}

.scheduler-location-menu.appointment-location-menu-portal.open {
	display: block;
	margin-top: 0;
}

.scheduler-location-menu-group + .scheduler-location-menu-group {
	margin-top: 6px;
	padding-top: 6px;
	border-top: 1px solid #edf0f2;
}

.scheduler-location-menu-heading {
	padding: 4px 7px 5px;
	color: #6b7280;
	font-size: 11px;
	line-height: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .03em;
}

.scheduler-location-option {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	width: 100%;
	padding: 8px 7px;
	border: 0;
	border-radius: 7px;
	background: transparent;
	text-align: left;
	cursor: pointer;
	box-sizing: border-box;
}

.scheduler-location-option:hover {
	background: #f5f7f9;
}

.scheduler-location-option-copy {
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
}

.scheduler-location-option-title {
	color: #202124;
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
}

.scheduler-location-option-detail {
	color: #6b7280;
	font-size: 12px;
	line-height: 17px;
}

.scheduler-basics-details-text {
	min-height: 154px;
	resize: vertical;
}

.scheduler-basics-source-note {
	display: none !important;
}

.scheduler-basics-url-control {
	display: flex;
	flex-direction: column;
	gap: 7px;
}

.scheduler-basics-url-line {
	display: flex;
	align-items: center;
	min-height: 36px;
	border: 1px solid #d6dbe1;
	border-radius: 7px;
	background: #fff;
	box-sizing: border-box;
	cursor: text;
	overflow: hidden;
}

.scheduler-basics-url-line:focus-within {
	border-color: #1a5ea8;
	box-shadow: 0 0 0 2px rgba(26, 94, 168, .12);
}

.scheduler-basics-url-line.disabled {
	background: #fff;
}

.scheduler-basics-url-line.dirty {
	border-color: #d99a21;
	box-shadow: 0 0 0 2px rgba(217, 154, 33, .14);
}

.scheduler-basics-url-prefix {
	min-width: 0;
	padding: 8px 0 8px 11px;
	color: #68717c;
	font-size: 13px;
	line-height: 18px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	user-select: none;
}

.scheduler-basics-url-account {
	padding: 8px 0;
	color: #48515b;
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
	white-space: nowrap;
	flex-shrink: 0;
	user-select: none;
}

.scheduler-basics-field-control input[type="text"].scheduler-basics-url-slug {
	width: 240px;
	min-width: 140px;
	max-width: 42%;
	min-height: 34px;
	padding: 7px 10px;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	background: transparent;
	color: #111827;
	font-weight: 700;
	flex: 0 1 240px;
}

.scheduler-basics-field-control input[type="text"].scheduler-basics-url-slug:focus {
	border: 0;
	box-shadow: none;
}

.scheduler-basics-url-warning {
	display: none;
	color: #8a5a00;
	font-size: 12px;
	line-height: 18px;
}

.scheduler-questions-editor {
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 100%;
	background: transparent;
	box-sizing: border-box;
}

.scheduler-questions-list {
	width: 100%;
	box-sizing: border-box;
}

.scheduler-questions-add,
.scheduler-question-dialog-primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 34px;
	padding: 0 12px;
	border: none;
	border-radius: 7px;
	color: #fff;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	line-height: 32px;
	font-weight: 700;
	cursor: pointer;
	white-space: nowrap;
	box-sizing: border-box;
	appearance: none;
}

/* "Add a question" / "Add another question" under the list is the primary blue button like
   every other add action; the secondary-action class is layout-only (see -add-more). It
   used to carry a flat white/dark-text override that lost its background to the shared
   primary block and left dark type on the navy fill. */

.scheduler-questions-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
	overflow: visible;
}

.scheduler-questions-empty {
	padding: 28px;
	border: 1px solid #e3e7ee;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(20, 31, 55, .04);
	color: #5f6368;
	font-size: 13px;
	line-height: 19px;
}

.scheduler-questions-empty-title {
	color: #202124;
	font-size: 16px;
	line-height: 22px;
	font-weight: 700;
}

.scheduler-questions-empty-copy {
	margin-top: 6px;
	max-width: 520px;
	color: #5f6368;
	font-size: 13px;
	line-height: 20px;
}

.scheduler-questions-empty-action {
	margin-top: 18px;
}

.scheduler-questions-list-action {
	display: flex;
	justify-content: flex-start;
	padding: 2px 0 0;
}

.scheduler-questions-add-more {
	min-height: 34px;
	border-radius: 9px;
}

.scheduler-question-row {
	position: relative;
	display: grid;
	grid-template-columns: 20px minmax(0, 1fr) auto;
	gap: 12px;
	align-items: center;
	min-height: 62px;
	padding: 18px;
	border: 1px solid #e1e6ef;
	border-radius: 14px;
	background: #fff;
	box-sizing: border-box;
	z-index: 1;
}

.scheduler-question-row-built-in {
	grid-template-columns: minmax(0, 1fr) auto;
}

.scheduler-question-drag-handle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 32px;
	padding: 0;
	color: #b0b0b0;
	font-size: 12px;
	line-height: 1;
	cursor: grab;
	flex-shrink: 0;
	align-self: center;
}

.scheduler-question-drag-handle:hover {
	color: #888;
}

.scheduler-question-row.is-dragging-question,
.scheduler-questions-list .ui-sortable-helper {
	background: #fff;
	box-shadow: 0 6px 18px rgba(20, 31, 55, .12);
}

.scheduler-questions-list .ui-sortable-helper .scheduler-question-drag-handle {
	cursor: grabbing;
}

.scheduler-question-row-placeholder {
	min-height: 62px;
	border: 1px dashed #cfd8e3;
	border-radius: 14px;
	background: #f8fafc;
}

.scheduler-question-row.is-hidden-question {
	background: #fafbfc;
}

.scheduler-question-row-copy {
	min-width: 0;
}

.scheduler-question-row-title {
	color: #202124;
	font-size: 13px;
	line-height: 19px;
	font-weight: 700;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.scheduler-question-row-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 4px;
}

.scheduler-question-chip {
	display: inline-flex;
	align-items: center;
	min-height: 20px;
	padding: 1px 7px;
	border-radius: 999px;
	background: #eef2f6;
	color: #4b5563;
	font-size: 11px;
	line-height: 16px;
	font-weight: 700;
}

.scheduler-question-row-actions {
	display: flex;
	align-items: center;
	gap: 6px;
}

.scheduler-question-toggle {
	position: relative;
	display: inline-flex;
	width: 34px;
	height: 20px;
	cursor: pointer;
}

.scheduler-question-toggle.locked {
	cursor: default;
	opacity: .46;
}

.scheduler-question-toggle input {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

.scheduler-question-toggle-track {
	position: relative;
	width: 34px;
	height: 20px;
	border-radius: 999px;
	background: #d9e2ef;
	box-shadow: inset 0 0 0 1px rgba(62, 82, 112, .18);
}

.scheduler-question-toggle-thumb {
	position: absolute;
	top: 3px;
	left: 3px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 4px rgba(24, 42, 62, .2);
	transition: transform .16s ease;
}

.scheduler-question-toggle input:checked + .scheduler-question-toggle-track {
	background: #0b66b2;
}

.scheduler-question-toggle input:checked + .scheduler-question-toggle-track .scheduler-question-toggle-thumb {
	transform: translateX(14px);
}

.scheduler-question-action,
.scheduler-question-option-row button,
.scheduler-question-add-option,
.scheduler-question-dialog-footer button {
	min-width: 34px;
	height: 28px;
	padding: 0 8px;
	border: 1px solid #d6dbe1;
	border-radius: 7px;
	background: #fff;
	color: #202124;
	font-family: Manrope, sans-serif;
	font-size: 12px;
	line-height: 26px;
	font-weight: 700;
	cursor: pointer;
}

.scheduler-question-action:disabled {
	opacity: .45;
	cursor: default;
}

.scheduler-question-action.danger {
	color: #8a2b20;
}

.scheduler-question-dialog-body {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 18px 22px 10px;
}

.scheduler-question-inline-editor {
	display: flex;
	flex-direction: column;
	border: 1px solid #e1e6ef;
	border-radius: 14px;
	background: #fff;
	box-sizing: border-box;
	overflow: hidden;
}

.scheduler-question-dialog-dynamic {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.scheduler-question-dialog-dynamic:empty {
	display: none;
}

.scheduler-question-dialog-field,
.scheduler-question-dialog-checkbox {
	display: flex;
	flex-direction: column;
	gap: 6px;
	color: #202124;
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
}

.scheduler-question-dialog-checkbox {
	flex-direction: row;
	align-items: center;
	gap: 9px;
	padding: 2px 0;
	color: #4b5563;
	font-weight: 500;
}

.scheduler-question-dialog-field input,
.scheduler-question-dialog-field select {
	width: 100%;
	min-height: 38px;
	padding: 8px 11px;
	border: 1px solid #d5dbe3;
	border-radius: 8px;
	background: #fff;
	color: #111827;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	line-height: 18px;
	box-sizing: border-box;
	transition: border-color .14s ease, box-shadow .14s ease, background .14s ease;
}

.scheduler-question-dialog-field input:focus,
.scheduler-question-dialog-field select:focus {
	border-color: #2f6fab;
	box-shadow: 0 0 0 3px rgba(47, 111, 171, .14);
	outline: 0;
}

.scheduler-question-dialog-checkbox input {
	width: 14px;
	height: 14px;
	margin: 0;
	accent-color: #2f6fab;
}

.scheduler-question-options-editor {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 12px;
	border: 1px solid #e1e6ed;
	border-radius: 8px;
	background: #f8fafc;
}

.scheduler-question-options-title {
	color: #111827;
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
}

.scheduler-question-options-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.scheduler-question-option-row {
	display: flex;
	align-items: center;
	gap: 8px;
}

.scheduler-question-option-row input {
	flex: 1;
	min-height: 34px;
	padding: 7px 10px;
	border: 1px solid #d5dbe3;
	border-radius: 7px;
	background: #fff;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	box-sizing: border-box;
}

.scheduler-question-dialog-footer {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	padding: 10px 22px 18px;
	border-top: 0;
	background: #fff;
}

.scheduler-question-dialog-footer button {
	height: 36px;
	min-width: 78px;
	padding: 0 14px;
	border-radius: 8px;
	font-size: 13px;
	line-height: 34px;
}

.scheduler-question-dialog-footer button:not(.scheduler-question-dialog-primary) {
	background: #fff;
	color: #374151;
	border-color: #d5dbe3;
}

.scheduler-question-dialog-footer button:not(.scheduler-question-dialog-primary):hover {
	background: #f1f3f5;
	border-color: #c5ccd6;
}

.scheduler-question-dialog-footer .scheduler-question-dialog-primary {
	color: #fff;
}

.scheduler-profile-layout {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.scheduler-profile-team-card {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 6px;
	border: 1px solid #e1e4e8;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .035);
	box-sizing: border-box;
	padding: 18px;
}

.scheduler-profile-card-heading p {
	margin: 4px 0 0;
	color: #6b7280;
	font-size: 12px;
	line-height: 1.45;
}

.scheduler-profile-team-card .scheduler-availability-field {
	margin: 0;
	width: min(380px, 100%);
	max-width: 100%;
}

.scheduler-profile-team-card .scheduler-basics-field-label {
	display: none;
}

.scheduler-team-members {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	width: 100%;
	box-sizing: border-box;
}

.scheduler-team-member-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: auto;
	max-width: 100%;
}

.scheduler-team-member-row {
	display: grid;
	grid-template-columns: minmax(0, 380px) auto;
	align-items: center;
	gap: 8px;
	width: fit-content;
	max-width: 100%;
	box-sizing: border-box;
}

.scheduler-team-member-lookup {
	width: 100%;
	min-width: 0;
}

.scheduler-team-member-lookup .lookup_input_link_container,
.scheduler-team-member-lookup .lookup-dropdown-trigger {
	width: 100%;
	max-width: 100%;
}

.scheduler-team-member-add,
.scheduler-team-member-remove {
	height: 32px;
	padding: 0 12px;
	border: 1px solid #d6dbe1;
	border-radius: 10px;
	background: #fff;
	color: #202124;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	line-height: 30px;
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}

.scheduler-team-member-add:hover,
.scheduler-team-member-remove:hover {
	background: #f3f5f7;
	border-color: #b9c1cb;
}

.scheduler-team-member-add:focus-visible,
.scheduler-team-member-remove:focus-visible {
	outline: 2px solid rgba(26, 94, 168, .28);
	outline-offset: 2px;
}

.scheduler-profile-card,
.scheduler-profile-logo-card {
	width: 100%;
	border: 1px solid #e1e4e8;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .035);
	box-sizing: border-box;
	padding: 28px;
	overflow: hidden;
}

.scheduler-profile-card {
	display: flex;
	flex-direction: column;
	position: relative;
}

.scheduler-profile-card.is-hidden-for-team-members {
	display: none;
}

.scheduler-profile-logo-card {
	display: flex;
	flex-direction: column;
	padding: 20px;
}

.scheduler-profile-override-button {
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 2;
	height: 32px;
	padding: 0 13px;
	border: 1px solid #cfd6df;
	border-radius: 10px;
	background: #fff;
	color: #1f2937;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	line-height: 30px;
	font-weight: 700;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
	cursor: pointer;
}

.scheduler-profile-override-button:hover {
	background: #f6f8fa;
	border-color: #aeb8c4;
}

.scheduler-profile-override-button:focus-visible {
	outline: 2px solid rgba(26, 94, 168, .28);
	outline-offset: 2px;
}

.scheduler-profile-form {
	display: flex;
	flex-direction: column;
	gap: 24px;
	min-width: 0;
	box-sizing: border-box;
}

.scheduler-profile-card.is-profile-locked .scheduler-profile-form {
	opacity: .5;
	pointer-events: none;
}

.scheduler-profile-card.is-profile-locked .scheduler-profile-field-control input[type="text"],
.scheduler-profile-card.is-profile-locked .scheduler-profile-field-control input[type="number"],
.scheduler-profile-card.is-profile-locked .scheduler-profile-field-control textarea,
.scheduler-profile-card.is-profile-locked .scheduler-profile-field-control select {
	background: #f8fafc;
	color: #5f6368;
}

.scheduler-profile-media-row {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	box-sizing: border-box;
}

.scheduler-profile-media-row + .scheduler-profile-media-row {
	padding-top: 0;
}

.scheduler-profile-media-content {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.scheduler-profile-media-preview {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	flex-shrink: 0;
	border: 1px solid rgba(255, 255, 255, .45);
	background: #4473CA;
	color: #fff;
	box-sizing: border-box;
	overflow: hidden;
}

.scheduler-profile-media-preview span {
	color: #fff;
	font-size: 20px;
	line-height: 1;
	font-weight: 700;
	letter-spacing: 0;
}

.scheduler-profile-media-preview img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.scheduler-profile-media-preview-avatar {
	border-radius: 50%;
}

.scheduler-profile-media-preview-logo {
	width: 160px;
	height: 64px;
	border-color: #dfe3e8;
	border-radius: 10px;
	background: #fff;
}

.scheduler-profile-media-preview-logo.has-image {
	border-color: #dfe3e8;
	background: #fff;
}

.scheduler-profile-media-preview-logo.has-image img {
	object-fit: contain;
	padding: 6px;
	box-sizing: border-box;
}

.scheduler-profile-media-preview-logo span {
	font-size: 18px;
}

.scheduler-profile-media-title,
.scheduler-profile-field-label {
	color: #202124;
	font-size: 14px;
	line-height: 16px;
	font-weight: 700;
}

.scheduler-profile-media-controls {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
}

.scheduler-profile-media-upload,
.scheduler-profile-media-remove {
	height: 32px;
	padding: 0 12px;
	border: 1px solid #d6dbe1;
	border-radius: 10px;
	background: #fff;
	color: #202124;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	line-height: 30px;
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}

.scheduler-profile-media-upload:hover {
	background: #f3f5f7;
	border-color: #b9c1cb;
}

.scheduler-profile-media-row.is-uploading .scheduler-profile-media-preview {
	opacity: .72;
}

.scheduler-profile-media-upload:disabled,
.scheduler-profile-media-remove:disabled {
	cursor: default;
	opacity: .6;
}

.scheduler-profile-media-upload:focus-visible,
.scheduler-profile-media-remove:focus-visible {
	outline: 2px solid rgba(26, 94, 168, .28);
	outline-offset: 2px;
}

.scheduler-profile-media-remove:hover {
	background: #fff7f5;
	border-color: #e3b9b2;
}

.scheduler-profile-media-help {
	color: #68717c;
	font-size: 12px;
	line-height: 14px;
}

.scheduler-profile-media-status {
	display: none;
	color: #6b7280;
	font-size: 12px;
	line-height: 14px;
}

.scheduler-profile-media-row.is-inherited-logo .scheduler-profile-media-preview-logo {
	border-color: #c8d7e8;
	background: #f8fbff;
}

.scheduler-profile-media-native-control {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

.scheduler-profile-media-file-input {
	display: none;
}

.scheduler-profile-fields {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 24px;
	padding-top: 0;
}

.scheduler-profile-field {
	min-width: 0;
}

.scheduler-profile-field-label {
	display: block;
	margin-bottom: 0;
}

.scheduler-profile-field-control {
	margin-top: 7px;
	min-width: 0;
}

.scheduler-profile-field-control input[type="text"],
.scheduler-profile-field-control input[type="number"],
.scheduler-profile-field-control textarea,
.scheduler-profile-field-control select {
	width: 100%;
	max-width: 100%;
	min-height: 36px;
	padding: 8px 12px;
	border: 1px solid #cfd4da;
	border-radius: 10px;
	background: #fff;
	color: #202124;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	line-height: 18px;
	box-sizing: border-box;
	outline: none;
}

.scheduler-profile-field-control input[type="text"]:focus,
.scheduler-profile-field-control input[type="number"]:focus,
.scheduler-profile-field-control textarea:focus,
.scheduler-profile-field-control select:focus {
	border-color: #1a5ea8;
	box-shadow: 0 0 0 2px rgba(26, 94, 168, .12);
}

.scheduler-profile-preview-browser {
	width: 100%;
	min-height: 420px;
	border: 1px solid #dfe3e8;
	border-radius: 16px;
	background: #f6f7f9;
	overflow: hidden;
	box-sizing: border-box;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72);
}

.scheduler-profile-preview-chrome {
	display: flex;
	align-items: center;
	gap: 12px;
	height: 50px;
	padding: 0 14px;
	border-bottom: 1px solid #e1e4e8;
	background: #fff;
	box-sizing: border-box;
}

.scheduler-profile-preview-dots {
	display: flex;
	align-items: center;
	gap: 5px;
	flex-shrink: 0;
}

.scheduler-profile-preview-dots span {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #d7dce2;
}

.scheduler-profile-preview-url {
	min-width: 0;
	flex: 1;
	padding: 7px 12px;
	border-radius: 999px;
	background: #f3f5f7;
	color: #68717c;
	font-size: 13px;
	line-height: 16px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.scheduler-availability-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 260px;
	grid-template-areas:
		"weekly timezone"
		"overrides .";
	gap: 16px;
	align-items: start;
}

.scheduler-availability-main,
.scheduler-availability-aside {
	display: contents;
}

.scheduler-availability-weekly-card {
	grid-area: weekly;
}

.scheduler-availability-overrides-card {
	grid-area: overrides;
}

.scheduler-availability-timezone-card {
	grid-area: timezone;
	position: sticky;
	top: 0;
}

.scheduler-availability-card {
	width: 100%;
	background: #fff;
	border: 1px solid #e3e5ea;
	border-radius: 14px;
	padding: 16px;
	box-shadow: 0 1px 2px rgba(20, 31, 55, .04);
	box-sizing: border-box;
}

.scheduler-availability-card-heading {
	margin: 0;
}

.scheduler-availability-weekly,
.scheduler-availability-dialog-windows,
.scheduler-availability-override-list {
	display: flex;
	flex-direction: column;
}

.scheduler-availability-weekly {
	gap: 2px;
}

.scheduler-availability-day-row {
	position: relative;
	display: grid;
	grid-template-columns: 138px 112px 12px 112px 32px 32px 32px;
	column-gap: 8px;
	row-gap: 8px;
	align-items: center;
	min-height: 40px;
	padding: 4px 8px;
	box-sizing: border-box;
	border: 1px solid transparent;
	border-radius: 10px;
}

.scheduler-availability-day-row:hover {
	background: #f8f9fb;
	border-color: #eceff4;
}

.scheduler-availability-day-row.inactive {
	color: #7b8190;
}

.scheduler-availability-day-toggle {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 34px;
	margin: 0;
	font-size: 13px;
	font-weight: 650;
	color: #263244;
	cursor: pointer;
}

.scheduler-availability-day-spacer,
.scheduler-availability-action-spacer {
	min-height: 32px;
}

.scheduler-availability-day-toggle input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
	pointer-events: none;
}

.scheduler-availability-toggle-track {
	position: relative;
	display: inline-flex;
	align-items: center;
	width: 44px;
	height: 24px;
	flex: 0 0 44px;
	border: 1px solid #dfe3eb;
	border-radius: 999px;
	background: #edf0f5;
	box-shadow: inset 0 1px 2px rgba(31, 41, 55, .08);
	transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.scheduler-availability-toggle-thumb {
	position: absolute;
	left: 2px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 4px rgba(15, 23, 42, .22);
	transition: transform .16s ease;
}

.scheduler-availability-day-toggle input:checked + .scheduler-availability-toggle-track {
	border-color: #00529B;
	background: #00529B;
	box-shadow: inset 0 1px 2px rgba(0, 61, 115, .18);
}

.scheduler-availability-day-toggle input:checked + .scheduler-availability-toggle-track .scheduler-availability-toggle-thumb {
	transform: translateX(20px);
}

.scheduler-availability-day-toggle input:focus-visible + .scheduler-availability-toggle-track {
	box-shadow: 0 0 0 3px rgba(68, 115, 202, .18), inset 0 1px 2px rgba(31, 41, 55, .08);
}

.scheduler-availability-day-row.inactive .scheduler-availability-day-name {
	color: #5f6673;
}

.scheduler-availability-windows {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}

.scheduler-availability-dialog-window {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
}

.scheduler-availability-time-select {
	width: 112px;
	height: 34px;
	border: 1px solid #d8dde6;
	border-radius: 8px;
	background: #fff;
	color: #202a3a;
	font-size: 13px;
	padding: 0 8px;
}

.scheduler-availability-time-select:focus,
.scheduler-availability-timezone-input:focus {
	border-color: #8ba1c7;
	box-shadow: 0 0 0 3px rgba(68, 115, 202, .12);
	outline: none;
}

.scheduler-availability-window-separator {
	color: #8a91a0;
	text-align: center;
}

.scheduler-availability-override-actions,
.scheduler-availability-copy-footer {
	display: flex;
	align-items: center;
	gap: 6px;
}

.scheduler-availability-copy-footer {
	justify-content: flex-end;
}

.scheduler-availability-icon-button,
.scheduler-availability-secondary,
.scheduler-availability-primary,
.scheduler-availability-add-override,
.scheduler-availability-add-window-inline,
.scheduler-availability-save-override {
	border: 1px solid #dde1e8;
	border-radius: 8px;
	background: #fff;
	color: #2d3748;
	font-size: 12px;
	font-weight: 650;
	min-height: 32px;
	padding: 0 10px;
	cursor: pointer;
}

.scheduler-availability-icon-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	min-width: 32px;
	height: 32px;
	min-height: 32px;
	padding: 0;
	line-height: 1;
}

.scheduler-availability-copy-window,
.scheduler-availability-window-remove {
	color: #2d3748;
	font-size: 0;
}

.scheduler-availability-copy-window::before,
.scheduler-availability-window-remove::before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	background-color: currentColor;
}

.scheduler-availability-copy-window::before {
	-webkit-mask: url("/images/calendar/duplicate.svg") center / contain no-repeat;
	mask: url("/images/calendar/duplicate.svg") center / contain no-repeat;
}

.scheduler-availability-copy-anchor {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
}

.scheduler-availability-window-remove::before {
	-webkit-mask: url("/images/calendar/delete.svg") center / contain no-repeat;
	mask: url("/images/calendar/delete.svg") center / contain no-repeat;
}

.scheduler-availability-primary,
.scheduler-availability-save-override {
	background: #25324a;
	border-color: #25324a;
	color: #fff;
}

.scheduler-availability-secondary:hover,
.scheduler-availability-icon-button:hover,
.scheduler-availability-add-override:hover,
.scheduler-availability-add-window-inline:hover {
	background: #f2f4f7;
	color: #1f2937;
}

.scheduler-availability-secondary.danger,
.scheduler-availability-window-remove {
	color: #2d3748;
}

.scheduler-availability-window-remove {
	border-color: #dde1e8;
	background: #fff;
}

.scheduler-availability-unavailable,
.scheduler-availability-empty-inline {
	display: flex;
	align-items: center;
	min-height: 34px;
	color: #7b8190;
	font-size: 13px;
}

.scheduler-availability-copy-popover {
	position: absolute;
	z-index: 50;
	top: 40px;
	left: 50%;
	transform: translateX(-50%);
	width: 220px;
	padding: 12px;
	background: #fff;
	border: 1px solid #dde1e8;
	border-radius: 12px;
	box-shadow: 0 16px 36px rgba(30, 41, 59, .16);
}

.scheduler-availability-copy-title {
	font-size: 11px;
	font-weight: 750;
	color: #687082;
	margin-bottom: 8px;
}

.scheduler-availability-copy-choices {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.scheduler-availability-copy-choice {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 28px;
	margin: 0;
	font-size: 13px;
	color: #2d3748;
}

.scheduler-availability-copy-choice.disabled {
	color: #9aa1ae;
}

.scheduler-availability-copy-footer {
	margin-top: 12px;
}

.scheduler-availability-override-list {
	gap: 8px;
	margin-bottom: 12px;
}

.scheduler-availability-override-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 12px;
	border: 1px solid #e4e7ec;
	border-radius: 10px;
	background: #fafbfc;
}

.scheduler-availability-override-date {
	font-size: 13px;
	font-weight: 700;
	color: #263244;
}

.scheduler-availability-override-summary {
	margin-top: 2px;
	font-size: 12px;
	color: #6b7280;
}

.scheduler-availability-timezone-control {
	position: relative;
}

.scheduler-availability-timezone-input {
	width: 100%;
	height: 36px;
	box-sizing: border-box;
	border: 1px solid #d8dde6;
	border-radius: 8px;
	background: #fff;
	color: #202a3a;
	font-size: 13px;
	padding: 0 10px;
}

.scheduler-availability-timezone-menu {
	display: none;
	position: absolute;
	z-index: 40;
	top: 42px;
	left: 0;
	right: 0;
	max-height: 260px;
	overflow: auto;
	padding: 6px;
	background: #fff;
	border: 1px solid #dde1e8;
	border-radius: 10px;
	box-shadow: 0 16px 36px rgba(30, 41, 59, .16);
}

.scheduler-availability-timezone-menu.open {
	display: block;
}

.scheduler-availability-timezone-option {
	display: block;
	width: 100%;
	border: 0;
	border-radius: 7px;
	background: transparent;
	color: #2d3748;
	font-size: 12px;
	line-height: 1.35;
	text-align: left;
	padding: 8px;
	cursor: pointer;
}

.scheduler-availability-timezone-option:hover {
	background: #f2f4f7;
}

.scheduler-availability-dialog-overlay {
	position: fixed;
	inset: 0;
	z-index: 30000;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(18, 27, 43, .24);
}

.scheduler-availability-dialog {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 0;
	width: min(803px, calc(100vw - 48px));
	min-height: 469px;
	max-width: calc(100vw - 48px);
	background: #fff;
	border: 1px solid #e3e5ea;
	border-radius: 18px;
	box-shadow: 0 24px 70px rgba(15, 23, 42, .22);
	overflow: hidden;
}

.scheduler-availability-dialog-calendar,
.scheduler-availability-dialog-detail {
	box-sizing: border-box;
	padding: 32px;
}

.scheduler-availability-dialog-calendar {
	border-right: 1px solid #e5e7eb;
	background: #fff;
}

.scheduler-availability-dialog-title {
	margin: 0 0 20px;
	color: #070a0d;
	font-size: 20px;
	font-weight: 700;
	line-height: 28px;
}

.scheduler-availability-dialog-calendar-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 26px;
}

.scheduler-availability-dialog-nav {
	display: flex;
	align-items: center;
	gap: 2px;
}

.scheduler-availability-dialog-nav button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid transparent;
	border-radius: 10px;
	background: transparent;
	color: #6b7280;
	font-size: 20px;
	font-weight: 400;
	cursor: pointer;
}

.scheduler-availability-dialog-nav button:hover {
	background: #f2f4f7;
	color: #3c3e44;
}

.scheduler-availability-dialog-month {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 16px;
	line-height: 24px;
}

.scheduler-availability-dialog-month-name {
	color: #070A0D;
	font-weight: 700;
}

.scheduler-availability-dialog-month-year {
	color: #6B7280;
	font-weight: 500;
}

.scheduler-availability-dialog-weekdays {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 8px;
	margin-bottom: 14px;
}

.scheduler-availability-dialog-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	grid-template-rows: repeat(6, 1fr);
	gap: 6px;
}

.scheduler-availability-dialog-weekday {
	text-align: center;
	color: #070a0d;
	font-size: 12px;
	font-weight: 650;
	line-height: 16px;
	text-transform: uppercase;
}

.scheduler-availability-dialog-day-placeholder,
.scheduler-availability-dialog-day {
	aspect-ratio: 1;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid transparent;
	border-radius: 8px;
	background: transparent;
	color: #070a0d;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
	cursor: pointer;
}

.scheduler-availability-dialog-day-placeholder {
	cursor: default;
}

.scheduler-availability-dialog-day.available {
	background: #e5e7eb;
}

.scheduler-availability-dialog-day:hover {
	background: #dfe2e8;
}

.scheduler-availability-dialog-day.before-today {
	background: transparent;
	color: #070a0d;
	font-weight: 300;
	cursor: default;
}

.scheduler-availability-dialog-day:disabled:hover {
	background: transparent;
}

.scheduler-availability-dialog-day.selected {
	background: #00529B;
	color: #fff;
}

.scheduler-availability-dialog-day.selected:hover {
	background: #003d73;
}

.scheduler-availability-dialog-today-dot {
	position: absolute;
	left: 50%;
	bottom: 8px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #00529B;
	transform: translateX(-50%);
}

.scheduler-availability-dialog-day.selected .scheduler-availability-dialog-today-dot {
	background: #fff;
}

.scheduler-availability-dialog-detail {
	display: flex;
	flex-direction: column;
	min-height: 469px;
	background: #fff;
}

.scheduler-availability-dialog-detail h4 {
	margin: 5px 0 16px;
	color: #070a0d;
	font-size: 16px;
	font-weight: 500;
	line-height: 24px;
}

.scheduler-availability-dialog-selected-summary {
	margin: -8px 0 16px;
	font-size: 13px;
	color: #6b7280;
}

.scheduler-availability-unavailable-all-day {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	width: fit-content;
	margin: 16px 0 0;
	color: #070a0d;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
	cursor: pointer;
}

.scheduler-availability-unavailable-all-day input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
	pointer-events: none;
}

.scheduler-availability-unavailable-all-day input:checked + .scheduler-availability-toggle-track {
	border-color: #00529B;
	background: #00529B;
	box-shadow: inset 0 1px 2px rgba(0, 61, 115, .18);
}

.scheduler-availability-unavailable-all-day input:checked + .scheduler-availability-toggle-track .scheduler-availability-toggle-thumb {
	transform: translateX(20px);
}

.scheduler-availability-unavailable-all-day input:focus-visible + .scheduler-availability-toggle-track {
	box-shadow: 0 0 0 3px rgba(68, 115, 202, .18), inset 0 1px 2px rgba(31, 41, 55, .08);
}

.scheduler-availability-dialog-windows {
	gap: 8px;
}

.scheduler-availability-dialog-windows.disabled {
	padding: 12px;
	border-radius: 10px;
	background: #f5f6f8;
}

.scheduler-availability-dialog-window {
	gap: 8px;
}

.scheduler-availability-dialog-window .scheduler-availability-time-select {
	width: 100px;
	height: 42px;
	border-color: #d1d5db;
	border-radius: 10px;
	color: #3c3e44;
	font-size: 14px;
	padding: 0 12px;
	box-shadow: 0 2px 3px rgba(0, 0, 0, .03), 0 2px 2px -1px rgba(0, 0, 0, .03);
}

.scheduler-availability-dialog-window > span {
	width: 12px;
	color: #3c3e44;
	font-size: 16px;
	line-height: 24px;
	text-align: center;
}

.scheduler-availability-dialog-window-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 36px;
}

.scheduler-availability-dialog-add-window,
.scheduler-availability-dialog-remove-window {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid #e5e7eb;
	border-radius: 10px;
	color: #3c3e44;
	cursor: pointer;
}

.scheduler-availability-dialog-add-window {
	background: #eeeff2;
	font-size: 24px;
	font-weight: 300;
	line-height: 1;
}

.scheduler-availability-dialog-remove-window {
	background: #fff;
	box-shadow: 0 2px 3px rgba(0, 0, 0, .03), 0 2px 2px -1px rgba(0, 0, 0, .03);
}

.scheduler-availability-dialog-remove-window::before {
	content: "";
	width: 16px;
	height: 16px;
	background: #3c3e44;
	-webkit-mask: url('/images/calendar/delete.svg') center / 16px 16px no-repeat;
	mask: url('/images/calendar/delete.svg') center / 16px 16px no-repeat;
}

.scheduler-availability-dialog-add-window:hover,
.scheduler-availability-dialog-remove-window:hover {
	background-color: #f5f6f8;
}

.scheduler-availability-dialog-footer {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	align-items: center;
	gap: 8px;
	margin-top: auto;
}

.scheduler-availability-dialog-close {
	border: 1px solid transparent;
	border-radius: 10px;
	background: transparent;
	color: #6b7280;
	font-size: 14px;
	font-weight: 650;
	min-height: 36px;
	padding: 0 10px;
	cursor: pointer;
}

.scheduler-availability-dialog-close:hover {
	background: #f5f6f8;
	color: #3c3e44;
}

.scheduler-availability-save-override {
	--btn-radius: 10px;
	min-height: 40px;
	border-radius: 10px;
	color: #fff;
	font-size: 14px;
	font-weight: 650;
	padding: 0 14px;
}

@media (max-width: 1100px) {
	.scheduler-availability-dialog {
		grid-template-columns: 1fr;
	}

	.scheduler-limits-rule {
		grid-template-columns: minmax(0, 1fr) auto;
	}

	.scheduler-limits-native-control,
	.scheduler-limits-notice-control {
		width: 100%;
	}

	.scheduler-limits-native-control input[type="text"],
	.scheduler-limits-native-control input[type="number"],
	.scheduler-limits-native-control select,
	.scheduler-limits-notice-control input,
	.scheduler-limits-notice-control select {
		width: 100%;
	}

	.scheduler-reminder-actions {
		justify-self: stretch;
		margin-left: 0;
	}

	.scheduler-reminder-actions .btn {
		flex: 1;
	}

	.scheduler-availability-dialog-calendar {
		border-right: 0;
		border-bottom: 1px solid #eaecf0;
	}
}

@container (max-width: 860px) {
	.scheduler-availability-layout {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas:
			"weekly"
			"timezone"
			"overrides";
	}

	.scheduler-availability-timezone-card {
		position: static;
	}
}

@media (max-width: 1180px) {
	.scheduler-main-content-public-profile {
		overflow-y: auto;
	}

	.scheduler-public-profile-shell {
		grid-template-columns: minmax(0, 1fr);
	}

	.scheduler-main-content-public-profile .scheduler-public-profile-shell {
		display: grid;
		height: auto;
		min-height: auto;
		overflow: visible;
	}

	.scheduler-main-content-public-profile .scheduler-public-profile-content {
		overflow: visible;
		padding-right: 0;
	}

	.scheduler-public-profile-preview {
		position: static;
		height: auto;
		max-height: none;
	}

	.scheduler-public-profile-preview-browser {
		height: auto;
		min-height: 560px;
	}

	.scheduler-public-profile-identity {
		grid-template-columns: minmax(0, 1fr);
	}

	.scheduler-basics-grid,
	.scheduler-basics-grid-identity,
	.scheduler-basics-grid-booking-details {
		grid-template-columns: minmax(0, 1fr);
	}

	.scheduler-basics-url-line {
		flex-wrap: wrap;
		padding: 7px 8px;
		gap: 0 6px;
	}

	.scheduler-basics-url-prefix {
		padding: 0;
		max-width: 100%;
	}

	.scheduler-basics-url-account {
		padding: 4px 0 0;
		max-width: 100%;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.scheduler-basics-field-control input[type="text"].scheduler-basics-url-slug {
		width: 100%;
		max-width: 100%;
		flex-basis: 100%;
		margin-top: 6px;
	}

	.scheduler-profile-media-row {
		align-items: flex-start;
	}
}

.scheduler-editor-field-table {
	border-collapse: separate;
	border-spacing: 0;
}

.scheduler-editor-field-table tr.scheduler-editor-field-row > td {
	padding: 15px 16px;
	border-bottom: 1px solid #edf0f2;
	vertical-align: top;
	box-sizing: border-box;
}

.scheduler-editor-field-table tr.scheduler-editor-field-row:last-child > td {
	border-bottom: 0;
}

.scheduler-editor-field-table td.label {
	width: 230px;
	max-width: 230px;
	color: #202124;
	font-size: 13px;
	line-height: 20px;
	font-weight: 700;
}

.scheduler-editor-field-table td.input_cell {
	width: auto;
}

.scheduler-editor-field-table input[type="text"],
.scheduler-editor-field-table input[type="number"],
.scheduler-editor-field-table textarea,
.scheduler-editor-field-table select {
	max-width: 100%;
}

.scheduler-editor-field-table textarea {
	min-height: 120px;
}

.scheduler-editor-field-table .scheduler-duration-select,
.scheduler-editor-field-table .scheduler-notice-hours-input {
	min-width: 180px;
}

.scheduler-editor-field-PublicNote textarea,
.scheduler-editor-field-ActivityNote textarea {
	min-height: 170px;
}

.scheduler-dow-picker {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.scheduler-dow-option {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 30px;
	padding: 5px 9px;
	border: 1px solid #dadce0;
	border-radius: 8px;
	background: #fff;
	color: #3c4043;
	font-size: 13px;
	line-height: 18px;
	font-weight: 600;
	box-sizing: border-box;
	cursor: pointer;
}

.scheduler-dow-option:hover {
	background: #f8f9fa;
}

.scheduler-dow-option input {
	margin: 0;
}

.scheduler-editor-field-DowMask .dow-ticker,
.scheduler-editor-field-DowMask .dow_ticker {
	max-width: 100%;
}

.scheduler-editor-source {
	display: none;
}

.scheduler-editor .custom_form_select,
.scheduler-editor-detail > label.required {
	display: none !important;
}

.scheduler-editor-reminders {
	padding: 0;
}

.scheduler-editor-reminders .tk_section_heading:not(.scheduler-reminders-title),
.scheduler-editor-reminders .form-section-title-v3:not(.scheduler-reminders-title) {
	display: none;
}

.scheduler-editor-reminders .section-description {
	margin-bottom: 14px;
	color: #5f6368;
	font-size: 13px;
	line-height: 20px;
}

.scheduler-editor-reminders .reminder-row {
	border-radius: 14px;
}

.scheduler-editor-pane .extern_sched_activities_area {
	padding: 18px;
}

.scheduler-editor-pane .extern_sched_activities_area.scheduler-linked-bookings-area {
	display: flex;
	flex-direction: column;
	gap: 0;
	width: 100%;
	min-height: 0;
	margin-bottom: 14px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	overflow: visible;
}

.scheduler-linked-booking-controls {
	margin-bottom: 12px;
}

.scheduler-linked-bookings-list {
	flex: 0 1 auto;
	max-height: calc(100vh - 390px);
	min-height: 0;
}

.scheduler-linked-booking-row {
	min-height: 82px;
}

.scheduler-linked-booking-row .scheduler-chip {
	max-width: 100%;
}

.scheduler-editor-pane .extern_sched_activities_area h3 {
	margin-top: 0;
}

.scheduler-editor-metadata-link {
	display: inline-flex;
	margin-top: 12px;
}

a.metadata-link {
	color: #ccc;
}

.fs-custom-tree {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding-bottom: 4px;
}

.fs-tree-list {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.fs-tree-node-virtual-root {
	margin-top: 0;
}

.fs-tree-node-row {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 28px;
	padding: 3px 8px;
	border: 1px solid transparent;
	border-radius: 10px;
	background: transparent;
	cursor: pointer;
	transition:
		background-color 0.18s ease,
		border-color 0.18s ease;
}

.fs-tree-node-row:hover {
	background: rgba(255,255,255,0.42);
}

.fs-tree-node-row.selected {
	background: #fff;
	border-color: #d3d8df;
}

.fs-tree-node-row.can-expand {
	font-weight: 500;
}

.fs-tree-node-toggle {
	width: 18px;
	height: 18px;
	padding: 0;
	border: none;
	background: transparent;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	flex-shrink: 0;
}

.fs-tree-node-toggle.is-placeholder {
	cursor: default;
	opacity: 0;
	pointer-events: none;
}

.fs-tree-node-chevron {
	font-size: 18px;
	line-height: 1;
	color: #7b8188;
	transform: rotate(0deg);
	transform-origin: center;
	transition: transform 0.2s ease, color 0.2s ease;
}

.fs-tree-node.expanded > .fs-tree-node-row .fs-tree-node-chevron {
	transform: rotate(90deg);
	color: #444b53;
}

.fs-tree-node-icon {
	width: 20px;
	height: 20px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.fs-tree-node-icon img {
	width: 20px;
	height: 20px;
	object-fit: contain;
}

.fs-tree-node-label {
	flex: 1;
	min-width: 0;
	font-size: 15px;
	color: #202124;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.fs-tree-node-row.selected .fs-tree-node-label {
	font-weight: 600;
}

.fs-tree-node-virtual-root > .fs-tree-node-row .fs-tree-node-label {
	font-weight: 600;
	color: #43484f;
}

.fs-tree-node-virtual-root > .fs-tree-node-row {
	background: transparent;
}

.fs-tree-node-virtual-root > .fs-tree-node-row.selected {
	background: #fff;
}

.fs-tree-children {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 2px 0 0 14px;
	padding-left: 14px;
	border-left: 1px solid #e3e7ec;
}

.fs-tree-children > .fs-tree-node > .fs-tree-node-row::before {
	content: "";
	position: absolute;
	left: -15px;
	top: 50%;
	width: 10px;
	border-top: 1px solid #e3e7ec;
	transform: translateY(-50%);
}

.fs-tree-loading-state {
	margin-left: 14px;
	padding: 7px 10px;
	font-size: 12px;
	color: #7a8087;
	letter-spacing: 0.01em;
}

/* Breadcrumb navigation */
.fs-breadcrumb {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 2px;
	padding: 8px 0 12px 0;
	font-size: 14px;
	color: #5f6368;
}

.fs-breadcrumb-item {
	padding: 4px 6px;
	border-radius: 4px;
}

.fs-breadcrumb-link {
	color: #1a73e8;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.fs-breadcrumb-link:hover {
	background-color: #e8f0fe;
	text-decoration: none;
}

.fs-breadcrumb-current {
	color: #202124;
	font-weight: 500;
}

.fs-breadcrumb-separator {
	color: #9aa0a6;
	padding: 0 2px;
	font-size: 13px;
}

/* Modern context menu styling for folder tree */
.vakata-context,
.vakata-context ul {
	background: #fff !important;
	border: 1px solid #e0e0e0 !important;
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
	padding: 6px 0;
}

.vakata-context li > a {
	padding: 2px 16px !important;
	line-height: 1.4;
	color: #333;
	text-shadow: none;
	border: none !important;
}

.vakata-context li > a:hover,
.vakata-context .vakata-context-hover > a {
	background: #fff !important;
	box-shadow: none !important;
}

.vakata-context li > a > i {
	display: none !important;
}

.vakata-context li > a > .vakata-contextmenu-sep {
	display: none !important;
	border: none !important;
}

/* File Store Grid View */
.fs-content-header {
	display: none;
}

.fs-content-title {
	font-size: 18px;
	font-weight: 600;
	color: #333;
	display: flex;
	align-items: center;
}

.fs-title-icon {
	width: 32px;
	height: 32px;
	margin-right: 10px;
}

.fs-new-folder-btn {
	padding: 6px 16px;
}

.fs-search-container {
	max-width: 250px;
	margin-bottom: 20px;
	flex-shrink: 0;
}

.fs-search-input {
	width: 100%;
	padding: 8px 12px;
	border: 1px solid #ddd;
	border-radius: 6px;
	font-size: 14px;
	outline: none;
	transition: border-color 0.2s;
	box-sizing: border-box;
}

.fs-search-input:focus {
	border-color: #1976d2;
}

.fs-search-input::placeholder {
	color: #999;
}

.fs-search-empty {
	color: #666;
	font-style: italic;
}

.fs-content-area {
	padding: 25px;
	background: #F3F3F3;
	height: 100%;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	border-radius: 12px;
	overflow: hidden;
}

.fs-scrollable-content {
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.fs-scrollable-content::-webkit-scrollbar {
	display: none;
}

.fs-section {
	margin-bottom: 25px;
}

.fs-section-header {
	font-size: 16px;
	font-weight: 600;
	color: #333;
	margin-bottom: 15px;
}

.fs-files-header-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 15px;
}

.fs-files-header-row .fs-section-header {
	margin-bottom: 0;
}

.fs-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.fs-sort-bar {
	display: flex;
	align-items: center;
	gap: 8px;
}

.fs-sort-label {
	font-size: 12px;
	color: #666;
	font-family: 'Manrope', sans-serif;
}

.fs-sort-select {
	padding: 4px 8px;
	border: 1px solid #ddd;
	border-radius: 4px;
	background: #fff;
	cursor: pointer;
}

.fs-sort-select:focus {
	outline: none;
	border-color: #1976d2;
}

.fs-file-list-cell .fs-sort-bar select {
	font-size: 12px;
	font-family: 'Manrope', sans-serif;
}

.fs-files-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 10px;
}

.fs-card {
	background: #fff;
	border-radius: 8px;
	padding: 12px;
	width: 140px;
	cursor: pointer;
	/* `translate:` for the hover lift - GSAP owns transform/opacity on cards (entrance cascade). */
	transition: box-shadow 0.2s var(--cal-arrive), translate 0.2s var(--cal-arrive);
	border: 1px solid #e8e8e8;
	position: relative;
}

.fs-card:hover {
	box-shadow: 0 4px 12px rgba(0,0,0,0.1);
	translate: 0 -2px;
	background-color: #fff;
	border-radius: 8px;
}

.fs-card.selected {
	border-color: #4a90d9;
	background: #f0f7ff;
}

.fs-folder-drop-hover {
	border-color: #4a90d9 !important;
	background: #f0f7ff !important;
	box-shadow: 0 0 10px rgba(74, 144, 217, 0.4) !important;
	scale: 1.02;
}

.fs-tree-node-drop-hover {
	background: #eef4ff !important;
	border-color: #bfd0ef !important;
	box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.08) !important;
}

.fs-drag-helper-multi {
	position: relative;
	width: 100px;
	height: 80px;
}

.fs-drag-helper-card {
	width: 90px;
	height: 70px;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

.fs-drag-helper-badge {
	position: absolute;
	top: -8px;
	right: -8px;
	background: #1976d2;
	color: white;
	border-radius: 50%;
	width: 24px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	font-weight: bold;
}

.fs-card-icon {
	width: 100%;
	height: 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 8px;
	background: #F3F3F3;
	border-radius: 6px;
}

.fs-card-icon img {
	max-width: 36px;
	max-height: 36px;
}

.fs-card-name {
	font-size: 12px;
	font-weight: 500;
	color: #333;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-bottom: 4px;
}

.fs-card-meta {
	font-size: 11px;
	color: #888;
}

/* File card specific styles (horizontal layout) */
.fs-file-card {
	display: flex;
	align-items: center;
	padding: 12px;
	width: auto;
	min-width: 220px;
	gap: 12px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

.fs-file-card-icon {
	width: 40px;
	height: 40px;
	background: #F3F3F3;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.fs-file-card-icon img {
	max-width: 24px;
	max-height: 24px;
}

.fs-file-card-info {
	flex: 1;
	min-width: 0;
}

.fs-file-card-name {
	font-size: 14px;
	font-weight: 500;
	color: #333;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-bottom: 2px;
}

.fs-file-card-date {
	font-size: 12px;
	color: #888;
}

.fs-file-card-menu {
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	border: none;
	background: transparent;
	padding: 0;
	border-radius: 4px;
	color: #666;
	flex-shrink: 0;
	font-size: 18px;
	font-family: inherit;
	appearance: none;
}

.fs-file-card-menu:hover {
	background: #f0f0f0;
}

/* Dropzone in grid view */
.fs-grid-dropzone {
	border: 2px dashed #ccc;
	border-radius: 8px;
	padding: 40px 20px;
	text-align: center;
	color: #888;
	background: #fafafa;
	margin-top: 20px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	position: relative;
}

.fs-grid-dropzone:hover {
	border-color: #4a90d9;
	background: #f0f7ff;
}

.fs-grid-dropzone.dz-drag-hover {
	border-color: #4a90d9;
	background: #f0f7ff;
	border-style: solid;
}

.vc-file-picker-input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	overflow: hidden;
	opacity: 0;
	border: 0;
	cursor: pointer;
	z-index: 1;
}

/* Empty state */
.fs-empty-state {
	text-align: center;
	padding: 40px;
	color: #888;
}

/* File Info Popup */
.fs-info-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 10000;
}

.fs-info-popup {
	background: white;
	border-radius: 12px;
	padding: 24px;
	min-width: 350px;
	max-width: 450px;
	box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}

.fs-info-header {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 20px;
	color: #333;
}

.fs-info-content {
	margin-bottom: 20px;
}

.fs-info-row {
	display: flex;
	padding: 8px 0;
	border-bottom: 1px solid #eee;
}

.fs-info-row:last-child {
	border-bottom: none;
}

.fs-info-label {
	font-weight: 500;
	color: #666;
	width: 120px;
	flex-shrink: 0;
}

.fs-info-value {
	color: #333;
	word-break: break-word;
}

.fs-info-close-btn {
	width: 100%;
	padding: 10px;
	background: #4a90d9;
	color: white;
	border: none;
	border-radius: 6px;
	cursor: pointer;
	font-size: 14px;
}

.fs-info-close-btn:hover {
	background: #3a7bc8;
}

/* Move File Dialog */
.fs-move-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 10000;
}

.fs-move-popup {
	background: white;
	border-radius: 12px;
	padding: 24px;
	min-width: 350px;
	max-width: 450px;
	box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}

.fs-move-header {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 16px;
	color: #333;
}

.fs-move-instruction {
	font-size: 14px;
	color: #666;
	margin-bottom: 12px;
}

.fs-move-tree-container {
	border: 1px solid #ddd;
	border-radius: 6px;
	padding: 8px;
	max-height: 300px;
	overflow-y: auto;
	margin-bottom: 20px;
}

.fs-move-tree-container .jstree-node {
	margin-bottom: 6px;
}

.fs-move-buttons {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
}

.fs-move-cancel-btn {
	padding: 10px 20px;
	background: #f5f5f5;
	border: 1px solid #ddd;
	border-radius: 6px;
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
}

.fs-move-cancel-btn:hover {
	background: #e8e8e8;
}

.fs-move-btn {
	padding: 10px 20px;
	background: #4a90d9;
	color: white;
	border: none;
	border-radius: 6px;
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
}

.fs-move-btn:hover {
	background: #3a7bc8;
}

/* Search container with controls on right */
.fs-search-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	max-width: none;
}

.fs-search-controls {
	display: flex;
	align-items: center;
	gap: 12px;
}

/* Bulk Operations Toolbar */
.fs-bulk-toolbar {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #E5E5E5;
	padding: 4px 10px;
	border-radius: 6px;
	margin-left: auto;
	align-self: stretch;
}

.fs-bulk-count {
	font-size: 13px;
	font-weight: 500;
	color: #333;
	white-space: nowrap;
}

.fs-bulk-actions {
	display: flex;
	gap: 4px;
}

.fs-bulk-btn {
	width: 24px;
	height: 24px;
	border: none;
	background: transparent;
	color: #555;
	border-radius: 4px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	transition: background 0.15s, color 0.15s;
}

.fs-bulk-btn:hover {
	background: rgba(0,0,0,0.08);
	color: #333;
}

.fs-bulk-btn.fs-bulk-delete:hover {
	background: #ffebee;
	color: #d32f2f;
}

.fs-bulk-btn.disabled {
	opacity: 0.4;
	cursor: not-allowed;
}

.fs-bulk-btn.disabled:hover {
	background: transparent;
	color: #555;
}

.fs-search-input {
	max-width: 250px;
}

.fs-view-toggle {
	display: flex;
	height: var(--workspace-toolbar-control-height);
	box-sizing: border-box;
	gap: 2px;
	background: #e5e5e5;
	border-radius: 8px;
	padding: 2px;
}

.fs-view-btn {
	width: 33px;
	height: 33px;
	border: none;
	background: transparent;
	border-radius: 4px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.15s var(--cal-arrive), color 0.15s var(--cal-arrive), border-color 0.15s var(--cal-arrive);
}

.fs-view-btn:hover {
	background: #e0e0e0;
}

.fs-view-btn.active {
	background: #fff;
	box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.fs-view-btn svg {
	fill: #666;
}

.fs-view-btn.active svg {
	fill: #1976d2;
}

/* Sort Container (in header) */
.fs-sort-container {
	display: flex;
	align-items: center;
	gap: 6px;
}

.fs-sort-container .fs-sort-label {
	font-size: 12px;
	color: #666;
	font-family: 'Manrope', sans-serif;
}

.fs-sort-container .fs-sort-select {
	height: 37px;
	padding: 0 12px;
	border: 1px solid #ddd;
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
	font-size: 13px;
	font-family: 'Manrope', sans-serif;
	box-sizing: border-box;
}

.fs-sort-container .fs-sort-select:focus {
	outline: none;
	border-color: #1976d2;
}

/* List View Container */
.fs-list-view {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #e0e0e0;
	border-radius: 8px;
	overflow: hidden;
}

/* List Row */
.fs-list-row {
	display: flex;
	align-items: center;
	padding: 10px 12px;
	border-bottom: 1px solid #f0f0f0;
	cursor: pointer;
	transition: background 0.1s;
}

.fs-list-row:last-child {
	border-bottom: none;
}

.fs-list-row:hover {
	background: #fafafa;
}

.fs-list-row.selected {
	background: #e3f2fd;
}

/* List Header Row */
.fs-list-header {
	background: #fafafa;
	font-weight: 600;
	font-size: 11px;
	color: #666;
	text-transform: uppercase;
	letter-spacing: 0.3px;
	cursor: default;
	border-bottom: 1px solid #e0e0e0;
}

.fs-list-header:hover {
	background: #fafafa;
}

.fs-list-header .fs-list-name {
	font-weight: 600;
	color: #666;
}

/* List Columns */
.fs-list-col {
	flex-shrink: 0;
	font-size: 13px;
	padding-right: 16px;
}

.fs-list-icon {
	width: 24px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	margin-right: 12px;
	padding-right: 0;
}

.fs-list-icon img {
	width: 24px;
	height: 24px;
}

.fs-list-name {
	flex: 1;
	min-width: 180px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-weight: 500;
	color: #333;
}

/* Inline rename editing styles */
.fs-inline-editing {
	background: #fff;
	border: 2px solid #4a90d9;
	border-radius: 3px;
	padding: 2px 4px;
	outline: none;
	min-width: 50px;
	box-shadow: 0 0 4px rgba(74, 144, 217, 0.3);
	cursor: text;
	white-space: pre;
	overflow: visible;
	text-overflow: clip;
}

.fs-card-name.fs-inline-editing,
.fs-file-card-name.fs-inline-editing {
	display: inline-block;
	max-width: none;
}

.fs-list-name.fs-inline-editing {
	flex: none;
	max-width: 300px;
}

.fs-list-date {
	width: 150px;
	color: #666;
	font-size: 12px;
}

.fs-list-size {
	width: 80px;
	color: #666;
	font-size: 12px;
	text-align: right;
}

.fs-list-created {
	width: 150px;
	color: #666;
	font-size: 12px;
}

.fs-list-created-by {
	width: 140px;
	color: #666;
	font-size: 12px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.fs-list-modified {
	width: 150px;
	color: #666;
	font-size: 12px;
}

.fs-list-actions {
	width: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-right: 0;
}

.fs-list-menu-btn {
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 4px;
	cursor: pointer;
	color: #666;
	font-size: 18px;
	opacity: 0;
	transition: opacity 0.1s, background 0.1s;
	border: none;
	background: transparent;
	padding: 0;
	font-family: inherit;
	appearance: none;
}

.fs-list-row:hover .fs-list-menu-btn {
	opacity: 1;
}

.fs-list-menu-btn:hover {
	background: #e0e0e0;
}

/* Folder rows - slightly different background */
.fs-folder-row {
	background: #fcfcfc;
}

.fs-folder-row:hover {
	background: #f5f5f5;
}

/* Drag-drop states for list rows */
.fs-folder-row.fs-folder-drop-hover {
	background: #e3f2fd !important;
	box-shadow: none !important;
	transform: none;
}

.fs-list-row.ui-draggable-dragging {
	opacity: 0.8;
	box-shadow: 0 4px 16px rgba(0,0,0,0.15);
	background: #fff;
}

/* =========================================
   File Store Upload Progress Dialog
   ========================================= */

/* Main dialog container override */
.fs-upload-dialog.ui-dialog {
	border-radius: 12px;
	box-shadow: 0 4px 20px rgba(0,0,0,0.15);
	overflow: hidden;
	border: none;
	position: fixed !important;
	right: 40px !important;
	bottom: 55px !important;
	left: auto !important;
	top: auto !important;
	max-height: 50vh;
}

.fs-upload-dialog .ui-dialog-titlebar {
	background: #F3F3F3;
	border: none;
	padding: 16px 20px;
	border-bottom: 1px solid #e0e0e0;
	border-radius: 12px 12px 0 0;
}

.fs-upload-dialog .ui-dialog-title {
	color: #333;
	font-size: 16px;
	font-weight: 600;
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif; font-weight: 600;
}

.fs-upload-dialog .ui-dialog-titlebar-close {
	background: transparent !important;
	border: none !important;
	right: 8px;
	top: 50%;
	transform: translateY(-50%);
	width: 32px;
	height: 32px;
	border-radius: 6px;
	transition: background 0.15s;
	margin: 0;
	padding: 0;
}

.fs-upload-dialog .ui-dialog-titlebar-close:hover {
	background: #e0e0e0 !important;
}

.fs-upload-dialog .ui-dialog-titlebar-close .ui-icon,
.fs-upload-dialog .ui-dialog-titlebar-close .ui-button-icon {
	display: none;
}

.fs-upload-dialog .ui-dialog-titlebar-close .ui-button-icon-space {
	display: none;
}

.fs-upload-dialog .ui-dialog-titlebar-close:before {
	content: "\00d7";
	font-size: 24px;
	color: #666;
	line-height: 32px;
	display: block;
	text-align: center;
}

.fs-upload-dialog .ui-dialog-content {
	padding: 0;
	background: #fff;
	max-height: calc(50vh - 56px) !important;
	overflow: hidden !important;
	display: flex !important;
	flex-direction: column !important;
	height: auto !important;
}

/* Upload progress container */
.fs-upload-container {
	display: flex;
	flex-direction: column;
	height: auto;
	max-height: 100%;
	overflow: hidden;
}

/* File list area */
.fs-upload-file-list {
	padding: 16px;
	overflow-y: auto;
	flex: 1 1 auto;
	min-height: 0;
	max-height: calc(50vh - 140px);
}

/* Individual file item card */
.fs-upload-file-item {
	background: #fafafa;
	border: 1px solid #e8e8e8;
	border-radius: 8px;
	padding: 14px 16px;
	margin-bottom: 10px;
	transition: all 0.2s ease;
}

.fs-upload-file-item:last-child {
	margin-bottom: 0;
}

.fs-upload-file-item:hover {
	border-color: #d0d0d0;
}

/* File item - success state */
.fs-upload-file-item.fs-upload-success {
	background: #f0fdf4;
	border-color: #86efac;
}

/* File item - error state */
.fs-upload-file-item.fs-upload-error {
	background: #fef2f2;
	border-color: #fecaca;
}

/* File item - uploading state */
.fs-upload-file-item.fs-upload-active {
	background: #f0f7ff;
	border-color: #93c5fd;
}

/* File name and size row */
.fs-upload-file-info {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
}

.fs-upload-file-name {
	font-size: 14px;
	font-weight: 500;
	color: #333;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	flex: 1;
	margin-right: 12px;
}

.fs-upload-file-size {
	font-size: 12px;
	color: #888;
	flex-shrink: 0;
}

/* Progress bar container */
.fs-upload-progress-track {
	width: 100%;
	height: 6px;
	background: #e5e7eb;
	border-radius: 3px;
	overflow: hidden;
	margin-bottom: 8px;
}

/* Progress bar fill */
.fs-upload-progress-bar {
	height: 100%;
	background: linear-gradient(90deg, #4a90d9, #60a5fa);
	border-radius: 3px;
	width: 0%;
	transition: width 0.3s ease;
}

/* Progress bar - success state */
.fs-upload-file-item.fs-upload-success .fs-upload-progress-bar {
	background: linear-gradient(90deg, #22c55e, #4ade80);
}

/* Progress bar - error state */
.fs-upload-file-item.fs-upload-error .fs-upload-progress-bar {
	background: linear-gradient(90deg, #ef4444, #f87171);
}

/* Animated progress bar for active uploads */
.fs-upload-file-item.fs-upload-active .fs-upload-progress-bar {
	background: linear-gradient(90deg, #4a90d9, #60a5fa, #4a90d9);
	background-size: 200% 100%;
	animation: fs-upload-shimmer 1.5s ease-in-out infinite;
}

@keyframes fs-upload-shimmer {
	0% { background-position: 200% 0; }
	100% { background-position: -200% 0; }
}

/* Status text */
.fs-upload-status {
	font-size: 12px;
	color: #666;
	display: flex;
	align-items: center;
	gap: 6px;
}

.fs-upload-status.fs-status-success {
	color: #16a34a;
}

.fs-upload-status.fs-status-error {
	color: #dc2626;
}

.fs-upload-status.fs-status-uploading {
	color: #2563eb;
}

/* Footer with stats and button */
.fs-upload-footer {
	background: #fafafa;
	padding: 16px 20px;
	border-top: 1px solid #e0e0e0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-shrink: 0;
}

/* Stats text */
.fs-upload-stats {
	font-size: 13px;
	font-weight: 500;
	color: #333;
}

/* Close button */
.fs-upload-close-btn {
	padding: 10px 20px;
	background: #4a90d9;
	color: white;
	border: none;
	border-radius: 6px;
	cursor: pointer;
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 14px;
	font-weight: 500;
	transition: background 0.15s, transform 0.1s;
}

.fs-upload-close-btn:hover {
	background: #3a7bc8;
}

.fs-upload-close-btn:active {
	transform: scale(0.98);
}

/* =========================================
   File Store Choice Dialog (Replace/Copy)
   ========================================= */

.fs-choice-dialog.ui-dialog {
	border-radius: 12px;
	box-shadow: 0 4px 20px rgba(0,0,0,0.15);
	overflow: hidden;
	border: none;
}

.fs-choice-dialog .ui-dialog-titlebar {
	background: #F3F3F3;
	border: none;
	padding: 16px 20px;
	border-bottom: 1px solid #e0e0e0;
	border-radius: 12px 12px 0 0;
}

.fs-choice-dialog .ui-dialog-title {
	color: #333;
	font-size: 16px;
	font-weight: 600;
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif; font-weight: 600;
}

.fs-choice-dialog .ui-dialog-titlebar-close {
	background: transparent !important;
	border: none !important;
	right: 8px;
	top: 50%;
	transform: translateY(-50%);
	width: 32px;
	height: 32px;
	border-radius: 6px;
	transition: background 0.15s;
	margin: 0;
	padding: 0;
}

.fs-choice-dialog .ui-dialog-titlebar-close:hover {
	background: #e0e0e0 !important;
}

.fs-choice-dialog .ui-dialog-titlebar-close .ui-icon,
.fs-choice-dialog .ui-dialog-titlebar-close .ui-button-icon {
	display: none;
}

.fs-choice-dialog .ui-dialog-titlebar-close:before {
	content: "\00d7";
	font-size: 24px;
	color: #666;
	line-height: 32px;
	display: block;
	text-align: center;
}

.fs-choice-dialog .ui-dialog-content {
	padding: 24px;
	font-size: 14px;
	color: #333;
	line-height: 1.6;
	background: #fff;
}

.fs-choice-dialog .ui-dialog-buttonpane {
	background: #fafafa;
	border-top: 1px solid #e0e0e0;
	padding: 16px 20px;
	margin-top: 0;
}

.fs-choice-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	float: none;
	display: flex;
	justify-content: flex-end;
	gap: 10px;
}

.fs-choice-dialog .ui-dialog-buttonpane button {
	padding: 10px 20px;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
	transition: background 0.15s, transform 0.1s;
	margin: 0;
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;
	white-space: nowrap;
}

.fs-choice-dialog .ui-dialog-buttonpane button:active {
	transform: scale(0.98);
}

/* Primary button (Replace) */
.fs-choice-dialog .ui-dialog-buttonpane button:first-child {
	background: #4a90d9;
	color: white;
	border: none;
}

.fs-choice-dialog .ui-dialog-buttonpane button:first-child:hover {
	background: #3a7bc8;
}

/* Secondary button (Create Copy) */
.fs-choice-dialog .ui-dialog-buttonpane button:last-child {
	background: white;
	color: #333;
	border: 1px solid #ddd;
}

.fs-choice-dialog .ui-dialog-buttonpane button:last-child:hover {
	background: #f5f5f5;
}

/* =========================================
   File Store Upload Options Dialog (Google Drive style)
   ========================================= */

.fs-upload-options-dialog.ui-dialog {
	border-radius: 12px;
	box-shadow: 0 4px 20px rgba(0,0,0,0.15);
	overflow: hidden;
	border: none;
}

.fs-upload-options-dialog .ui-dialog-titlebar {
	background: #fff;
	border: none;
	padding: 24px 24px 0 24px;
}

.fs-upload-options-dialog .ui-dialog-title {
	color: #333;
	font-size: 22px;
	font-weight: 400;
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Hide the X button */
.fs-upload-options-dialog .ui-dialog-titlebar-close {
	display: none;
}

.fs-upload-options-dialog .ui-dialog-content {
	padding: 16px 24px 5px 24px;
	background: #fff;
}

.fs-upload-options-message {
	color: #555;
	font-size: 14px;
	line-height: 1.5;
	margin: 0 0 20px 0;
}

.fs-upload-options-choices {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.fs-upload-option {
	display: flex;
	align-items: center;
	gap: 12px;
	cursor: pointer;
}

.fs-upload-option input[type="radio"] {
	display: none;
}

.fs-upload-option-radio {
	width: 20px;
	height: 20px;
	border: 2px solid #666;
	border-radius: 50%;
	position: relative;
	flex-shrink: 0;
}

.fs-upload-option input[type="radio"]:checked + .fs-upload-option-radio {
	border-color: #4a90d9;
}

.fs-upload-option input[type="radio"]:checked + .fs-upload-option-radio::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 10px;
	height: 10px;
	background: #4a90d9;
	border-radius: 50%;
}

.fs-upload-option-label {
	font-size: 14px;
	color: #333;
}

/* Button pane */
.fs-upload-options-dialog .ui-dialog-buttonpane {
	background: #fff;
	border-top: none;
	padding: 8px 24px 24px 24px;
	margin-top: 0;
}

.fs-upload-options-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	float: none;
	display: flex;
	justify-content: flex-end;
	gap: 12px;
}

/* Cancel button */
.fs-upload-options-dialog button.fs-upload-options-cancel {
	background: #F3F3F3 !important;
	color: #333 !important;
	border: none !important;
	padding: 10px 20px !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	cursor: pointer;
	border-radius: 20px !important;
}

.fs-upload-options-dialog button.fs-upload-options-cancel:hover {
	background: #e5e5e5 !important;
}

/* Upload button - pill style */
.fs-upload-options-dialog button.fs-upload-options-upload {
	background: #4a90d9 !important;
	color: white !important;
	border: none !important;
	padding: 10px 24px !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	cursor: pointer;
	border-radius: 20px !important;
}

.fs-upload-options-dialog button.fs-upload-options-upload:hover {
	background: #3a7bc8 !important;
}

/** Time Zone Picker **/
div.tz-picker-wrapper {
	cursor: pointer;
}

div.tz-picker-wrapper span {
	color: #2b5b83;
}
div.tz-picker-wrapper div.button.search {
	float: right;
}

div.tz-picker-wrapper span:hover {
	text-decoration: underline;
}

div.tz-picker {
	text-align: center;
}

select.tz-select {
	margin-top: 10px;
}

/** Software updates **/

.software_updates {
	width: 80%;
	table-layout: fixed;
	border: 1px solid black;
}

.admin_busy {
	background: rgba(80,57,57,0.2);
	position: absolute;
	top: 0px;
	left: 0px;
}


/** ===== Email module (list + reader) =====
    The list rides the shared entity-list shell; these rules add only the
    email-specific presentation: direction badges, snippet previews, regarding
    chips, smart dates, the Received/Sent scope pill, and the reader. **/

/* — mail workspace: list rail left, reader right — */
.email-ws-root .email-ws {
	display: flex;
	gap: 14px;
	flex: 1 1 auto;
	min-height: 0;
}

.email-ws-list-pane {
	/* min-width 0 is load-bearing: without it the flex item's automatic minimum
	   inherits the rows' intrinsic (un-ellipsized) text width and the rail
	   blows past its basis. */
	flex: 0 0 360px;
	width: 360px;
	max-width: 360px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
	background: #F3F3F3;
	border-radius: 12px;
	padding: 10px;
	box-sizing: border-box;
}

.email-ws-scroll {
	flex: 1 1 0;
	min-height: 0;
	overflow-y: auto;
}

.email-ws-list {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.email-ws-row {
	display: block;
	width: 100%;
	text-align: left;
	border: none;
	border-radius: 8px;
	background: #ffffff;
	padding: 9px 12px;
	cursor: pointer;
	box-sizing: border-box;
	font-family: 'Manrope', sans-serif;
	transition: background-color 0.15s ease;
}

.email-ws-row:hover {
	background: #f8f8f8;
}

.email-ws-row-selected,
.email-ws-row-selected:hover {
	background: #E9F2FF;
}

.email-ws-row-top {
	display: flex;
	align-items: baseline;
	gap: 8px;
}

.email-ws-row-from {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 12px;
	font-weight: 600;
	color: #24384d;
}

.email-ws-row-time {
	flex: 0 0 auto;
	font-size: 11px;
	color: #8a97a8;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.email-ws-row-subject {
	margin-top: 2px;
	font-size: 13px;
	font-weight: 600;
	color: #0f172a;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.email-ws-row-snippet {
	margin-top: 1px;
	font-size: 12px;
	color: #99a2ac;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	min-height: 16px;
}

.email-ws-row-selected .email-ws-row-from,
.email-ws-row-selected .email-ws-row-subject {
	color: #0D417C;
}

.email-ws-row-selected .email-ws-row-time,
.email-ws-row-selected .email-ws-row-snippet {
	color: #4470a3;
}

.email-ws-status {
	padding: 12px 14px;
	text-align: center;
	font-size: 11px;
	color: #99a2ac;
}

.email-ws-sentinel {
	height: 1px;
}

.email-ws-reader-pane {
	flex: 1 1 auto;
	min-width: 0;
	min-height: 0;
	overflow-y: auto;
}

.email-ws-reader-pane .email-reader {
	max-width: none;
	margin: 0;
	padding-top: 0;
}

.email-ws-reader-empty {
	height: 100%;
	min-height: 240px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	cursor: default;
}

.email-ws-reader-empty-title {
	font-size: 13px;
	font-weight: 600;
	color: #64707c;
}

.email-ws-reader-empty-hint {
	font-size: 12px;
	color: #99a2ac;
}


/* — empty state — */
.email-list-empty {
	padding: 44px 16px;
	text-align: center;
	cursor: default;
}

.email-list-empty-title {
	font-size: 13px;
	font-weight: 600;
	color: #64707c;
}

.email-list-empty-hint {
	margin-top: 4px;
	font-size: 12px;
	color: #99a2ac;
}

/* — reader — */
.email-reader {
	max-width: 900px;
	margin: 0 auto;
	padding: 10px 4px 32px;
	box-sizing: border-box;
	font-family: 'Manrope', sans-serif;
}

.email-reader-dialog .email-reader {
	max-width: none;
	margin: 0;
	padding: 0;
}

.email-reader-header {
	background: #F3F3F3;
	border-radius: 12px;
	padding: 16px 18px;
}

.email-reader-topline {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.email-reader-subject {
	font-size: 18px;
	font-weight: 700;
	color: #000;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.email-reader-topline-spacer {
	flex: 1 1 auto;
}

.email-reader-download {
	display: inline-flex;
	align-items: center;
	height: 30px;
	padding: 0 12px;
	border: 1px solid #C6C6C6;
	border-radius: 8px;
	background: #ffffff;
	color: #24384d;
	font-size: 12px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.email-reader-download:hover {
	background: #f8f8f8;
	border-color: #B8B8B8;
	text-decoration: none;
}

.email-reader-sender {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 14px;
}

.email-reader-avatar {
	flex: 0 0 40px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #E9F2FF;
	color: #0D417C;
	font-size: 14px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: inset 0 0 0 1px rgba(13, 65, 124, 0.14);
	user-select: none;
}

.email-reader-sender-lines {
	flex: 1 1 auto;
	min-width: 0;
}

.email-reader-sender-name {
	font-size: 14px;
	font-weight: 600;
	color: #24384d;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.email-reader-sender-name a {
	color: #24384d;
	text-decoration: none;
	cursor: pointer;
}

.email-reader-sender-name a:hover {
	color: #0D417C;
	text-decoration: underline;
}

.email-reader-sender-address {
	font-size: 12px;
	color: #8a97a8;
	margin-top: 1px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.email-reader-times {
	flex: 0 0 auto;
	text-align: right;
}

.email-reader-time-primary {
	font-size: 12px;
	font-weight: 600;
	color: #5c6b7c;
}

.email-reader-time-secondary {
	font-size: 11px;
	color: #99a2ac;
	margin-top: 2px;
}

.email-reader-meta {
	margin-top: 14px;
	padding-top: 12px;
	border-top: 1px solid #E4E4E4;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.email-reader-meta-row {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.email-reader-meta-label {
	flex: 0 0 68px;
	font-size: 11px;
	font-weight: 600;
	color: #99a2ac;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	line-height: 24px;
}

.email-reader-chips {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	min-width: 0;
}

.email-reader-chip {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	height: 24px;
	padding: 0 10px;
	border-radius: 999px;
	background: #ffffff;
	border: 1px solid #D9DEE5;
	font-size: 12px;
	color: #24384d;
	box-sizing: border-box;
	max-width: 260px;
}

.email-reader-chip > span,
.email-reader-chip > a {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.email-reader-chip a {
	color: #0D417C;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
}

.email-reader-chip a:hover {
	text-decoration: underline;
}

.email-reader-chip-remove {
	flex: 0 0 auto;
	cursor: pointer;
	color: #99a2ac;
	font-size: 14px;
	line-height: 1;
	padding-left: 1px;
}

.email-reader-chip-remove:hover {
	color: #B3261E;
}

.email-reader-chip-add {
	border-style: dashed;
	border-color: rgba(0, 0, 0, 0.2);
	background: transparent;
	color: #4c6076;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 500;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.email-reader-chip-add:hover {
	background: #ffffff;
}

.email-reader-attachments {
	margin-top: 12px;
}

.email-reader-attachment-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.email-reader-attachment {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 34px;
	padding: 0 12px 0 6px;
	border-radius: 9px;
	background: #ffffff;
	border: 1px solid #E1E5EA;
	cursor: pointer;
	text-decoration: none;
	box-shadow: 0 1px 2px rgba(11, 28, 49, 0.06);
	transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.email-reader-attachment:hover {
	border-color: #C9D2DD;
	box-shadow: 0 3px 8px rgba(11, 28, 49, 0.10);
	text-decoration: none;
}

.email-reader-attachment-ext {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 22px;
	min-width: 34px;
	padding: 0 5px;
	border-radius: 6px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.4px;
	box-sizing: border-box;
}

.email-reader-attachment-ext-pdf { background: #FDECEC; color: #B3261E; }
.email-reader-attachment-ext-doc { background: #E9F2FF; color: #0D417C; }
.email-reader-attachment-ext-sheet { background: #E6F4EA; color: #1E7B34; }
.email-reader-attachment-ext-image { background: #F3ECFD; color: #6B3FA0; }
.email-reader-attachment-ext-default { background: #EFF2F7; color: #4C6076; }

.email-reader-attachment-name {
	font-size: 12px;
	font-weight: 600;
	color: #24384d;
	max-width: 220px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.email-reader-attachment-size {
	font-size: 11px;
	color: #99a2ac;
}

.email-reader-body {
	margin-top: 12px;
	background: #ffffff;
	border: 1px solid #E4E4E4;
	border-radius: 12px;
	padding: 16px 20px;
	overflow: hidden;
}

.email-reader-frame {
	width: 100%;
	border: 0;
	min-height: 120px;
	display: block;
}

.email-reader-frame-remote {
	min-height: 480px;
}

.global_search_row {
	cursor: pointer;
}

.global_search_row:hover {
	background-color: highlight;
}

.note_display {
	border: 1px solid #d5d5d5;
	padding: 10px;
}

.note_display:not(:first-child) {
	margin-top: 10px;
}

.note_display h4 {
	color: #161b5e;
	font-size: 11px;
	text-decoration: underline;
	margin: 0px;
	margin-bottom: 8px;
	padding: 0px;
}

.note_display hr {
	border-collapse: collapse;
	border: 1px solid #999;
	border-bottom: none;
}

.note_body {
	white-space: normal;
	word-wrap: break-word;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 5px;
	padding: 10px;
	background-color: #f5f5f5;
}

.note_body p,
.contact-note-body p,
.note_print_body p,
.note-form-rich-host p {
	margin: 0 0 10px;
}

.note_body p:last-child,
.contact-note-body p:last-child,
.note_print_body p:last-child,
.note-form-rich-host p:last-child {
	margin-bottom: 0;
}

.note_body ul,
.note_body ol,
.contact-note-body ul,
.contact-note-body ol,
.note_print_body ul,
.note_print_body ol,
.note-form-rich-host ul,
.note-form-rich-host ol {
	margin: 0 0 10px 22px;
	padding: 0;
}

.note_body li,
.contact-note-body li,
.note_print_body li,
.note-form-rich-host li {
	margin-bottom: 4px;
}

.note_body a,
.contact-note-body a,
.note_print_body a,
.note-form-rich-host a {
	color: #0f6cbd;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
	word-break: break-word;
}

.note_body a:hover,
.contact-note-body a:hover,
.note_print_body a:hover,
.note-form-rich-host a:hover {
	color: #0b5a9f;
}

.note-rich-editor-shell {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 0;
	flex: 1;
}

.note-rich-editor-toolbar {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 2;
	display: flex;
	flex-direction: column;
	gap: 2px;
	background: #F5F5F5;
	border-radius: 8px;
	padding: 4px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 8px rgba(0, 0, 0, 0.05);
}

.note-rich-link-popover {
	position: absolute;
	top: 0;
	right: calc(100% + 10px);
	z-index: 3;
	width: 240px;
	padding: 12px;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	background: #ffffff;
	box-shadow: 0 12px 32px rgba(15, 23, 42, 0.14), 0 4px 12px rgba(15, 23, 42, 0.08);
	box-sizing: border-box;
}

.note-rich-link-label {
	display: block;
	margin-bottom: 6px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: #475569;
}

.note-rich-link-input {
	width: 100%;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	padding: 8px 10px;
	font-size: 13px;
	line-height: 1.4;
	color: #0f172a;
	background: #ffffff;
	box-sizing: border-box;
}

.note-rich-link-input:focus {
	outline: none;
	border-color: #94a3b8;
	box-shadow: 0 0 0 3px rgba(148, 163, 184, 0.2);
}

.note-rich-link-error {
	margin-top: 7px;
	font-size: 11px;
	line-height: 1.4;
	color: #b42318;
}

.note-rich-link-actions {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 6px;
	margin-top: 10px;
}

.note-rich-link-action {
	border: 1px solid #d0d7de;
	border-radius: 999px;
	background: #ffffff;
	color: #334155;
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	padding: 8px 12px;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.note-rich-link-action:hover {
	background: #f8fafc;
	border-color: #94a3b8;
}

.note-rich-link-action.primary {
	background: #0f172a;
	border-color: #0f172a;
	color: #ffffff;
}

.note-rich-link-action.primary:hover {
	background: #1e293b;
	border-color: #1e293b;
}

.note-rich-link-action.secondary {
	color: #0f6cbd;
}

/* #1672: note font sizes. Relative to the note's own text so the three sizes stay in
   proportion wherever a note is rendered - the editor, the read-only panel and the
   Activity Center all inherit their own base size. */
.note-fs-sm {
	font-size: 0.85em;
}

.note-fs-lg {
	font-size: 1.25em;
}

.note-fs-xl {
	font-size: 1.6em;
}

/* #1740: the size menu opens beside the toolbar, level with its button. Each option is shown
   at its own size. */
.note-rich-size-menu {
	position: absolute;
	right: calc(100% + 8px);
	z-index: 3;
	display: flex;
	flex-direction: column;
	min-width: 120px;
	padding: 4px;
	border: 1px solid #e2e8f0;
	border-radius: 10px;
	background: #ffffff;
	box-shadow: 0 12px 32px rgba(15, 23, 42, 0.14), 0 4px 12px rgba(15, 23, 42, 0.08);
	box-sizing: border-box;
}

.note-rich-size-option {
	display: flex;
	align-items: center;
	min-height: 32px;
	padding: 4px 10px;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: #334155;
	font-size: 13px;
	line-height: 1.2;
	text-align: left;
	white-space: nowrap;
	cursor: pointer;
}

.note-rich-size-option:hover,
.note-rich-size-option:focus-visible {
	outline: none;
	background: #f1f5f9;
}

.note-rich-size-option.is-current {
	background: #e8eef6;
	color: #0f172a;
	font-weight: 600;
}

.note-rich-toolbar-button {
	width: 28px;
	height: 28px;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: #64748b;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.note-rich-toolbar-button:hover:not(:disabled):not(.active) {
	background: #DCDCDC;
}

.note-rich-toolbar-button:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.3);
}

.note-rich-toolbar-button.active {
	background: #000000;
	color: #ffffff;
}

.note-rich-toolbar-button:disabled {
	opacity: 0.35;
	cursor: default;
}

.note-rich-toolbar-icon {
	width: 16px;
	height: 16px;
}

/* #1740: a collapsed toolbar keeps only its toggle, so the note gets its width back. */
.note-rich-editor-toolbar.is-collapsed > :not(.note-rich-toolbar-collapse) {
	display: none !important;
}

.note-rich-toolbar-collapse {
	align-self: flex-end;
}

.note-rich-toolbar-button[data-command="link"] .note-rich-toolbar-icon {
	width: 14px;
	height: 14px;
}

.note-rich-toolbar-button.active .note-rich-toolbar-icon {
	filter: brightness(0) invert(1);
}

.note-rich-editor-host {
	position: relative;
	min-height: 0;
	outline: none;
	word-break: break-word;
}

.note-rich-editor-host.is-empty:before {
	content: attr(data-placeholder);
	position: absolute;
	top: 0;
	left: 0;
	color: #94a3b8;
	pointer-events: none;
}

.note-rich-editor-host.read-only:before {
	content: none;
}

.note-rich-editor-host.cke_editable_inline:focus {
	outline: none;
}

.cke_float .cke_top:empty,
.cke_float .cke_top:has(.cke_toolbox:empty) {
	display: none;
}

.cke_float:has(.cke_top:empty),
.cke_float:has(.cke_toolbox:empty) {
	display: none;
}

.note_regarding {
	color: #555;
	font-size: 11px;
	margin-top: 5px;
}

.note_regarding_items {
	display: inline;
}

.note_attachment {
	color: #555;
	font-size: 11px;
	margin-top: 5px;
}

.note_attachment_items {
	display: inline;
}

.note_sub_item {
	color: #555;
    font-size: 11px;
    display: inline-block;
    margin: 5px;
    padding: 3px;
    border: 1px solid #a0a0a0;
    cursor: pointer;
    border-radius: 4px;
}

.note_sub_item:hover {
    border: 1px solid #a0a0a0;
}

.note_sub_item div.button {
	width: 12px;
	height: 12px;
}

.note_attachment_error {
	display: none;
	position: relative;
	bottom: 125px;
	width: 95%;
	color: red;
	padding: 8px;
	text-align: center;
}

.note_dropzone {
	border: 2px dashed #c0c0c0;
	height: 200px;
	width: 98%;
}

.note_attachment_progress_bar {
	display: none;
	position: relative;
	bottom: 100px;
	width: 85%;
	color: red;
	text-align: center;
	margin: 0 auto;
	z-index: -1;
}

/* ===== Multi-lookup record picker ("Choose Entity" dialog) ===== */

.multi-lookup-dialog.ui-dialog {
	padding: 0;
	max-width: calc(100vw - 32px);
	border: 1px solid rgba(26, 42, 58, .1);
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 24px 64px rgba(15, 30, 50, .22), 0 6px 16px rgba(15, 30, 50, .08);
	overflow: hidden;
	animation: multi-lookup-dialog-in .18s cubic-bezier(.2, .8, .3, 1);
}

@keyframes multi-lookup-dialog-in {
	from {
		opacity: 0;
		transform: translateY(8px) scale(.985);
	}
}

@media (prefers-reduced-motion: reduce) {
	.multi-lookup-dialog.ui-dialog {
		animation: none;
	}
}

.multi-lookup-dialog .ui-dialog-titlebar {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 4;
	width: auto;
	height: 30px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.multi-lookup-dialog .ui-dialog-title,
.multi-lookup-dialog .ui-dialog-titlebar-maximize {
	display: none !important;
}

.multi-lookup-dialog .ui-dialog-titlebar-close {
	position: static;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	margin: 0;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 7px;
	background: transparent;
	color: #6f7782;
	box-sizing: border-box;
	cursor: pointer;
}

.multi-lookup-dialog .ui-dialog-titlebar-close:hover {
	border-color: #d9dee5;
	background: #f5f5f5;
	color: #252a31;
}

.multi-lookup-dialog .ui-dialog-titlebar-close:focus-visible {
	outline: none;
	border-color: #b8c0ca;
	box-shadow: 0 0 0 2px rgba(15, 23, 42, .12);
}

.multi-lookup-dialog .ui-dialog-titlebar-close .ui-icon,
.multi-lookup-dialog .ui-dialog-titlebar-close .ui-button-icon,
.multi-lookup-dialog .ui-dialog-titlebar-close .ui-button-icon-primary,
.multi-lookup-dialog .ui-dialog-titlebar-close .ui-button-text {
	display: none;
}

.multi-lookup-dialog .ui-dialog-titlebar-close:before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.multi-lookup-dialog .ui-dialog-content {
	display: flex !important;
	flex-direction: column;
	min-height: 0 !important;
	padding: 20px 20px 16px;
	border: 0;
	background: #fff !important;
	color: #243244;
	overflow: hidden !important;
	box-sizing: border-box;
}

.multi-lookup-selector {
	--mlk-icon: url("/images/contacts/related.svg");
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-height: 0;
	height: 100%;
	color: #243244;
}

.multi-lookup-header {
	flex: 0 0 auto;
	padding-right: 36px;
}

.multi-lookup-heading {
	margin: 0 0 2px;
	color: #16202d;
	font-size: 17px;
	font-weight: 700;
	line-height: 24px;
}

.multi-lookup-intro {
	margin: 0 0 14px;
	color: #64748b;
	font-size: 13px;
	font-weight: 500;
	line-height: 18px;
}

/* unified scoped search bar */

.multi-lookup-searchbar {
	display: flex;
	align-items: stretch;
	height: 44px;
	margin-bottom: 12px;
	border: 1px solid #d7dee8;
	border-radius: 9px;
	background: #fff;
	box-sizing: border-box;
	flex: 0 0 auto;
	overflow: hidden;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.multi-lookup-searchbar:focus-within {
	border-color: #3b82f6;
	box-shadow: 0 0 0 3px rgba(59, 130, 246, .14);
}

.multi-lookup-scope {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 0 26px 0 12px;
	border-right: 1px solid #e3e3e3;
	background: #f3f3f3;
	cursor: pointer;
	flex: 0 0 auto;
	transition: background-color .12s ease;
}

.multi-lookup-scope:hover {
	background: #e9e9e9;
}

.multi-lookup-scope::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 11px;
	width: 0;
	height: 0;
	margin-top: -2px;
	border-right: 4px solid transparent;
	border-left: 4px solid transparent;
	border-top: 5px solid #64748b;
	pointer-events: none;
}

.multi-lookup-scope-icon {
	width: 16px;
	height: 16px;
	flex: 0 0 auto;
	background: var(--mlk-icon) center / contain no-repeat;
	pointer-events: none;
}

.multi-lookup-dialog select.multi-lookup-type-select {
	height: 100%;
	max-width: 190px;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: #2b3b4e;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	outline: none;
	box-shadow: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

/* The native <select> is kept as the source of truth but hidden; the scope acts as the
   trigger and a DOM menu (.multi-lookup-type-menu) renders the styleable option list. */
.multi-lookup-dialog select.multi-lookup-type-select.multi-lookup-type-select-native {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: 0;
	opacity: 0;
	pointer-events: none;
	overflow: hidden;
}

.multi-lookup-scope-label {
	max-width: 190px;
	overflow: hidden;
	color: #2b3b4e;
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.multi-lookup-scope.is-open::after {
	transform: rotate(180deg);
}

.multi-lookup-type-menu {
	position: fixed;
	z-index: 10001;
	min-width: 160px;
	max-height: 280px;
	overflow-y: auto;
	padding: 4px;
	background: #fff;
	border: 1px solid #e3e3e3;
	border-radius: 8px;
	box-shadow: 0 8px 24px rgba(15, 23, 42, .16);
}

.multi-lookup-type-option {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	border-radius: 6px;
	color: #2b3b4e;
	font-size: 13px;
	white-space: nowrap;
	cursor: pointer;
}

.multi-lookup-type-option:hover,
.multi-lookup-type-option.is-active {
	background: #f1f5f9;
}

.multi-lookup-type-option[aria-selected="true"] {
	font-weight: 600;
	background: #eef2f7;
}

.multi-lookup-type-option-icon {
	width: 16px;
	height: 16px;
	flex: 0 0 auto;
	background: center / contain no-repeat;
}

.multi-lookup-search-slot {
	position: relative;
	display: flex;
	align-items: center;
	flex: 1 1 auto;
	min-width: 0;
}

.multi-lookup-search-icon {
	position: absolute;
	left: 13px;
	width: 15px;
	height: 15px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Ccircle cx='7' cy='7' r='5' stroke='%2393a1b3' stroke-width='1.6'/%3E%3Cpath d='M14.2 14.2L10.6 10.6' stroke='%2393a1b3' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
	pointer-events: none;
}

.multi-lookup-dialog input.multi-lookup-search-input {
	flex: 1 1 auto;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0 12px 0 38px;
	border: 0;
	background: transparent;
	color: #1f2937;
	font-size: 14px;
	font-weight: 500;
	outline: none;
	box-shadow: none;
	box-sizing: border-box;
}

.multi-lookup-dialog input.multi-lookup-search-input::placeholder {
	color: #9aa7b6;
	font-weight: 500;
}

/* results */

.multi-lookup-dialog .dataTables_length,
.multi-lookup-dialog .dataTables_filter,
.multi-lookup-dialog .multi-lookup-results .custom_table_select {
	display: none;
}

.multi-lookup-results {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-height: 0;
}

/* the table widget injects an unclassed host div around the dataTables wrapper */
.multi-lookup-results > div {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-height: 0;
}

.multi-lookup-results-wrapper {
	position: relative;
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-height: 0;
	color: #243244;
}

.multi-lookup-table-shell {
	flex: 1 1 auto;
	min-height: 0;
	border: 1px solid #e4eaf1;
	border-radius: 10px;
	background: #fff;
	overflow-x: hidden;
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-width: none;
	-ms-overflow-style: none;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 1px 2px rgba(15, 30, 50, .04);
}

/* Keep the result list scrollable without reserving a native scrollbar gutter. */
.multi-lookup-table-shell::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}

.multi-lookup-table-shell::-webkit-scrollbar-track,
.multi-lookup-table-shell::-webkit-scrollbar-track-piece,
.multi-lookup-table-shell::-webkit-scrollbar-corner {
	background: transparent;
	border: 0;
	box-shadow: none;
}

.multi-lookup-table-shell::-webkit-scrollbar-button {
	display: none;
	width: 0;
	height: 0;
}

.multi-lookup-table-shell::-webkit-scrollbar-thumb {
	background: transparent;
	border: 0;
}

.multi-lookup-dialog .multi-lookup-table-shell table {
	width: 100% !important;
	min-width: 100%;
	margin: 0 !important;
	border-collapse: separate;
	/* override table.table_builder's "0 3px" which leaves a gap above the sticky header */
	border-spacing: 0 !important;
	background: #fff !important;
	font-size: 13px;
}

.multi-lookup-dialog .multi-lookup-table-shell thead th {
	position: sticky;
	top: 0;
	z-index: 1;
	padding: 9px 12px !important;
	border: 0;
	border-bottom: 1px solid #e4eaf1 !important;
	background: #f3f3f3 !important;
	background-image: none !important;
	color: #7b8794;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	line-height: 16px;
	text-align: left !important;
	white-space: nowrap;
	cursor: pointer;
}

.multi-lookup-dialog .multi-lookup-table-shell thead th:first-child {
	border-top-left-radius: 9px;
}

.multi-lookup-dialog .multi-lookup-table-shell thead th:last-child {
	border-top-right-radius: 9px;
}

.multi-lookup-dialog .multi-lookup-table-shell thead th.sorting,
.multi-lookup-dialog .multi-lookup-table-shell thead th.sorting_asc,
.multi-lookup-dialog .multi-lookup-table-shell thead th.sorting_desc {
	background-image: none !important;
}

.multi-lookup-dialog .multi-lookup-table-shell thead th:first-child {
	padding-left: 48px !important;
}

.multi-lookup-table-shell thead th.sorting:after,
.multi-lookup-table-shell thead th.sorting_asc:after,
.multi-lookup-table-shell thead th.sorting_desc:after {
	content: "";
	display: inline-block;
	width: 0;
	height: 0;
	margin-left: 6px;
	vertical-align: 2px;
	border-right: 4px solid transparent;
	border-left: 4px solid transparent;
	border-top: 5px solid #b6c2cf;
}

.multi-lookup-table-shell thead th.sorting_asc:after {
	border-top: 0;
	border-bottom: 5px solid #3b82f6;
}

.multi-lookup-table-shell thead th.sorting_desc:after {
	border-top-color: #3b82f6;
}

.multi-lookup-table-shell tbody tr {
	cursor: pointer;
}

.multi-lookup-dialog .multi-lookup-table-shell tbody td {
	position: relative;
	padding: 9px 14px !important;
	border: 0;
	border-bottom: 1px solid #eef2f7 !important;
	background: #fff !important;
	color: #2a3a4d;
	font-size: 13px;
	font-weight: 500;
	line-height: 22px;
	text-align: left !important;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	transition: background-color .12s ease;
	background-clip: padding-box;
}

.multi-lookup-dialog .multi-lookup-table-shell tbody tr:last-child td {
	border-bottom: 0 !important;
}

.multi-lookup-dialog .multi-lookup-table-shell tbody td:first-child:not(.dataTables_empty) {
	padding-left: 48px !important;
}

.multi-lookup-avatar {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 27px;
	height: 27px;
	border-radius: 50%;
	overflow: hidden;
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .02em;
	line-height: 1;
	text-transform: uppercase;
	user-select: none;
	pointer-events: none;
}

/* canonical avatar renderer (uix.LookupDropdownPanel) injects the photo as this image */
.multi-lookup-avatar .lookup-dropdown-avatar-image {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	border-radius: 50%;
}

.multi-lookup-dialog .multi-lookup-table-shell tbody td:last-child:not(.dataTables_empty) {
	padding-right: 96px !important;
}

.multi-lookup-table-shell tbody td:last-child:not(.dataTables_empty)::after {
	content: "Select";
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	padding: 3px 9px;
	border-radius: 6px;
	background: #e7f0fe;
	color: #2f6fe4;
	font-size: 11px;
	font-weight: 700;
	line-height: 16px;
	opacity: 0;
	transition: opacity .12s ease;
	pointer-events: none;
}

.multi-lookup-dialog .multi-lookup-table-shell tbody tr:hover td:not(.dataTables_empty) {
	background: #f4f8fd !important;
}

.multi-lookup-dialog .multi-lookup-table-shell tbody tr:hover td:last-child:not(.dataTables_empty)::after {
	opacity: 1;
}

.multi-lookup-dialog .multi-lookup-table-shell tbody td.dataTables_empty {
	padding: 44px 16px !important;
	border: 0;
	background: #fff !important;
	color: #8a97a8;
	font-size: 13px;
	font-weight: 500;
	text-align: center !important;
	cursor: default;
}

.multi-lookup-dialog td.dataTables_empty::before {
	content: "";
	display: block;
	width: 26px;
	height: 26px;
	margin: 0 auto 10px;
	background: var(--mlk-icon) center / contain no-repeat;
	opacity: .55;
}

.multi-lookup-dialog .dataTables_processing {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 3;
	width: auto;
	height: auto;
	margin: 0;
	padding: 7px 14px;
	border: 1px solid #e4eaf1;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 8px 24px rgba(15, 30, 50, .14);
	color: #51617a;
	font-size: 12px;
	font-weight: 600;
	transform: translate(-50%, -50%);
}

/* footer: record count + pagination */

.multi-lookup-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding-top: 10px;
	flex: 0 0 auto;
}

.multi-lookup-dialog .dataTables_info {
	float: none;
	margin: 0;
	padding: 0 !important;
	color: #8a97a8;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
}

.multi-lookup-dialog .dataTables_paginate {
	display: none;
}

.quick-links-dropdown {
	box-sizing: border-box;
	color: #666;
	width: 100%;
	flex: 0 1 auto;
	min-height: 0;
	text-align: left;
	line-height: 1.4;
	background-color: #F3F3F3;
	border: none;
	border-radius: 12px;
	padding: 16px 25px 25px;
	position: relative;
	display: flex;
	flex-direction: column;
}

div.birthday-age {
	display: inline;
	position: relative;
	right: 40px;
	margin-right: -50px;
}

.contact_quick_links {
	width: 100%;
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.contact_quick_links::-webkit-scrollbar {
	display: none; /* Chrome/Safari */
}

.contact_quick_links ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.contact_quick_links ul li {
	text-align: left;
	margin-left: 0;
	margin-right: 0;
	cursor: pointer;
	padding: 3px 0;
	color: #6A6A6A;
	font-size: 15px;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

.contact_quick_links ul li:hover {
	color: #222;
}

.contact_quick_links ul li a {
	font-size: 14px;
	text-decoration: none;
	font-weight: normal;
}

.quick-nav-top-btn {
	position: absolute;
	top: 16px;
	right: 16px;
	width: 24px;
	height: 24px;
	border: 1.5px solid #666;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	background: transparent;
}

.quick-nav-top-btn:hover {
	background: rgba(0, 0, 0, 0.05);
}

.quick-nav-top-btn svg {
	width: 12px;
	height: 12px;
	stroke: #666;
}

/* advanced search */

div.adv-search-filter-group {
	position: relative;
    display: flex;
    flex-flow: column;
    gap: 10px;
}

div.adv-search-filter-group-filters {
	display:flex;
	flex-flow:column;
	gap:5px;
}

div.adv-search-filter-group > div.adv-search-filter-group {
	margin-left: 1em;
	white-space: pre;
}

div.adv-search-filter-group fieldset {
	border: none;
}

div.adv-search-filter-group-header > div {
	display: inline-block;
	vertical-align: middle;
	position: relative;
}

div.adv-search-filter-controls-group-right {
	float: right;
}

div.adv-search-filter-group.adv-search-bg-borders {
	border: 1px solid lightgray;
	margin-right: 5px;
	margin-bottom: 5px;
	background-color: rgba(128,128,128,0.1);
}

div.adv-search-filter-group.adv-search-marks > ::before {
	border-width: 0 0 2px 2px;
}

div.adv-search-filter-group.adv-search-marks > :first-child::before {
	top: -12px;
	height: calc(50% + 14px);
}

div.adv-search-filter-group.adv-search-marks > ::after {
	top: 50%;
	border-width: 0 0 0 2px;
}

div.adv-search-filter-group.adv-search-marks > ::after, div.adv-search-filter-group.adv-search-marks > ::before {
	content: '';
	position: absolute;
	left: -10px;
	width: 10px;
	height: calc(50% + 4px);
	border-color: #ccc;
	border-style: solid;
}

div.adv-search-filter-group-filter div {
	/*display: inline-block;*/
	display: inline-flex;
}

div.adv-search-filter-group-filter input {
	min-width: auto;
	max-width: 300px;
}

div.adv-search-filter-group-filter select {
	min-width: auto;
	max-width: 300px;
}

div.adv-search-filter-group-filter {
	margin: 3px;
	display:flex;
	flex-flow:column;
}

div.adv-search-filter > * {
	margin-left: 5px;
}

ul.adv-search-field-sortable-list {
	list-style-type: none;
	padding: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
}

ul.adv-search-field-sortable-list > li {
	cursor: move;
}

ul.adv-search-field-sortable-list > li > span.ui-icon {
	display: inline-block;
}

div.adv-search-display-fields-accordion h3.ui-accordion-header {
	padding-left: 2.2em;
	padding-top: 3px;
	padding-bottom: 3px;

	border: 1px solid #00529b;
	font-weight: bold;
	color: #00529b;
	background: #f5f8f9 url("/js/jquery/images/ui-bg_inset-hard_100_f5f8f9_1x100.png") 50% 50% repeat-x;
}

div.adv-search-display-fields-accordion div.ui-accordion-content {
	padding: 0px;
}

div.adv-search-btn-group > div {
	margin: 5px;
	margin-bottom: 10px;
}

tr.adv-search-custom-row > td {
	padding-top: 10px;
	padding-bottom: 10px;
}

div.fg-n-n-group > div > div > div > div.button.delete {
	display: none;
}

div.fg-1-n-group > div > div > div > div.button.delete {
	display: none;
}

ul.adv-search-field-sortable-list.ui-sortable {
	height: auto;
	min-height: 100px;
}

table.adv-search-fields-table {
	width: 100%;
	border: 0px;
	margin: 0px;
	padding: 0px;
}

table.adv-search-fields-table > tbody > tr > td {
	width: 50%;
	vertical-align: top;
}

/** notes **/

.notes_meta {
	font-size: 12px;
	font-style: italic;
}

.notes_meta ul {
	list-style-type: none;
    margin: 0px;
    padding-left: 10px;
}

.notes_meta ul li {
	font-size: 12px;
}

.notes_meta ul li span:first-child, .notes_meta ul li span:last-child {
	color: #c0c0c0;
}

.note_debug {
	overflow-y: auto;
	border: 1px solid blue;
	height: 100px;
}

.note_debug span {
	display: block;
}

.note_form_side_section {
	/*border: 1px solid #c0c0c0;*/
	margin-bottom: 10px;
	margin-left: 2.5%;
	width: 100%;
	height: 150px;
}

.note_form_side_section h3 {
	background-color: #d6e4f0;
	border: 1px solid #26bee0;
	color: #000000;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 3px;
	padding-bottom: 5px;
}

.note_form_side_content {
	height: 123px;
	overflow-y: auto;
	margin: 0px;
	padding: 0px;
}

.note_form_list_item {
	display: inline-block;
	border: 1px solid #c5dbec;
	color: #555;
	font-size: 13px;
	padding: 5px;
	cursor: pointer;
	margin: 2.5px;
	font-weight: bold;
	padding-right: 1px;
}

.note_form_list_item:hover {
	text-shadow: 2px 2px 2px #999;
}


/*
.note_form_list_item:not(:last-child) {
	border-bottom: 1px dashed #a0a0a0;
}
*/

.note_form_list_item:hover {
	color: #000;
	background-color: #f4f4f4;
}

.note_form_draft_marker {
	color: red;
	font-weight: bold;
}

.note-form-rich-editor {
	min-height: 310px;
}

.note-form-rich-editor .note-rich-editor-toolbar {
	top: 12px;
	right: 12px;
}

.note-form-rich-host {
	min-height: 310px;
	/* #1740: the toolbar's width plus its 12px inset and a gap. */
	padding-right: calc(var(--note-toolbar-width, 44px) + 22px);
	box-sizing: border-box;
	font-size: 14px;
	line-height: 1.55;
	color: #334155;
}

.note_side_wrapper {
	width: 95%;
	margin-left: 2%;
}

.note_comment_wrapper {
	position: absolute;
	width: 500px;
	height: 268px;
	border: 1px solid black;
	background-color: white;

}

.note_comment_title {
	margin: 0px;
	padding: 2px;
	background-color: #00529b;
	font-size: 14px;
}

.note_comment_content {
	height: 200px;
	margin: 0px;
	padding: 2px;
}

.note_comment_content textarea {
	width: 490px;
	height: 100%;
}

.note_comment_buttons {
	padding: 2px;
}

.note_comments_area_title {
	font-size: 13px;
}

.note_comment_item div {
	white-space: -moz-pre-wrap; /* Firefox */
	white-space: -pre-wrap; /* ancient Opera */
	white-space: -o-pre-wrap; /* newer Opera */
	white-space: pre-wrap; /* Chrome; W3C standard */
	word-wrap: break-word; /* IE */
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 5px;
	padding: 10px;
	background-color: #f5f5f5;
}

.note_comment_item h4 {
	color: #161b5e;
	font-size: 11px;
	text-decoration: underline;
	margin: 0px;
	margin-bottom: 8px;
	padding: 0px;
}

.note_close {
	float: right;
    display: block;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
	background-image: url("/js/jquery/images/ui-icons_6da8d5_256x240.png");
    background-position: -80px -128px;
    line-height: 17px;
    cursor: pointer;
    color: #555;
}

.notes_content {
	max-height: 350px;
	overflow-y: auto;
}

/* end notes */

/* CURRENCY INPUT CONTAINER - Legacy Forms */
div.currency_input {
	min-width: 395px;
	width: 98%;
	box-sizing: border-box;
}

div.currency_input input {
	min-width: 395px;
	width: 98%;
	box-sizing: border-box;
}

div.currency_input input:focus {
	outline: none;
	box-shadow: none;
}

div.currency_input span {
	display: inline-block;
	position: relative;
	right: 36px;
	margin-right: -35px;
	width: 33px;
	top: 1px;
	border: 1px solid #ccc;
	border-right: none;
	text-align: center;
	cursor: pointer;
}

/* custom entity table */
.custom_entity_table {
	width: 100%;
	margin-top: 10px;
	height: 600px;
	border-collapse: collapse;
	border-spacing: 0px;
}

.custom_entity_table * TD {
	margin: 0px;
	padding: 0px;
}

/*.custom_entity_table * td:first-child {*/
	/*width: 250px;*/
/*}*/

.custom_entity_table * .left_content {
	width: 250px;
	margin: 0px;
	padding: 0px;
	height: 700px;
	overflow-y: auto;
}

.custom_entity_table * .right_content {
	margin: 0px;
	padding: 0px;
	height: 700px;
	overflow-y: auto;
}

/* end custom entity table */

.custom_items_wrapper {
	display: flex;
	flex-flow:row;
	padding:10px;
	margin:0px;
	min-height: 600px;
}

.custom_items_wrapper .left_content {
	display: flex;
	flex-grow: 1;
	flex-flow: column;
    max-width: 260px;
    min-width: 260px;
	overflow-y:auto;
}

.custom_items_wrapper .right_content {
	display: flex;
	flex-grow: 1;
	flex-flow: column;
	margin-left:10px;
	margin-right:10px;
	justify-items: flex-start;
}

UL.custom_entity {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}

UL.custom_entity LI.entity {
	list-style-type: none;
	background-color: #ccc;
	font-size: 15px;
	border-radius: 2px;
	cursor: pointer;
	margin: 3px;
	padding: 0px;
	padding-top: 4px;
}

UL.custom_entity LI.entity:first-child {
	margin-top: 0px;
}

UL.custom_entity LI.entity span {
	display: inline-block;
	margin: 0px 5px 0px 5px;
	padding: 0px 5px 0px 5px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	width: 150px !important;
}

UL.custom_entity LI.entity .custom_entity_closed,
UL.custom_entity LI.entity .custom_entity_open {
	margin: 5px;
    margin-top: 0px;
}

UL.custom_options {
	background-color: white;
	list-style-type: none;
	padding: 0px;
	margin: 0px;
	margin-top: 5px;
}

UL.custom_options LI:hover {
	background-color: #f1f1f1;
	cursor: pointer;
	overflow:visible;
	text-overflow: none;
}

UL.custom_options LI {
	padding: 2.5px;
	padding-left: 20px;
	border: 1px solid #f0f0f0;
}

.custom_fields_table {
	width: 98%;
	table-layout: fixed;
	margin-left: 5px;
}

.custom_fields_table thead {
	font-size: 12px;
}

.custom_fields_table thead .title {
	background-color: #e0e0e0;
	border-radius: 4px;
	font-weight: 600;
	font-size: 16px;
	padding: 3px;
	padding-left: 10px !important;
}

.custom_fields_table thead .title span {
	font-size: 12px;
	font-style: italic;
	font-weight: normal;
}

.custom_fields_table thead tr th.title_button {
	width: 260px;
	text-align: center;
	padding-left:10px;
	padding-right:10px;
	background-color:white;
}

.custom_fields_table thead * th {
	background-color: #fafafa;
	text-align: left;
	padding: 2px !important;
	height: auto !important;
}

.custom_fields_table tbody * td {
	border-bottom: 1px solid #f0f0f0;
	padding: 2px !important;
	font-size: 14px;
	cursor: pointer;
}

.custom_fields_table:NOT(.form_table) tbody tr:hover * {
	background-color: highlight !important;
}

/*
.custom_fields_table tbody tr:active * {
	background-color: highlight !important;
}
*/

.custom_fields_table:NOT(.form_table) thead * th:last-child,
.custom_fields_table:NOT(.form_table) tbody * td:last-child {
	width: 30px;
	text-align: center;
}

.custom_fields_table:NOT(.form_table) tbody * td:nth-child(2) {
	background-color: #f4f4f4;
}

.custom_fields_table thead * th.title {
	text-align: left;
	font-size: 16px;
}

.custom_entities {
	list-style-type: none;
	font-weight: bold;
	padding: 0px;
	margin: 0px;
}

.custom_type::after {
	content: url(/images/icons/18/color/attachment.png);
	margin-left: 10px;
}

.custom_current {
	background-color: highlight;
}


.custom_form_table, .form_table {
	width: 99%;
	min-width: 600px;
	table-layout: fixed;
}

.custom_form_table:not(:first-child) {
	margin-top: 10px;
}

.custom_form_table tbody tr td {
	height: 35px;
	border: 1px dashed #444;
	margin: 25px;
}


/* CustomListTableEditor2 (the Layouts tab editor) renders into
   .fb_v4_right_content_bot, a flex column with flex-grow:1; height:0
   (form_builder_v4.css). The editor builds a div tree (was a <table>
   before) so we can chain display:flex cleanly. Earlier rules for
   .form_creator_left/right and .form_table set widths, min-widths and
   overflow-y that fight the flex sizing — overridden below.

   Flow:
     .fb_v4_right_content_bot          (flex column, bounded by parent)
     └── .custom_fields_table.form_table   (flex column, fills parent)
         ├── .layout_title             (flex: 0 0 auto — natural height)
         └── .form_creator_row         (flex row, fills remaining)
             ├── .form_creator_left    (flex: 8, flex column)
             │   └── .custom_header_list  (flex: 1 1 0, scroll)
             └── .form_creator_right   (flex: 2, flex column)
                 └── .form_creator_unused (flex: 1 1 0, scroll) */
.fb_v4_right_content_bot > .custom_fields_table.form_table {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    /* override .custom_fields_table { margin-left: 5px } — that 5px on
       top of width:100% pushed the editor past its parent and created
       a horizontal scrollbar. */
    margin: 0;
    overflow: hidden;
    box-sizing: border-box;
    padding: 15px;
    /* override .form_table { width:99%; min-width:600px; table-layout:fixed } */
    table-layout: auto;
}
/* override the older .form_creator_left {width:80%; min-width:500px; overflow-y:auto}
   and .custom_fields_table.form_table .form_creator_left {height:100%} */


.field_name  {
	width: 210px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-size: 12px;
}


.custom_field_display_table {
	width: 100%;
	border: none;
}

.custom_field_display_table tbody tr td {
	border: none;
}

.custom_field_display_table tbody tr td:first-child {
	width: 100px;
	text-align: right;
	background-color: #f3f3f3;
}

.custom_field_display_table tbody tr td:nth-child(2) * {
	width: 100%;
}

.custom_form_builder_field {
	display: inline-block;
	width: 49%;
	border: 1px dashed #ccc;
	font-size: 12px;
	padding: 2px;
	margin: 2px;
}

.custom_form_builder_field:first-child {
	margin-right: 15px;
}

.custom_form_builder_section {
	margin-bottom: 10px;
	border: 1px solid #d5d5d5;
	padding: 5px;
	font-size: 13px;
}

.custom_form_section  {
	background-color: #f3f3f3;
	line-height: 35px;
	font-weight: bold;
	font-size: 13px;
	text-align: left;
	padding-left: 10px;
}

.custom_entity_drag_clone {
	height: 35px;
	background-color: #f3f3f3;
	border: 1px dashed #999;
	width: 200px;
	padding: 5px;
}

.sortable-placeholder {
	/*background-color: highlight;*/
	height: 50px;
}


.custom_form_section_td {
	width: 100%;
}

.form_field_label {
	display: inline-block;
	width: 25%;
	max-width: 140px;
	background-color: #f0f0f0;
	padding: 5px;
	margin-right: 5px;
	text-align: right;
	vertical-align: top;
}

.form_field_label_required:before {
	content: " * ";
	color: red;
}

.form_field_input {
	display: inline-block;
	vertical-align: top;
}

.form_field_input input:NOT([type=radio]) {
	width: 350px;
}

.form_field_input textarea {
	width: 750px;
	height: 75px;
}

.form_field_input select {
	width: 355px;
}


select.custom_form_select {
	position: absolute;
	right: 5px;
	max-width: 400px;
	min-width: 0px;
}

select.custom_form_select::before {
	content: "Form Select: ";
	width: 150px;
	height: 100%;
	position: absolute;
}

td.formtitle select.custom_form_select {
	position: relative;
	float: right;
	margin-top: 15px;
	padding: 2px;
	font-size: 13px;
	border-radius: 4px;
}

.cust_drop_down_options {
	border: 1px solid #999;
	padding: 5px;
	border-radius: 4px;
}

.cust_drop_down_options .title {
	font-weight: bold;
	font-size: 14px;
	margin: 0px;
	padding: 0px;
}

.custom_drop_down_list {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
	margin-top: 10px;
}

.custom_drop_down_list li {
	padding: 3px;
	margin: 3px;
	background-color: #f3f3f3;
	border: 1px solid #c0c0c0;
	border-radius: 4px;
	cursor: move;
}


.e_tracking_div {
	padding: 5px;
	float: right;
	font-size: small;
}

.e_tracking_div img {
	cursor: pointer;
	vertical-align: middle;
	height: 20px;
	margin: 5px;
}

select.custom_table_select {
	float: right;
	margin: 5px;
}

#custom_sub_menu {
	position: absolute;
	display: none;
	background-color: white;
	border: 1px solid #999;
	/*
	min-width: 100px;
	min-height: 100px;
	*/
}

#custom_sub_menu li:hover {
	background-color: highlight;
}


/* Left panel UL for displayed headers in CustomListTableEditor2 */
/* Height now set dynamically via JavaScript instead of fixed min-height 500px */
.custom_header_list {
	overflow-y: auto;
	border: 1px dashed #c0c0c0;
	padding: 0px;
    border-radius: 10px;
}

/* CustomListTableEditor2 (Layouts tab) — flex-div layout. The outer
 * .custom_fields_table.form_table is rendered as a div column, with the
 * .form_creator_row inside it as a flex row; left/right panels then flex
 * within that row. Each panel's UL gets flex:1 + overflow-y so the lists
 * scroll inside their panels instead of overflowing the gray container. */
.custom_fields_table.form_table {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;          /* fill the .fb_v4_right_content_bot column */
	min-height: 0;
	min-width: 0;            /* override .form_table min-width:600px legacy rule */
	width: auto;             /* don't lock to 100% — flex parent sizes it */
	max-width: 100%;
	padding: 16px;
	box-sizing: border-box;
	gap: 10px;
}
/* Left panel UL is a direct child of .form_creator_left (flex column) — it
 * can flex itself. */
.custom_fields_table.form_table .custom_header_list {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	height: auto !important;     /* override any stale inline height left by old code */
}
/* Right panel: the UL sits inside a wrapper, so the wrapper has to be the
 * flex item that grows + scrolls. The UL itself fills the wrapper. */
.custom_fields_table.form_table .form_creator_unused_wrapper {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
}


/* Default Sort section styles */
.custom_sort_list {
	list-style: none;
	padding: 5px;
	margin: 0;
	min-height: 50px;
	max-height: 120px;
	overflow-y: auto;
	border: 1px dashed #ccc;
	background: #fafafa;
	border-radius: 3px;
}


div.x-sched-extern-link > img {
    height: 16px;
    padding-left: 5px;
    vertical-align: middle;
    cursor: pointer;
}

/*div.x-sched-extern-qrlink {*/
	/* text-align: center; */
/*}*/

div.x-sched-extern-qrlink > * {
	vertical-align: middle;
}

div.x-sched-extern-qrlink > img {
	width: 300px;
}

/* External Scheduler Reminders Section */
.extern-schedule-reminders-section {
	margin-top: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent !important;
	box-shadow: none;
	box-sizing: border-box;
	overflow: visible;
}

.scheduler-editor-reminders.extern-schedule-reminders-section {
	margin-top: 0;
	background: transparent !important;
}

.scheduler-reminders-heading {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 8px 14px;
	align-items: center;
	margin-bottom: 14px;
	padding: 0;
	border-bottom: 0;
	background: transparent;
}

.scheduler-reminders-add-btn {
	grid-column: 2;
	grid-row: 1 / span 2;
	align-self: center;
}

.scheduler-reminders-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
}

.scheduler-reminders-empty,
.scheduler-reminders-loading,
.scheduler-reminders-error {
	padding: 28px;
	border: 1px solid #e3e7ee;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(20, 31, 55, .04);
	color: #5f6368;
	font-size: 13px;
	line-height: 19px;
}

.scheduler-reminders-loading {
	color: #6b7280;
}

.scheduler-reminders-empty-title {
	color: #202124;
	font-size: 16px;
	line-height: 22px;
	font-weight: 700;
}

.scheduler-reminders-empty-copy {
	margin-top: 6px;
	max-width: 520px;
	color: #5f6368;
	font-size: 13px;
	line-height: 20px;
}

.scheduler-reminders-empty-action {
	margin-top: 18px;
}

.scheduler-reminders-action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 34px;
	padding: 0 12px;
	border: none;
	border-radius: 7px;
	color: #fff;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	line-height: 32px;
	font-weight: 700;
	cursor: pointer;
	white-space: nowrap;
	box-sizing: border-box;
	appearance: none;
}

/* "Add another reminder" is the primary blue button like every other add action; the
   secondary-action class is layout-only. Its flat white/dark-text override lost the
   background to the shared primary block and left dark type on the navy fill. */

.scheduler-reminders-error {
	background: #fffafa;
}

.scheduler-reminders-list-action {
	display: flex;
	justify-content: flex-start;
	padding: 2px 0 0;
}

.scheduler-reminders-add-more-btn {
	min-height: 34px;
	border-radius: 9px;
}

.scheduler-reminder-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 16px;
	padding: 18px;
	border: 1px solid #e1e6ef;
	border-radius: 14px;
	background: #fff;
	box-shadow: none;
	box-sizing: border-box;
	transition: border-color 0.16s ease;
}

.scheduler-reminder-row.is-unsaved {
	border-color: #c9dced;
	box-shadow: none;
}

.scheduler-reminder-row.has-error {
	border-color: #f4b8b1;
	background: #fffafa;
}

.scheduler-reminder-row.is-saving {
	opacity: .72;
}

.scheduler-reminder-main {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 16px;
	align-items: center;
}

.scheduler-reminder-copy {
	min-width: 0;
}

.scheduler-reminder-title {
	color: #202124;
	font-size: 16px;
	line-height: 22px;
	font-weight: 700;
}

.scheduler-reminder-subtitle {
	margin-top: 3px;
	color: #5f6368;
	font-size: 13px;
	line-height: 19px;
}

.scheduler-reminder-status {
	display: inline-flex;
	align-items: center;
	min-height: 22px;
	padding: 2px 0;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: #7a8494;
	font-size: 11px;
	line-height: 16px;
	font-weight: 700;
	white-space: nowrap;
}

.scheduler-reminder-row.is-unsaved .scheduler-reminder-status {
	color: #0b66b2;
}

.scheduler-reminder-remove-btn {
	align-self: start;
	min-height: 32px;
	padding: 5px 10px;
	border-radius: 9px;
	background: #fff;
	color: #526173;
	font-size: 12px;
	line-height: 18px;
}

.scheduler-reminder-remove-btn:hover {
	border-color: #cfd8e3;
	background: #f8fafc;
	color: #202124;
}

.scheduler-reminder-controls {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	padding-top: 14px;
	border-top: 1px solid #eef1f5;
}

.scheduler-reminder-field {
	display: flex;
	flex-direction: column;
	gap: 5px;
	margin: 0;
	color: #202124;
	font-size: 12px;
	line-height: 18px;
	font-weight: 700;
}

.scheduler-reminder-field-timing {
	min-width: 0;
	width: min(240px, 100%);
}

.scheduler-reminder-field-label {
	color: #5f6368;
	font-size: 11px;
	line-height: 16px;
	font-weight: 700;
}

.scheduler-reminder-recipient-group {
	display: flex;
	flex-direction: column;
	gap: 7px;
}

.scheduler-reminder-recipient-toggles {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.scheduler-reminder-interval {
	height: 38px;
	width: 100%;
	min-width: 0;
	padding: 6px 8px;
	border: 1px solid #d4dae3;
	border-radius: 9px;
	background: #fff;
	color: #202124;
	font-size: 13px;
	box-sizing: border-box;
}

.scheduler-reminder-interval:focus {
	border-color: #0b66b2;
	box-shadow: 0 0 0 3px rgba(11, 102, 178, 0.12);
	outline: none;
}

.scheduler-reminder-toggle {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 38px;
	margin: 0;
	cursor: pointer;
	color: #202124;
	font-size: 12px;
	line-height: 18px;
	font-weight: 700;
}

.scheduler-reminder-toggle-input {
	position: absolute;
	inset: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	opacity: 0;
	cursor: pointer;
	border: 0;
}

.scheduler-reminder-toggle-track {
	position: relative;
	width: 34px;
	height: 20px;
	border-radius: 999px;
	background: #d9e2ef;
	box-shadow: inset 0 0 0 1px rgba(62, 82, 112, 0.18);
	transition: background-color 0.16s ease, box-shadow 0.16s ease;
}

.scheduler-reminder-toggle-thumb {
	position: absolute;
	top: 3px;
	left: 3px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: #ffffff;
	box-shadow: 0 1px 4px rgba(24, 42, 62, 0.2);
	transition: transform 0.16s ease;
}

.scheduler-reminder-toggle-input:checked + .scheduler-reminder-toggle-track {
	background: #0b66b2;
	box-shadow: inset 0 0 0 1px rgba(11, 102, 178, 0.2);
}

.scheduler-reminder-toggle-input:checked + .scheduler-reminder-toggle-track .scheduler-reminder-toggle-thumb {
	transform: translateX(14px);
}

.scheduler-reminder-toggle-input:focus-visible + .scheduler-reminder-toggle-track {
	box-shadow: 0 0 0 3px rgba(11, 102, 178, 0.18), inset 0 0 0 1px rgba(11, 102, 178, 0.2);
}

.scheduler-reminder-actions {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 38px;
	margin-left: auto;
	justify-self: end;
}

.scheduler-reminder-actions .btn-sm {
	min-height: 34px;
	padding: 6px 12px;
	border-radius: 9px;
	font-size: 12px;
	line-height: 18px;
}

.scheduler-reminder-validation {
	min-height: 0;
	color: #b42318;
	font-size: 12px;
	line-height: 18px;
}

.scheduler-reminder-validation:empty {
	display: none;
}

.scheduler-reminder-row.has-error .scheduler-reminder-validation:not(:empty) {
	margin-top: -4px;
}

.extern-schedule-reminders-section.reminder-placeholder {
	border-style: dashed;
}

.extern-schedule-reminders-section .reminder-placeholder-message {
	background: #fbfcfd;
	color: #5f6368;
	font-style: normal;
}

.loading-dialog {
	position: absolute;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%);
	background: #fff;
	width: 400px;
	height: 300px;
	z-index: 1000;
	text-align: center;
	border: 1px solid #c0c0c0;
}

.loading-dialog.modal {
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
}


.loading-dialog > h3 {
	margin-top: 75px;
}

#DML-OVERLAY {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #ffffff;
	margin: 0px;
	padding: 0px;
	z-index: 5000;
}

table.dashboard-table {
	/*border: 1px solid #c0c0c0;*/
	border-collapse: collapse;
	width: 100%;
}

/*table.dashboard-table thead tr th {*/
	/*background-color: #eaebed;
	border: 1px solid #c0c0c0;*/
/*}*/

/*table.dashboard-table tbody tr td {*/
	/*border: 1px solid #c0c0c0;*/
/*}*/

div.tkrv-filter-select-container {
	float: right;
	margin: 5px;
	font-weight: normal;
}

div.tkrv-filter-select-container > select {
	width: 200px;
}

.dashboard-root {
	vertical-align: top;
}

.dashboard-mod {
	display: inline-block;
	width: 100%;
	/*margin-right: 20px;*/
	vertical-align: top;
	border: 1px solid #c0c0c0;
	padding: 5px;
	margin: 2px;
}

.dashboard-mod h4 {
	margin-bottom: 0px;
	margin-top: 0px;
}

.dashboard-ta table tbody tr td:first-child {
	white-space: nowrap;
	width: 100px;
}

.dashboard-ta table tbody tr td:nth-child(3) {
	width: 100px;
}

.dashboard-ta table tbody tr td:nth-child(4) {
	width: 300px;
}

.dashboard-ta table tbody tr td:nth-child(5) {
	width: 300px;
}

/*.dashboard-ru {
}*/

.dashboard-ru table {
	border: 1px solid #ccc;
}



.db-root {
	padding: 16px;
	height: 100%;
	box-sizing: border-box;
	overflow: auto;
}

.db-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}

.db-tile {
	list-style: none;
	display: flex;
	flex-direction: column;
	border: 1px solid #d9dde2;
	border-radius: 6px;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
	overflow: hidden;
}

.db-tile-header {
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 8px 12px;
	border-bottom: 1px solid #e6e9ed;
	background: #f7f8fa;
	cursor: move;
}

.db-grid .preview-holder {
	border: 2px dashed #c7ccd2;
	border-radius: 6px;
	background: #f7f8fa;
}

.db-tile-title {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-weight: 600;
	font-size: 14px;
	/* Let drags pass through the title to the header (gridster's drag handle), since
	   gridster matches the handle strictly against the event target. */
	pointer-events: none;
}

.db-tile-refresh {
	border: none;
	background: transparent;
	cursor: pointer;
	padding: 4px 6px;
	color: #5a6b7b;
	border-radius: 4px;
}

.db-tile-refresh:hover {
	background: #e6e9ed;
}

.db-tile-body {
	flex: 1;
	padding: 8px 12px 12px;
	overflow: auto;
}

/* When a panel hosts the chromeless waterfall list, the inner .entity-list-scroll
   owns the scrolling (so the IntersectionObserver fires); the body itself must not
   scroll. Synthetic panels keep the default body behaviour above. */
.db-tile-body:has(> .entity-list-chromeless) {
	display: flex;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
	padding-bottom: 0;
}

.db-tile-body .entity-list-chromeless {
	height: 100%;
	min-height: 0;
}

/* Render the list flush inside the panel (drop the standalone list view's grey
   rounded backdrop and padding). */
.db-tile-body .entity-list-chromeless .entity-list-container {
	background: transparent;
	border-radius: 0;
	padding: 0;
}

.db-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	padding: 0 0 16px;
}

.db-dashboard-select {
	min-width: 180px;
	padding: 5px 8px;
	border: 1px solid #c7ccd2;
	border-radius: 4px;
	background: #fff;
}

.db-toolbar-btn {
	padding: 6px 12px;
	border: 1px solid #c7ccd2;
	border-radius: 4px;
	background: #fff;
	cursor: pointer;
	font-size: 13px;
}

.db-toolbar-btn:hover {
	background: #eef1f4;
}

.db-toolbar-btn-danger {
	color: #b3261e;
	border-color: #e3b6b3;
}

.db-toolbar-btn-danger:hover {
	background: #fbeceb;
}

.db-tile-remove {
	border: none;
	background: transparent;
	cursor: pointer;
	padding: 0 6px;
	margin-left: 4px;
	color: #8a97a3;
	font-size: 18px;
	line-height: 1;
	border-radius: 4px;
}

.db-tile-remove:hover {
	background: #f3d6d3;
	color: #b3261e;
}

.db-empty {
	padding: 40px 16px;
	color: #6b7884;
	font-size: 14px;
	text-align: center;
	width: 100%;
}

.db-dialog {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 4px 2px;
}

.db-dialog label {
	font-size: 12px;
	font-weight: 600;
	color: #5a6b7b;
	margin-top: 6px;
}

.db-dialog-input {
	padding: 7px 9px;
	border: 1px solid #c7ccd2;
	border-radius: 4px;
	font-size: 14px;
	width: 100%;
	box-sizing: border-box;
}

.db-activity-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}

.db-activity-table th {
	text-align: left;
	font-weight: 600;
	color: #5a6b7b;
	border-bottom: 1px solid #e6e9ed;
	padding: 6px 8px;
}

.db-activity-table td {
	padding: 6px 8px;
	border-bottom: 1px solid #f0f2f4;
}

.db-activity-table .db-activity-when {
	white-space: nowrap;
	color: #5a6b7b;
}

.dashboard-activity-table tbody tr td:first-child {
	width: 85px;
}

/*.dashboard-activity-table tbody tr td:nth-child(2) {
}*/

.dashboard-activity-table tbody tr td:nth-child(3) {
	width: 120px;
}

.dashboard-activity-table tbody tr td:nth-child(4) {
	width: 100px;
}

.dashboard-activity-table tbody tr td:nth-child(5) {
	width: 100px;
}

.dashboard-activity-overdue {
	background-color: #e6a081 !important;
}

.dashboard-activity-complete {
	background-color: #c5e8be !important;
	text-decoration: line-through;
}

/**
"when you click the X on any sort of pop up (like creating a new task etc...) the outline shape doesnt make a square shape like I assume it should.
This is SUPER nitpicky so not essential. Only really noticable when you click the X, but nullify the click by holding and moving the mouse away."
	- Carter
*/
div.ui-dialog > div.ui-dialog-titlebar > button.ui-button > span.ui-button-text {
	padding: inherit;
}

.number_report_total {
    font-size: 70px;
    color: green;
    font-weight: 400;
}

.notes_search_input {
	border-radius: 4px;
	border: .5px solid gray;
}

.notes_search_output_container {
	position: absolute;
	min-width: 300px;
	height: 200px;
	border: 1px solid gray;
	padding: 3px;
	background: white;
	overflow-y: auto;
	z-index:1000;
}

ul.notes_search_output_results {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}

li.notes_search_output_result {
	border-bottom: 1px dashed red;
	cursor: pointer !important;
}

li.notes_search_output_result:hover {
	background-color: highlight;
}

li.notes_search_output_result span {
	font-size: 11px;
	font-weight: 500;
}

li.notes_search_output_result div {
	font-size: 11px;
	padding-bottom: 4px;
}

.tm_button_disabled {
	color: lightgray !important;
}

.x-sched-beta-lbl {
	display: inline-block;
	background-image: url(/images/icons/beta_icon.svg);
	background-repeat: no-repeat;
	width: 50px;
	height: 50px;
	margin-top: -30px;
	margin-left: -30px;
	margin-bottom: -1px;
	z-index: 10;
}

.url_input_root {
	display: inline-block;
	height: 25px;
	line-height: 25px;
	border: 1px solid #666;
	min-width: 307px;
}

.url_input_wrapper {
	line-height: 25px;
	padding-left: 3px;
}

.url_input_wrapper input {
	border: 0px;
	min-width: 367px;
	margin-right: 5px;
}

.url_input_wrapper input::focus {
	border: 0px;
}

.url_display {
	width: 90%;
	max-width: 396px;
}

.url_display a {
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/** field style **/
.slider {
	/* #1196: range input has no intrinsic full width, so it rendered at the browser default
	   (~129px) instead of filling its column. Stretch it (capped by the existing 95% max). */
	width: 100%;
	max-width: 95%;
}

.slider_value {
	display: inline-block;
	margin-top: -2px;
}

/** Contact **/
.contact_top_wrapper {
	display: flex;
	flex-direction: row;
	height: 100%;
}

.contact_header {
	background: #F3F3F3;
	border-radius: 12px;
	height: var(--workspace-module-header-height);
	min-height: var(--workspace-module-header-height);
	padding: var(--workspace-module-header-padding);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: nowrap;
	margin-bottom: 5px;
}

.contact-header-avatar {
	width: 40px;
	height: 40px;
	min-width: 40px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #ffffff;
	font-size: 14px;
	font-weight: 700;
	overflow: hidden;
	box-shadow: 0 2px 6px rgba(0,0,0,0.12);
	position: relative;
}

.contact-header-titles {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.contact_content_wrapper {
	display:flex;
	flex-direction: row;
	height: calc(100% - 75px);
}

.contact_right_column {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0;
	height: 100%;
	position: relative;
}

.contact_left {
	width: 280px;
	min-width: 280px;
	height: 100%;
	margin-right: 10px;
	padding: 0 5px 5px 0;
	overflow-y: hidden;
	scrollbar-width: none;
	-ms-overflow-style: none;
	display: flex;
	flex-direction: column;
}

.contact_left::-webkit-scrollbar {
	display: none;
}

@media (max-width: 1180px) {
	.contact_left {
		display: none;
	}
}

.contact-header-avatar-actions {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.15s ease;
	cursor: pointer;
}

.contact-header-avatar:hover {
	box-shadow: none;
}

.contact-header-avatar:hover .contact-header-avatar-actions {
	opacity: 1;
	pointer-events: auto;
}

.contact-header-avatar-actions svg {
	width: 18px;
	height: 18px;
	fill: none;
	stroke: #ffffff;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
	filter: drop-shadow(0 1px 2px rgba(0,0,0,0.15));
}

.contact-header-avatar-file {
	display: none;
}

.contact-header-avatar-initials {
	letter-spacing: 1px;
	text-transform: uppercase;
}

.contact-header-avatar.is-uploading .contact-header-avatar-actions {
	opacity: 1;
	pointer-events: auto;
	cursor: wait;
}

.contact-header-avatar.contact-header-avatar-disabled {
	opacity: 0.72;
	box-shadow: none;
}

.contact-header-avatar.contact-header-avatar-disabled:hover .contact-header-avatar-actions {
	opacity: 0;
	pointer-events: none;
}

.quick-nav-wrapper {
	flex: 0 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
}

.contact_right {
	display: flex;
	flex: 1;
	flex-flow: column;
	overflow-y: auto;
	overflow-x: hidden;
	min-width: 0;
	min-height: 0;
	position: relative;
	background: #fff;
	border-radius: 12px;
	padding: 0 10px 10px 0;
	scrollbar-width: thin;
	scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}

.contact_right.contact-save-pill-visible {
	padding-bottom: 112px;
}

.contact_right.contact-form-upgrade-pending > * {
	opacity: 0;
	pointer-events: none;
}

.record-content-host.contact-form-upgrade-pending > * {
	opacity: 0;
	pointer-events: none;
}

.record-shell-account.record-first-paint-pending > * {
	opacity: 0;
	pointer-events: none;
}

.contact_right.contact-activity-center-open::-webkit-scrollbar-thumb {
	background-color: transparent;
}

.contact_right.contact-activity-center-open {
	scrollbar-color: transparent transparent;
}

.contact_right::-webkit-scrollbar {
	width: 6px;
}

.contact_right::-webkit-scrollbar-track {
	background: transparent;
}

.contact_right::-webkit-scrollbar-thumb {
	background-color: rgba(0, 0, 0, 0.2);
	border-radius: 3px;
}

/* Marker-based record shell tuning */
.record-shell-account .contact_right,
.record-shell-custom-entity .contact_right {
	padding-right: 0;
}

.record-shell-account .contact_right > *,
.record-shell-custom-entity .contact_right > * {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

.contact-save-state-layer {
	position: absolute;
	left: 50%;
	bottom: 20px;
	transform: translateX(-50%) translateY(14px);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0;
	width: min(360px, calc(100% - 32px));
	z-index: 14;
	opacity: 0;
	pointer-events: none;
	border-radius: 999px;
	transition: opacity 0.18s ease, transform 0.18s ease, border-radius 0.22s cubic-bezier(0.32, 0.72, 0, 1);
}

.contact-save-state-layer.is-visible {
	opacity: 1;
	transform: translateX(-50%) translateY(0);
}

.contact-save-state-layer.is-review-open {
	border-radius: 18px;
	background: linear-gradient(
		to bottom,
		#3B82F6 0%,
		#2563EB 100%
	);
	box-shadow:
		0 0 0 0.5px rgba(30, 64, 175, 0.4),
		inset 0 0 0 1px rgba(255, 255, 255, 0.08),
		inset 0 1px 0 rgba(255, 255, 255, 0.15),
		0 1px 2px rgba(37, 99, 235, 0.18),
		0 4px 10px rgba(37, 99, 235, 0.14),
		0 12px 28px rgba(37, 99, 235, 0.10);
}

.contact-save-pill {
	pointer-events: auto;
	height: 42px;
	padding: 0 16px 0 10px;
	border: none;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: linear-gradient(
		to bottom,
		#60A5FA 0%,
		#3B82F6 40%,
		#2563EB 100%
	);
	color: #fff;
	box-shadow:
		0 0 0 0.5px rgba(30, 64, 175, 0.4),
		inset 0 0 0 1px rgba(255, 255, 255, 0.08),
		inset 0 1px 0 rgba(255, 255, 255, 0.15),
		0 1px 2px rgba(37, 99, 235, 0.18),
		0 3px 6px rgba(37, 99, 235, 0.12),
		0 8px 18px rgba(37, 99, 235, 0.08);
	text-shadow: 0 1px 1px rgba(30, 58, 138, 0.25);
	font-family: 'Manrope', sans-serif;
	cursor: pointer;
	transition: transform 0.16s ease, box-shadow 0.2s ease, opacity 0.16s ease, background 0.22s ease;
}

.contact-save-pill:hover {
	transform: translateY(-1px);
	box-shadow:
		0 0 0 0.5px rgba(30, 64, 175, 0.4),
		inset 0 0 0 1px rgba(255, 255, 255, 0.10),
		inset 0 1px 0 rgba(255, 255, 255, 0.18),
		0 1px 3px rgba(37, 99, 235, 0.22),
		0 4px 8px rgba(37, 99, 235, 0.16),
		0 12px 24px rgba(37, 99, 235, 0.10);
}

.contact-save-pill:active {
	transform: scale(0.97);
	box-shadow:
		0 0 0 0.5px rgba(30, 64, 175, 0.4),
		inset 0 0 0 1px rgba(255, 255, 255, 0.06),
		inset 0 1px 2px rgba(30, 58, 138, 0.12),
		0 1px 2px rgba(37, 99, 235, 0.10);
}

.contact-save-pill-count {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.18);
	box-shadow: inset 0 1px 2px rgba(30, 58, 138, 0.15);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	line-height: 1;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	flex-shrink: 0;
}

.contact-save-pill-label {
	font-size: 12px;
	line-height: 1;
	font-weight: 700;
	letter-spacing: 0.01em;
	opacity: 0.92;
}

.contact-save-pill-hint {
	padding-left: 8px;
	border-left: 1px solid rgba(255, 255, 255, 0.18);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.contact-save-pill-hint img {
	width: 18px;
	height: 18px;
	filter: brightness(0) invert(1);
	opacity: 0.85;
	transition: opacity 0.14s ease;
}

.contact-save-pill:hover .contact-save-pill-hint img {
	opacity: 1;
}

.contact-save-state-layer.is-saving .contact-save-pill {
	opacity: 0.92;
	cursor: progress;
	pointer-events: none;
}

.contact-save-review-card {
	width: 100%;
	max-height: 0;
	padding: 0 10px;
	box-sizing: border-box;
	pointer-events: auto;
	overflow: hidden;
	opacity: 0;
	transition:
		max-height 0.28s cubic-bezier(0.32, 0.72, 0, 1),
		padding 0.28s cubic-bezier(0.32, 0.72, 0, 1),
		opacity 0.2s ease;
}

.contact-save-state-layer.is-review-open .contact-save-review-card {
	max-height: 320px;
	padding: 10px 10px 4px 10px;
	opacity: 1;
}

.contact-save-state-layer.is-review-open .contact-save-pill {
	background: transparent;
	box-shadow: none;
	text-shadow: none;
}

.contact-save-review-title {
	display: none;
}

.contact-save-review-list {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.contact-save-review-row {
	width: 100%;
	border: none;
	border-radius: 8px;
	padding: 10px 12px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	background: rgba(255, 255, 255, 0.13);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
	color: #fff;
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	text-align: left;
	transition: background-color 0.14s ease;
}

.contact-save-review-row:hover {
	background: rgba(255, 255, 255, 0.20);
}

.contact-save-review-row:active {
	background: rgba(255, 255, 255, 0.10);
}

.contact-save-review-row-label {
	min-width: 0;
	flex: 1 1 auto;
	font-size: 12.5px;
	line-height: 17px;
	font-weight: 700;
	word-break: break-word;
	text-shadow: 0 1px 1px rgba(30, 58, 138, 0.2);
}

.contact-save-review-row-action {
	flex: 0 0 auto;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.15);
	box-shadow: inset 0 1px 2px rgba(30, 58, 138, 0.12);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.14s ease;
}

.contact-save-review-row-action img {
	width: 16px;
	height: 16px;
	filter: brightness(0) invert(1);
	opacity: 0.7;
	transition: opacity 0.14s ease;
}

.contact-save-review-row:hover .contact-save-review-row-action {
	background: rgba(255, 255, 255, 0.25);
}

.contact-save-review-row:hover .contact-save-review-row-action img {
	opacity: 1;
}

.contact-save-review-target-flash {
	animation: contact-save-review-target-flash 1.8s ease;
}

@keyframes contact-save-review-target-flash {
	0% {
		background-color: rgba(37, 99, 235, 0.16);
	}
	55% {
		background-color: rgba(37, 99, 235, 0.08);
	}
	100% {
		background-color: transparent;
	}
}

@media (max-width: 720px) {
	.contact-save-state-layer {
		width: calc(100% - 20px);
		bottom: 14px;
	}

	.contact-save-pill {
		width: 100%;
	}

	.contact-save-review-row {
		flex-direction: column;
		align-items: flex-start;
	}
}

.record-shell-account .ct-hd-identity {
	min-width: 0;
}

.record-shell-account .ct-hd-form-host .custom_form_select {
	min-width: 170px;
}

.record-shell-account .contact_right table.entry,
.record-shell-custom-entity .contact_right table.entry {
	width: 100%;
}

.contact_add_ons {
	display: flex;
	flex-grow: 1;
	flex-flow: column;
	min-width: 0;
}

.record-shell-custom-entity .contact_add_ons {
	gap: 12px;
	padding-top: 8px;
}

.contact_right table {
	/*width: 100%;
	max-width: 100%;*/
	table-layout: auto;
	word-wrap: break-word;
}

.contact_right form {
	width: 100%;
	max-width: 100%;
	overflow-x: hidden;
}

.contact_right .addon_section {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	overflow-x: auto;
	padding: 0;
}

.contact-create-helper {
	padding: 22px 24px !important;
	border: 1px dashed #c6d3df;
	border-radius: 16px;
	background: linear-gradient(180deg, #f8fbfe 0%, #eef4fa 100%);
	overflow: hidden !important;
}

.contact-create-helper-title {
	font-family: 'Manrope', sans-serif;
	font-size: 15px;
	font-weight: 700;
	line-height: 20px;
	color: #15324b;
	margin-bottom: 6px;
}

.contact-create-helper-copy {
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 500;
	line-height: 20px;
	color: #4f6477;
	max-width: 720px;
}

.contact_right .addon_section_row {
	width: 100%;
	max-width: 100%;
}

.contact_right .addon_section_row td {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	padding: 0;
	overflow: hidden;
}

/* Completed Activities — faded rows */
.contact_right .contacts_completed_activities table.dataTable tbody tr {
	opacity: 0.7;
}

.contact_right .addon_section table,
.contact_right .addon_section .data-table,
.contact_right .addon_section .generalized-type-data-table,
.contact_right .addon_section .dt-container {
	/*width: 100% !important;
	max-width: 100% !important;*/
	table-layout: fixed;
	word-wrap: break-word;
}

.contact_right .addon_section .data-table th,
.contact_right .addon_section .data-table td,
.contact_right .addon_section .generalized-type-data-table th,
.contact_right .addon_section .generalized-type-data-table td {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Transparent backgrounds inside floating box — only inputs stay white */
.contact_right .form-section-v3 {
	background-color: transparent;
}

.contact_right .form-section-v3 .form-section-title-v3 {
	padding-left: 0;
	padding-bottom: 5px;
}

.contact_right .addon_section {
	background-color: transparent !important;
}

.contact_right .form-container-v3 .addon_section > *:not(.tk_section_heading) {
	padding: 0;
}

/* Addon section headings — match form section title style */
.contact_right .addon_section .tk_section_heading,
.contact_right .form-container-v3 .addon_section .tk_section_heading {
	background-color: transparent;
	color: #24282d;
	font-size: 16px;
	font-weight: bold;
	padding: 0;
	padding-top: 15px;
	padding-bottom: 5px;
	padding-right: 5px;
	margin: 0;
	width: auto;
	overflow: visible;
}

/* Addon section heading icons — unified SVG style matching contact toolbar */
.contact_right .addon_section .tk_section_heading .button.add {
	background-image: url(/images/contacts/add.svg);
	background-size: 11px 11px;
	background-repeat: no-repeat;
	background-position: center;
	width: 19px;
	height: 19px;
	border: 2px solid #b2b2b2;
	border-radius: 50%;
	box-sizing: border-box;
}

.contact_right .addon_section .tk_section_heading .button.add:hover {
	background-image: url(/images/contacts/add.svg);
	transform: scale(1.1);
}

.contact_right .addon_section .tk_section_heading .reload.button {
	background-image: url(/images/calendar/reload.svg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	width: 21px;
	height: 21px;
}

.contact_right .addon_section .tk_section_heading .reload.button:hover {
	background-image: url(/images/calendar/reload.svg);
	transform: scale(1.1);
}

/* Custom entity search icon — expandable */
.contact_right .addon_section .ce-search-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 19px;
	height: 19px;
	margin-left: 7px;
	overflow: hidden;
	transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            padding 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            background-color 0.2s ease;
	cursor: pointer;
	flex-shrink: 0;
	padding: 0;
	border-radius: 4px;
	box-sizing: content-box;
}

.contact_right .addon_section .ce-search-wrapper.expanded {
	width: 180px;
	background-color: #fff;
	padding: 2px 6px;
	gap: 6px;
	justify-content: flex-start;
}

.contact_right .addon_section .ce-search-icon {
	background-image: url(/images/calendar/search.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	width: 19px;
	min-width: 19px;
	height: 19px;
	cursor: pointer;
	transition: transform 0.2s ease;
}

.contact_right .addon_section .ce-search-icon:hover {
	transform: scale(1.1);
}

.contact_right .addon_section .ce-search-wrapper.expanded .ce-search-icon {
	width: 15px;
	min-width: 15px;
	height: 15px;
}

.contact_right .addon_section .ce-search-input {
	border: none;
	outline: none;
	font-size: 13px;
	width: 0;
	min-width: 0;
	flex: 1;
	background: transparent;
	padding: 2px 0;
	font-family: inherit;
	color: #24282d;
}

.contact_right .addon_section .ce-search-wrapper.expanded .ce-search-input {
	width: auto;
}

/* Custom entity layout icon — expandable dropdown */
.contact_right .addon_section .ce-layout-control {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 19px;
	height: 19px;
	margin-left: 4px;
	overflow: hidden;
	transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	cursor: pointer;
	flex-shrink: 0;
	padding: 0;
	border-radius: 4px;
	box-sizing: content-box;
}

.contact_right .addon_section .ce-layout-control.expanded {
	width: 140px;
	gap: 6px;
	justify-content: flex-start;
}

.contact_right .addon_section .ce-layout-icon {
	background-image: url(/images/calendar/layout.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	width: 19px;
	min-width: 19px;
	height: 19px;
	cursor: pointer;
	transition: transform 0.2s ease;
}

.contact_right .addon_section .ce-layout-icon:hover {
	transform: scale(1.1);
}

.contact_right .addon_section .ce-layout-host {
	display: flex;
	align-items: center;
	min-width: 0;
	flex: 1;
}

.contact_right .addon_section .ce-layout-host select.custom_table_select {
	font-size: 12px;
	padding: 1px 6px;
	border: 1px solid #ccc;
	border-radius: 5px;
	background: #fff;
	cursor: pointer;
	outline: none;
	height: 19px;
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
}

/* Hide native DataTables search in custom entity addon sections */
.contact_right .addon_section .addon-table-scroll .dataTables_filter {
	display: none;
}

/* Addon table container — pill-shaped, lighter bg for contrast. */
.contact_right .addon_section .dataTables_wrapper {
	background: #F3F3F3;
	border-radius: 8px;
	padding: 10px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
}

/* Scrollable table area — custom scrollbar matching contacts list style */
.contact_right .addon_section .addon-table-scroll {
	max-height: 350px;
	overflow: auto;
	scrollbar-gutter: stable;
}
.contact_right .addon_section .addon-table-scroll::-webkit-scrollbar {
	width: 15px !important;
	height: 15px !important;
}
.contact_right .addon_section .addon-table-scroll::-webkit-scrollbar-track {
	background: transparent !important;
	margin-top: 28px;
}
.contact_right .addon_section .addon-table-scroll::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.15) !important;
	background-clip: content-box !important;
	border: 4.5px solid transparent !important;
	border-radius: 10px !important;
}

/* Pin the OPTIONS column to the right edge so it never clips when
   the addon table's columns overflow the scroll container. Mirrors
   the .entity-list-scroll.gtd-wide-table-sticky-options rules. */
.contact_right .addon_section .addon-table-scroll table.table_builder thead th.gdt_ops_col,
.contact_right .addon_section .addon-table-scroll table.table_builder tbody td.gdt_ops_col {
	width: 74px;
}
.contact_right .addon_section .addon-table-scroll table.table_builder thead th.gdt_ops_col {
	position: sticky;
	right: 0;
	z-index: 4;
	background-color: #f3f3f3 !important;
	border-left: none;
	background-clip: padding-box;
}
.contact_right .addon_section .addon-table-scroll table.table_builder tbody td.gdt_ops_col {
	position: sticky;
	right: 0;
	z-index: 1;
	background-color: #fff;
	border-left: 1px solid #f0f0f0;
	background-clip: padding-box;
}
.contact_right .addon_section .addon-table-scroll table.table_builder tbody tr.data_table_selected_row td.gdt_ops_col {
	background-color: #E9F2FF;
	border-left-color: #8CB2E5;
}
.contact_right .addon_section .addon-table-scroll table.table_builder tbody tr.data_table_selected_row:hover td.gdt_ops_col {
	background-color: #DDEAF8;
}

/* Custom entity sections: scroll wraps wrapper — move visual styling to scroll container
   so the gray background box includes the scrollbar gutter. */
.contact_right .form-container-v3 .addon_section > .addon-table-scroll {
	background: #F3F3F3;
	border-radius: 8px;
	padding: 10px;
}
.contact_right .form-container-v3 .addon_section > .addon-table-scroll .dataTables_wrapper {
	background: transparent;
	border-radius: 0;
	padding: 0;
}
.contact_right .form-container-v3 .addon_section > .addon-table-scroll table.table_builder {
	margin-bottom: 0;
}

/* Table row styling — pill rows */
.contact_right .addon_section table.dataTable {
	border-spacing: 0 2px !important;
}
.contact_right .addon_section table.dataTable tbody tr {
	background-color: #ffffff;
	transition: background-color 0.15s ease;
}
.contact_right .addon_section table.dataTable tbody tr:hover {
	background-color: rgba(0, 0, 0, 0.04);
}
.contact_right .addon_section table.dataTable tbody tr td:first-child {
	border-top-left-radius: 6px;
	border-bottom-left-radius: 6px;
}
.contact_right .addon_section table.dataTable tbody tr td:last-child {
	border-top-right-radius: 6px;
	border-bottom-right-radius: 6px;
}
.contact_right .addon_section table.dataTable tbody tr td {
	padding: 8px 14px !important;
	font-size: 13px;
	border-bottom: none;
}

/* Sticky table headers */
.contact_right .addon_section table.dataTable thead th {
	font-size: 11px;
	font-weight: 500 !important;
	color: #999;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	padding: 4px 14px 10px !important;
	border-bottom: none !important;
	white-space: nowrap;
	position: sticky;
	top: 0;
	z-index: 2;
	background-color: #F3F3F3 !important;
}

/* Hide pagination and length controls. The "Showing 1 to N of M" info line stays: these
   tables load up to 5,000 rows without paging, so it's the only sign of the total and of a
   truncated list. */
.contact_right .addon_section .dataTables_paginate,
.contact_right .addon_section .dataTables_length {
	display: none !important;
}

/* Empty table message styling */
.contact_right .addon_section table.dataTable .dataTables_empty {
	padding: 20px 14px;
	color: #999;
	font-size: 13px;
}

.contact_right table.dataTable tbody tr {
	background-color: transparent;
}

.assigned-to-display {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	max-width: 100%;
	min-width: 0;
	/* inherit so the label follows row status colors (e.g. red on past-due task rows) */
	color: inherit;
	cursor: default;
}

.assigned-to-avatar {
	width: 22px;
	height: 22px;
	box-sizing: border-box;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	background: linear-gradient(135deg, #2a9d8f 0%, #1d6f86 100%);
	box-shadow: 0 4px 10px rgba(29, 111, 134, 0.18);
	color: #ffffff;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.assigned-to-display-single .assigned-to-name {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 13px;
	font-weight: 600;
	color: #264653;
}

.assigned-to-display-single .table-member-display {
	font-size: 13px;
	font-weight: 600;
	color: #264653;
}

.assigned-to-display-multiple {
	gap: 8px;
}

.assigned-to-avatar-stack {
	display: inline-flex;
	align-items: center;
	height: 22px;
	padding-right: 2px;
}

.assigned-to-avatar-stack .table-member-display {
	/* light overlap (~20% of the 22px avatar) — enough to read as a stack without
	   burying the covered avatar */
	margin-left: -5px;
	position: relative;
	border-radius: 50%;
	z-index: 1;
}

/* Border-free stack: rather than a ring (which halos on tinted rows, e.g. overdue red),
   each covered avatar gets a transparent crescent cut where the avatar above overlaps —
   the 22px circle to the left is centered at -6px, so masking out a 13px radius leaves a
   2px gap that shows the row's own background whatever color it is */
.assigned-to-avatar-stack .table-member-display:not(:first-child) {
	-webkit-mask: radial-gradient(circle at -6px 50%, transparent 13px, #000 13.5px);
	mask: radial-gradient(circle at -6px 50%, transparent 13px, #000 13.5px);
}

/* leftmost on top, descending behind it — the front avatar hides the initials of the
   one it covers instead of both sets of initials blending across same-colored circles */
.assigned-to-avatar-stack .table-member-display:nth-child(1) { z-index: 5; }
.assigned-to-avatar-stack .table-member-display:nth-child(2) { z-index: 4; }
.assigned-to-avatar-stack .table-member-display:nth-child(3) { z-index: 3; }
.assigned-to-avatar-stack .table-member-display:nth-child(4) { z-index: 2; }

.assigned-to-avatar-stack .table-member-display:first-child {
	margin-left: 0;
}

.assigned-to-avatar-stack .table-member-avatar {
	width: 22px;
	height: 22px;
	flex-basis: 22px;
	font-size: 9px;
}

.assigned-to-multiple-label {
	/* matches .table-member-name (14px/400, row-inherited color) so "Multiple" reads
	   exactly like a member name would in the same cell */
	font-size: 14px;
	font-weight: 400;
	color: inherit;
	white-space: nowrap;
}

/* Seamless field containers — unified label + input design */
.contact_right .form-field-container-v3 {
	background-color: #F3F3F3;
	border-radius: 6px;
	padding: 6px 10px;
	gap: 8px;
	align-items: center;
	width: 100%;
}

.contact_right .form-field-container-v3 .entry_label {
	background-color: transparent !important;
	color: #777;
	font-size: 14px;
	text-align: left;
	font-weight: 600;
}

.contact_right .form-section-content-v3.columns-2 {
	--record-field-label-width: clamp(150px, 22%, 220px);
}

@media (min-width: 1800px) {
	.contact_right .form-section-content-v3.columns-2 {
		--record-field-label-width: clamp(190px, 24%, 250px);
	}
}

.contact_right .form-section-content-v3.columns-2 .form-field-container-v3 {
	grid-template-columns: var(--record-field-label-width) minmax(0, 1fr);
}

.contact_right .form-section-content-v3.columns-2 .form-field-container-v3:has(input[name="BirthDate"]),
.contact_right .form-section-content-v3.columns-2 .form-field-container-v3:has(div.birthday-age) {
	grid-template-columns: var(--record-field-label-width) minmax(0, 1fr) !important;
}

.contact_right .form-section-content-v3.columns-2 .form-field-container-v3 .entry_label {
	width: var(--record-field-label-width);
	min-width: var(--record-field-label-width);
	max-width: var(--record-field-label-width);
	box-sizing: border-box;
	overflow: hidden;
	text-overflow: ellipsis;
}

.contact_right .form-section-content-v3.columns-2 .form-field-container-v3 .entry_label label {
	display: block;
	width: 100%;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
	padding: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.contact_right .form-field-container-v3 .input_cell input.forminput,
.contact_right .form-field-container-v3 .input_cell input,
.contact_right .form-field-container-v3 .input_cell select,
.contact_right .form-field-container-v3 .input_cell select.forminput {
	border: none;
	background-color: transparent;
	padding: 4px 0;
	font-size: 14px;
	height: 27px;
	min-height: 0;
	line-height: 19px;
	box-sizing: border-box;
}

.contact_right .form-field-container-v3 .input_cell select,
.contact_right .form-field-container-v3 .input_cell select.forminput {
	-webkit-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 4px center;
	padding-right: 20px;
}

/* True/false fields: the 27px control height must live on the cell, not the checkbox —
   stretching the native box (plus its default margins) makes these rows taller than text rows */
.contact_right .form-field-container-v3 .input_cell input[type="checkbox"] {
	height: 16px;
	width: 16px !important;
	margin: 0;
	padding: 0;
}

.contact_right .form-field-container-v3 .input_cell:has(> input[type="checkbox"]) {
	min-height: 27px;
	justify-content: center;
}

.contact_right .form-section-content-v3 {
	gap: 6px;
	column-gap: 8px;
}

.contact_right .form-field-container-v3 .input_cell div.birthday-age {
	font-size: 14px;
	color: #555;
}

/* Textarea fields — stacked layout: label on top, textarea below */
.contact_right .form-section-content-v3.columns-2 .form-field-container-v3:has(textarea),
.contact_right .form-field-container-v3:has(textarea) {
	grid-template-columns: 1fr;
	grid-column: 1 / -1;
	align-items: start;
	padding: 12px 14px;
}

.contact_right .form-section-content-v3.columns-2 .form-field-container-v3:has(textarea) .entry_label,
.contact_right .form-field-container-v3:has(textarea) .entry_label {
	width: auto;
	min-width: 0;
	max-width: none;
	text-align: left;
	font-size: 14px;
	font-weight: 600;
	padding: 0 0 4px 0;
}

.contact_right .form-field-container-v3:has(textarea) .input_cell textarea {
	min-height: 120px;
	border: none;
	border-radius: 0;
	background-color: transparent;
	padding: 0;
	resize: vertical;
	font-size: 13px;
	color: #24282d;
}

.contact_right .form-field-container-v3:has(textarea) .input_cell textarea:focus {
	outline: none;
	box-shadow: none;
}

.contact_right .form-field-container-v3 .input_cell input.forminput:focus,
.contact_right .form-field-container-v3 .input_cell select:focus {
	outline: none;
	border: none;
	box-shadow: none;
}

.contact_right .form-field-container-v3 .input_cell .lookup_input_link_container {
	border: none;
	background-color: transparent;
}

.contact_right .form-field-container-v3 .input_cell .lookup-dropdown-trigger {
	background-color: transparent;
	border: 1px solid transparent;
	border-radius: 6px;
	height: 27px;
	min-height: 27px;
	padding: 0 8px 0 0;
}

.contact_right .form-field-container-v3 .input_cell .lookup-dropdown-trigger:hover {
	background-color: #F3F3F3;
}

.modern-record-select-popover {
	position: fixed;
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 4px;
	box-sizing: border-box;
	overflow-y: auto;
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 12px 28px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08);
}

.modern-record-select-option {
	display: flex;
	align-items: center;
	width: 100%;
	min-height: 30px;
	padding: 0 10px;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: #24282d;
	font-family: Manrope, 'Segoe UI', Verdana, Geneva, Arial, Sans;
	font-size: 14px;
	font-weight: 500;
	line-height: 18px;
	text-align: left;
	cursor: pointer;
}

.modern-record-select-option:hover,
.modern-record-select-option:focus-visible {
	background: #F3F3F3;
	outline: none;
}

.modern-record-select-option.is-selected {
	background: #E8F1FF;
	color: #00529b;
}

.modern-record-select-option.is-selected::before {
	content: '\2713';
	width: 16px;
	margin-right: 6px;
	font-weight: 700;
}

.modern-record-select-option:not(.is-selected)::before {
	content: '';
	width: 16px;
	margin-right: 6px;
}

.modern-record-select-option.is-disabled {
	color: #999;
	cursor: default;
}

/* --- Multi-text tag/chip input --- */
.contact_right .forminput:has(.vc_multi_text_input_wrapper) {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
}

.contact_right .vc_multi_text_input_wrapper {
	display: inline-flex;
	align-items: center;
	background: #fff;
	border-radius: 16px;
	/* pill pinned to the standard 27px control height so a single-line row is 39px like text rows */
	height: 27px;
	box-sizing: border-box;
	padding: 0 6px 0 12px;
	margin: 0;
	white-space: nowrap;
	transition: box-shadow 0.15s ease;
}

.contact_right .vc_multi_text_input_wrapper:focus-within {
	box-shadow: 0 0 0 2px rgba(0, 82, 155, 0.2);
}

.contact_right .vc_multi_text_input {
	border: none !important;
	background: transparent !important;
	width: auto !important;
	height: auto !important;
	/* size the pill to its text (Chromium); min keeps empty pills clickable, max unchanged */
	field-sizing: content;
	min-width: 40px;
	max-width: 140px;
	padding: 2px 4px !important;
	font-size: 13px;
	margin-right: 0 !important;
	outline: none;
}

.contact_right .vc_multi_text_remove_btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	font-size: 14px;
	line-height: 1;
	color: #999;
	margin: 0;
	transition: background 0.15s, color 0.15s;
	cursor: pointer;
	flex-shrink: 0;
}

.contact_right .vc_multi_text_remove_btn:hover {
	background: rgba(0,0,0,0.08);
	color: #555;
}

.contact_right .vc_multi_text_add_btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	box-sizing: border-box;
	border-radius: 50%;
	border: 1.5px dashed #bbb;
	font-size: 16px;
	color: #999;
	margin: 0;
	cursor: pointer;
	transition: border-color 0.15s, color 0.15s;
}

.contact_right .vc_multi_text_add_btn:hover {
	border-color: #777;
	color: #555;
}

.contact_right .form-blank-cell-v3 .entry_label {
	background-color: transparent !important;
}

/* --- Recreation Categories (tag-it) — match the chip-field design --- */
.contact_right .recreation-categories-chooser .input_cell > div {
	display: flex;
	align-items: center;
	gap: 6px;
	width: 100%;
	min-height: 27px;
}

.contact_right .recreation-categories-chooser .input_cell > div > div:first-child {
	/* shrink-wrap the pills so the add button sits right beside the last one */
	flex: 0 1 auto;
	min-width: 0;
}

.contact_right .recreation-categories-chooser ul.tagit {
	border: none !important;
	background: transparent !important;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	padding: 0 !important;
}

.contact_right .recreation-categories-chooser ul.tagit li {
	margin: 0 !important;
	float: none;
}

.contact_right .recreation-categories-chooser ul.tagit li.tagit-choice {
	display: inline-flex;
	align-items: center;
	background: #fff;
	border: none !important;
	border-radius: 16px;
	height: 27px;
	box-sizing: border-box;
	padding: 0 6px 0 12px;
	font-size: 13px;
	color: #24282d;
	white-space: nowrap;
}

.contact_right .recreation-categories-chooser ul.tagit li.tagit-choice .tagit-label {
	margin-right: 2px;
}

.contact_right .recreation-categories-chooser ul.tagit li.tagit-choice a.tagit-close {
	/* the tag-it plugin sheet absolutely positions the close anchor (top 50%/right .1em),
	   which hangs the x off the pill — keep it in the pill's flex flow instead */
	position: static;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	margin: 0 0 0 2px;
	color: #999;
	text-decoration: none;
	line-height: 1;
	cursor: pointer;
	transition: background 0.15s, color 0.15s;
}

.contact_right .recreation-categories-chooser ul.tagit li.tagit-choice a.tagit-close:hover {
	background: rgba(0, 0, 0, 0.08);
	color: #555;
}

/* tag-it renders both a themed ui-icon and a plain-text x; keep only the text one */
.contact_right .recreation-categories-chooser ul.tagit li.tagit-choice a.tagit-close .ui-icon {
	display: none;
}

.contact_right .recreation-categories-chooser ul.tagit li.tagit-choice a.tagit-close .text-icon {
	display: inline;
	font-size: 14px;
	line-height: 1;
}

.contact_right .recreation-categories-chooser ul.tagit li.tagit-new {
	padding: 0;
	background: transparent;
}

.contact_right .recreation-categories-chooser ul.tagit li.tagit-new input {
	border: none !important;
	background: transparent !important;
	width: auto !important;
	height: auto !important;
	field-sizing: content;
	/* room for the "Type to autocomplete" placeholder */
	min-width: 150px;
	font-size: 13px;
	padding: 2px 4px;
	outline: none;
	box-sizing: border-box;
}

/* LinkedEntitiesControl dropdown-picker mode: the inline tag-it autocomplete is replaced
   by the shared lookup dropdown panel, so hide the inline input and make the field a
   click target with an empty-state placeholder */
.lec-dropdown-mode ul.tagit li.tagit-new {
	display: none !important;
}

.lec-dropdown-mode ul.tagit {
	cursor: pointer;
	min-height: 27px;
	align-content: center;
}

.lec-dropdown-mode ul.tagit:not(:has(li.tagit-choice))::before {
	content: attr(data-placeholder);
	color: #999;
	font-size: 13px;
	padding: 2px 4px;
}

/* search affordance inline at the right, styled like the chip add button */
.contact_right .recreation-categories-chooser .lec-buttons {
	display: flex;
	align-items: center;
	gap: 6px;
	flex: 0 0 auto;
	float: none;
	margin: 0;
}

.contact_right .recreation-categories-chooser .lec-buttons .button.search {
	/* same treatment as the multi-text add button (Children Names) */
	width: 26px;
	height: 26px;
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1.5px dashed #bbb;
	border-radius: 50%;
	background: none;
	font-size: 16px;
	color: #999;
	margin: 0;
	cursor: pointer;
	transition: border-color 0.15s, color 0.15s;
}

.contact_right .recreation-categories-chooser .lec-buttons .button.search::before {
	content: '+';
	line-height: 1;
}

.contact_right .recreation-categories-chooser .lec-buttons .button.search:hover {
	border-color: #777;
	color: #555;
}

/* Custom entity screens keep the legacy content treatment under the new shell */
.record-shell-custom-entity .contact_right .addon_section .dataTables_wrapper,
.record-shell-custom-entity .contact_right .form-container-v3 .addon_section > .addon-table-scroll {
	background: transparent;
	border-radius: 0;
	padding: 0;
}

.record-shell-custom-entity .contact_right .addon_section .addon-table-scroll {
	max-height: none;
	overflow-y: visible;
}

.record-shell-custom-entity .contact_right .addon_section table.dataTable {
	border-spacing: 0 !important;
}

.record-shell-custom-entity .contact_right .addon_section table.dataTable thead th {
	position: static;
	background-color: transparent !important;
	padding: 0 10px 8px !important;
}

.record-shell-custom-entity .contact_right .addon_section table.dataTable tbody tr td {
	padding: 8px 10px !important;
}

/* Legacy: contact header grid — used by Companies and Custom Entities modules */
.contact_header_top {
	display:flex;
	align-items: flex-end;
}

.contact_header_bot {
	display:flex;
	align-items: flex-start;
}

.contact_header_top_left {
	flex-grow: 1;
	width: 25%;
	min-width: 400px;
	font-size: 14pt;
	font-weight: 700;
	line-height: 1.1;
}

.contact_header_top_mid {
	flex-grow: 1;
	width: 50%;
	min-width: 535px;
	line-height: 42px;
    padding: 0px 10px 10px 20px;
}

.contact_header_top_right {
	flex-grow: 1;
	width: 25%;
	min-width: 400px;
}

.contact_header_bot_left {
	flex-grow: 1;
	width: 25%;
	min-width: 400px;
	font-size: 18pt;
	font-weight: 700;
	line-height: 1.1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.contact_header_bot_mid {
	flex-grow: 1;
	background-color: #00529b;
	width: 50%;
	min-width: 535px;
	line-height: 42px;
    padding: 0px 10px 10px 20px;
    border-radius: 5px;
}

.contact_header_bot_mid a.contact_add_link {
	color: #FFF;
	line-height: 42px;
	text-decoration: none;
	font-size: 1em;
	font-weight: 600;
	margin-right: 15px;
}

.contact_header_bot_mid a.contact_add_link:hover {
	text-shadow: none;
}

.contact_header_bot_mid .contact_button {
	float: right;
	margin-top: 5px;
	margin-right: 5px;
	border-radius: 2px;
}

.contact_header_top_right .contact_button {
	margin-right: 5px;
}

.contact_header_bot_mid .snc {
	margin-right: 15px;
}

.contact_header_bot_mid .contact_button.ui-state-disabled,
.contact_header_bot_mid .contact_button.ui-button:disabled {
	opacity: 0.5;
	cursor: not-allowed;
	background: #ccc !important;
	border-color: #aaa !important;
	color: #666 !important;
	pointer-events: none;
}

/* ============================================================
   Contact Record Header — Unified Toolbar (ct-hd-* prefix)
   Matches Calendar/Task toolbar design language
   ============================================================ */

.ct-hd-identity {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
	flex-shrink: 1;
}

.ct-hd-label {
	font-family: 'Manrope', sans-serif;
	font-weight: 700;
	font-size: 16px;
	color: #666;
	white-space: nowrap;
}

.ct-hd-separator {
	color: #999;
	font-size: 16px;
	user-select: none;
}

.ct-hd-name {
	font-family: 'Manrope', sans-serif;
	font-weight: 700;
	-webkit-text-stroke: 0.5px currentColor;
	font-size: 20px;
	color: #000;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 0;
	line-height: 1.3;
}

.ct-hd-form-host {
	flex-shrink: 0;
}

/* Matches .entity-list-default-filter-header-trigger (the "All Contacts" pill) —
   visual only, behavior stays the native select */
.ct-hd-form-host .custom_form_select {
	position: inherit !important;
	appearance: none;
	-webkit-appearance: none;
	height: 34px;
	padding: 0 34px 0 10px;
	border: 1px solid #C6C6C6;
	border-radius: 10px;
	background-color: #ffffff;
	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9L12 15L18 9' stroke='%2300000066' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 15px 15px;
	color: rgba(0, 0, 0, 0.58);
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	outline: none;
	box-sizing: border-box;
	transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.ct-hd-form-host .custom_form_select:hover {
	background-color: #f8f8f8;
	border-color: #B8B8B8;
}

.ct-hd-form-host .custom_form_select:focus {
	outline: none;
	border-color: #8cb2e5;
	box-shadow: 0 0 0 3px rgba(140, 178, 229, 0.25);
}

.ct-hd-spacer {
	flex-grow: 1;
}

.ct-hd-actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}

.ct-hd-btn {
	cursor: pointer;
	background-size: 25px 25px;
	background-repeat: no-repeat;
	background-position: center;
	width: 34px;
	height: 34px;
	background-color: transparent;
	transition: scale 0.2s var(--cal-arrive);
	flex-shrink: 0;
	margin-left: -5px;
}

.ct-hd-btn:hover {
	scale: 1.1;
}

.ct-hd-btn.ct-hd-btn-disabled,
.ct-hd-btn.ct-hd-btn-disabled:hover {
	opacity: 0.38;
	cursor: not-allowed;
	pointer-events: none;
	filter: grayscale(1);
	transform: none;
}

.ct-hd-btn-active {
	background-color: #DCDCDC;
	border-radius: 6px;
}

.ct-hd-btn-note {
	background-image: url(/images/contacts/note.svg);
}

.ct-hd-btn-activity {
	background-image: url(/images/contacts/activity.svg);
}

.ct-hd-btn-activity-center {
	background-image: url(/images/contacts/activity-center.svg);
}

.ct-hd-btn-files {
	background-image: url(/images/contacts/files.svg);
}

.ct-hd-btn-reload {
	background-image: url(/images/calendar/reload.svg);
}

.ct-hd-btn-reload.spinning {
	animation: fc-reload-spin 0.8s linear infinite;
}

.ct-hd-btn-actions {
	background-image: url(/images/contacts/more.svg);
}

.ct-hd-btn-relationship-map {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b2b2b2' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='5' cy='7' r='2.2'/%3E%3Ccircle cx='18.5' cy='5.5' r='2.2'/%3E%3Ccircle cx='18' cy='18' r='2.2'/%3E%3Ccircle cx='7' cy='18.5' r='2.2'/%3E%3Cpath d='M7.1 7l9.2-1.1M6.8 8.8l-.1 7.4M8.8 17.8l7-4.2M9.2 8.5l6.9 7.1'/%3E%3C/svg%3E");
}

.contact-activity-center-host {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 900;
	opacity: 0;
	pointer-events: none;
	transition: opacity 180ms ease;
}

.contact-activity-center-host.is-open {
	opacity: 1;
	pointer-events: none;
}

.contact-activity-center-host.is-step-editor-open {
	opacity: 0;
	pointer-events: none;
}

.contact-activity-center-host.is-open .contact-activity-center-panel {
	pointer-events: auto;
}

.contact-activity-center-backdrop {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
}

.contact-activity-center-panel {
	--contact-activity-center-panel-bg: #F3F3F3;
	--contact-activity-center-panel-bg-rgb: 243, 243, 243;
	position: fixed;
	right: 20px;
	bottom: 16px;
	width: 25%;
	max-width: 100%;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	padding: 24px 24px 0;
	background: var(--contact-activity-center-panel-bg);
	border: 1px solid #E5E5E5;
	border-radius: 12px;
	box-shadow: 0 24px 56px rgba(21, 28, 37, 0.18);
	transform: translateX(100%);
	transition: transform 220ms ease;
}

.contact-activity-center-panel::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 3;
	height: 52px;
	border-radius: 0 0 12px 12px;
	background: linear-gradient(
		180deg,
		rgba(var(--contact-activity-center-panel-bg-rgb), 0) 0%,
		rgba(var(--contact-activity-center-panel-bg-rgb), 0.34) 34%,
		rgba(var(--contact-activity-center-panel-bg-rgb), 0.82) 68%,
		var(--contact-activity-center-panel-bg) 100%
	);
	pointer-events: none;
}

.contact-activity-center-host.is-open .contact-activity-center-panel {
	transform: translateX(0);
}

.contact-activity-center-title {
	flex: 0 0 auto;
	width: 100%;
	max-width: 100%;
	margin-bottom: 12px;
	font-family: 'Manrope', sans-serif;
	font-size: 22px;
	line-height: 28px;
	font-weight: 700;
	letter-spacing: -0.03em;
	color: rgba(0, 0, 0, 0.7);
}

.contact-activity-center-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 18px;
}

.contact-activity-center-tab {
	border: 1px solid rgba(17, 24, 39, 0.12);
	border-radius: 999px;
	padding: 7px 14px;
	background: transparent;
	color: #5b6b85;
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	line-height: 19px;
	font-weight: 500;
	cursor: pointer;
	transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.contact-activity-center-tab:hover {
	color: #334155;
	background: transparent;
	border-color: rgba(17, 24, 39, 0.18);
}

.contact-activity-center-tab.is-active {
	border-color: transparent;
	background: #ffffff;
	box-shadow: 0 1px 2px rgba(17, 24, 39, 0.08);
	color: #111827;
}

.contact-activity-center-refresh-notice {
	display: none;
	position: sticky;
	top: 0;
	z-index: 4;
	margin: 0 0 14px auto;
	padding: 8px 12px;
	border: none;
	border-radius: 999px;
	background: #E8F1FF;
	box-shadow:
		0 8px 18px rgba(29, 78, 216, 0.12),
		inset 0 0 0 1px rgba(63, 96, 173, 0.14);
	color: #254A8A;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	font-weight: 700;
	letter-spacing: 0.01em;
	cursor: pointer;
	align-items: center;
	justify-content: center;
}

.contact-activity-center-refresh-notice:hover {
	background: #DCEBFF;
}

.contact-activity-center-viewport {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	overflow-x: hidden;
	box-sizing: border-box;
	padding: 0 22px 52px;
	margin: 0 -22px;
	scrollbar-width: none;
}

.contact-activity-center-viewport::-webkit-scrollbar {
	display: none;
}

.contact-activity-center-timeline {
	display: flex;
	flex-direction: column;
	gap: 18px;
	width: 100%;
	max-width: 100%;
}

.contact-activity-center-process-wrapper {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.contact-activity-center-process-toggle {
	width: 100%;
	padding: 0;
	border: none;
	background: transparent;
	cursor: pointer;
	text-align: left;
}

.contact-activity-center-process-card {
	width: 100%;
	padding: 18px;
	border-radius: 18px;
	background: #FFFFFF;
	box-shadow:
		0 12px 28px rgba(24, 36, 54, 0.08),
		inset 0 0 0 1px rgba(184, 197, 214, 0.24);
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.contact-activity-center-process-toggle:focus-visible .contact-activity-center-process-card {
	box-shadow:
		0 0 0 2px rgba(29, 78, 216, 0.16),
		0 12px 28px rgba(24, 36, 54, 0.08),
		inset 0 0 0 1px rgba(184, 197, 214, 0.24);
}

.contact-activity-center-process-header {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.contact-activity-center-process-title-block {
	min-width: 0;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.contact-activity-center-process-kicker {
	font-family: 'Manrope', sans-serif;
	font-size: 10px;
	line-height: 14px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #6B7280;
}

.contact-activity-center-process-title {
	font-family: 'Manrope', sans-serif;
	font-size: 16px;
	line-height: 22px;
	font-weight: 700;
	color: #18212B;
	word-break: break-word;
}

.contact-activity-center-process-started {
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	font-weight: 600;
	color: #758090;
}

.contact-activity-center-process-chevron {
	width: 11px;
	height: 11px;
	margin-top: 7px;
	border-right: 2px solid #7E8A99;
	border-bottom: 2px solid #7E8A99;
	transform: rotate(45deg);
	transition: transform 0.18s ease;
	flex: 0 0 auto;
}

.contact-activity-center-process-toggle.is-expanded .contact-activity-center-process-chevron {
	transform: rotate(225deg);
}

.contact-activity-center-process-counts {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.contact-activity-center-process-count {
	display: inline-flex;
	align-items: center;
	padding: 5px 10px;
	border-radius: 999px;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	line-height: 14px;
	font-weight: 700;
	letter-spacing: 0.01em;
}

.contact-activity-center-process-count-open {
	background: #E8F1FF;
	color: #234789;
}

.contact-activity-center-process-count-completed {
	background: #E8F4EB;
	color: #316347;
}

.contact-activity-center-process-count-deleted {
	background: #F2F4F6;
	color: #66707C;
}

/* #1730: progress of the whole applied process, under the step-count pills. */
.contact-activity-center-process-progress {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.contact-activity-center-process-progress-label {
	display: flex;
	justify-content: space-between;
	gap: 8px;
	font-family: 'Manrope', sans-serif;
	font-size: 10px;
	line-height: 14px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #7A8593;
}

.contact-activity-center-process-progress-value {
	letter-spacing: 0.01em;
	text-transform: none;
	color: #316347;
}

.contact-activity-center-process-progress-track {
	height: 6px;
	border-radius: 999px;
	background: #EDF1F5;
	overflow: hidden;
}

.contact-activity-center-process-progress-fill {
	height: 100%;
	border-radius: 999px;
	background: #4C9A6A;
}

.contact-activity-center-process-next-step {
	padding: 12px 14px;
	border-radius: 14px;
	background: #F6F9FC;
	box-shadow: inset 0 0 0 1px rgba(186, 199, 214, 0.2);
}

.contact-activity-center-process-next-step-label {
	font-family: 'Manrope', sans-serif;
	font-size: 10px;
	line-height: 14px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #7A8593;
}

.contact-activity-center-process-next-step-value {
	margin-top: 4px;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
	color: #1E2937;
}

.contact-activity-center-process-steps {
	display: none;
	flex-direction: column;
	gap: 10px;
	margin-left: 12px;
	padding: 2px 0 0 16px;
	border-left: 2px solid #E2EAF3;
}

.contact-activity-center-process-step {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 14px 16px;
	border-radius: 16px;
	background: #FFFFFF;
	box-shadow:
		0 8px 18px rgba(24, 36, 54, 0.06),
		inset 0 0 0 1px rgba(193, 202, 214, 0.2);
}

.contact-activity-center-process-step-copy {
	min-width: 0;
	flex: 1 1 auto;
}

.contact-activity-center-process-step-title {
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	line-height: 19px;
	font-weight: 700;
	color: #1E2835;
	word-break: break-word;
}

.contact-activity-center-process-step-meta {
	margin-top: 5px;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	line-height: 16px;
	font-weight: 600;
	color: #707C89;
	word-break: break-word;
}

.contact-activity-center-process-step-status {
	flex: 0 0 auto;
	padding: 6px 10px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	line-height: 14px;
	font-weight: 700;
	letter-spacing: 0.01em;
}

.contact-activity-center-process-step-status-button {
	cursor: pointer;
}

.contact-activity-center-process-step-status-button:focus-visible {
	outline: 2px solid rgba(29, 78, 216, 0.32);
	outline-offset: 2px;
}

.contact-activity-center-process-step-status-open {
	background: #E8F1FF;
	color: #234789;
}

.contact-activity-center-process-step-status-completed {
	background: #E8F4EB;
	color: #316347;
}

.contact-activity-center-process-step-status-deleted {
	background: #F2F4F6;
	color: #66707C;
}

.contact-activity-center-day-heading {
	margin: 6px 0 -6px;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #8D9198;
}

.contact-activity-center-entry {
	display: flex;
	align-items: stretch;
	gap: 8px;
}

.contact-activity-center-rail {
	width: 32px;
	min-width: 32px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.contact-activity-center-icon {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	color: #FFFFFF;
}

.contact-activity-center-rail-line {
	width: 2px;
	flex: 1 1 auto;
	margin-top: 10px;
	border-radius: 999px;
	background: linear-gradient(180deg, rgba(196, 201, 209, 0.85) 0%, rgba(196, 201, 209, 0.2) 100%);
}

.contact-activity-center-rail-bundle .contact-activity-center-rail-line,
.contact-activity-center-rail-process-bundle .contact-activity-center-rail-line {
	margin-top: 8px;
	background: linear-gradient(180deg, rgba(214, 226, 245, 1) 0%, rgba(238, 243, 250, 1) 100%);
}

.contact-activity-center-entry-content {
	min-width: 0;
	flex: 1 1 auto;
	display: flex;
	align-items: stretch;
}

.contact-activity-center-bundle {
	min-width: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.contact-activity-center-bundle-stack {
	position: relative;
	min-width: 0;
	padding-bottom: 16px;
	overflow: visible;
}

.contact-activity-center-bundle-stack:has(.contact-activity-center-bundle-toggle.is-expanded) {
	padding-bottom: 0;
}

.contact-activity-center-bundle-preview {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: calc(100% - 16px);
	border-radius: 16px;
	overflow: hidden;
	pointer-events: none;
	box-shadow: 0 1px 2px rgba(17, 24, 39, 0.1);
	box-sizing: border-box;
	will-change: transform, opacity;
}

.contact-activity-center-bundle-preview-1 {
	left: 8px;
	top: 8px;
	right: 8px;
	background: #FFFFFF;
	z-index: 0;
}

.contact-activity-center-bundle-preview-2 {
	left: 16px;
	top: 16px;
	right: 16px;
	background: rgba(255, 255, 255, 0.7);
	z-index: -1;
}

.contact-activity-center-bundle-preview .contact-activity-center-card {
	visibility: hidden;
}

.contact-activity-center-bundle-preview-skeleton {
	padding: 28px 34px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.contact-activity-center-bundle-preview-skeleton-bar {
	height: 6px;
	border-radius: 999px;
	background: #D6E4FB;
	width: 110px;
}

.contact-activity-center-bundle-preview-skeleton-bar-short {
	width: 82px;
	background: #E9EFF8;
}

.contact-activity-center-bundle-preview-2 .contact-activity-center-bundle-preview-skeleton-bar {
	background: #DCE7F7;
	width: 102px;
}

.contact-activity-center-bundle-preview-2 .contact-activity-center-bundle-preview-skeleton-bar-short {
	width: 76px;
	background: #E6EEF9;
}

.contact-activity-center-bundle-toggle {
	position: relative;
	z-index: 1;
	min-width: 0;
	display: block;
	cursor: pointer;
	border-radius: 16px;
	outline: none;
}

.contact-activity-center-bundle-toggle:focus-visible .contact-activity-center-card-bundle,
.contact-activity-center-bundle-toggle:focus-visible .contact-activity-center-card-process-bundle {
	box-shadow:
		0 0 0 2px rgba(29, 78, 216, 0.14),
		0 1px 2px rgba(17, 24, 39, 0.1);
}

.contact-activity-center-card-bundle,
.contact-activity-center-card-process-bundle {
	position: relative;
}

.contact-activity-center-bundle-head {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	min-width: 0;
}

.contact-activity-center-bundle-copy {
	min-width: 0;
	flex: 1 1 auto;
}

.contact-activity-center-bundle-headline {
	padding-right: 0;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	white-space: normal;
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
	color: #1F2937;
}

.contact-activity-center-bundle-meta {
	display: inline-flex;
	align-items: center;
	gap: 0;
	margin-left: auto;
	flex: 0 0 auto;
	padding-top: 0;
}

.contact-activity-center-bundle-count {
	min-width: 24px;
	padding: 4px 8px;
	border-radius: 999px;
	background: #EFF6FF;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	line-height: 12px;
	font-weight: 700;
	letter-spacing: 0;
	color: #1D4ED8;
	text-align: center;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
}

.contact-activity-center-bundle-children {
	display: none;
	overflow: hidden;
}

.contact-activity-center-bundle-children-inner {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding-top: 2px;
}

.contact-activity-center-card.contact-activity-center-bundle-child-card {
	box-shadow: none;
}

.contact-activity-center-card-bundle .contact-activity-center-actor-name,
.contact-activity-center-card-bundle .contact-activity-center-timestamp,
.contact-activity-center-card-process-bundle .contact-activity-center-actor-name,
.contact-activity-center-card-process-bundle .contact-activity-center-timestamp {
	font-size: 12px;
	line-height: 16px;
	font-weight: 500;
	color: #737373;
	letter-spacing: 0;
}

.contact-activity-center-card {
	min-width: 0;
	width: 100%;
	background: #FFFFFF;
	border-radius: 16px;
	padding: 16px 18px;
	box-sizing: border-box;
	box-shadow:
		0 10px 22px rgba(24, 36, 54, 0.08),
		0 2px 4px rgba(24, 36, 54, 0.04);
}

.contact-activity-center-card.contact-activity-center-card-bundle,
.contact-activity-center-card.contact-activity-center-card-process-bundle {
	padding: 14px 15px;
	box-shadow: 0 1px 2px rgba(17, 24, 39, 0.1);
}

.contact-activity-center-card-headline {
	flex: 1 1 auto;
	min-width: 0;
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	line-height: 21px;
	font-weight: 500;
	color: #22262D;
	word-break: break-word;
}

.contact-activity-center-card-header {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	min-width: 0;
}

.contact-activity-center-origin-pills {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-top: 10px;
}

.contact-activity-center-origin-pill {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	gap: 7px;
	max-width: 100%;
	padding: 5px 10px;
	border-radius: 999px;
	background: #E8EDF1;
	color: #4C5662;
	box-shadow: inset 0 0 0 1px rgba(108, 118, 130, 0.12);
}

.contact-activity-center-origin-pill-icon {
	width: 14px;
	height: 14px;
	min-width: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #3E4751;
}

.contact-activity-center-origin-pill-label {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	line-height: 14px;
	font-weight: 700;
	letter-spacing: 0.01em;
	color: #4C5662;
}

.contact-activity-center-origin-pill-service {
	background: #EAF0E9;
	box-shadow: inset 0 0 0 1px rgba(94, 118, 95, 0.14);
}

.contact-activity-center-origin-pill-service .contact-activity-center-origin-pill-icon,
.contact-activity-center-origin-pill-service .contact-activity-center-origin-pill-label {
	color: #365140;
}

.contact-activity-center-origin-pill-header {
	margin-left: auto;
	align-self: flex-start;
}

.contact-activity-center-meta-row,
.contact-activity-center-actor-row {
	margin-top: 12px;
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.contact-activity-center-card-header + .contact-activity-center-meta-row,
.contact-activity-center-card-header + .contact-activity-center-actor-row,
.contact-activity-center-origin-pills + .contact-activity-center-meta-row,
.contact-activity-center-origin-pills + .contact-activity-center-actor-row {
	margin-top: 10px;
}

.contact-activity-center-meta-pill {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	padding: 5px 10px;
	border-radius: 999px;
	box-shadow: inset 0 0 0 1px rgba(94, 115, 144, 0.16);
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	line-height: 14px;
	font-weight: 700;
	letter-spacing: 0.01em;
}

.contact-activity-center-meta-pill-automated {
	background: #EEF4FF;
	color: #355898;
}

.contact-activity-center-avatar {
	width: 24px;
	height: 24px;
	min-width: 24px;
	border-radius: 50%;
	background: #D8DDE5;
	color: #FFFFFF;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'Manrope', sans-serif;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	overflow: hidden;
	position: relative;
}

.contact-activity-center-avatar-initials {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

img.contact-activity-center-avatar-image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}

.contact-activity-center-actor-name {
	min-width: 0;
	flex: 1 1 auto;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	font-weight: 600;
	color: #66707D;
}

.contact-activity-center-timestamp {
	flex: 0 0 auto;
	margin-left: auto;
	padding-left: 12px;
	text-align: right;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	line-height: 14px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: #8C9198;
	white-space: nowrap;
}

.contact-activity-center-status {
	display: none;
	width: 100%;
	max-width: 100%;
	margin-top: 18px;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 18px;
	font-weight: 600;
	color: #8C9198;
	text-align: center;
}

.contact-activity-center-empty {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	padding: 28px 26px;
	border: 1px dashed rgba(114, 124, 138, 0.26);
	border-radius: 18px;
	background: rgba(255, 255, 255, 0.72);
}

.contact-activity-center-empty-title {
	font-family: 'Manrope', sans-serif;
	font-size: 15px;
	line-height: 22px;
	font-weight: 700;
	color: #1F252C;
}

.contact-activity-center-empty-copy {
	margin-top: 6px;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	line-height: 20px;
	font-weight: 500;
	color: #6E7681;
}

.contact-activity-center-sentinel {
	width: 1px;
	height: 1px;
}

.contact_right.contact-docs-open::-webkit-scrollbar-thumb {
	background-color: transparent;
}

.contact_right.contact-docs-open {
	scrollbar-color: transparent transparent;
}

.contact-docs-host {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 901;
	opacity: 0;
	pointer-events: none;
	transition: opacity 180ms ease;
}

.contact-docs-host.is-open {
	opacity: 1;
	pointer-events: none;
}

.contact-docs-host.is-open .contact-docs-panel {
	pointer-events: auto;
}

.contact-docs-panel {
	position: fixed;
	right: 20px;
	bottom: 16px;
	width: 25%;
	max-width: 100%;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	padding: 25px 20px;
	background: #f3f3f3;
	border: 1px solid #e5e5e5;
	border-radius: 12px;
	box-shadow: 0 24px 56px rgba(21, 28, 37, 0.18);
	transform: translateX(100%);
	transition: transform 220ms ease;
}

.contact-docs-host.is-open .contact-docs-panel {
	transform: translateX(0);
}

.contact-docs-header {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding-bottom: 18px;
}

.contact-docs-title {
	min-width: 0;
	font-family: 'Manrope', sans-serif;
	font-size: 22px;
	line-height: 28px;
	font-weight: 700;
	color: rgba(0, 0, 0, 0.7);
}

.contact-docs-add-button {
	width: 34px;
	height: 34px;
	flex: 0 0 auto;
	border: none;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #3B82F6;
	box-shadow: 0 12px 26px rgba(59, 130, 246, 0.28);
	cursor: pointer;
	transition: transform 0.16s ease, box-shadow 0.16s ease;
}

.contact-docs-add-button:hover {
	transform: translateY(-1px);
	box-shadow: 0 16px 30px rgba(59, 130, 246, 0.32);
}

.contact-docs-add-button-plus {
	font-family: 'Manrope', sans-serif;
	font-size: 28px;
	line-height: 1;
	font-weight: 500;
	color: #fff;
	transform: translateY(-1px);
}

.contact-docs-viewport {
	position: relative;
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: thin;
	scrollbar-color: rgba(0, 0, 0, 0.16) transparent;
}

.contact-docs-viewport::-webkit-scrollbar {
	width: 6px;
}

.contact-docs-viewport::-webkit-scrollbar-track {
	background: transparent;
}

.contact-docs-viewport::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.16);
	border-radius: 999px;
}

.contact-docs-viewport.is-drag-over::before {
	content: '';
	position: absolute;
	inset: 0;
	border: 2px dashed rgba(47, 107, 255, 0.42);
	border-radius: 18px;
	background: rgba(47, 107, 255, 0.06);
	pointer-events: none;
}

.contact-docs-body {
	display: flex;
	flex-direction: column;
	gap: 28px;
	padding-bottom: 10px;
}

.contact-docs-status,
.contact-docs-empty-state {
	padding: 18px 20px;
	border-radius: 16px;
	background: rgba(255, 255, 255, 0.88);
	box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06);
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
	color: #57606b;
}

.contact-docs-status-error {
	color: #af3c42;
}

.contact-docs-breadcrumb-row {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	justify-content: space-between;
}

.contact-docs-back-button,
.contact-docs-breadcrumb {
	border: none;
	background: transparent;
	padding: 0;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	line-height: 18px;
	font-weight: 400;
	color: #4e5a67;
	cursor: pointer;
	transition: color 0.15s ease, opacity 0.15s ease;
}

.contact-docs-back-button:hover,
.contact-docs-breadcrumb:hover {
	color: #1f55d6;
}

.contact-docs-breadcrumbs {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	min-width: 0;
}

.contact-docs-breadcrumb-root {
	color: #1f55d6;
}

.contact-docs-breadcrumb-separator {
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	font-weight: 400;
	color: #98a3ae;
}

.contact-docs-bulk-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
	padding: 14px 16px;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 8px 26px rgba(15, 23, 42, 0.08);
}

.contact-docs-bulk-label {
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
	color: #283241;
}

.contact-docs-bulk-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

.contact-docs-toolbar-button {
	border: none;
	border-radius: 999px;
	padding: 9px 14px;
	background: #eef2f6;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	font-weight: 700;
	color: #45505d;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}

.contact-docs-toolbar-button:hover {
	background: #e1e8f0;
	color: #1d2631;
}

.contact-docs-toolbar-button.is-disabled {
	opacity: 0.45;
	cursor: default;
}

.contact-docs-section {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.contact-docs-section-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.contact-docs-section-title {
	font-family: 'Manrope', sans-serif;
	font-size: 16px;
	line-height: 20px;
	font-weight: 500;
	color: rgba(0, 0, 0, 0.7);
}

.contact-docs-section-link {
	border: none;
	padding: 0;
	background: transparent;
	font-family: 'Manrope', sans-serif;
	font-size: 15px;
	line-height: 18px;
	font-weight: 400;
	color: rgba(0, 0, 0, 0.43);
	cursor: pointer;
}

.contact-docs-folder-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
}

.contact-docs-folder-card {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 15px 15px 10px;
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 4px 40px rgba(0, 0, 0, 0.03);
	cursor: pointer;
	transition: transform 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease;
}

.contact-docs-folder-card:hover,
.contact-docs-doc-row:hover {
	transform: translateY(-1px);
	box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
}

.contact-docs-folder-card.is-selected,
.contact-docs-doc-row.is-selected {
	background: #eef4ff;
	box-shadow:
		0 10px 28px rgba(47, 107, 255, 0.12),
		inset 0 0 0 1px rgba(47, 107, 255, 0.2);
}

.contact-docs-folder-card.is-drop-target,
.contact-docs-breadcrumb.is-drop-target {
	box-shadow:
		0 10px 28px rgba(47, 107, 255, 0.12),
		inset 0 0 0 2px rgba(47, 107, 255, 0.34);
}

.contact-docs-folder-card.is-collapsed-hidden {
	display: none;
}

.contact-docs-folder-preview {
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	aspect-ratio: 1.6;
	padding: 8px;
	border-radius: 7px;
	background: #F3F3F3;
	overflow: clip;
}

.contact-docs-folder-icon {
	width: 24px;
	height: 24px;
	object-fit: contain;
}

.contact-docs-folder-name {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	font-weight: 500;
	letter-spacing: -0.02em;
	color: rgba(0, 0, 0, 0.7);
	word-break: break-word;
}

.contact-docs-doc-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.contact-docs-doc-row {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 10px;
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 4px 40px rgba(0, 0, 0, 0.03);
	cursor: pointer;
	transition: transform 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease;
}

.contact-docs-doc-icon-wrap {
	width: 32px;
	height: 32px;
	flex: 0 0 auto;
	border-radius: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #f3f3f3;
}

.contact-docs-doc-icon {
	width: 18px;
	height: 18px;
	object-fit: contain;
}

.contact-docs-doc-copy {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.contact-docs-doc-name {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	font-weight: 500;
	color: #333333;
}

.contact-docs-doc-date {
	font-family: 'Manrope', sans-serif;
	font-size: 10px;
	line-height: 14px;
	font-weight: 400;
	color: #999999;
}

.contact-docs-doc-menu {
	width: 32px;
	height: 32px;
	flex: 0 0 auto;
	border: none;
	border-radius: 50%;
	background: transparent;
	font-family: 'Manrope', sans-serif;
	font-size: 22px;
	line-height: 1;
	color: #7a8593;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.contact-docs-doc-menu:hover {
	background: #eef2f6;
	color: #1f2937;
}

.contact-docs-draggable.is-drag-origin {
	opacity: 0.68;
}

.contact-docs-drag-helper {
	position: relative;
	width: 76px;
	height: 76px;
}

.contact-docs-drag-helper-card {
	position: absolute;
	inset: 0;
	border-radius: 16px;
	background: rgba(255, 255, 255, 0.95);
	box-shadow:
		0 16px 32px rgba(15, 23, 42, 0.18),
		inset 0 0 0 1px rgba(47, 107, 255, 0.18);
}

.contact-docs-drag-helper-card.is-second {
	inset: 0;
	opacity: 0.7;
	transform: translate(8px, 8px);
}

.contact-docs-drag-helper-badge {
	position: absolute;
	right: -6px;
	top: -6px;
	min-width: 28px;
	height: 28px;
	padding: 0 8px;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #2f6bff;
	box-shadow: 0 10px 20px rgba(47, 107, 255, 0.28);
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	font-weight: 700;
	color: #fff;
}

.contact-docs-floating-menu {
	position: absolute;
	min-width: 180px;
	padding: 8px;
	border-radius: 16px;
	background: rgba(255, 255, 255, 0.98);
	box-shadow: 0 18px 38px rgba(15, 23, 42, 0.16);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}

.contact-docs-floating-menu.is-compact {
	min-width: 100px;
}

.contact-docs-floating-menu-item {
	width: 100%;
	border: none;
	border-radius: 12px;
	padding: 10px 12px;
	background: transparent;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	line-height: 18px;
	font-weight: 500;
	color: #1f2937;
	text-align: left;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}

.contact-docs-floating-menu-item:hover {
	background: #f3f6fa;
}

.contact-docs-floating-menu-item.is-danger {
	color: #b42318;
}

.contact-docs-floating-menu-item.is-disabled {
	opacity: 0.45;
	cursor: default;
}

.contact-docs-name-dialog {
	padding-top: 10px;
}

.contact-docs-name-input {
	width: 100%;
	box-sizing: border-box;
	padding: 12px 14px;
	border: 1px solid #d5dbe3;
	border-radius: 12px;
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	line-height: 20px;
	color: #1f2937;
	background: #fff;
}

.contact-docs-name-input:focus {
	outline: none;
	border-color: rgba(47, 107, 255, 0.45);
	box-shadow: 0 0 0 4px rgba(47, 107, 255, 0.12);
}

.contact-docs-info-overlay,
.contact-docs-move-overlay {
	position: fixed;
	inset: 0;
	z-index: 940;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	background: rgba(15, 23, 42, 0.22);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}

.contact-docs-info-popup,
.contact-docs-move-popup {
	width: 420px;
	max-width: calc(100vw - 40px);
	max-height: calc(100vh - 48px);
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 22px;
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 24px 56px rgba(15, 23, 42, 0.18);
}

.contact-docs-info-title,
.contact-docs-move-title {
	font-family: 'Manrope', sans-serif;
	font-size: 20px;
	line-height: 26px;
	font-weight: 700;
	color: #1f2937;
}

.contact-docs-info-content {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.contact-docs-info-row {
	display: grid;
	grid-template-columns: 108px minmax(0, 1fr);
	gap: 12px;
	align-items: start;
}

.contact-docs-info-label {
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #8b95a1;
}

.contact-docs-info-value,
.contact-docs-move-copy {
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
	color: #344150;
	word-break: break-word;
}

.contact-docs-info-close,
.contact-docs-move-button {
	border: none;
	border-radius: 14px;
	padding: 11px 16px;
	background: #2f6bff;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
	color: #fff;
	cursor: pointer;
}

.contact-docs-move-actions {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	margin-top: 4px;
}

.contact-docs-move-button.is-secondary {
	background: #eef2f6;
	color: #45505d;
}

.contact-docs-move-tree {
	min-height: 220px;
	max-height: 360px;
	padding: 14px;
	border-radius: 16px;
	background: #f7f7f8;
	overflow: auto;
}

.contact-docs-move-tree .jstree-default .jstree-anchor {
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	line-height: 22px;
	font-weight: 600;
	color: #344150;
}

.contact-docs-move-tree .jstree-default .jstree-clicked {
	background: #e8f1ff;
	border-radius: 10px;
	box-shadow: none;
}

.contact-docs-move-tree .jstree-default .jstree-hovered {
	background: #eef3f8;
	border-radius: 10px;
	box-shadow: none;
}

@media (max-width: 900px) {
	.contact-activity-center-panel {
		width: 100%;
		padding: 28px 20px 0;
	}

	.contact-docs-panel {
		right: 0;
		width: 100%;
		max-width: 100%;
		padding: 24px 20px 20px;
		border-radius: 0;
	}

	.contact-activity-center-title,
	.contact-activity-center-timeline,
	.contact-activity-center-status,
	.contact-activity-center-empty,
	.contact-docs-title,
	.contact-docs-viewport {
		width: 100%;
	}
}

@media (max-width: 640px) {
	.contact-activity-center-tabs {
		gap: 6px;
	}

	.contact-activity-center-tab {
		padding: 8px 12px;
	}

	.contact-activity-center-process-step {
		flex-direction: column;
	}

	.contact-activity-center-process-step-status {
		align-self: flex-start;
	}

	.contact-activity-center-timestamp {
		padding-left: 10px;
	}

	.contact-docs-title {
		font-size: 24px;
		line-height: 30px;
	}

	.contact-docs-header {
		gap: 12px;
	}

	.contact-docs-folder-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.contact-docs-bulk-toolbar,
	.contact-docs-breadcrumb-row {
		align-items: flex-start;
	}

	.contact-docs-info-row {
		grid-template-columns: minmax(0, 1fr);
		gap: 6px;
	}
}

.ct-hd-snc-btn {
	background-color: transparent;
	color: #00529b;
	border: 1.5px solid #00529b;
	border-radius: 8px;
	padding: 0 16px;
	cursor: pointer;
	height: 37px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	white-space: nowrap;
	flex-shrink: 0;
	font-weight: 600;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	transition: background-color 0.15s ease, color 0.15s ease, opacity 0.15s ease, box-shadow 0.15s ease;
}

.ct-hd-snc-btn:not(:disabled):hover {
	background-color: #00529b;
	color: #fff;
}

.ct-hd-snc-btn.is-pristine,
.ct-hd-save-btn.is-pristine {
	opacity: 0.5;
}

.ct-hd-snc-btn.is-dirty,
.ct-hd-save-btn.is-dirty {
	opacity: 1;
}

.ct-hd-snc-btn.is-pristine:disabled {
	background: transparent;
	border-color: #00529b;
	color: #00529b;
	cursor: default;
	pointer-events: none;
}

.ct-hd-snc-btn.is-saving:disabled {
	opacity: 0.9;
	cursor: progress;
	pointer-events: none;
}

.ct-hd-snc-btn:disabled:not(.is-pristine):not(.is-saving) {
	opacity: 0.5;
	cursor: not-allowed;
	background: #ccc;
	border-color: #aaa;
	color: #666;
	pointer-events: none;
}

.ct-hd-save-btn {
	color: white;
	border: none;
	border-radius: 8px;
	padding: 0 20px;
	cursor: pointer;
	height: 37px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	white-space: nowrap;
	flex-shrink: 0;
	font-weight: 500;
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	transition: background-color 0.15s ease, opacity 0.15s ease, box-shadow 0.15s ease;
}

.ct-hd-save-btn.is-pristine:disabled {
	color: #fff;
	cursor: default;
	pointer-events: none;
}

.ct-hd-save-btn.is-saving:disabled {
	opacity: 0.9;
	cursor: progress;
	pointer-events: none;
}

.ct-hd-save-btn:disabled:not(.is-pristine):not(.is-saving) {
	opacity: 0.5;
	cursor: not-allowed;
	background: #ccc;
	color: #666;
	pointer-events: none;
}

.contact_header.view-only-mode .ct-hd-save-btn,
.contact_header.view-only-mode .ct-hd-snc-btn {
	opacity: 0.5;
	cursor: not-allowed;
	background: #ccc;
	border-color: #aaa;
	color: #666;
	pointer-events: none;
}

/* Disabled state for dialog buttons (edit session view-only mode) */
.ui-dialog-buttonset button:disabled,
.ui-dialog-buttonset button.ui-state-disabled {
	opacity: 0.5;
	cursor: not-allowed;
	background: #ccc !important;
	border-color: #aaa !important;
	color: #666 !important;
	pointer-events: none;
}

.contact_header_bot_right {
	flex-grow: 1;
	width: 25%;
	min-width: 400px;
}

.contact_ql_title {
	font-size: 16px;
	font-weight: 700;
	color: #333;
	margin-bottom: 12px;
}

.contact_form_select_reposition {
	position: inherit !important;
	padding: 5px;
	border-radius: 4px;
	color: #2e6e9e;
	background-color: #fdfdfd;
	font-weight: bold;
	font-size: 1em !important;
	font-family: 'Manrope', 'Segoe UI', Verdana, Geneva, Arial, sans-serif !important;
	text-align: center;
	margin-left: 25px;
}

/* -------- Bubble Popup --------- */

.bp-container {
	font-family: 'Manrope' !important;
	display: flex;
	flex-flow: column;
	max-width: 350px !important;
    gap: 9px;
    padding: 15px;
}

.bp-title-bar {
	display: flex;
	flex-flow: row;
    gap: 12px;
    margin-bottom: 3px;
}

.bp-title-color-marker {
	background-color: gray;
    min-width: 4px;
    max-width: 4px;
    border-radius: 5px;
}

.bp-title-info-wrap {
	display: flex;
	flex-flow: column;
}

.bp-title-info-type {
    font-family: 'Manrope' !important; font-weight: 600;
	font-size: 12px;
}

.bp-title-info-type a {
    font-family: 'Manrope' !important; font-weight: 600;
	text-decoration: none;
}

.bp-title-info-title {
	white-space: nowrap;
	text-overflow: ellipsis;
	font-family: 'Manrope' !important; font-weight: 600;
	font-size: 20px;
    max-width: 250px;
    overflow: hidden;

}

/* #1701: a completed appointment's popup says so - a tag beside its type, title struck through */
.bp-title-info-type .bp-status-completed {
	display: inline-block;
	margin-left: 6px;
	padding: 0 7px;
	border-radius: 8px;
	background-color: #e8f5e9;
	color: #2e7d32;
	font-size: 11px;
	line-height: 17px;
	vertical-align: 1px;
}
.bp-title-info-type a + .bp-status-completed {
	margin-left: 8px;
}
.bp-title-info-title.bp-title-completed {
	text-decoration: line-through;
	opacity: 0.7;
}

.bp-date-bar {
	font-family: 'Manrope' !important;
	display: flex;
	flex-flow: row;
	justify-content: space-between;
	border: 1px solid #b2b2b2;
	background-color: #fafafb;
	color: #737373;
    border-radius: 5px;
    line-height: 15px;
    padding: 0px 5px;
}

.bp-date-info-date {
	font-family: 'Manrope' !important;
    padding: 15px 3px;
    white-space: nowrap;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}

.bp-date-info-date::before {
	background-image: url(/images/popups/calendar.svg);
    background-size: 27px 27px;
    display: inline-block;
    height: 27px;
    width: 27px;
    content: "";
    margin-top: -8px;
    margin-bottom: -8px;
    margin-right: 3px;
}

.bp-date-info-time {
	font-family: 'Manrope' !important;
    padding: 15px 3px;
    white-space: nowrap;
    font-size: 13px;
    min-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bp-date-info-time::before {
	background-image: url(/images/popups/clock.svg);
    background-size: 27px 27px;
    display: inline-block;
    height: 27px;
    width: 27px;
    content: "";
    margin-top: -8px;
    margin-bottom: -8px;
    margin-right: 3px;
}

.bp-loc-bar {
	display: flex;
	flex-flow: row nowrap;
	border: 1px solid #b2b2b2;
	background-color: #fafafb;
	color: #737373;
    border-radius: 5px;
    padding: 5px 10px;
    line-height: 30px;
    min-height: 35px;
    overflow-y: hidden;
    text-overflow: ellipsis;
    font-size: 13px;
    padding-right: 7px;
}

.bp-loc-bar::before {
	background-image: url(/images/popups/location.svg);
    background-size: 27px 27px;
    display: inline-block;
    height: 27px;
    width: 27px;
    content: "";
    margin-top: 3px;
    margin-left: -2px;
}

.bp-pop-divider {
    min-width: 98%;
    border: 1px solid #d9d9d9;
    border-top: none;
}

.bp-desc-bar {
    font-family: 'Manrope', 'Segoe UI', Verdana, Geneva, Arial, sans-serif !important;
    font-weight: 400;
    border: 1px solid #b2b2b2;
    background-color: #fafafb;
    color: #737373;
    border-radius: 5px;
    padding: 10px;
    font-size: 13px;
    line-height: 1.45;
    max-height: 120px;
    overflow-y: auto;
    white-space: pre-wrap;
    scrollbar-width: thin;
    scrollbar-color: #dedede #fff;
}

.bp-override {
    border-radius: 10px;
    box-shadow: 0px 0px 20px #ddd;
    border: none;
    min-width: 300px;
    /* fit the content; the cap only kicks in (with scroll) when the popup would
       outgrow the viewport — a fixed 27em clipped ordinary task popups */
    max-height: 80vh;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #dedede #fff;
}

.bp-link-btn {
	font-family: 'Manrope' !important;
	white-space:nowrap;
	border-radius: 5px;
	color: #585C60;
	padding: 0px 10px;
	background-color: #DEDEDF;
	cursor: pointer;
	font-size: 13px;
	height: 31px;
	margin-top: 2px;
    padding-left: 8px;
}

.bp-link-btn::before {
	background-image: url(/images/popups/open_external_icon.svg);
    background-size: 15px 15px;
    display: inline-block;
    height: 15px;
    width: 15px;
    content: "";
    margin-top: 4px;
    margin-bottom: -3px;
    margin-right: 6px;
}

.bp-zoom-btn {
	color: #0c5cff;
	background-color: #D1DCFD;
	font-size: 13px;
}

.bp-zoom-btn::before {
	background-image: url(/images/popups/zoom.svg);
    background-size: 20px 20px;
    display: inline-block;
    height: 20px;
    width: 20px;
    content: "";
    margin-top: 4px;
    margin-bottom: -5px;
    margin-right: 6px;
}

.bp-teams-btn {
	color: #5059c9;
	background-color: #D8DAF2;
	font-size: 13px;
}

.bp-teams-btn::before {
	background-image: url(/images/popups/teams.svg);
	background-size: 18px 18px;
    display: inline-block;
    height: 18px;
    width: 18px;
    content: "";
    margin-top: 4px;
    margin-bottom: -5px;
    margin-right: 6px;
}

.bp-link-wrap {
    display: flex;
    flex-grow: 1;
    flex-flow: row nowrap;
    justify-content: space-between;
    max-width: 226px !important;
}

.bp-link-name {
	font-family: 'Manrope' !important;
	overflow: hidden;
	text-overflow: ellipsis;
    font-size: 13px;
    white-space: nowrap;
    margin-top: 2px;
    margin-left: 4px;
}

.bp-at-rap {
	display: flex;
	flex-flow: column;
	gap: 5px;
	height: fit-content;
}

.bp-at-title {
	font-family: 'Manrope' !important;
    font-size: 16px;
	color: #737373;
}

.bp-at-content {
	font-family: 'Manrope' !important;
	display: flex;
    gap: 5px;
	flex-flow: row wrap;
}

.bp-at-link {
	font-family: 'Manrope' !important;
	flex-grow:0;
	border: 1px solid #b2b2b2;
	border-radius: 5px;
	color: #737373;
    padding: 5px 7px;
    cursor: pointer;
}

.bp-at-link a {
	font-family: 'Manrope' !important;
	color: #737373;
	text-decoration: none;
    font-size: 12px;
}

.bp-attendees-rap {
    max-height: 135px;
	overflow-y: auto;
    display: flex;
    gap: 13px;
    flex-flow: column;
    scrollbar-width: thin;
    scrollbar-color: #dedede #fff;
}

.task-view-search-rap {
    display: inline-flex;
    flex-flow: row;
    height: 30px;
    width: 220px;
    margin-right: 10px;
    margin-top: -5px;
    margin-bottom: -10px;
    float: right;
    border: 1px solid #c5c5c5;
    border-radius: 7px;
}

.task-search-icon {
	background-image: url(/images/calendar/search.svg);
	background-size: 18px 18px;
    display: inline-block;
    height: 18px;
    width: 18px;
    content: "";
    margin-top: 6px;
    margin-right: 6px;
    margin-left: 4px;
}

.task-view-search-close {
	background-image: url(/images/calendar/search.svg);
	background-size: 18px 18px;
    display: inline-block;
    height: 18px;
    width: 18px;
    content: "";
    margin-top: 4px;
    margin-bottom: -5px;
    margin-right: 6px;
}

.task-view-search-rap input {
	font-family: 'Manrope'; font-weight: 300;
	color: #969696;
	flex-grow: 1;
	outline: none;
	border: none;
	border-radius: 10px;
}

.tm-header {
	display: flex;
	flex-flow: column;
	justify-content: space-between;
    margin: 0px 0px 10px 0px;
    gap: 10px;
}

.tm-header-top {
	display: flex;
	flex-flow: row;
	justify-content: space-between;
}

.tm-header-bottom {
	display: flex;
	flex-flow: row;
	justify-content: space-between;
}

/*.tm-header-buttons {

}*/

.tm-header-sel-act-rap {
	display: flex;
	flex-flow: row;
	gap: 5px;
}

.fc-printBtn-button, .fc-newBtn-button {
	display: none;
}

.ops_container {
	max-height: 80vh;
	overflow-y: auto;
}

.fc-scroller {
	max-height: 73vh;
	overflow-y: auto;
}

/* Legacy: margin-top was used when all-day section was extracted to fixed container.
   With sticky positioning, this is no longer needed - sticky top offset handles spacing.
   Keeping commented for reference during migration. */
/*
.fc-day-grid {
	margin-top: 55px;
}

/* No margin when all-day bar is relocated into the fixed header */
.fc-tb-clone > .fc-day-grid {
	margin-top: 0;
}

/* Remove gap in month view (no all-day events bar) */
.fc-month-view .fc-day-grid {
	margin-top: 0;
}
*/

@media screen and (max-width: 1920px) {
	.ops_container {
		max-height: 80vh;
		overflow-y: auto;
	}

	.fc-scroller:not(.fc-day-grid-container) {
		max-height: 66vh;
		overflow-y: auto;
	}

	.fc-day-grid-container {
		max-height: 69vh;
		overflow-y: auto;
	}
}

/** PA redesign 2025-03-24 **/

.page-wrapper {
	display:flex;
	flex-flow: column;
	height: 100vh;
	padding: 0px;
	margin: 0px;
	min-height:600px;
	min-width: 800px;
}

.menu-bar-wrapper {
	flex: 0 0 32px;
	min-height: 32px;
	max-height: 32px;
}

.menubar {
	display:flex;
	flex-grow:1;
	flex-flow:row;
	justify-content: space-between;
}

.display-wrapper {
	display:flex;
	flex: 1 1 auto;
	flex-flow:row;
	min-height: 0;
}

.pa-display-wrapper {
	gap: 20px;
	padding: 20px;
}

.sidebar-container {
	display:flex;
	flex-flow:column;
	flex-grow: 1;
	max-width: 400px;
	min-width: 400px;
	row-gap: 20px;
	background-color: #F8FAFB !important;
}

.content-container {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
}

.content-display {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}

.content-display .ribbon_content_adjust {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}

.content-display .ui-tabs {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}

.ribbon_tab_root {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}

.ribbon_tab_root > .ui-tabs-nav {
	flex: 0 0 auto;
}

.content-display .ui-tabs > .ui-tabs-panel:has(> .record-shell) {
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
	box-sizing: border-box;
}

.content-display .ui-tabs > .ui-tabs-panel > .record-shell {
	min-height: 0;
}

.pa-root {
	background-color: #F8FAFB !important;
    row-gap: 20px;
}

/* The base wrapper is capped at the Toolkit's 32px bar, which lets PA's 50px logo
   underlap the sidebar below; 46px leaves the logo a small gap above the sidebar. */
.pa-root .menu-bar-wrapper {
	flex-basis: 46px;
	min-height: 46px;
	max-height: 46px;
}

.pa-root .menu-bar-wrapper #menubar {
	position: relative;
	background: none !important;
    height: 60px;
}

.pa-root .display-wrapper {
    overflow: hidden;
	column-gap: 20px;
}

.pa-root .display-wrapper .content-container {
	display:flex;
	flex-flow:column;
	flex-grow:1;
    row-gap: 20px;
	overflow: hidden;
	margin-right: 20px;
	margin-bottom:20px;
}

.pa-root .display-wrapper .content-container .content-display {
	display:flex;
	flex-grow:1;
	flex-flow:column;
	background-color: white !important;
	border: 1px solid #dbdada;
	border-radius: 20px;
    min-height: 0;
}

.pa-root .display-wrapper .content-container .sub-content-display .resources-display {
	display: none;
	flex-flow: row;
    min-height: 53px;
    max-height: 53px;
    margin-top: 2px;
	justify-content: flex-end;
}

.pa-root .display-wrapper .content-container .sub-content-display .resources-display .section-resources-button {
	display:flex;
	flex-flow: row;
	justify-content: center;
	flex-grow:0;
    background-color: #e1edf4;
    border-radius: 15px;
    line-height: 53px;
    font-family: 'Manrope';
    font-size: 20px;
	color: #05273a;
    text-transform: uppercase;
    padding: 0px 60px;
	cursor: pointer;
}

.pa-root .display-wrapper .content-container .sub-content-display .resources-display .section-resources-button span::before {
    display: inline-block;
	content: "";
	background-image: url(/images/pareto_academy/folder_icon.svg);
	background-repeat: no-repeat;
	background-size: cover;
    min-width: 30px;
    min-height: 26px;
	margin-right:10px;
	margin-bottom: -3px;
}

.resources-display {
	display: none;
}

.pa-root .display-wrapper .content-container .content-display #content {
	overflow-y: auto;
	scrollbar-width: thin;
	background-color: white !important;
	margin:5px;
	border-radius: 20px;
    padding: 10px;
}

.pa-root .display-wrapper .sidebar-container {
	margin-left:20px;
	margin-bottom:20px;
	border-radius: 20px;
}

.pa-root .display-wrapper .sidebar-container #sidebar {
	display: flex;
	flex-flow: column;
	flex-grow:1;
	overflow: hidden;
	border-radius: 20px;
	border: 1px solid #dbdada;
    background-color: #e1edf4;
}

.pa-root .display-wrapper .sidebar-container #sidebar #side_menu_wrapper {
	display: flex;
	flex-flow: column;
	flex-grow:1;
	overflow: hidden;
}

.pa-root .display-wrapper .sidebar-container #sidebar #side_menu_wrapper .side_menu {
    display: flex;
    flex-flow: column;
	flex-grow:1;
	overflow: hidden;
}

.pa-root .display-wrapper .sidebar-container #sidebar #side_menu_wrapper .side_menu #menu_vertical {
	border: none;
    background-color: transparent;
}

.pa-root .display-wrapper .sidebar-container #sidebar #side_menu_wrapper .side_menu #menu_vertical .side_menu_title_container {
	display:flex;
	justify-content: center;
	font-family: 'Manrope'; font-weight: 600;
	color: #375261;
	font-size: 18px;
	background-color: white;
	border: 1px solid #dbdada;
	border-radius: 10px;
    padding: 15px 0px;
	cursor:pointer;
}

.side_menu_accordion_wrapper {
	flex-grow:1;
	overflow-y: auto;
	scrollbar-width: thin;
	padding-bottom: 10px;
}

.accordion-icon-open {
    position: relative !important;
	background-image: url(/images/pareto_academy/arrow_down.svg) !important;
    min-width: 37px;
    min-height: 37px;
    background-size: cover;
    margin-top: 5px !important;
	margin-left: 12px;
}

.accordion-icon-closed {
    position: relative !important;
	background-image: url(/images/pareto_academy/left_arrow.svg) !important;
    min-width: 39px;
    min-height: 39px;
    background-size: cover;
    margin-top: 4px !important;
	margin-left: 10px;
}
.pa-root .display-wrapper .content-container .sub-content-display {
	display:none;
	flex-flow: row;
	flex-grow:1;
	justify-content: flex-end;
	column-gap:20px;
	max-height: 59px;
}

.pa-root .display-wrapper .content-container .sub-content-display .ai-logo-container {
	display: none;
	background-image: url(/images/pareto_academy/learn_with_ai_298px.svg);
    background-size: contain;
    background-repeat: no-repeat;
    max-height: 59px;
    min-height: 59px;
    min-width: 298px;
    max-width: 298px;
	cursor:pointer;
}

.pa-root * .drop_down_indicator {
	font-family: 'Manrope'; font-weight: 600;
	color: #375261;
	border: 1px solid #dbdada;
	border-radius: 10px;
	background-color: white;
	margin-right:20px !important;
}

.pa-root * .drop_down_indicator::after {
	background-image: url(/images/pareto_academy/dropdown.svg);
	background-size: cover;
	background-repeat: no-repeat;
	min-height: 12px;
	min-width: 9px;
	content: "";
    display: inline-block;
	margin-right:10px;
}

.pa-root * .name_container {
	font-family: 'Manrope';
	line-height:40px;
	margin-right: 4px;
    margin-left: 4px;
	letter-spacing: -.5px;
}

.pa-root * #menu_bar_right_menu_container {
    display: flex;
    flex-flow: row;
    justify-content: center;
    align-items: center;
    /* #1588: the base rule gained height:100% for the Toolkit top bar, which stretches
       the PA header's name pill to the full header height (~58px) and makes the name
       read larger than it used to. PA keeps the content-hugging pill. */
    height: auto;
}

.user-name-circle {
	font-family: 'Manrope';
	width: 25px;
	height: 25px;
	line-height: 25px;
	color: white;
	background: #016BA5;
	border-radius: 50%;
	text-align: center;
    margin-left: 10px;
}

.user-panel-content {
	box-sizing: border-box;
	padding: 20px;
	min-height: 0;
	overflow-y: auto;
}

.pa-panel-logo {
	background-image: url(/images/pareto_academy/pa-logo-50h.png);
	height:50px;
    margin-left: 30px;
    width: 227px;
    background-size: contain;
    background-repeat: no-repeat;
}

/*
.pa-panel-logo {
	display:flex;
	flex-flow:row;
	font-family: 'Manrope' !important;
	color: #1A6BA5;
	margin-left:20px;
	justify-content: space-between;
}

.pa-panel-logo-text {
	font-family: KanitBold;
	font-size: 27px;
    align-self: anchor-center;
}

.pa-panel-logo-by-pareto {
    font-family: 'Manrope';
    font-size: 11px;
    align-self: flex-end;
    margin-bottom: 12px;
}

.pa-panel-logo-icon {
	background-image: url(/images/pareto_academy/pa_logo.svg);
	background-size: contain;
	background-repeat: no-repeat;
	height: 50px;
	width: 50px;
}
*/

/* parent container for the new resources display */
.resources-content {
	display: flex;
	flex-flow: column;
	flex-grow: 1;
	gap: 10px;
	border-top: 1px solid #dbdada;
}

.section-resources-title {
	font-size: 23px;
	padding: 10px;
}

.section-resources-content {
	display:flex;
	flex-flow: row;
	flex-grow:1;
	gap: 7px;
	justify-content: flex-start;
	flex-wrap: wrap;
}

.section-resource {
	flex-grow: 0;
	border: 1px solid #dbdada;
	border-radius: 10px;
    padding: 10px;
    cursor: pointer;
    font-size: 15px;
    white-space: nowrap;
}


.side_menu_book_progress {
    display: flex;
    flex-flow: row;
    padding: 10px;
}

.complete-section-mark {
	background-image: url(/images/pareto_academy/complete_section.svg);
	height: 22px !important;
	width: 22px !important;
    margin: 0px 3px 0 0;
	z-index: 0;
}

.completed-section-mark {
	background-image: url(/images/pareto_academy/completed_section.svg);
	height: 22px !important;
    width: 23px !important;
    margin: 0px 3px 0 0;
	z-index: 0;
}

.completed-book .accordion-icon-open {
	background-image: url(/images/pareto_academy/down_arrow_complete.svg) !important;
    min-height: 38px !important;
    min-width: 38px !important;
	margin-left: 10px;
}

.completed-book .accordion-icon-closed {
	background-image: url(/images/pareto_academy/right_arrow_complete.svg) !important;
    min-height: 38px !important;
    min-width: 37px !important;
}

.section-resources-panel {
	display: flex;
	flex-flow: column;
    row-gap: 10px;
	border: 1px solid #dbdada;
	/*position: absolute;
	bottom: 20px;
	right: 20px;*/
    min-height: 300px;
    max-height: 80vh;
    min-width: 300px;
	/* #1549: default stays 400px; a custom drag handle on the right edge (see
	   .section-resources-resize-handle) lets the user widen it — growing right, then continuing to grow
	   LEFT once the right edge reaches the viewport. Width is persisted in localStorage + clamped to the
	   viewport in JS (the panel is left-anchored, so a plain vw cap isn't enough). */
	width: 400px;
	max-width: 95vw;
	position: relative;   /* containing block for the absolute resize handle */
	/* #1549: sit above the app content (nav section edit/add icons top out ~10070) so nothing bleeds
	   through the panel; still below the app's overlay layer (30000+) so real modals cover it. */
	z-index: 10080;
	background-color: #e1edf4;
	border-radius: 20px;
	box-shadow: 0px 0px 20px #ddd;
	padding: 20px;
    overflow-y: hidden;
}

/* #1549: obvious, full-height drag handle on the panel's LEFT edge. It's on the left because the panel
   is docked bottom-right and the free space is to the left — dragging the left edge leftward can widen
   the panel all the way to the left viewport wall, whereas a right-edge handle dead-ends as soon as the
   cursor reaches the right edge of the screen. */
.section-resources-resize-handle {
	position: absolute;
	top: 0;
	left: 0;
	width: 14px;
	height: 100%;
	cursor: ew-resize;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(to right, rgba(92,125,146,0.18), rgba(92,125,146,0));
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
	z-index: 2;
}
.section-resources-resize-handle::before {
	content: "";
	width: 0;
	height: 34px;
	border-left: 2px dotted #5c7d92;
}
.section-resources-resize-handle:hover {
	background: linear-gradient(to right, rgba(92,125,146,0.32), rgba(92,125,146,0));
}
/* #1549: while dragging the resize handle, suppress text selection + keep the resize cursor. */
body.section-resources-resizing, body.section-resources-resizing * {
	user-select: none !important;
	cursor: ew-resize !important;
}

.section-resources-panel-header {
	display:flex;
	flex-flow: column;
	font-family: 'Manrope';
	font-size: 20px;
	color: #05273a;
    max-height: 83px;
    row-gap: 20px;
}

.section-resources-panel-header span {
	flex-grow:1;
	overflow:hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.section-resources-panel-header span:not(.section-resources-panel-select-all span)::before {
    display: inline-block;
	content: "";
	background-image: url(/images/pareto_academy/folder_icon.svg);
	background-repeat: no-repeat;
	background-size: cover;
    min-width: 30px;
    min-height: 26px;
	margin-right:10px;
	margin-bottom: -3px;
}

.section-resources-panel-footer {
	max-height: 40px;
    padding: 10px;
    justify-content: flex-end;
    display: flex;
    flex-flow: row;
    column-gap: 10px;
}

.section-resources-panel-content {
	display: flex;
	flex-flow: column;
	flex-grow: 1;
	row-gap: 10px;
    overflow-y: auto;
	min-height:100px;
}

.section-resource-item {
	background-color: #016BA5;
	color: white;
	font-family: 'Manrope';
    padding: 5px;
    border-radius: 8px;
    display: flex;
    flex-flow: row;
    column-gap: 5px;
    align-items: center;
    justify-content: flex-start;
	line-height:34px;
	cursor:pointer;
}

/* #1549: with the panel now resizable, lay each resource row out as
   [radio] [icon + name — fills the middle, truncates] [action buttons — right].
   Higher specificity (.section-resource-item .section-resource-name) so it beats the
   `.section-resource-item span { max-width: 275px }` cap in the <=1366px media query — that cap was for
   the old fixed-width panel and would otherwise stop the name from filling the widened panel. */
.section-resource-item .section-resource-name {
	flex: 1 1 auto;
	min-width: 0;             /* allow the name to shrink + ellipsis instead of stretching the row */
	max-width: none;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.section-resource-item > .section-resource-selector,
.section-resource-item > .section-resource-file-icon,
.section-resource-item > .section-resource-download-icon,
.section-resource-item > .button {
	flex-shrink: 0;          /* keep the radio + action buttons at full size, pinned to their edges */
}
/* #1549: vertically center every item in the row. The children still carried margin-top offsets tuned
   for the old top-aligned layout, which fought align-items:center — clear them (higher specificity than
   the base + <=1366px media-query rules) so everything lines up on the row's centerline. */
.section-resource-item > .section-resource-selector,
.section-resource-item > .section-resource-file-icon,
.section-resource-item > .section-resource-download-icon,
.section-resource-item > .section-resource-name,
.section-resource-item > .button {
	margin-top: 0;
	margin-bottom: 0;
}
/* #1549: normalize the right-side action icons. They come from two icon sets (download from
   pareto_academy at 15px, edit/delete from calendar at 16px) with different margins, so they looked
   uneven/skewed. Put them all on the same 16x16 box, contained + centered (no crop), with no per-icon
   margins so the row's column-gap spaces them evenly. (Art still differs between the two sets.) */
.section-resource-item > .section-resource-download-icon,
.section-resource-item > .button {
	width: 16px;
	height: 16px;
	min-width: 16px;
	min-height: 16px;
	margin: 0;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}
/* #1549: match the admin edit/delete icons to the accepted (user-facing) download icon style — a solid
   white filled glyph at 0.86 opacity, full white on hover — instead of the thin calendar line-art, so
   the three action icons read as one set. Scoped to the resource row so the global .edit/.delete used
   elsewhere in the app are untouched. */
.section-resource-item > .button.edit {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white' fill-opacity='0.86'%3E%3Cpath d='M12.854.146a.5.5 0 0 0-.707 0L10.5 1.793 14.207 5.5l1.647-1.646a.5.5 0 0 0 0-.708l-3-3zm.646 6.061L9.793 2.5 3.293 9H3.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.207l6.5-6.5zm-7.468 7.468A.5.5 0 0 1 6 13.5V13h-.5a.5.5 0 0 1-.5-.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.5-.5V10h-.5a.499.499 0 0 1-.175-.032l-.179.178a.5.5 0 0 0-.11.168l-2 5a.5.5 0 0 0 .65.65l5-2a.5.5 0 0 0 .168-.11l.178-.178z'/%3E%3C/svg%3E");
}
.section-resource-item > .button.delete {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white' fill-opacity='0.86'%3E%3Cpath d='M2.5 1a1 1 0 0 0-1 1v1a1 1 0 0 0 1 1H3v9a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V4h.5a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H10a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1H2.5zm3 4a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5zM8 5a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7A.5.5 0 0 1 8 5zm3 .5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}
.section-resource-item > .button.edit:hover {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3E%3Cpath d='M12.854.146a.5.5 0 0 0-.707 0L10.5 1.793 14.207 5.5l1.647-1.646a.5.5 0 0 0 0-.708l-3-3zm.646 6.061L9.793 2.5 3.293 9H3.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.207l6.5-6.5zm-7.468 7.468A.5.5 0 0 1 6 13.5V13h-.5a.5.5 0 0 1-.5-.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.5-.5V10h-.5a.499.499 0 0 1-.175-.032l-.179.178a.5.5 0 0 0-.11.168l-2 5a.5.5 0 0 0 .65.65l5-2a.5.5 0 0 0 .168-.11l.178-.178z'/%3E%3C/svg%3E");
}
.section-resource-item > .button.delete:hover {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3E%3Cpath d='M2.5 1a1 1 0 0 0-1 1v1a1 1 0 0 0 1 1H3v9a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V4h.5a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H10a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1H2.5zm3 4a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5zM8 5a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7A.5.5 0 0 1 8 5zm3 .5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}
/* #1549: don't let the footer squish/clip its buttons. The footer's max-height (tightened to 20px in
   the <=1366px media query) + default align-items:stretch stretched the flex buttons down to ~6px of
   content, clipping the "Upload File" label. Center them at natural height and let the footer size to
   fit. Higher specificity (panel > footer) than the base + media rules. */
.section-resources-panel > .section-resources-panel-footer {
	align-items: center;
	max-height: none;
}

.section-resource-item span {
	flex-grow:1;
    margin-right: 5px;
	max-width: 325px;
	white-space: nowrap;
	overflow-x: hidden;
	text-overflow: ellipsis;
}

.section-resource-selector {
    display: inline-block;
	background-image: url(/images/pareto_academy/file_selection_input.svg);
	background-repeat: no-repeat;
	background-size: cover;
    min-width: 14px;
    min-height: 15px;
    margin-right: 6px;
    margin-top: 9px;
    margin-left: 9px;
}

.section-resource-selector-selected {
	background-image: url(/images/pareto_academy/file_selected.svg);
}

.section-resource-file-icon {
    display: inline-block;
	background-image: url(/images/pareto_academy/file.svg);
	background-repeat: no-repeat;
	background-size: cover;
    min-width: 16px;
    min-height: 24px;
    margin-right: 5px;
    margin-top: 3px;
}

.section-resource-download-icon {
    display: inline-block;
	background-image: url(/images/pareto_academy/download_file.svg);
	background-repeat: no-repeat;
	background-size: cover;
    min-width: 15px;
    min-height: 15px;
    margin-right: 10px;
    margin-top: 8px;
}

.section-resource-download-icon:hover {
	background-image: url(/images/pareto_academy/download_file_hover.svg);
}

.section-resources-panel-select-all {
	display: flex;
	flex-flow: row;
	justify-content: flex-start;
	flex-grow:0;
	background-color: #e1edf4;
    border-radius: 8px;
	border: 1px solid #3086B6;
    gap: 5px;
	font-family: 'Manrope';
	font-size: 14px;
	color: #3086B6;
	cursor: pointer;
    padding: 6px;
    max-width: 92px;
    padding-left: 13px;
	user-select: none;
	-ms-user-select:none;
	-webkit-user-select:none;
	-moz-user-select:none;
}

.section-resources-panel-select-all-icon {
	background-image: url(/images/pareto_academy/select_all_input.svg);
	background-repeat: no-repeat;
    background-size: contain;
    min-width: 14px;
    margin-top: 3px;
}

.section-resources-panel-select-all-icon-selected {
	background-image: url(/images/pareto_academy/file_selected.svg);
	background-repeat: no-repeat;
    background-size: contain;
    min-width: 12px;
    margin-top: 3px;
}

.section-resources-panel-download {
	display: inline-block;
	flex-grow:0;
    border-radius: 8px;
	border: 1px solid #016ba5;
	background-color: #016BA5;
	font-family: 'Manrope';
	font-size: 14px;
	color: #ffffff;
	cursor: pointer;
    padding: 6px;
	user-select: none;
	-ms-user-select:none;
	-webkit-user-select:none;
	-moz-user-select:none;
}

.section-resources-panel-download-disabled {
	background: none;
	color: #016ba5;
}

.section-resources-panel-upload {
	display: inline-block;
	flex-grow:0;
    border-radius: 8px;
	border: 1px solid #016ba5;
	background-color: #016BA5;
	font-family: 'Manrope';
	font-size: 14px;
	color: #ffffff;
	cursor: pointer;
    padding: 6px;
	user-select: none;
	-ms-user-select:none;
	-webkit-user-select:none;
	-moz-user-select:none;
}

.section-resources-panel-error {
	position:absolute;
	bottom: 70px;
	right: 200px;
    min-height: 20px;
    min-width: 100px;
    background-color: #e1edf4;
    border: 1px solid #dbdada;
    font-family: 'Manrope';
    color: #05273a;
    font-size: 16px;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 1px 1px 5px #444;

}

.side_menu_vertical_buttons {
	display: flex;
	flex-flow: row;
	flex-grow: 0;
	white-space: nowrap;
    margin-top: 4px;
}

.side_menu_vertical_buttons .button {
    width: 18px;
    height: 18px;
}

.sidebar-divider {
	display: none;
}

.pa-root .display-wrapper .left-slope {
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	border-top-right-radius: 2px;
	border-bottom-right-radius: 2px;
}

.pa-root .display-wrapper .right-slope {
	border-top-left-radius: 2px;
	border-bottom-left-radius: 2px;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}

.pa-menu {
    background-color: #f8fafb !important;
    box-shadow: none;
	border-radius: 15px;
    border: 1px solid #dbdada;
}

.pa-menu .menu_content_container {
	display: flex;
	flex-flow: row;
	flex-grow: 1;
    margin: 10px;
}

.pa-menu .menu_content_container * .menu_standard_category_container_title {
	color: #375261;
	font-family: 'Manrope';
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 550;
}

.pa-menu * .menu_standard_category_list {
	margin-bottom: 40px;
}

.pa-menu .menu_content_container * .menu_tile_category_container_title {
	color: #375261;
	font-family: 'Manrope';
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 550;
}

.pa-menu .menu_content_container * .menu_plugin_nav_item {
	color: #375261;
	font-family: 'Manrope';
}

.pa-menu .menu_content_container * .menu_plugin_settings_item {
	color: #375261;
	font-family: 'Manrope';
}

.pa-menu * .version-container {
	margin-top:20px;
}

.pa-menu * .menu_tile_category_tile_container {
    column-gap: 10px;
    height: 100%;
	margin-bottom: 20px;
}

.pa-menu * .menu_standard_category_list li:hover {
    border: 1px solid #dbdada;
	background-color: #f8fafb !important;
	border-radius: 10px;
}

.pa-menu .menu_tile_menu_item_container {
	display: flex;
	flex-flow: row;
	flex-grow: 1;
	columns: 2;
	justify-content: space-between;
}

.pa-menu .version-container > span {
	color: #375261;
	font-family: 'Manrope';
}

.pa-menu * .menu_item_tile_container {
    border: 1px solid #dbdada;
	border-radius: 10px;
}

.pa-menu * .menu_plugin_vertical_tile_text {
    text-align: center;
	background-color: #698594;
	color: white;
    padding: 5px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    min-height: 20px;
}

.pa-menu * .menu_plugin_vertical_tile {
	border-radius: 10px;
	min-height:30px;
	max-height:30px;
}

.pa-menu * .menu_plugin_vertical_tile_img {
    border-radius: 10px;
}

.pa-menu * .menu_plugin_nav_item_icon_container, .pa-menu * .menu_plugin_settings_item_icon_container {
	background-color: transparent !important;
}

.section-resources-panel * .delete {
    min-width: 17px;
    min-height: 18px;
    margin-top: 6px;
    margin-right: 5px;
    margin-left: -5px;
}

.section-resources-panel * .edit {
    min-width: 19px;
    min-height: 17px;
    margin-top: 6px;
    margin-right: 5px;
    margin-left: -5px;
}

.section-resources-panel * .save {
    min-width: 20px;
    min-height: 20px;
    margin-top: 6px;
    margin-right: 5px;
    margin-left: -5px;
}

.section-resource-edit-input {
    margin-top: 1px;
    line-height: 25px;
    flex-grow: 1;
}

/* Styles for DFB blank cells and rows */
.blank_cell {
    background-color: transparent !important;
    border: none !important;
}

.blank_row {
    background-color: transparent !important;
    border: none !important;
    height: 20px;
}

.entry_label:empty {
    background-color: transparent !important;
    border: none !important;
}

/*
table.entry {
	width: 97%;
	table-layout: fixed;
}
*/

/* Ensure blank cells maintain proper width for column spacing */
.blank_cell {
    width: auto;
    min-width: 200px;
}

.form-container-v3 .entry_label {
    width: 150px;
    min-width: 150px;
}
/* Custom Entity Form Layout Options Styles */
#tr_FormLayoutOptions td {
    padding: 15px;
    background-color: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 4px;
}

#tr_FormLayoutOptions h4 {
    margin: 0 0 15px 0;
    color: #333;
    font-size: 14px;
}

.form-layout-option {
    margin-bottom: 10px;
    padding: 8px;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 3px;
    display: flex;
    flex-flow: row;
}

.form-layout-option:last-child {
    margin-bottom: 5px;
}

.form-layout-option label {
    cursor: pointer;
    display: inline-block;
    vertical-align: top;
    flex-grow: 1;
}

.form-layout-option input[type="radio"] {
    margin-right: 8px;
    vertical-align: top;
    margin-top: 2px;
    width: auto !important;
}

.form-layout-option label .description {
    color: #666;
    font-size: 12px;
}


/* overrides for 1366 x 768 */
@media screen and (max-width: 1366px) {

	.fc button.fc-button {
		height: 37px;
	}

	.fc-tb-clone-date {
		min-width: 180px;
		max-width: 180px;
	}

	.fc-tb-clone-date h2 {
		font-size: 17px;
	}

	/* Collapsed state stays same size */
	.fc-tb-clone-search-wrapper.expanded {
		max-width: 125px;
		min-width: 125px;
	}

	.fc-tb-clone-search-wrapper.expanded input.fc-tb-clone-search-input {
		max-width: 100px;
	}

	.fc-tb-clone-search-wrapper input.fc-tb-clone-search-input::placeholder {
		font-size: 13px;
	}

	/* Task toolbar responsive */
	.task-tb-title {
		font-size: 20px;
	}

	.task-tb-search-wrapper.expanded {
		max-width: 125px;
		min-width: 125px;
	}

	.task-tb-search-wrapper.expanded input.task-tb-search-input {
		max-width: 100px;
	}

	.task-tb-search-wrapper input.task-tb-search-input::placeholder {
		font-size: 13px;
	}

	/* The Create Task button keeps its full size, matching the calendar's Create Event button,
	   which has no narrow-screen override. */
	.task-tb-layout-host .custom_table_select {
		min-width: 145px;
	}

	/* Module toolbar responsive */
	.mod-tb-title {
		font-size: 20px;
	}

	.mod-tb-search-wrapper.expanded {
		max-width: 125px;
		min-width: 125px;
	}

	.mod-tb-search-wrapper.expanded input.mod-tb-search-input {
		max-width: 100px;
	}

	.mod-tb-search-wrapper input.mod-tb-search-input::placeholder {
		font-size: 13px;
	}

	.mod-tb-create-button {
		padding: 0 12px;
	}

	.mod-tb-create-button-text {
		font-size: 13px;
	}

	.mod-tb-save-button {
		padding: 0 12px;
	}

	.mod-tb-export-button {
		padding: 0 12px;
	}
	.mod-tb-export-button-text {
		font-size: 13px;
	}

	.ops_container {
		max-height: 72vh;
		overflow-y: auto;
	}

	.fc-scroller:not(.fc-day-grid-container) {
		max-height: 52vh;
		overflow-y: auto;
	}

	.fc-day-grid-container {
		max-height: 56vh;
		overflow-y: auto;
	}

	.fc-tb-clone-bottom {
		line-height: 25px;
	}

	/* The main ↔ sidebar gap stays on --workspace-layout-gap at every width, matching Tasks. */
	.calendar_layout .cal_fc_container {
		min-height: 0;
	}

	/* Sidebar width stays on the shared .cal_ops_container clamp so it matches the Tasks sidebar. */
	.calendar_layout .cal_ops_container .ops_container {
		gap: 2px;
		max-height: none;
	}

	.calendar_layout .cal_ops_container .ops_container > .cal_user_filter {
		gap: 2px;
	}

	div.ops_container div.mini_cal_container {
		margin-top: 2px;
	}

	div.ops_container div.mini_cal_container div.pareto_picker_container {
		position: relative;
		box-sizing: border-box;
		margin-bottom: 0px;
		padding: 4px;
		max-width: 100%;
		overflow: hidden;
	}

	div.ops_container div.mini_cal_container table {
		table-layout: fixed;
		width: 100%;
	}

	div.ops_container div.mini_cal_container table td {
		width: auto;
	}

	.pareto_date_picker_dow_header td {
		width: auto;
	}

	div.ops_container div.mini_cal_container select {
		font-size: 13px;
	}

	.tk_section_heading {
		padding: 4px 10px;
		margin-bottom: 0px;
	}

	.sidebar-container {
		max-width: 300px;
		min-width: 300px;
	}

	.pa-root .display-wrapper .sidebar-container #sidebar #side_menu_wrapper .side_menu #menu_vertical .side_menu_title_container {
		font-size: 16px;
	}

	.menu_tile_category_tile_container {
		max-height: 60vh;
	}

	.section-resources-panel-header {
		font-size: 18px;
		max-height: 70px;
		row-gap: 15px;
	}

	.section-resources-panel-header span:not(.section-resources-panel-select-all span)::before {
		min-width: 25px;
		min-height: 21px;
	}

	.section-resources-panel-footer {
        max-height: 20px;
		padding: 5px;
	}

	.section-resource-item {
		padding: 4px;
        padding-left: 0px;
        column-gap: 10px;
		line-height:25px;
	}

	.section-resource-item span {
		font-size: 13px;
		max-width: 275px;
	}

	.section-resource-selector {
        margin-top: 5px;
	}

	.section-resource-file-icon {
		margin-top: 1px;
		cursor:pointer;
	}

	.section-resources-panel-select-all {
		font-size: 13px;
		padding: 5px;
        max-width: 82px;
	}

	.section-resources-panel-download {
		min-height: 20px;
	}

	.pa-root .display-wrapper .content-container .sub-content-display .resources-display .section-resources-button {
		line-height: 49px;
		font-size: 18px;
		padding: 0 40px;
		max-height: 49px;
		user-select: none;
		-ms-user-select:none;
		-webkit-user-select:none;
		-moz-user-select:none;
	}

	.pa-root .display-wrapper .content-container .sub-content-display .resources-display .section-resources-button span::before {
		min-width: 25px;
		min-height: 21px;
		margin-bottom: -2px;
	}

	.pa-root .display-wrapper .sidebar-divider {
		display: flex;
		width: 10px;
		cursor: col-resize;
		border: 1px solid #dbdada;
		background-color: #e1edf4;
        margin: 20px 0px 40px 0px;
	}

	.pa-root .display-wrapper {
		column-gap:5px;
	}

	.section-resource-download-icon {
		margin-top: 5px;
	}

	.side_menu_book {
		font-size: 14px;
	}

	.side_menu_section {
		font-size: 14px;
	}
}

@media screen and (max-width: 1280px) {

	.fc-tb-clone-selector-btn {
		padding: 0px 8px;
		font-size: 13px;
	}

	.ops_container {
		max-height: 72vh;
		overflow-y: auto;
	}

	.fc-scroller:not(.fc-day-grid-container) {
		max-height: 50vh;
		overflow-y: auto;
	}

	.fc-day-grid-container {
		max-height: 53vh;
		overflow-y: auto;
	}

	.fc-tb-clone-buttons {
		margin-left: -10px;
	}

	/* Collapsed state stays same size, expanded is smaller */
	.fc-tb-clone-search-wrapper.expanded {
        max-width: 100px;
        min-width: 100px;
	}

	.fc-tb-clone-search-wrapper.expanded input.fc-tb-clone-search-input {
		max-width: 84px;
	}

	.fc-tb-clone-search-wrapper input.fc-tb-clone-search-input::placeholder {
		font-size: 13px;
	}

	/* Keep icon size consistent when collapsed */
	.fc-tb-clone-search-icon {
		max-width: 20px;
		min-width: 20px;
		height: 20px;
	}

	.fc-tb-clone-search-wrapper.expanded .fc-tb-clone-search-icon {
		max-width: 15px;
		min-width: 15px;
		height: 15px;
	}

	.fc-settings-day-pill {
		width: 30px;
		height: 26px;
		font-size: 11px;
	}

	/* Fit calendar within layout instead of overflowing */
	.calendar_layout .cal_fc_container {
		min-height: 0;
	}

	.calendar_layout .cal_ops_container .ops_container {
		gap: 2px;
		max-height: none;
	}

	div.ops_container div.mini_cal_container {
		margin-top: 2px;
	}

	div.ops_container div.mini_cal_container div.pareto_picker_container {
		position: relative;
		box-sizing: border-box;
		margin-bottom: 0px;
		padding: 2px;
		max-width: 100%;
		overflow: hidden;
	}

	div.ops_container div.mini_cal_container table {
		table-layout: fixed;
		width: 100%;
	}

	div.ops_container div.mini_cal_container table thead th,
	div.ops_container div.mini_cal_container table tbody td {
		padding: 1px;
		font-size: 12px;
		width: auto;
	}

	.pareto_date_picker_dow_header td {
		width: auto;
	}

	div.ops_container div.mini_cal_container select {
		font-size: 12px;
	}

	.tk_section_heading {
		padding: 3px 10px;
		margin-bottom: 0px;
		font-size: 13px;
	}

	.calendar_layout .cal_ops_container .ops_container > .cal_user_filter {
		gap: 2px;
	}

	div.cal_user_filter {
		max-height: clamp(120px, 18vh, 170px);
	}

	div.cal_user_filter > ul.cal_ops_list:not(.collapsible_content) {
		min-height: 40px;
		max-height: clamp(60px, 12vh, 120px);
	}

	div.cal_user_filter > ul.collapsible_content {
		flex: 1 1 auto;
		min-height: 0;
		overflow-y: auto;
	}

	div.cal_user_filter span {
		font-size: 12px;
		margin-top: 1px;
	}
}
.calendar_layout .cal_ops_container {
	width: 100%;
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 0;
}

/* No extra top padding on the calendar sidebar at smaller widths: it keeps the same 16px as the
   Tasks sidebar so the mini calendar sits level with the toolbar. */

/* ==========================================================================
   Process List Header Buttons
   ========================================================================== */

.process-grid-header {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	margin-bottom: 20px;
	flex-shrink: 0;
	min-height: 38px;
}

.process-grid-header .button-group {
	display: flex;
	align-items: stretch;
	gap: 10px;
}

.process-header-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 12px 16px;
	border-radius: 6px;
	cursor: pointer;
	font-family: 'Manrope', sans-serif !important; font-weight: 500;
	font-size: 14px;
	font-weight: 500;
	transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
	white-space: nowrap;
}

.process-header-btn:focus {
	outline: none;
}

.process-header-btn:focus-visible {
	outline: 2px solid #00529b;
	outline-offset: 2px;
}

.process-header-btn--primary {
	color: #fff;
	border: none;
}


.process-header-btn--secondary {
	background-color: #fff;
	color: #333;
	border: 1px solid #ccc;
}

.process-header-btn--secondary:hover {
	background-color: #f5f5f5;
	border-color: #999;
}

.process-header-btn--secondary:active {
	background-color: #eee;
	border-color: #888;
}

.process-header-btn svg {
	flex-shrink: 0;
	margin-right: 8px;
}

/* ==========================================================================
   Builder Mode Toggle Pill
   ========================================================================== */

.builder-mode-pill {
	padding: 8px 16px;
	background: #e8f0f8;
	border: 1px solid #b8d4ed;
	border-radius: 6px;
	font-family: 'Manrope', sans-serif !important; font-weight: 500;
	font-size: 13px;
	color: #00529b;
	cursor: pointer;
	transition: all 0.2s;
	white-space: nowrap;
}

.builder-mode-pill:hover {
	background: #d4e6f5;
	border-color: #8bbfe0;
	color: #003d73;
}

.builder-mode-pill:focus {
	outline: none;
}

.builder-mode-pill:focus-visible {
	outline: 2px solid #00529b;
	outline-offset: 2px;
}

.builder-mode-pill--small {
	padding: 6px 12px;
	font-size: 12px;
}

/* Shimmer animation for builder mode pill */
@keyframes builderPillShimmer {
	0% {
		background-position: -200% center;
	}
	100% {
		background-position: 200% center;
	}
}

.builder-mode-pill--shimmer {
	background: linear-gradient(
		90deg,
		#e8f0f8 0%,
		#e8f0f8 40%,
		#f5faff 50%,
		#e8f0f8 60%,
		#e8f0f8 100%
	);
	background-size: 200% 100%;
	animation: builderPillShimmer 3s ease-in-out infinite;
}

/* Classic expanded card state */
.process-card.classic-expanded {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	transform: none !important;
}

.classic-expanded-content {
	border-radius: 8px;
}

.process-step-add {
	min-height: 18px;
	color: #fff;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	line-height: 18px;
	background: #13529B;
	border-radius: 6px;
	padding: 8px 16px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	cursor: pointer;
	box-sizing: border-box;
}

.process-step-add::before {
	content: '+';
	color: #fff;
	font-size: 16px;
	line-height: 16px;
}

.process-step-add > div.button {
	display: none;
}

.process-step-add:hover {
	background: #0f477f;
}

.classic-expanded-content table.table_builder tbody tr td {
	padding: 10px 12px !important;
}

.classic-expanded-content table.table_builder tbody tr td:first-child {
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
}

.classic-expanded-content table.table_builder tbody tr td:last-child {
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
}

.classic-expanded-content table.table_builder.table_builder_selectable_rows tbody tr:hover {
	background-color: #F3F3F3;
}

.classic-expanded-content table.table_builder tbody tr.data_table_selected_row {
	background-color: #95afcc !important;
}

.classic-expanded-content table.table_builder tbody tr.data_table_selected_row:hover {
	background-color: #8aa3c0 !important;
}

.process-list-wrapper {
	position: relative;
}

/* Under the modern mod-view-head the wrapper is the grey content card
   (styles previously applied inline from tkrv_mod_advocate_process.ts) */
.processes-module-root .process-list-wrapper {
	background: #F3F3F3;
	padding: 25px 25px 0;
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
	border-radius: 12px;
	box-sizing: border-box;
	overflow: hidden;
}

.service-list-wrapper::after,
.process-list-wrapper::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 34px;
	pointer-events: none;
	z-index: 5;
	background: linear-gradient(to bottom, rgba(243, 243, 243, 0), #F3F3F3 74%);
}

.process-list-scrollable {
	scrollbar-width: none; /* Firefox */
	-ms-overflow-style: none; /* IE and Edge */
}

.process-list-scrollable::-webkit-scrollbar {
	display: none; /* Chrome, Safari, Opera */
}

/* ==========================================================================
   Service List Card View
   ========================================================================== */

.service-list-wrapper {
	background: #F3F3F3;
	padding: 25px 25px 0;
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	border-radius: 8px;
	box-sizing: border-box;
	overflow: hidden;
}

/* Under the modern mod-view-head the wrapper is a flex child, not the page */
.services-module-root .service-list-wrapper {
	flex: 1 1 auto;
	height: auto;
	min-height: 0;
	border-radius: 12px;
}

.service-list-scrollable {
	flex: 1;
	overflow-y: auto;
	min-height: 0;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.service-list-scrollable::-webkit-scrollbar {
	display: none;
}

.service-card-grid {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.service-card {
	background: #fff;
	border: 1px solid #e0e0e0;
	border-radius: 8px;
	padding: 12px;
	overflow: hidden;
	/* `translate:` for the hover lift - GSAP owns transform and opacity on these cards
	   (entrance cascade), and a transition on either would re-ease every frame of it. */
	transition: box-shadow 0.2s var(--cal-arrive), translate 0.2s var(--cal-arrive);
}

.service-card:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	translate: 0 -2px;
}

.service-card--expanded {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Drag-reorder insertion indicators (#1517) */
.service-card--drop-above {
	box-shadow: 0 -3px 0 0 #00529b;
}

.service-card--drop-below {
	box-shadow: 0 3px 0 0 #00529b;
}

.service-card--expanded:hover {
	translate: 0 0;
}

.service-card-header {
	display: flex;
	align-items: center;
	cursor: pointer;
	gap: 8px;
}

.service-card-icon {
	width: 32px;
	height: 32px;
	background: #e8f0f8;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.service-card-name {
	flex: 1;
	font-family: 'Manrope', sans-serif;
	font-size: 15px;
	font-weight: 500;
	color: #1e4a6f;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}


.service-card-dots {
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 4px;
	cursor: pointer;
	flex-shrink: 0;
	transition: background 0.2s;
}

.service-card-dots:hover {
	background: #e8f0f8;
}

.service-card-chevron {
	margin-left: 8px;
	transition: transform 0.2s;
	flex-shrink: 0;
	display: flex;
	align-items: center;
}

.service-card--expanded .service-card-chevron {
	transform: rotate(180deg);
}

.service-card-content {
	display: none;
	padding: 20px;
	background: #fafafa;
	margin-top: 12px;
	border-radius: 8px;
}

.service-card--expanded .service-card-content {
	display: block;
}

.service-card-content table.table_builder tbody tr td {
	padding: 10px 12px !important;
}

.service-card-content table.table_builder tbody tr td:first-child {
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
}

.service-card-content table.table_builder tbody tr td:last-child {
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
}

.service-card-content table.table_builder.table_builder_selectable_rows tbody tr:hover {
	background-color: #F3F3F3;
}

.service-activation-actions {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 8px;
}

.service-activation-add {
	min-height: 18px;
}

.service-activation-disable-all {
	margin-left: auto;
	border: 1px solid #d7dde5;
	background: #fff;
	color: #2f3a45;
	border-radius: 6px;
	padding: 8px 14px;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	cursor: pointer;
	line-height: 18px;
}

.service-activation-disable-all:hover:not(:disabled) {
	background: #f5f8fb;
	border-color: #b8c6d5;
}

.service-activation-disable-all:disabled {
	color: #a5adb6;
	background: #f2f4f6;
	cursor: default;
}

.service-activation-header {
	padding: 10px 0 8px 0;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 600;
	color: #666;
}


.service-empty-state {
	text-align: center;
	padding: 60px 20px;
	color: #666;
	font-family: 'Manrope', sans-serif;
}

.service-empty-state h3 {
	margin: 12px 0 8px 0;
	font-size: 18px;
	color: #333;
}

.service-empty-state p {
	font-size: 14px;
	color: #888;
}

.service-card--selected {
	background: #e8f4ff !important;
	border-color: #00529b !important;
}

.service-card-content table.table_builder tbody tr.data_table_selected_row {
	background-color: #95afcc !important;
}

.service-card-content table.table_builder tbody tr.data_table_selected_row:hover {
	background-color: #8aa3c0 !important;
}

.client-class-linked-contacts-dialog.ui-dialog {
	max-height: calc(100vh - 32px);
}

.client-class-linked-contacts-dialog .ui-dialog-titlebar-close {
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	transition: background-color .14s ease, color .14s ease;
}

.client-class-linked-contacts-dialog .ui-dialog-titlebar-close:hover,
.client-class-linked-contacts-dialog .ui-dialog-titlebar-close:focus-visible {
	border: 0 !important;
	outline: none;
	background: #f2f4f6 !important;
	color: #252a31;
	box-shadow: none !important;
}

.client-class-linked-contacts-dialog .ui-dialog-content {
	padding: 8px 16px 10px;
	overflow: visible;
}

.client-class-linked-contacts-table,
.client-class-linked-contacts-table > div {
	display: flex;
	flex-direction: column;
	width: 100%;
	min-width: 0;
	min-height: 0;
	box-sizing: border-box;
}

.client-class-linked-contacts-table > div {
	overflow: visible !important;
}

.client-class-linked-contacts-dialog .custom_table_select,
.client-class-linked-contacts-dialog .dataTables_length {
	display: none;
}

.client-class-linked-contacts-dialog .dataTables_wrapper {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-rows: auto auto auto;
	width: 100%;
	min-height: 0;
	color: #243244;
}

.client-class-linked-contacts-dialog .dataTables_filter {
	grid-column: 1 / -1;
	grid-row: 1;
	float: none;
	width: 100%;
	margin: 0 0 8px;
	text-align: left;
}

.client-class-linked-contacts-dialog .dataTables_filter label {
	display: block;
	width: 100%;
	color: #536273;
	font-size: 0;
}

.client-class-linked-contacts-dialog .dataTables_filter input[type="search"] {
	-webkit-appearance: none;
	appearance: none;
	display: block;
	width: 100%;
	height: 36px;
	margin: 0 !important;
	padding: 0 12px !important;
	border: 1px solid #d7dee7 !important;
	border-radius: 9px !important;
	background: #fff;
	color: #1f2937;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 500;
	line-height: 36px;
	box-shadow: inset 0 1px 2px rgba(15, 30, 50, .04);
	box-sizing: border-box;
}

.client-class-linked-contacts-dialog .dataTables_filter input[type="search"]::placeholder {
	color: #97a4b2;
}

.client-class-linked-contacts-dialog .dataTables_filter input[type="search"]:focus {
	outline: none;
	border-color: #8cb2e5;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .14);
}

.client-class-linked-contacts-dialog .client-class-linked-contacts-table-scroll {
	grid-column: 1 / -1;
	grid-row: 2;
	width: 100%;
	min-height: 0;
	max-height: min(52vh, 430px);
	border: 1px solid #e3e8ee;
	border-radius: 8px;
	background: #fff;
	overflow: auto;
	overscroll-behavior: contain;
	box-sizing: border-box;
}

.client-class-linked-contacts-dialog table.table_builder {
	width: 100% !important;
	min-width: 540px;
	margin: 0 !important;
	border-collapse: separate;
	border-spacing: 0 !important;
	background: #fff;
	table-layout: fixed;
}

.client-class-linked-contacts-dialog table.table_builder thead th {
	position: sticky;
	top: 0;
	z-index: 1;
	padding: 9px 28px 9px 12px !important;
	border: 0;
	border-bottom: 1px solid #e3e8ee !important;
	background-color: #f3f5f7 !important;
	color: #667382;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .04em;
	line-height: 16px;
	text-align: left !important;
	text-transform: uppercase;
	white-space: nowrap;
}

.client-class-linked-contacts-dialog table.table_builder thead th.sorting,
.client-class-linked-contacts-dialog table.table_builder thead th.sorting_asc,
.client-class-linked-contacts-dialog table.table_builder thead th.sorting_desc {
	background-image: none !important;
}

.client-class-linked-contacts-dialog table.table_builder thead th.sorting::after,
.client-class-linked-contacts-dialog table.table_builder thead th.sorting_asc::after,
.client-class-linked-contacts-dialog table.table_builder thead th.sorting_desc::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 12px;
	width: 0;
	height: 0;
	border-right: 4px solid transparent;
	border-left: 4px solid transparent;
	border-top: 5px solid #bdc6d0;
	transform: translateY(-50%);
}

.client-class-linked-contacts-dialog table.table_builder thead th.sorting_asc::after {
	border-top: 0;
	border-bottom: 5px solid #3d7fbd;
}

.client-class-linked-contacts-dialog table.table_builder thead th.sorting_desc::after {
	border-top-color: #3d7fbd;
}

.client-class-linked-contacts-dialog table.table_builder thead th:nth-child(1),
.client-class-linked-contacts-dialog table.table_builder thead th:nth-child(2) {
	width: 24%;
}

.client-class-linked-contacts-dialog table.table_builder thead th:nth-child(3) {
	width: 52%;
}

.client-class-linked-contacts-dialog table.table_builder tbody tr[role="link"] {
	cursor: pointer;
}

.client-class-linked-contacts-dialog table.table_builder tbody td {
	padding: 10px 12px !important;
	border: 0;
	border-bottom: 1px solid #edf1f5 !important;
	background: #fff !important;
	color: #2f3d4d;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 500;
	line-height: 18px;
	text-align: left !important;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	transition: background-color .14s ease;
}

.client-class-linked-contacts-dialog table.table_builder tbody td a {
	color: inherit;
	text-decoration: none;
	pointer-events: none;
}

.client-class-linked-contacts-dialog table.table_builder tbody tr:last-child td {
	border-bottom: 0 !important;
}

.client-class-linked-contacts-dialog table.table_builder tbody tr:hover td:not(.dataTables_empty),
.client-class-linked-contacts-dialog table.table_builder tbody tr:focus td:not(.dataTables_empty) {
	background: #f2f7fc !important;
}

.client-class-linked-contacts-dialog table.table_builder tbody tr:focus {
	outline: 2px solid #78a8dc;
	outline-offset: -2px;
}

.client-class-linked-contacts-dialog table.table_builder td.dataTables_empty {
	padding: 38px 16px !important;
	border: 0;
	background: #fff !important;
	color: #7d8b9a;
	font-size: 13px;
	font-weight: 500;
	text-align: center !important;
	cursor: default;
}

.client-class-linked-contacts-dialog .dataTables_info {
	grid-column: 1;
	grid-row: 3;
	align-self: stretch;
	display: flex;
	align-items: center;
	float: none;
	min-height: 39px;
	margin: 8px 0 0;
	padding: 8px 12px 0 0 !important;
	border-top: 1px solid #e7ebef;
	color: #7d8b9a;
	font-size: 12px;
	font-weight: 500;
	line-height: 30px;
	box-sizing: border-box;
}

.client-class-linked-contacts-dialog .dataTables_paginate {
	grid-column: 2;
	grid-row: 3;
	align-self: stretch;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 6px;
	float: none;
	min-height: 39px;
	margin: 8px 0 0;
	padding: 8px 0 0 !important;
	border-top: 1px solid #e7ebef;
	font-size: 0;
	line-height: 1;
	box-sizing: border-box;
}

.client-class-linked-contacts-dialog .dataTables_paginate > span {
	display: flex;
	align-items: center;
	gap: 6px;
	height: 30px;
	font-size: 0;
	line-height: 1;
}

.client-class-linked-contacts-dialog .dataTables_paginate .paginate_button {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	min-width: 30px;
	height: 30px;
	margin: 0 !important;
	padding: 0 10px !important;
	border: 1px solid #d7dee7 !important;
	border-radius: 7px !important;
	background: #fff !important;
	color: #395066 !important;
	font-size: 12px;
	font-weight: 600;
	line-height: 28px !important;
	vertical-align: top;
	box-shadow: none !important;
	box-sizing: border-box;
}

.client-class-linked-contacts-dialog .dataTables_paginate .paginate_button:hover:not(.disabled),
.client-class-linked-contacts-dialog .dataTables_paginate .paginate_button.current {
	border-color: #9db9d8 !important;
	background: #edf4fb !important;
	color: #174e80 !important;
}

.client-class-linked-contacts-dialog .dataTables_paginate .paginate_button.disabled {
	opacity: .45;
	cursor: default;
}

.client-class-linked-contacts-dialog .dataTables_processing {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 3;
	width: auto;
	height: auto;
	margin: 0;
	padding: 8px 14px;
	border: 1px solid #e3e8ee;
	border-radius: 7px;
	background: #fff;
	color: #536273;
	font-size: 12px;
	font-weight: 600;
	box-shadow: 0 8px 24px rgba(15, 30, 50, .14);
	transform: translate(-50%, -50%);
}

@media (max-width: 600px), (max-height: 640px) {
	.client-class-linked-contacts-dialog .client-class-linked-contacts-table-scroll {
		overflow-x: hidden;
	}

	.client-class-linked-contacts-dialog table.table_builder {
		min-width: 100%;
	}

	.client-class-linked-contacts-dialog .dataTables_info {
		display: none;
	}

	.client-class-linked-contacts-dialog .dataTables_paginate {
		grid-column: 1 / -1;
		justify-content: center;
		width: 100%;
		text-align: center;
	}
}


.service-section-label {
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: #666;
	margin-bottom: 12px;
}

/* ============================================
   RECYCLE BIN MODULE (grouped card list)
   ============================================ */
.rb-scope-host {
	position: relative;
	display: inline-flex;
}

.rb-scope-trigger {
	min-width: 118px;
	max-width: 200px;
}

.rb-scope-popover {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	z-index: 1000;
	width: 232px;
	max-height: 420px;
	background: #ffffff;
	border-radius: 9px;
	box-shadow: 0 14px 40px rgba(11, 28, 49, 0.18);
	padding: 8px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	box-sizing: border-box;
	overflow-y: auto;
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.rb-scope-popover::-webkit-scrollbar {
	width: 0;
	height: 0;
	display: none;
}

.rb-scope-item {
	flex-shrink: 0;
}

.rb-scope-item-selected,
.rb-scope-item-selected:hover {
	background: #E9F2FF;
	color: #0D417C;
	font-weight: 600;
}

.rb-tb-danger {
	color: #B3261E;
	border-color: rgba(179, 38, 30, 0.35);
}

.rb-tb-danger:hover {
	background: #FDECEC;
	border-color: rgba(179, 38, 30, 0.5);
}

.rb-list {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.rb-group-head {
	font-size: 11px;
	font-weight: 500;
	color: #999;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	padding: 14px 14px 6px;
}

.rb-list > .rb-category:first-child .rb-group-head {
	padding-top: 4px;
}

.rb-category-head {
	display: block;
	width: 100%;
	border: 0;
	background: transparent;
	text-align: left;
	cursor: pointer;
}

.rb-category-rows {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.rb-row {
	display: flex;
	align-items: center;
	gap: 12px;
	background: #ffffff;
	border-radius: 8px;
	padding: 8px 14px;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.rb-row:hover {
	background: #f8f8f8;
}

.rb-row-name {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 13px;
	font-weight: 600;
	color: #24384d;
}

.rb-row-when {
	flex: 0 0 90px;
	font-size: 12px;
	color: #5c6b7c;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.rb-row-who {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	max-width: 200px;
	overflow: hidden;
	white-space: nowrap;
	font-size: 12px;
	color: #5c6b7c;
}

.rb-row-actions {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.rb-row-restore {
	height: 26px;
	padding: 0 12px;
	border: 1px solid rgba(13, 65, 124, 0.3);
	border-radius: 8px;
	background: #E9F2FF;
	color: #0D417C;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.rb-row-restore:hover {
	background: #DBEAFB;
	border-color: rgba(13, 65, 124, 0.45);
}

.rb-row-perm {
	height: 26px;
	padding: 0 12px;
	border: 1px solid rgba(179, 38, 30, 0.35);
	border-radius: 8px;
	background: #ffffff;
	color: #B3261E;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.rb-row-perm:hover {
	background: #FDECEC;
	border-color: rgba(179, 38, 30, 0.5);
}

.rb-status {
	padding: 12px 14px;
	text-align: center;
	font-size: 11px;
	color: #99a2ac;
}

.rb-load-more {
	display: block;
	min-width: 240px;
	margin: 18px auto 6px;
	padding: 9px 16px;
	border: 1px solid #cad3dd;
	border-radius: 6px;
	background: #fff;
	color: #28435f;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
}

.rb-load-more:hover {
	border-color: #8ea3b8;
	background: #f7f9fb;
}

.rb-progress {
	padding: 0 14px 14px;
}

.rb-progress-label {
	margin-bottom: 8px;
	color: #5c6b7c;
	font-size: 12px;
	font-weight: 600;
}

.rb-progress-track {
	height: 12px;
	overflow: hidden;
	border-radius: 999px;
	background: #e7ecf2;
}

.rb-progress-fill {
	height: 100%;
	width: 0;
	background: #0d417c;
	transition: width .2s ease;
}

.rb-progress-fill.is-danger,
.rb-progress-fill.is-error {
	background: #b3261e;
}

.rb-progress-fill.is-complete {
	background: #2e7d32;
}

.rb-empty {
	padding: 60px 16px;
	text-align: center;
	cursor: default;
}

.rb-empty-title {
	font-size: 13px;
	font-weight: 600;
	color: #64707c;
}

.rb-empty-hint {
	margin-top: 4px;
	font-size: 12px;
	color: #99a2ac;
}

/* ============================================
   DATE RANGE POPOVER (shared widget — DateRangePopover)
   The notes filter's preset-rail + range-calendar design as a standalone
   component. The host owns positioning and outside-click dismissal.
   ============================================ */
.vc-daterange-popover {
	width: 430px;
	background: #ffffff;
	border-radius: 14px;
	box-shadow: 0 18px 45px rgba(0, 0, 0, 0.18), 0 4px 12px rgba(0, 0, 0, 0.08);
	box-sizing: border-box;
	overflow: hidden;
	font-family: 'Manrope', sans-serif;
}

.vc-daterange-header {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 16px 12px;
}

.vc-daterange-title {
	flex: 1 1 auto;
	font-size: 14px;
	font-weight: 700;
	color: #0f172a;
}

.vc-daterange-clear {
	border: 1px solid transparent;
	border-radius: 8px;
	background: transparent;
	padding: 4px 10px;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 600;
	color: #6f7782;
	cursor: pointer;
}

.vc-daterange-clear:hover {
	background: #f5f5f5;
	color: #252a31;
}

.vc-daterange-surface {
	display: flex;
	border-top: 1px solid rgba(10, 10, 10, 0.04);
}

.vc-daterange-presets {
	width: 128px;
	flex: 0 0 128px;
	padding: 16px 0;
	border-right: 1px solid rgba(10, 10, 10, 0.04);
	box-sizing: border-box;
}

.vc-daterange-preset {
	display: block;
	width: calc(100% - 16px);
	height: 28px;
	margin: 0 8px;
	padding: 0 10px;
	border: 1px solid transparent;
	border-radius: 8px;
	background: transparent;
	color: #0a0a0a;
	font-family: 'Manrope', sans-serif;
	font-size: 12.8px;
	font-weight: 500;
	text-align: left;
	cursor: pointer;
}

.vc-daterange-preset:hover,
.vc-daterange-preset:focus,
.vc-daterange-preset.active {
	background: #f5f5f5;
	outline: none;
}

.vc-daterange-main {
	flex: 1 1 auto;
	padding: 12px;
	box-sizing: border-box;
}

.vc-daterange-month-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 28px;
	margin-bottom: 12px;
}

.vc-daterange-month-title {
	font-size: 14px;
	font-weight: 500;
	color: #0a0a0a;
}

.vc-daterange-month-nav {
	width: 28px;
	height: 28px;
	border: 1px solid transparent;
	border-radius: 10px;
	background: transparent;
	color: #0a0a0a;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.vc-daterange-month-prev {
	transform: scaleX(-1);
}

.vc-daterange-month-nav:hover,
.vc-daterange-month-nav:focus {
	background: #f5f5f5;
	outline: none;
}

.vc-daterange-grid {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.vc-daterange-weekdays,
.vc-daterange-week {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 0;
}

.vc-daterange-weekday {
	text-align: center;
	font-size: 12.8px;
	line-height: 1.45;
	color: #737373;
}

.vc-daterange-day {
	min-height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.vc-daterange-day.in-range {
	background: #f5f5f5;
	border-radius: 0;
}

.vc-daterange-day.range-start {
	border-radius: 8px 0 0 8px;
}

.vc-daterange-day.range-end {
	border-radius: 0 8px 8px 0;
}

.vc-daterange-day.range-single {
	border-radius: 8px;
}

.vc-daterange-day-btn {
	width: 28px;
	height: 28px;
	border: 0;
	border-radius: 10px;
	background: transparent;
	color: #0a0a0a;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	cursor: pointer;
	position: relative;
	z-index: 1;
}

.vc-daterange-day-btn:hover,
.vc-daterange-day-btn:focus {
	background: rgba(10, 10, 10, 0.06);
	outline: none;
}

.vc-daterange-day.range-start .vc-daterange-day-btn,
.vc-daterange-day.range-end .vc-daterange-day-btn,
.vc-daterange-day.range-single .vc-daterange-day-btn {
	background: #171717;
	color: #fafafa;
}

.vc-daterange-day.range-single .vc-daterange-day-btn {
	box-shadow: 0 0 0 3px rgba(161, 161, 161, 0.5);
}

.vc-daterange-day-label {
	font-size: 13px;
	line-height: 1;
}

.vc-daterange-day.outside-month .vc-daterange-day-btn {
	color: #737373;
	opacity: 0.5;
	cursor: default;
}

.vc-daterange-day.outside-month .vc-daterange-day-btn:hover,
.vc-daterange-day.outside-month .vc-daterange-day-btn:focus {
	background: transparent;
}

/* ============================================
   HISTORY MODULE (live activity feed)
   ============================================ */

/* — toolbar scope pills + popovers — */
.history-scope-host {
	position: relative;
	display: inline-flex;
}

.history-scope-trigger {
	min-width: 118px;
	max-width: 190px;
}

.history-scope-popover {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	z-index: 1000;
	width: 232px;
	max-height: 420px;
	background: #ffffff;
	border-radius: 9px;
	box-shadow: 0 14px 40px rgba(11, 28, 49, 0.18);
	padding: 8px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	box-sizing: border-box;
	overflow: hidden;
}

.history-types-popover {
	overflow-y: auto;
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.history-types-popover::-webkit-scrollbar {
	width: 0;
	height: 0;
	display: none;
}

.history-popover-list {
	display: flex;
	flex-direction: column;
	gap: 6px;
	overflow-y: auto;
	min-height: 0;
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.history-popover-list::-webkit-scrollbar {
	width: 0;
	height: 0;
	display: none;
}

.history-scope-item {
	flex-shrink: 0;
}

.history-scope-item-selected,
.history-scope-item-selected:hover {
	background: #E9F2FF;
	color: #0D417C;
	font-weight: 600;
}

.history-popover-search {
	flex-shrink: 0;
	height: 34px;
	padding: 0 10px;
	border: 1px solid #C6C6C6;
	border-radius: 10px;
	background: transparent;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	color: #292929;
	box-sizing: border-box;
	outline: none;
}

.history-popover-search:focus {
	border-color: #999;
}

.history-popover-empty {
	padding: 12px 9px;
	color: #7f8790;
	font-size: 12px;
	text-align: center;
}

/* — feed stage — */
.history-feed {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.history-day-header {
	font-size: 11px;
	font-weight: 500;
	color: #999;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	padding: 14px 14px 6px;
}

.history-feed > .history-day-header:first-child {
	padding-top: 4px;
}

.history-event-block {
	border-radius: 8px;
}

.history-event {
	display: flex;
	align-items: center;
	gap: 10px;
	background: #ffffff;
	border-radius: 8px;
	padding: 8px 14px;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.history-event:hover {
	background: #f8f8f8;
}

.history-event-expanded .history-event {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

.history-event-badge {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 60px;
	height: 20px;
	padding: 0 9px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.2px;
	line-height: 1;
	white-space: nowrap;
	box-sizing: border-box;
}

.history-event-badge-created { background: #E6F4EA; color: #1E7B34; }
.history-event-badge-updated { background: #E9F2FF; color: #0D417C; }
.history-event-badge-deleted { background: #FDECEC; color: #B3261E; }

.history-event-main {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	overflow: hidden;
}

.history-event-record {
	font-size: 13px;
	font-weight: 600;
	color: #24384d;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
}

.history-event-type {
	flex: 0 0 auto;
	font-size: 12px;
	color: #8a97a8;
	white-space: nowrap;
}

.history-event-who {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	max-width: 260px;
	overflow: hidden;
	white-space: nowrap;
	padding: 2px 10px 2px 3px;
	border-radius: 999px;
	background: #F0F3F7;
	font-size: 12px;
	color: #5c6b7c;
	box-sizing: border-box;
}

.history-event-time {
	flex: 0 0 58px;
	text-align: left;
	font-size: 12px;
	color: #5c6b7c;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.history-event-chevron {
	flex: 0 0 15px;
	width: 15px;
	height: 15px;
	opacity: 0.55;
	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 6L15 12L9 18' stroke='%2300000066' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-size: contain;
	background-repeat: no-repeat;
	transition: transform 0.2s ease;
}

.history-event-expanded .history-event-chevron {
	transform: rotate(90deg);
}

/* — expanded inline diff — */
.history-event-details {
	background: #ffffff;
	border-top: 1px solid #EFF1F4;
	border-radius: 0 0 8px 8px;
	padding: 12px 14px 14px;
	cursor: default;
}

.history-expanded-details {
	margin: 0;
}

.history-detail-message {
	margin: 0 0 10px;
	font-size: 12px;
	font-weight: 600;
	color: #64707c;
}

.history-values-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	font-size: 12px;
	background: #ffffff;
	border: 1px solid #ECEFF3;
	border-radius: 8px;
	overflow: hidden;
}

.history-values-table th,
.history-values-table td {
	padding: 7px 12px;
	text-align: left;
}

.history-values-table thead th {
	font-size: 11px;
	font-weight: 500;
	color: #999;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	background: #FAFBFC;
	border-bottom: 1px solid #ECEFF3;
}

.history-values-table tbody td {
	border-top: 1px solid #F1F3F6;
}

.history-values-table tbody tr:first-child td {
	border-top: none;
}

.history-values-table th.history-value-before,
.history-values-table th.history-value-after {
	color: #999;
}

.history-field-name {
	font-weight: 600;
	color: #24384d;
	width: 180px;
}

.history-value-cell {
	word-break: break-word;
	max-width: 400px;
}

.history-value-cell.history-value-before {
	background: #FFF8F8;
	color: #B3261E;
}

.history-value-cell.history-value-after {
	background: #F4FBF6;
	color: #1E7B34;
}

.history-event-details-footer {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 12px;
}

.history-detail-action {
	height: 28px;
	padding: 0 12px;
	border: 1px solid #C6C6C6;
	border-radius: 8px;
	background: #ffffff;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 600;
	color: #24384d;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.history-detail-action:hover {
	background: #f8f8f8;
	border-color: #B8B8B8;
}

.history-detail-sync-note {
	margin-left: auto;
	font-size: 11px;
	color: #99a2ac;
}

.history-detail-action-danger {
	color: #B3261E;
	border-color: rgba(179, 38, 30, 0.35);
}

.history-detail-action-danger:hover {
	background: #FDECEC;
	border-color: rgba(179, 38, 30, 0.5);
}

/* — date-range trigger (calendar button next to search) — */
.history-date-trigger {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	height: 34px;
	min-width: 34px;
	padding: 0 10px;
	border: 1px solid #C6C6C6;
	border-radius: 10px;
	background: #ffffff;
	color: rgba(0, 0, 0, 0.58);
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 400;
	line-height: 16px;
	cursor: pointer;
	box-sizing: border-box;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.history-date-trigger:hover {
	background: #f8f8f8;
	border-color: #B8B8B8;
}

.history-date-trigger-active,
.history-date-trigger-active:hover {
	background: #E9F2FF;
	border-color: #8cb2e5;
	color: #0D417C;
}

.history-date-trigger-icon {
	width: 16px;
	height: 16px;
	flex: 0 0 16px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='2' y='3' width='12' height='11' rx='2' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M2 6.5H14' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M5.5 1.5V4' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M10.5 1.5V4' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='2' y='3' width='12' height='11' rx='2' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M2 6.5H14' stroke='black' stroke-width='1.5'/%3E%3Cpath d='M5.5 1.5V4' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M10.5 1.5V4' stroke='black' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.history-date-trigger-label {
	white-space: nowrap;
}

/* The date popover anchors to the toolbar's right side (the trigger sits next
   to search), so it opens leftward instead of overflowing the viewport. */
.history-date-host .vc-daterange-popover {
	position: absolute;
	top: calc(100% + 6px);
	right: 0;
	left: auto;
	z-index: 1000;
}

/* — record history + diff dialogs (EntityHistoryUtils, shared app-wide) —
   Both ride the vc-utility-dialog modal shell; rules here style content only. */
.history-record-list {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.history-record-row {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 8px 12px;
	border: none;
	border-radius: 8px;
	background: #F3F3F3;
	cursor: pointer;
	text-align: left;
	box-sizing: border-box;
	font-family: 'Manrope', sans-serif;
	transition: background-color 0.15s ease;
}

.history-record-row:hover {
	background: #eaeaea;
}

.history-record-when {
	flex: 1 1 auto;
	min-width: 0;
	font-size: 13px;
	font-weight: 600;
	color: #24384d;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.history-record-who {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	max-width: 200px;
	overflow: hidden;
	white-space: nowrap;
	font-size: 12px;
	color: #5c6b7c;
}

.history-diff-toggle {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 10px;
	font-size: 12px;
	color: #64707c;
	cursor: pointer;
	user-select: none;
}

/* Unchanged rows (revealed by the toggle) stay neutral — the red/green tint
   marks actual differences only. */
.history-diff-dialog tr.no_diff .history-value-cell {
	background: transparent;
	color: #64707c;
}

.history-diff-dialog tr.no_diff .history-field-name {
	color: #99a2ac;
	font-weight: 500;
}

/* — feed status, sentinel, empty state — */
.history-feed-status {
	padding: 12px 14px;
	text-align: center;
	font-size: 11px;
	color: #99a2ac;
}

.history-feed-sentinel {
	height: 1px;
}

.history-feed-empty {
	padding: 60px 16px;
	text-align: center;
	cursor: default;
}

.history-feed-empty-title {
	font-size: 13px;
	font-weight: 600;
	color: #64707c;
}

.history-feed-empty-hint {
	margin-top: 4px;
	font-size: 12px;
	color: #99a2ac;
}

/* Copy Address from Master User button */
.copy-address-btn {
	display: inline-block;
	margin-top: 8px;
	padding: 4px 10px;
	background: none;
	border: none;
	color: #337ab7;
	font-size: 12px;
	cursor: pointer;
	text-decoration: underline;
}

.copy-address-btn:hover {
	color: #23527c;
}

/* Contact File Store Dialog */

.contact-fs-dialog {
	padding: 0;
}

.contact-fs-layout {
	display: flex;
	height: 100%;
	gap: 0;
}

.contact-fs-left-panel {
	width: 220px;
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	background: #f8f9fa;
	border-right: 1px solid #e0e0e0;
}

/* Tree header section - matches main file store */
.contact-fs-tree-header-section {
	padding: 16px 12px;
	border-bottom: 1px solid #e0e0e0;
}

.contact-fs-tree-header {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 12px;
}

.contact-fs-tree-title-icon {
	width: 24px;
	height: 24px;
}

.contact-fs-tree-title {
	font-weight: 600;
	font-size: 16px;
	color: #202124;
}

.contact-fs-tree-new-folder-btn {
	width: 100%;
	background: #fff;
	border: 1px solid #dadce0;
	padding: 8px 16px;
	border-radius: 8px;
	cursor: pointer;
	font-size: 13px;
	color: #3c4043;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	transition: background 0.2s, box-shadow 0.2s;
}

.contact-fs-tree-new-folder-btn:hover {
	background: #f1f3f4;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

.contact-fs-tree-container {
	flex: 1;
	overflow-y: auto;
	overflow-x: hidden;
	padding: 8px 0;
}

.contact-fs-tree-container .jstree-default .jstree-clicked {
	background: #e8f0fe;
	border-radius: 0 20px 20px 0;
}

.contact-fs-tree-container .jstree-default .jstree-hovered {
	background: #f1f3f4;
	border-radius: 0 20px 20px 0;
}

.contact-fs-folder-node {
	padding: 2px 0;
}

/* Right panel */
.contact-fs-right-panel {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: #fff;
}

.contact-fs-file-list-container {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.contact-fs-content-area {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: #F3F3F3;
}

/* Search container - matches main file store */
.contact-fs-search-container {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 16px;
	border-bottom: 1px solid #e0e0e0;
	background: #fff;
}

.contact-fs-search-input {
	flex: 1;
	padding: 10px 16px;
	border: 1px solid #dadce0;
	border-radius: 24px;
	font-size: 14px;
	background: #f1f3f4;
	transition: background 0.2s, border-color 0.2s;
}

.contact-fs-search-input:focus {
	outline: none;
	background: #fff;
	border-color: #4285f4;
	box-shadow: 0 1px 6px rgba(66, 133, 244, 0.28);
}

.contact-fs-search-input::placeholder {
	color: #5f6368;
}

.contact-fs-search-controls {
	display: flex;
	align-items: center;
	gap: 12px;
}

/* View toggle buttons */
.contact-fs-view-toggle {
	display: flex;
	border: 1px solid #dadce0;
	border-radius: 4px;
	overflow: hidden;
}

.contact-fs-view-btn {
	background: #fff;
	border: none;
	padding: 6px 10px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
}

.contact-fs-view-btn:first-child {
	border-right: 1px solid #dadce0;
}

.contact-fs-view-btn:hover {
	background: #f1f3f4;
}

.contact-fs-view-btn.active {
	background: #e8f0fe;
}

.contact-fs-view-btn svg {
	fill: #5f6368;
}

.contact-fs-view-btn.active svg {
	fill: #1967d2;
}

/* Sort container */
.contact-fs-sort-container {
	display: flex;
	align-items: center;
	gap: 6px;
}

.contact-fs-sort-label {
	font-size: 13px;
	color: #5f6368;
}

.contact-fs-sort-select {
	padding: 6px 24px 6px 8px;
	border: 1px solid #dadce0;
	border-radius: 4px;
	background: #fff;
	font-size: 13px;
	cursor: pointer;
}

.contact-fs-sort-select:hover {
	background: #f1f3f4;
}

/* Upload button */
.contact-fs-upload-btn {
	background: #1a73e8;
	color: #fff;
	border: none;
	padding: 8px 16px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 13px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	position: relative;
}

.contact-fs-upload-btn:hover {
	background: #1557b0;
}

.contact-fs-upload-btn svg {
	fill: #fff;
}

/* Scrollable content */
.contact-fs-scrollable-content {
	flex: 1;
	overflow-y: auto;
	padding: 16px;
}

/* Section styling */
.contact-fs-section {
	margin-bottom: 24px;
}

.contact-fs-section-header {
	font-size: 14px;
	font-weight: 500;
	color: #5f6368;
	margin-bottom: 12px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.contact-fs-empty-state {
	color: #80868b;
	font-size: 13px;
	font-style: italic;
	padding: 8px 0;
}

/* Grid view */
.contact-fs-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 16px;
}

/* Drop-target hover highlight for the entity-dialog drag-and-drop */
.contact-fs-card-drop-hover {
	border-color: #4a90d9 !important;
	background: #f0f7ff !important;
	box-shadow: 0 0 10px rgba(74, 144, 217, 0.4) !important;
	transform: scale(1.02);
}

.contact-fs-folder-row.contact-fs-card-drop-hover {
	transform: none;
}

.contact-fs-tree-drop-hover {
	background: #eef4ff !important;
	border-color: #bfd0ef !important;
	box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.08) !important;
}

/* Card styling - matches main file store */
.contact-fs-card {
	background: #fff;
	border: 1px solid #dadce0;
	border-radius: 8px;
	padding: 12px;
	cursor: pointer;
	transition: box-shadow 0.2s, border-color 0.2s;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	min-height: 100px;
}

.contact-fs-card:hover {
	box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
	border-color: #bdc1c6;
}

.contact-fs-card.selected {
	background: #e8f0fe;
	border-color: #4285f4;
}

.contact-fs-card-icon {
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 8px;
}

.contact-fs-card-icon img {
	max-width: 100%;
	max-height: 100%;
}

.contact-fs-card-name {
	font-size: 13px;
	color: #202124;
	word-break: break-word;
	line-height: 1.3;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

/* File card specific */
.contact-fs-file-card {
	position: relative;
}

.contact-fs-file-card-icon {
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 8px;
}

.contact-fs-file-card-icon img {
	max-width: 100%;
	max-height: 100%;
}

.contact-fs-file-card-info {
	width: 100%;
}

.contact-fs-file-card-name {
	font-size: 13px;
	color: #202124;
	word-break: break-word;
	line-height: 1.3;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	margin-bottom: 4px;
}

.contact-fs-file-card-date {
	font-size: 11px;
	color: #80868b;
}

.contact-fs-file-card-menu {
	position: absolute;
	top: 4px;
	right: 4px;
	background: none;
	border: none;
	cursor: pointer;
	padding: 4px 8px;
	font-size: 16px;
	color: #5f6368;
	border-radius: 50%;
	opacity: 0;
	transition: opacity 0.2s;
}

.contact-fs-file-card:hover .contact-fs-file-card-menu {
	opacity: 1;
}

.contact-fs-file-card-menu:hover {
	background: #e8eaed;
}

/* List view */
.contact-fs-list-view {
	display: flex;
	flex-direction: column;
	border: 1px solid #dadce0;
	border-radius: 8px;
	overflow: hidden;
}

.contact-fs-list-row {
	display: flex;
	align-items: center;
	padding: 8px 12px;
	border-bottom: 1px solid #e8eaed;
	cursor: pointer;
	transition: background 0.1s;
}

.contact-fs-list-row:last-child {
	border-bottom: none;
}

.contact-fs-list-row:hover {
	background: #f1f3f4;
}

.contact-fs-list-row.selected {
	background: #e8f0fe;
}

.contact-fs-list-header {
	background: #f8f9fa;
	font-weight: 500;
	font-size: 12px;
	color: #5f6368;
	cursor: default;
}

.contact-fs-list-header:hover {
	background: #f8f9fa;
}

.contact-fs-list-col {
	flex-shrink: 0;
}

.contact-fs-list-icon {
	width: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.contact-fs-list-icon img {
	width: 20px;
	height: 20px;
}

.contact-fs-list-name {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	padding-right: 12px;
}

.contact-fs-list-modified {
	width: 100px;
	color: #5f6368;
	font-size: 12px;
}

.contact-fs-list-size {
	width: 80px;
	color: #5f6368;
	font-size: 12px;
	text-align: right;
}

.contact-fs-list-actions {
	width: 40px;
	text-align: center;
}

.contact-fs-list-menu-btn {
	background: none;
	border: none;
	cursor: pointer;
	padding: 4px 8px;
	font-size: 16px;
	color: #5f6368;
	border-radius: 4px;
}

.contact-fs-list-menu-btn:hover {
	background: #e8eaed;
}

/* Dropzone */
.contact-fs-dropzone {
	border: 2px dashed #dadce0;
	border-radius: 8px;
	padding: 24px;
	text-align: center;
	display: block;
	cursor: pointer;
	transition: all 0.2s ease;
	margin-top: 16px;
	position: relative;
}

.contact-fs-dropzone:hover,
.contact-fs-dropzone.drag-over {
	border-color: #4285f4;
	background: #e8f0fe;
}

.contact-fs-dropzone-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
}

.contact-fs-drop-icon {
	font-size: 32px;
	opacity: 0.5;
	color: #5f6368;
}

.contact-fs-drop-text {
	color: #5f6368;
	margin: 0;
	font-size: 13px;
}


/* Upload progress dialog */
.contact-fs-upload-progress {
	padding: 20px;
	text-align: center;
}

.contact-fs-progress-text {
	margin-bottom: 15px;
	font-size: 14px;
	color: #333;
}

.contact-fs-progress-bar {
	width: 100%;
	height: 8px;
	background: #e0e0e0;
	border-radius: 4px;
	overflow: hidden;
}

.contact-fs-progress-fill {
	height: 100%;
	background: #4285f4;
	transition: width 0.3s ease;
}

.contact-fs-upload-dialog .ui-dialog-titlebar-close {
	display: none;
}

/* New folder / rename dialogs */
.contact-fs-new-folder-input,
.contact-fs-rename-folder-input {
	padding: 15px;
	overflow: hidden !important;
}

.contact-fs-new-folder-input label,
.contact-fs-rename-folder-input label {
	display: block;
	margin-bottom: 8px;
	font-weight: 500;
	color: #202124;
}

.contact-fs-folder-name-input {
	width: calc(100% - 18px);
	padding: 10px 12px;
	border: 1px solid #dadce0;
	border-radius: 4px;
	font-size: 14px;
	box-sizing: border-box;
}

.contact-fs-folder-name-input:focus {
	border-color: #4285f4;
	outline: none;
	box-shadow: 0 0 0 2px rgba(66, 133, 244, 0.2);
}

.contact-fs-folder-dialog .ui-dialog-content {
	overflow: hidden !important;
}

/* Modern Docs/File Store action dialogs */
.docs-action-dialog.ui-dialog {
	display: flex !important;
	flex-direction: column;
	padding: 0;
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 18px 45px rgba(0, 0, 0, .18), 0 4px 12px rgba(0, 0, 0, .08);
	overflow: hidden;
	box-sizing: border-box;
}

.docs-action-dialog .ui-dialog-titlebar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 44px;
	min-height: 44px;
	padding: 0 8px 0 14px;
	border: 0;
	border-radius: 10px 10px 0 0;
	background: #fff;
	box-sizing: border-box;
}

.docs-action-dialog .ui-dialog-title {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	color: #24282d;
	font-size: 15px;
	font-weight: 700;
	line-height: 20px;
	-webkit-text-stroke: 0.45px currentColor;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.docs-action-dialog .ui-dialog-titlebar-close {
	position: static !important;
	top: auto !important;
	right: auto !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px !important;
	height: 28px !important;
	margin: 0 !important;
	padding: 0 !important;
	transform: none !important;
	border: 1px solid transparent;
	border-radius: 6px;
	background: transparent;
	color: #6f7782;
	box-sizing: border-box;
	cursor: pointer;
}

.docs-action-dialog .ui-dialog-titlebar-close:hover {
	border-color: #d9dee5;
	background: #f5f5f5;
	color: #252a31;
}

.docs-action-dialog .ui-dialog-titlebar-close:focus-visible {
	outline: none;
	border-color: #b8c0ca;
	box-shadow: 0 0 0 2px rgba(15, 23, 42, .12);
}

.docs-action-dialog .ui-dialog-titlebar-close .ui-icon,
.docs-action-dialog .ui-dialog-titlebar-close .ui-button-icon,
.docs-action-dialog .ui-dialog-titlebar-close .ui-button-icon-primary,
.docs-action-dialog .ui-dialog-titlebar-close .ui-button-text {
	display: none;
}

.docs-action-dialog .ui-dialog-titlebar-close:before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 4L4 12M4 4L12 12' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.docs-action-dialog .ui-dialog-content {
	padding: 0 14px 12px !important;
	border: 0;
	background: #fff;
	overflow: hidden !important;
	box-sizing: border-box;
}

.docs-action-dialog-form {
	margin: 0;
}

.docs-action-dialog-field-row {
	display: grid;
	grid-template-columns: 116px minmax(0, 1fr);
	width: 100%;
	min-height: 37px;
	background: #f3f3f3;
	border-radius: 6px;
	box-sizing: border-box;
}

.docs-action-dialog-label {
	display: flex;
	align-items: center;
	min-width: 0;
	padding: 7px 8px 7px 12px;
	color: #777;
	font-size: 13px;
	font-weight: 600;
	line-height: 18px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	box-sizing: border-box;
}

.docs-action-dialog-input {
	width: 100%;
	min-width: 0;
	height: 37px;
	padding: 4px 10px 4px 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	color: #24282d;
	font-size: 13px;
	line-height: 19px;
	box-sizing: border-box;
}

.docs-action-dialog-input:focus {
	outline: none;
	border: 0;
	box-shadow: none;
}

.docs-action-dialog .ui-dialog-buttonpane {
	flex: 0 0 auto;
	margin: 0;
	padding: 10px 14px 12px;
	border-width: 1px 0 0;
	border-style: solid;
	border-color: #e7ebef;
	background: #fff;
	box-sizing: border-box;
}

.docs-action-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	float: none;
	width: 100%;
	min-height: 32px;
}

.docs-action-dialog .ui-dialog-buttonpane button.ui-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	height: 32px;
	margin: 0;
	padding: 0 14px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background: #fff;
	color: #395066;
	box-shadow: none;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	box-sizing: border-box;
}

.docs-action-dialog .ui-dialog-buttonpane button.ui-button:hover {
	border-color: #bfcad6;
	background: #f5f8fb;
	color: #23384f;
}

.docs-action-dialog .ui-dialog-buttonpane button.ui-button:focus {
	outline: none;
	border-color: #8cb2e5;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .16);
}

.docs-action-dialog .ui-dialog-buttonpane button.ui-button .ui-button-text {
	padding: 0;
	line-height: 1;
}

/* The scoped rule above paints every dialog button white and clears its shadow, and it
   outranks the shared DIMENSIONAL BUTTONS block (which only matches the bare
   .docs-action-primary class). So the primary has to carry the dimensional face here, at
   the specificity that actually wins - otherwise it renders as white-on-white. */
.docs-action-dialog .ui-dialog-buttonpane button.docs-action-dialog-primary {
	border-color: var(--btn-border);
	background-color: var(--btn-fill);
	background-image: var(--btn-sheen);
	color: #fff;
	box-shadow:
		0 1px 1px rgba(var(--btn-shadow-hue), 0.18),
		0 3px 7px rgba(var(--btn-shadow-hue), 0.16),
		var(--btn-ring),
		inset 0 1px 0 var(--btn-specular),
		inset 0 -1px 0 var(--btn-underside);
}

.docs-action-dialog .ui-dialog-buttonpane button.docs-action-dialog-primary:hover {
	border-color: var(--btn-border);
	background-color: var(--btn-fill-hover);
	background-image: var(--btn-sheen);
	color: #fff;
}

/* Bulk Action Bar - multi-select operations
   (used by Contacts list, Advocate Process, and contact-record Open Activities) */
.bulk-action-bar {
	display: none !important;
	background: #3a5a8c;
	color: #fff;
	padding: 8px 15px;
	border-radius: 4px 4px 0 0;
	align-items: center;
	gap: 10px;
	z-index: 10;
	box-shadow: 0 -2px 8px rgba(0,0,0,0.15);
	flex-shrink: 0;
}
.bulk-action-bar.visible {
	display: flex !important;
}
.bulk-action-bar .bulk-count {
	font-weight: bold;
	margin-right: 10px;
}
.bulk-action-bar .bulk-btn {
	background: rgba(255,255,255,0.2);
	color: #fff;
	border: 1px solid rgba(255,255,255,0.3);
	padding: 4px 12px;
	border-radius: 3px;
	cursor: pointer;
	font-size: 12px;
}
.bulk-action-bar .bulk-btn:hover {
	background: rgba(255,255,255,0.35);
}
.bulk-action-bar .bulk-btn.bulk-btn-danger {
	background: rgba(200,50,50,0.7);
	border-color: rgba(200,50,50,0.9);
}
.bulk-action-bar .bulk-btn.bulk-btn-danger:hover {
	background: rgba(200,50,50,0.9);
}
.bulk-action-bar .bulk-clear {
	margin-left: auto;
	cursor: pointer;
	opacity: 0.7;
}
.bulk-action-bar .bulk-clear:hover {
	opacity: 1;
}

/* Task Bulk Toolbar - inline multi-select widget in task header bar */
.task-tb-bulk-toolbar {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #E5E5E5;
	padding: 4px 10px;
	border-radius: 6px;
	flex-shrink: 0;
}
.task-tb-bulk-count {
	font-size: 13px;
	font-weight: 500;
	color: #333;
	white-space: nowrap;
}
.task-tb-bulk-actions {
	display: flex;
	gap: 4px;
}
.task-tb-bulk-btn {
	width: 24px;
	height: 24px;
	border: none;
	background: transparent;
	color: #555;
	cursor: pointer;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	padding: 0;
	transition: background 0.15s, color 0.15s;
}
.task-tb-bulk-btn:hover {
	background: rgba(0,0,0,0.08);
	color: #333;
}
.task-tb-bulk-btn.task-tb-bulk-delete:hover {
	background: #ffebee;
	color: #d32f2f;
}
.task-tb-bulk-btn.task-tb-bulk-complete:hover {
	background: #e8f5e9;
	color: #2e7d32;
}


/* ============================================================
   Contacts / Accounts — Context Menu & Bulk Toolbar
   (mirrors Task context menu and bulk toolbar)
   ============================================================ */

/* Contact / Account Bulk Toolbar - inline multi-select widget in header bar */
.contact-tb-bulk-toolbar,
.account-tb-bulk-toolbar {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}
.contact-tb-bulk-count,
.account-tb-bulk-count {
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 19px;
	color: #152A3D;
	white-space: nowrap;
}
.contact-tb-bulk-actions,
.account-tb-bulk-actions {
	display: flex;
	align-items: center;
	gap: 10px;
	padding-left: 5px;
}
.contact-tb-bulk-btn,
.account-tb-bulk-btn {
	width: 34px;
	height: 34px;
	border: none;
	background: transparent;
	cursor: pointer;
	padding: 0;
	flex-shrink: 0;
	margin-left: -5px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 25px 25px;
	transition: scale 0.2s var(--cal-arrive);
	appearance: none;
	-webkit-appearance: none;
}
.contact-tb-bulk-btn:hover,
.account-tb-bulk-btn:hover {
	scale: 1.1;
}
.contact-tb-bulk-btn:disabled,
.account-tb-bulk-btn:disabled {
	opacity: 0.38;
	cursor: default;
}
.contact-tb-bulk-btn:disabled:hover,
.account-tb-bulk-btn:disabled:hover {
	transform: none;
}
.contact-tb-bulk-btn:focus-visible,
.account-tb-bulk-btn:focus-visible {
	outline: 2px solid #2563EB;
	outline-offset: 2px;
	border-radius: 6px;
}
.contact-tb-bulk-btn-process,
.account-tb-bulk-btn-process {
	background-image: url(/images/contacts/apply-process-toolbar-icon.svg);
}
.contact-tb-bulk-btn-services,
.account-tb-bulk-btn-services {
	background-image: url(/images/contacts/apply-client-class-toolbar-icon.svg);
}
.account-tb-bulk-btn-convert {
	background-image: url(/images/contacts/convert-account-type-toolbar-icon.svg);
}
.contact-tb-bulk-btn-delete,
.account-tb-bulk-btn-delete {
	background-image: url(/images/contacts/trash-toolbar-icon.svg);
}
.contact-tb-bulk-btn-clear,
.account-tb-bulk-btn-clear {
	background-image: url(/images/contacts/close-toolbar-icon.svg);
}

.account-bulk-convert-dialog-copy {
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	line-height: 1.55;
	color: #152A3D;
}
.account-bulk-convert-dialog-copy p {
	margin: 0 0 12px;
}
.account-bulk-convert-dialog-copy p:last-child {
	margin-bottom: 0;
}
.account-bulk-convert-blockers {
	margin-top: 14px;
	border: 1px solid #D7DCE1;
	border-radius: 10px;
	background: #FAFBFC;
	overflow: hidden;
}
.account-bulk-convert-blockers summary {
	cursor: pointer;
	padding: 12px 14px;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.4;
	color: #152A3D;
}
.account-bulk-convert-blockers[open] summary {
	border-bottom: 1px solid #E4E7EB;
}
.account-bulk-convert-blocker-list {
	display: flex;
	flex-direction: column;
}
.account-bulk-convert-blocker-item {
	padding: 12px 14px;
}
.account-bulk-convert-blocker-item + .account-bulk-convert-blocker-item {
	border-top: 1px solid #E4E7EB;
}
.account-bulk-convert-blocker-name {
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.4;
	color: #152A3D;
}
.account-bulk-convert-blocker-meta,
.account-bulk-convert-blocker-reason {
	margin-top: 4px;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.5;
	color: #5B6570;
}


/* Shared Record Notes Panel */
.contact-note-workspace,
.contact-relationships-workspace,
.account-relationships-workspace {
    --contact-record-workspace-height: min(715px, calc(100vh - 320px));
    --contact-record-workspace-min-height: 350px;
}

.contact-note-section {
    margin-top: 8px;
}

.contact_right .addon_section.contact-note-section {
    overflow-x: hidden;
}

.contact-note-workspace {
    display: flex;
    align-items: stretch;
    position: relative;
    height: var(--contact-record-workspace-height);
    min-height: var(--contact-record-workspace-min-height);
    border-radius: 10px;
    background: #F3F3F3;
}

.quick-note-composer-shell.ui-dialog {
    border: 0;
    border-radius: 18px;
    overflow: hidden;
    background: #F3F3F3;
    padding: 0;
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.2), 0 10px 28px rgba(15, 23, 42, 0.12);
}

.quick-note-composer-shell .ui-dialog-titlebar {
    display: none;
}

.quick-note-composer-shell .ui-dialog-content {
    padding: 0;
    overflow: hidden;
    background: #F3F3F3;
}

.quick-note-composer-dialog {
    display: flex;
    flex-direction: column;
    gap: 10px;
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
    margin: 0;
    padding: 12px;
    background: #F3F3F3;
}

.quick-note-composer-header {
    flex-shrink: 0;
}

.quick-note-composer-close {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 12px;
    background-color: transparent;
    cursor: pointer;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease, transform 0.15s ease;
}

.quick-note-composer-close-icon {
    display: block;
    width: 20px;
    height: 20px;
    background-image: url('../images/icons/x-icon.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 20px 20px;
    opacity: 0.72;
    transition: opacity 0.2s ease;
}

.quick-note-composer-close:hover:not(:disabled) {
    background-color: rgba(15, 23, 42, 0.06);
    transform: scale(1.04);
}

.quick-note-composer-close:hover:not(:disabled) .quick-note-composer-close-icon,
.quick-note-composer-close:focus-visible .quick-note-composer-close-icon {
    opacity: 1;
}

.quick-note-composer-dialog .quick-note-composer-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    padding: 12px;
    box-sizing: border-box;
}

.quick-note-composer-dialog .quick-note-composer-editor-shell {
    min-height: 200px;
}

.quick-note-composer-dialog .quick-note-composer-body {
    min-height: 180px;
}

.quick-note-composer-chip-wrapper {
    margin-top: 10px;
}

.quick-note-composer-content:has(.contact-note-dynamic-row.expanded) .quick-note-composer-chip-wrapper {
    display: none;
}

.quick-note-composer-dynamic-row {
    margin-top: 12px;
}

.quick-note-composer-tag-popover {
    width: min(480px, 100%);
    max-width: 100%;
}

/* ── Left panel ── */
.contact-note-left-panel {
    flex: 0 0 25%;
    min-width: 280px;
    min-height: 0;
    height: 100%;
    position: relative;
    padding: 12px 6px 12px 12px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    transition: none;
    container-type: inline-size;
    container-name: notes-panel;
}

.contact-note-add-btn {
    width: 100%;
    height: 35px;
    border-radius: 7px;
    border: none;
    background: #3B82F6;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 500;
    color: #ffffff;
    cursor: pointer;
    margin-bottom: 8px;
    flex-shrink: 0;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.contact-note-add-btn:hover {
    background: #2563EB;
    color: #ffffff;
}

.contact-note-toolbar {
    display: flex;
    align-items: stretch;
    gap: 6px;
    height: 43px;
    margin-bottom: 8px;
    flex-shrink: 0;
}

.contact-note-toolbar .contact-note-add-btn {
    flex: 1 1 auto;
    height: 100%;
    margin-bottom: 0;
    white-space: nowrap;
    overflow: hidden;
    min-width: 0;
    container-type: inline-size;
    container-name: add-btn;
}

.contact-note-add-btn-label {
    white-space: nowrap;
    overflow: hidden;
}

@container notes-panel (max-width: 320px) {
    .contact-note-toolbar .contact-note-add-btn-verbose {
        display: none;
    }
}

@container add-btn (max-width: 80px) {
    .contact-note-add-btn-noun {
        display: none;
    }
}

.contact-note-view-toggle {
    display: flex;
    align-items: stretch;
    gap: 2px;
    height: 35px;
    padding: 2px;
    flex-shrink: 0;
    background: rgba(0, 0, 0, 0.08);
    border-radius: 7px;
    box-sizing: border-box;
}

.contact-note-toolbar .contact-note-view-toggle,
.contact-note-toolbar .contact-note-filter-control,
.contact-note-toolbar .contact-note-filter-btn {
    height: 100%;
}

.contact-note-toolbar .contact-note-filter-control,
.contact-note-toolbar .contact-note-filter-btn {
    width: 43px;
    min-width: 43px;
}

.contact-note-view-btn {
    width: 39px;
    align-self: stretch;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #6b7280;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.contact-note-view-btn:hover {
    background: rgba(0, 0, 0, 0.06);
}

.contact-note-view-btn.active {
    background: #ffffff;
    color: #1976d2;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.contact-note-view-btn svg {
    width: 16px;
    height: 16px;
    fill: currentColor;
}

.contact-note-filter-control {
    flex-shrink: 0;
    position: relative;
}

.contact-note-filter-btn {
    height: 35px;
    width: 35px;
    min-width: 35px;
    border-radius: 7px;
    border: none;
    background: #E2E2E2;
    color: #7c8694;
    padding: 0;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.contact-note-filter-btn:hover {
    background: #d5d5d5;
    color: #475569;
}

.contact-note-filter-btn.active,
.contact-note-filter-control.open .contact-note-filter-btn,
.contact-note-filter-control.has-active-filter .contact-note-filter-btn {
    background: #d0d0d0;
    color: #334155;
}

.contact-note-filter-btn.disabled,
.contact-note-filter-btn:disabled {
    cursor: default;
    opacity: 0.48;
    color: #94a3b8;
    background: transparent;
}

.contact-note-filter-btn.disabled:hover,
.contact-note-filter-btn:disabled:hover {
    color: #94a3b8;
    background: transparent;
}

.contact-note-filter-btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.contact-note-filter-btn-icon svg {
    width: 18px;
    height: 18px;
}

.contact-note-filter-popover {
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 6px;
    min-width: 200px;
    max-width: 280px;
    width: auto;
    border-radius: 14px;
    border: 1px solid rgba(10, 10, 10, 0.08);
    background: #ffffff;
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.12);
    z-index: 30;
    max-height: calc(100vh - 400px);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.contact-note-filter-popover.calendar-open {
    max-width: none;
    width: max-content;
}

.contact-note-filter-chooser {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    scrollbar-width: none;
}

/* ── Filter accordion ── */
.contact-note-filter-accordion-row {
    border-bottom: 1px solid rgba(10, 10, 10, 0.06);
}

.contact-note-filter-accordion-row:last-child {
    border-bottom: none;
}

.contact-note-filter-accordion-header {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 12px;
    border: none;
    background: transparent;
    font-size: 13px;
    font-weight: 600;
    color: #0f172a;
    cursor: pointer;
    transition: background-color 0.15s ease;
    border-radius: 0;
}

.contact-note-filter-accordion-header:hover {
    background: rgba(15, 23, 42, 0.03);
}

.contact-note-filter-accordion-chevron {
    color: #94a3b8;
    display: flex;
    align-items: center;
    transition: transform 0.2s ease;
}

.contact-note-filter-accordion-header.expanded .contact-note-filter-accordion-chevron {
    transform: rotate(90deg);
}

.contact-note-filter-accordion-body {
    padding: 0 12px 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.contact-note-filter-option {
    height: 38px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: #0f172a;
    font-size: 13px;
    font-weight: 500;
    text-align: left;
    padding: 0 12px;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.contact-note-filter-option:hover {
    background: #F5F5F5;
}

.contact-note-filter-option:focus {
    outline: none;
}

.contact-note-filter-tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    max-height: 200px;
    overflow-y: auto;
    scrollbar-width: none;
}

.contact-note-filter-tag-list::-webkit-scrollbar {
    display: none;
}

.contact-note-filter-tag-list .contact-note-tag-chip.selected {
    box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.12), 0 4px 12px rgba(15, 23, 42, 0.08);
}

.contact-note-filter-tag-list .contact-note-attachment-chip:hover {
    background: #F5F5F5;
    transform: none;
}

.contact-note-filter-empty {
    font-size: 12px;
    color: #94a3b8;
    padding: 4px 2px 2px;
}

.contact-note-filter-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #ffffff;
    padding: 8px 10px;
    margin-bottom: 8px;
    flex-shrink: 0;
}

.contact-note-filter-summary-label {
    display: block;
    font-size: 12px;
    line-height: 1.4;
    color: #475569;
    min-width: 0;
}

.contact-note-filter-summary-clear {
    width: 20px;
    height: 20px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: #64748b;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    flex-shrink: 0;
}

.contact-note-filter-summary-clear:hover {
    background: rgba(15, 23, 42, 0.08);
    color: #0f172a;
}

.contact-note-filter-calendar-view {
    padding: 0 0 8px;
}

.contact-note-filter-calendar-top {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px 10px;
}

.contact-note-filter-back-btn {
    width: 26px;
    height: 26px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #0f172a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
}

.contact-note-filter-back-btn:hover {
    background: rgba(15, 23, 42, 0.06);
}

.contact-note-filter-calendar-basis {
    font-size: 13px;
    font-weight: 600;
    color: #0f172a;
}

.contact-note-filter-calendar-surface {
    display: flex;
    border-top: 1px solid rgba(10, 10, 10, 0.04);
}

.contact-note-filter-presets {
    width: 128px;
    flex: 0 0 128px;
    padding: 16px 0;
    border-right: 1px solid rgba(10, 10, 10, 0.04);
    box-sizing: border-box;
}

.contact-note-filter-preset {
    width: calc(100% - 16px);
    height: 28px;
    margin: 0 8px;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: #0a0a0a;
    font-size: 12.8px;
    font-weight: 500;
    text-align: left;
    cursor: pointer;
}

.contact-note-filter-preset:hover,
.contact-note-filter-preset:focus,
.contact-note-filter-preset.active {
    background: #f5f5f5;
    outline: none;
}

.contact-note-filter-calendar-main {
    flex: 1 1 auto;
    padding: 8px;
    box-sizing: border-box;
}

.contact-note-filter-month-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 28px;
    margin-bottom: 16px;
}

.contact-note-filter-month-title {
    font-size: 14px;
    font-weight: 500;
    color: #0a0a0a;
}

.contact-note-filter-month-nav {
    width: 28px;
    height: 28px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: #0a0a0a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.contact-note-filter-month-nav:hover,
.contact-note-filter-month-nav:focus {
    background: #f5f5f5;
    outline: none;
}

.contact-note-filter-calendar-grid {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.contact-note-filter-weekdays,
.contact-note-filter-week {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0;
}

.contact-note-filter-weekday {
    text-align: center;
    font-size: 12.8px;
    line-height: 1.45;
    color: #737373;
}

.contact-note-filter-day {
    min-height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.contact-note-filter-day.in-range {
    background: #f5f5f5;
    border-radius: 0;
}

.contact-note-filter-day.range-start {
    border-radius: 8px 0 0 8px;
}

.contact-note-filter-day.range-end {
    border-radius: 0 8px 8px 0;
}

.contact-note-filter-day.range-single {
    border-radius: 8px;
}

.contact-note-filter-day-btn {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #0a0a0a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
    position: relative;
    z-index: 1;
}

.contact-note-filter-day-btn:hover,
.contact-note-filter-day-btn:focus {
    background: rgba(10, 10, 10, 0.06);
    outline: none;
}

.contact-note-filter-day.range-start .contact-note-filter-day-btn,
.contact-note-filter-day.range-end .contact-note-filter-day-btn,
.contact-note-filter-day.range-single .contact-note-filter-day-btn {
    background: #171717;
    color: #fafafa;
}

.contact-note-filter-day.range-single .contact-note-filter-day-btn {
    box-shadow: 0 0 0 3px rgba(161, 161, 161, 0.5);
}

.contact-note-filter-day-label {
    font-size: 14px;
    line-height: 1;
}

.contact-note-filter-day.outside-month .contact-note-filter-day-btn {
    color: #737373;
    opacity: 0.5;
    cursor: default;
}

.contact-note-filter-day.outside-month .contact-note-filter-day-btn:hover,
.contact-note-filter-day.outside-month .contact-note-filter-day-btn:focus {
    background: transparent;
}

.contact-note-folder-back {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    margin: 0 0 8px;
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 10px;
    background: #ffffff;
    flex-shrink: 0;
}

.contact-note-folder-back-btn {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 8px;
    background: rgba(148, 163, 184, 0.12);
    color: #0f172a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
}

.contact-note-folder-back-btn:hover {
    background: rgba(148, 163, 184, 0.18);
}

.contact-note-folder-back-label {
    min-width: 0;
    font-size: 12.5px;
    font-weight: 600;
    color: #334155;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.contact-note-cards-viewport {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 0;
    position: relative;
    scrollbar-width: none;
}

.contact-note-cards-viewport::-webkit-scrollbar {
    display: none;
}

/* ── Note card ── */
.contact-note-card {
    padding: 10px 12px;
    cursor: pointer;
    margin-bottom: 6px;
    border-radius: 8px;
    background: #ffffff;
    transition: background 0.12s ease;
}

.contact-note-workspace.expanded-view .contact-note-left-panel {
    flex: 1 1 100%;
    min-width: 0;
    padding-right: 12px;
}

.contact-note-workspace.expanded-view.expanded-detail-active .contact-note-left-panel {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    padding: 12px;
    z-index: 0;
}

.contact-note-workspace.expanded-view .contact-note-cards-list {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.contact-note-workspace.expanded-view .contact-note-card {
    margin-bottom: 6px;
}

.contact-note-card.expanded-card {
    position: relative;
    padding: 16px 18px;
    border-radius: 8px;
    border: 1px solid rgba(148, 163, 184, 0.24);
    background: linear-gradient(180deg, #ffffff 0%, #fbfbfc 100%);
    cursor: pointer;
    transition: border-color 0.2s ease;
}

.contact-note-workspace.expanded-view.expanded-detail-active .contact-note-card.expanded-card {
    display: none;
}

.contact-note-workspace.expanded-view.expanded-detail-active .contact-note-card.expanded-card.expanding-card {
    display: block;
    pointer-events: none;
    border-color: transparent;
    flex: 1 1 auto;
}

.contact-note-card.expanded-card:hover {
    background: linear-gradient(180deg, #ffffff 0%, #fbfbfc 100%);
    border-color: rgba(148, 163, 184, 0.40);
}

.contact-note-card.expanded-card.bulk-selected,
.contact-note-card.expanded-card.selected.bulk-selected {
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    border-color: rgba(59, 130, 246, 0.22);
}


.contact-note-card.draft-card {
    background: #fafafa;
    border: 1px dashed #d4d4d4;
}

.contact-note-card.draft-card .contact-note-card-top::after {
    content: 'DRAFT';
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.5px;
    color: #b0b0b0;
    border: 1px dashed #d4d4d4;
    border-radius: 4px;
    padding: 3px;
    line-height: 1;
    flex-shrink: 0;
}

.contact-note-card:hover {
    background: rgba(0, 0, 0, 0.04);
}

.contact-note-card.selected {
    background: #ffffff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06), 0 4px 16px rgba(0, 0, 0, 0.06);
    border: 1px solid #c0c0c0;
}

.contact-note-card.selected:hover {
    background: #ffffff;
}

.contact-note-card.bulk-selected {
    background: #EAEAEA;
    border: 1px solid #d4d4d4;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.03);
}

.contact-note-card.bulk-selected:hover {
    background: #EAEAEA;
}

.contact-note-card.selected.bulk-selected {
    background: #EAEAEA;
    border: 1px solid #cfcfcf;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06), 0 4px 16px rgba(0, 0, 0, 0.06);
}

.contact-note-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 2px;
}

.contact-note-card-pin-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #94a3b8;
}

.contact-note-card-pin-icon svg {
    width: 12px;
    height: 12px;
}

.contact-note-card-title {
    font-size: 13px;
    line-height: 1.4;
    font-weight: 600;
    color: #1a1a1a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
}

.contact-note-card-body {
    font-size: 11.5px;
    line-height: 1.4;
    color: #999;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 2px;
}

.contact-note-card-meta {
    display: flex;
    align-items: center;
    gap: 8px;
}

.contact-note-folder-card {
    border: 1px solid rgba(148, 163, 184, 0.18);
    background: #ffffff;
}

.contact-note-card.contact-note-folder-card:hover {
    background: #ffffff;
    border-color: rgba(148, 163, 184, 0.32);
}

.contact-note-folder-card.folder-selected {
    border-color: rgba(59, 130, 246, 0.45);
    box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.12), 0 8px 18px rgba(59, 130, 246, 0.08);
}

.contact-note-folder-card.is-editing {
    border-color: rgba(59, 130, 246, 0.55);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12);
}

.contact-note-folder-card .contact-note-card-top {
    align-items: center;
    margin-bottom: 0;
}

.contact-note-folder-card-heading {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-width: 0;
}

.contact-note-folder-card-icon {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: rgba(37, 99, 235, 0.1);
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.contact-note-folder-card-icon svg {
    width: 16px;
    height: 16px;
}

.contact-note-folder-card-body {
    font-size: 12px;
    line-height: 1.5;
    color: #64748b;
    margin-bottom: 4px;
}

.contact-note-folder-card-meta {
    font-size: 11.5px;
    line-height: 1.45;
    color: #94a3b8;
}

.contact-note-folder-name-input {
    width: 100%;
    min-width: 0;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #ffffff;
    color: #0f172a;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    padding: 8px 10px;
    box-sizing: border-box;
}

.contact-note-folder-name-input:focus {
    outline: none;
    border-color: #60a5fa;
    box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.16);
}

.contact-note-folder-card-validation {
    margin-top: 8px;
    color: #dc2626;
    font-size: 11.5px;
    line-height: 1.45;
}

.contact-note-workspace.expanded-view .contact-note-folder-card {
    padding: 18px;
    border-radius: 12px;
}

.contact-note-workspace.expanded-view .contact-note-folder-card-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.contact-note-workspace.expanded-view .contact-note-folder-card .contact-note-card-title {
    font-size: 14px;
}

.contact-note-card-date {
    font-size: 11px;
    color: #999;
    line-height: 1.3;
}

.contact-note-card-indicators {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.contact-note-card-indicator {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-size: 10px;
    color: #b0b0b0;
    font-weight: 500;
}

.contact-note-card-indicator.pinned {
    color: #2563eb;
}

.contact-note-card-indicator svg {
    width: 11px;
    height: 11px;
    flex-shrink: 0;
}

.contact-note-card-avatar {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #d1d5db;
    color: #fff;
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
}

.contact-note-card-avatar:empty {
    display: none;
}

.expanded-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.expanded-card-header-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.contact-note-card-pin-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(37, 99, 235, 0.08);
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    flex-shrink: 0;
}

.contact-note-card-pin-badge-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.contact-note-card-pin-badge-icon svg {
    width: 12px;
    height: 12px;
}

.expanded-card-subject {
    width: 100%;
    border: 0;
    background: transparent;
    padding: 0;
    color: #0f172a;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    outline: none;
}

.expanded-card-subject-display {
    display: block;
}

.contact-note-subject.expanded-card-subject-display {
    font-size: 16px;
    line-height: normal;
    padding-right: 0;
    color: #1e293b;
    width: auto;
    flex: 0 1 auto;
}

.expanded-card-subject:disabled {
    color: #334155;
    cursor: default;
}

.expanded-card-subject::placeholder {
    color: #94a3b8;
}

.expanded-card-date {
    color: #64748b;
    font-size: 12px;
    line-height: 1.45;
}

.expanded-card-subject-row {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.expanded-card-header-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-left: auto;
    flex-shrink: 0;
}

.expanded-card-status {
    flex-shrink: 0;
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.5px;
    color: #b0b0b0;
    border: 1px dashed #d4d4d4;
    border-radius: 4px;
    padding: 3px;
    line-height: 1;
    text-transform: uppercase;
    background: transparent;
}

.expanded-card-meta {
    min-width: 0;
    color: #64748b;
    font-size: 12px;
    line-height: 1.45;
}

.expanded-card-avatar {
    width: 18px;
    height: 18px;
    font-size: 7px;
}

.expanded-card-editor-region {
    position: relative;
    margin-bottom: 12px;
}

.expanded-card-editor-region.is-editing {
}

.expanded-card-toolbar {
    top: 0;
    right: 0;
}

.expanded-card-body {
    max-height: 180px;
    overflow: hidden;
    color: #334155;
    font-size: 14px;
    line-height: 1.65;
    padding-right: 0;
}

.expanded-card-body p {
    margin: 0 0 0.9em;
}

.expanded-card-body p:last-child {
    margin-bottom: 0;
}

.expanded-card-body.contact-note-body {
    min-height: 0;
    height: auto;
    flex: 0 0 auto;
    padding-right: 0;
    font-size: 14px;
}

.expanded-card-editor-region.is-editing .expanded-card-body {
    min-height: 220px;
    max-height: none;
}

.expanded-card-body.is-empty::before {
    content: attr(data-empty-label);
    color: #94a3b8;
}

.expanded-card-save-indicator {
    min-height: 32px;
}

.expanded-card-inline-section {
    margin-top: 14px;
    padding: 14px;
    border-radius: 14px;
    border: 1px solid rgba(148, 163, 184, 0.2);
    background: #f8fafc;
}

.expanded-card-inline-title {
    margin-bottom: 12px;
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.expanded-card-inline-body {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.expanded-card-comments-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.expanded-card-comments-timeline {
    max-height: 240px;
}

.expanded-card-comment-composer {
    display: flex;
    align-items: center;
    gap: 8px;
}

.expanded-card-inline-empty,
.expanded-card-inline-loading {
    color: #94a3b8;
    font-size: 13px;
    line-height: 1.5;
}

.expanded-card-regarding-list,
.expanded-card-attachment-list {
    align-items: center;
}

.expanded-card-regarding-pill {
    max-width: 280px;
}

.expanded-card-dropzone {
    width: 100%;
    margin: 4px 0 0;
}

/* ── Left panel status ── */
/* #1702: note count under the list - the activity panels' "Showing 1 to 10 of 25" line. */
.contact-note-count-footer {
    flex: 0 0 auto;
    font-size: 12px;
    color: #64748b;
    font-weight: 500;
    padding: 8px 4px 0;
    border-top: 1px solid #e2e8f0;
    margin-top: 6px;
}

.contact-note-left-status {
    font-size: 12px;
    color: #94a3b8;
    font-weight: 500;
    text-align: center;
    padding: 12px 10px 6px;
}

.contact-note-left-status.loading {
    color: #3b82f6;
}

.contact-note-left-status.loading::before {
    content: '';
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid #3b82f6;
    border-top-color: transparent;
    border-radius: 50%;
    animation: contact-note-spin 0.8s linear infinite;
    vertical-align: middle;
    margin-right: 6px;
}

@keyframes contact-note-spin {
    to { transform: rotate(360deg); }
}

.contact-note-left-status.done {
    color: #94a3b8;
    font-size: 11px;
}

.contact-note-left-status.empty {
    color: #94a3b8;
    padding: 32px 12px;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
}

.contact-note-left-sentinel {
    height: 4px;
}

.contact-note-context-menu {
    position: fixed;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    padding: 4px 0;
    z-index: 10000;
    min-width: 200px;
}

.contact-note-context-menu-header {
    padding: 8px 16px;
    font-weight: 600;
    color: #00529b;
    border-bottom: 1px solid #e0e0e0;
    margin-bottom: 4px;
}

.contact-note-context-menu-item {
    padding: 8px 16px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #333;
    font-size: 13px;
    transition: background 0.15s ease, color 0.15s ease;
}

.contact-note-context-menu-item:hover {
    background: #f5f5f5;
}

.contact-note-context-menu-item.danger {
    color: #dc3545;
}

.contact-note-context-menu-item.danger:hover {
    background: #fff0f0;
}

.contact-note-context-menu-item.disabled,
.contact-note-context-menu-item.disabled.danger {
    color: #a3a3a3;
    cursor: not-allowed;
}

.contact-note-context-menu-item.disabled:hover,
.contact-note-context-menu-item.disabled.danger:hover {
    background: transparent;
}

.contact-note-context-menu-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.contact-note-context-menu-item-with-submenu {
    position: relative;
    padding-right: 36px;
}

.contact-note-context-submenu-arrow {
    margin-left: auto;
    color: #94a3b8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.contact-note-context-submenu {
    position: absolute;
    min-width: 220px;
    border: 1px solid #ddd;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.16);
    padding: 4px 0;
    z-index: 10001;
}

.contact-note-context-submenu .contact-note-context-menu-item {
    white-space: nowrap;
}

.contact-note-context-menu-separator {
    border-top: 1px solid #e0e0e0;
    margin: 4px 0;
}

.contact-note-context-menu-message {
    padding: 6px 16px 4px;
    font-size: 12px;
    line-height: 1.4;
    color: #6b7280;
}

.contact-note-folder-delete-copy {
    margin: 0 0 10px;
    color: #334155;
    font-size: 13px;
    line-height: 1.55;
}

.contact-note-folder-delete-hint {
    margin: 0;
    color: #64748b;
    font-size: 12px;
    line-height: 1.5;
}

.contact-note-folder-delete-danger {
    color: #b91c1c !important;
}

/* ── Right panel ── */
.contact-note-right-panel {
    flex: 1;
    min-height: 0;
    height: 100%;
    padding: 12px 12px 12px 6px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: none;
}

.contact-note-right-panel > * {
    transition: opacity 0.18s ease;
}

.contact-note-workspace.expanded-view .contact-note-right-panel {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    pointer-events: none;
    padding: 12px;
    z-index: 1;
}

.contact-note-workspace.expanded-view .contact-note-right-panel > * {
    opacity: 0;
}

.contact-note-workspace.expanded-view.expanded-detail-active .contact-note-right-panel {
    opacity: 1;
    pointer-events: auto;
    overflow: visible;
}

.contact-note-workspace.expanded-view.expanded-detail-active .contact-note-right-panel > * {
    opacity: 1;
}

.contact-note-right-panel.empty {
    opacity: 0.7;
}

.contact-note-header-row {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #ffffff;
    border-radius: 8px;
    padding: 0 12px;
    height: 43px;
    transition: background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.contact-note-header-row:focus-within {
    background: #ffffff;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

.contact-note-back-btn {
    display: none;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    background: transparent;
    border: 1px solid #e2e8f0;
    border-radius: 50%;
    color: #64748b;
    cursor: pointer;
    padding: 0;
    margin-right: 8px;
    transition: all 0.15s ease;
}

.contact-note-back-btn:hover {
    background: #f1f5f9;
    border-color: #cbd5e1;
    color: #334155;
}

.contact-note-workspace.expanded-view.expanded-detail-active .contact-note-back-btn {
    display: flex;
}

.contact-note-info-wrap {
    position: relative;
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

input.contact-note-subject {
    flex: 1;
    border: 0;
    background: transparent;
    padding: 0 14px 0 0;
    font-size: 16px;
    font-weight: 700;
    color: #1e293b;
    outline: none;
}

.contact-note-subject:disabled {
    color: #475569;
}

.contact-note-info-btn {
    border: 0;
    background: transparent;
    color: #94a3b8;
    font-size: 20px;
    cursor: pointer;
    width: 34px;
    height: 34px;
    border-radius: 6px;
    transition: color 0.2s ease, background-color 0.2s ease;
}

.contact-note-info-btn:hover {
    color: #3b82f6;
    background: rgba(59, 130, 246, 0.08);
}

.contact-note-metadata {
    display: flex;
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 5;
    min-width: 320px;
    max-width: 460px;
    flex-direction: column;
    row-gap: 4px;
    padding: 10px 14px;
    border-radius: 8px;
    border: 1px solid #dcdcdc;
    background: #ffffff;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    font-size: 11.5px;
    color: #64748b;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.2s cubic-bezier(0.4, 0, 0.2, 1),
                visibility 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.contact-note-info-wrap:hover .contact-note-metadata,
.contact-note-info-wrap:focus-within .contact-note-metadata {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.contact-note-metadata-line {
    line-height: 1.35;
    word-break: break-word;
}

/* ── Content region ── */
.contact-note-content-region {
    border-radius: 8px;
    background: #ffffff;
    padding: 14px;
    min-height: 0;
    display: flex;
    flex-direction: column;
    flex: 1;
    transition: background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.contact-note-content-region:focus-within {
    background: #ffffff;
}

.contact-note-body-shell {
    flex: 1;
    min-height: 0;
}

.contact-note-body-toolbar {
    top: 0;
    right: 0;
}

/* Keep formatting in the body's flow when a short window cannot fit the vertical rail. */
@media (max-height: 800px) {
    .contact-note-body-toolbar {
        position: relative;
        flex-direction: row;
        flex-wrap: wrap;
        flex-shrink: 0;
        align-self: flex-end;
        max-width: 100%;
        margin-bottom: 8px;
    }

    .contact-note-body-toolbar .note-rich-link-popover {
        top: calc(100% + 8px);
        right: 0;
    }
}

.contact-note-body {
    background: transparent;
    width: 100%;
    min-height: 80px;
    height: 100%;
    flex: 1;
    /* Bounded flex child (height:100%); without this a long note overflows and bleeds over the
       footer controls. overflow-y:auto keeps the note body contained and scrolling. */
    overflow-y: auto;
    color: #334155;
    font-size: 15px;
    line-height: 1.55;
    /* #1740: keep the note text clear of the formatting toolbar floating over this corner. The
       editor publishes the toolbar's width, which changes when the toolbar is collapsed. */
    padding-right: calc(var(--note-toolbar-width, 44px) + 12px);
    box-sizing: border-box;
}

@media (max-height: 800px) {
    .contact-note-body {
        padding-right: 0;
    }
}

.contact-note-body.read-only {
    color: #475569;
}

.contact-note-body .cke_editable {
    min-height: 100%;
}

.contact-note-body .cke_editable,
.contact-note-body.cke_editable {
    font-size: 15px;
    line-height: 1.55;
}

/* ── Comments timeline ── */
.contact-note-comments-timeline {
    width: 100%;
    max-height: 280px;
    overflow-y: auto;
    padding: 4px 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.12) transparent;
}

.contact-note-comments-timeline::-webkit-scrollbar {
    width: 5px;
}

.contact-note-comments-timeline::-webkit-scrollbar-track {
    background: transparent;
}

.contact-note-comments-timeline::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.12);
    border-radius: 3px;
}

.contact-note-comments-empty {
    color: #94a3b8;
    font-size: 13px;
    font-weight: 500;
    padding: 16px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
}

.contact-note-comment-date {
    color: #64748b;
    font-weight: 600;
    font-size: 12px;
    margin: 12px 0 8px;
    text-align: center;
}

.contact-note-comment-row-item {
    display: flex;
    flex-direction: column;
    margin-bottom: 12px;
}

.contact-note-comment-row-item.mine {
    align-items: flex-end;
}

.contact-note-comment-row-item.theirs {
    align-items: flex-start;
}

.contact-note-comment-bubble {
    max-width: 86%;
    border-radius: 18px;
    padding: 10px 14px;
    font-size: 14px;
    line-height: 1.4;
}

.contact-note-comment-row-item.mine .contact-note-comment-bubble {
    background: #3b82f6;
    color: #ffffff;
    border-top-right-radius: 4px;
}

.contact-note-comment-row-item.theirs .contact-note-comment-bubble {
    background: #ffffff;
    color: #334155;
    border: 1px solid #dcdcdc;
    border-top-left-radius: 4px;
}

.contact-note-comment-meta {
    font-size: 10.5px;
    color: #94a3b8;
    margin-top: 4px;
    padding: 0 4px;
}

.contact-note-comment-row-content {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 6px;
    max-width: 100%;
}

.contact-note-comment-row-item.mine .contact-note-comment-row-content {
    flex-direction: row-reverse;
}

.contact-note-comment-avatar {
    width: 24px;
    height: 24px;
    min-width: 24px;
    border-radius: 50%;
    color: #fff;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
    margin-top: 2px;
}

.contact-note-comment-row-item.mine .contact-note-comment-meta {
    padding-right: 30px;
}

.contact-note-comment-row-item.theirs .contact-note-comment-meta {
    padding-left: 30px;
}

/* ── Dynamic row ── */
.contact-note-dynamic-row {
    padding: 12px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    margin-bottom: 14px;
    background: #F5F5F5;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 8px rgba(0, 0, 0, 0.05);
}

.contact-note-dynamic-row.expanded {
    flex-direction: column;
    align-items: stretch;
}

.contact-note-dynamic-row.expanded.comments-mode {
    flex: 1;
}

.contact-note-dynamic-row.expanded.comments-mode .contact-note-comments-timeline {
    flex: 1;
    min-height: 0;
    max-height: calc(100vh - 530px);
    display: flex !important;
    flex-direction: column;
}

/* ── Passive attachment bar (read-only pills between textarea and dynamic bar) ── */
.contact-note-passive-attachments {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 8px 0;
    margin-bottom: 2px;
}

/* ── Regarding bar (connected entity pills) ── */
.contact-note-regarding-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 8px 0;
    margin-bottom: 2px;
}

.contact-note-regarding-add {
    border: 1.5px dashed #B3B3B3 !important;
    background: transparent !important;
    color: #B3B3B3;
    box-shadow: none !important;
}

.contact-note-regarding-add:hover {
    border-color: #334155 !important;
    color: #334155;
    background: rgba(51, 65, 85, 0.04) !important;
}

/* ── Upload pills inside the attachments timeline ── */
.contact-note-upload-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 8px;
}

/* ── Inline drop zone (inside dynamic bar when expanded) ── */
.contact-note-dropzone {
    border: 2px dashed #dadce0;
    border-radius: 8px;
    padding: 24px;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s ease;
    margin: 8px;
}

.contact-note-dropzone:hover,
.contact-note-dropzone.drag-over {
    border-color: #4285f4;
    background: #e8f0fe;
}

.contact-note-dropzone.uploading {
    opacity: 0.6;
    pointer-events: none;
}

.contact-note-dropzone * {
    pointer-events: none;
}

.contact-note-dropzone-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.contact-note-drop-icon {
    font-size: 24px;
    opacity: 0.5;
    color: #5f6368;
}

.contact-note-drop-text {
    color: #5f6368;
    margin: 0;
    font-size: 13px;
}

.contact-note-dynamic-content {
    min-width: 0;
}

.contact-note-dynamic-content[style*="display: none"] {
    display: none !important;
}

.contact-note-dynamic-body {
    display: flex !important;
    align-items: center;
    gap: 8px;
}

.contact-note-dynamic-body[style*="display: none"] {
    display: none !important;
}

.contact-note-dynamic-comments {
}

.contact-note-attachment-chip,
.contact-note-attachment-more {
    border: 0;
    background: #F5F5F5;
    color: #475569;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 8px rgba(0, 0, 0, 0.05);
    /* Guarantee spacing between adjacent chips regardless of the container
       (some render paths place them in a zero-gap container). 5px per side
       yields ~10px between adjacent chips. */
    margin: 5px;
    padding: 5px 10px;
    font-size: 12px;
    cursor: pointer;
    height: 32px;
    box-sizing: border-box;
    max-width: 200px;
    white-space: nowrap;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: background-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.contact-note-regarding-bar .contact-note-attachment-chip,
.contact-note-regarding-bar .contact-note-attachment-more,
.contact-note-tag-popover-grid .contact-note-attachment-chip,
.contact-note-tag-popover-grid .contact-note-attachment-more {
    margin: 0;
}

.contact-note-chip-icon {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.contact-note-chip-text {
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.contact-note-tag-dot {
    width: 10px;
    height: 10px;
    min-width: 10px;
    border-radius: 999px;
    border: 1px solid transparent;
    display: inline-flex;
}

.contact-note-tag-chip {
    max-width: 240px;
}

.contact-note-attachment-chip.contact-note-tag-chip {
    font-size: 12px;
}

.contact-note-tag-chip .contact-note-chip-delete {
    color: inherit;
    opacity: 0.7;
}

.contact-note-tag-chip .contact-note-chip-delete:hover {
    opacity: 1;
}

.contact-note-attachment-chip:hover {
    background: #E9EEF5;
    box-shadow: 0 2px 5px rgba(15, 23, 42, 0.08), 0 5px 12px rgba(15, 23, 42, 0.06);
    transform: translateY(-1px);
}

.contact-note-chip-delete {
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 999px;
    color: #64748b;
    font-size: 16px;
    line-height: 1;
    font-weight: 700;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transform: scale(0.8);
    transition: opacity 0.16s ease, visibility 0.16s ease, color 0.16s ease, background-color 0.16s ease, transform 0.16s ease;
}

.contact-note-chip-delete:hover {
    background: rgba(239, 68, 68, 0.12);
    color: #dc2626;
    transform: scale(1.04);
}

.contact-note-attachment-chip.deletable:hover .contact-note-chip-delete,
.contact-note-attachment-chip.deletable:focus-visible .contact-note-chip-delete {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
}

.contact-note-attachment-more {
    background: #c8c8c8;
    font-weight: 600;
    color: #334155;
}

.contact-note-attachment-more:hover {
    background: #94a3b8;
    color: #ffffff;
}

.contact-note-attachment-empty {
    color: #94a3b8;
    font-size: 12px;
}

.contact-note-dynamic-toggle {
    border: 0;
    background: #e8e8e8;
    color: #94a3b8;
    width: 28px;
    min-width: 28px;
    height: 28px;
    border-radius: 50%;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.contact-note-dynamic-toggle:hover:not(:disabled) {
    background: #d4d4d4;
    color: #475569;
}

.contact-note-dynamic-toggle.expanded {
    transform: rotate(180deg);
}

/* ── Comment input ── */
.contact-note-comment-input {
    flex: 1;
    border: 1px solid #dcdcdc;
    outline: none;
    background: #ffffff;
    border-radius: 8px;
    padding: 9px 12px;
    height: 40px;
    box-sizing: border-box;
    color: #334155;
    font-size: 14px;
    transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.contact-note-comment-input:focus {
    border-color: #3b82f6;
    background: #ffffff;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.12);
}

.contact-note-comment-submit {
    border: 0;
    border-radius: 50%;
    background: #3B82F6;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.contact-note-comment-submit img {
    filter: brightness(0) invert(1);
}

.contact-note-comment-submit:hover:not(:disabled) {
    background: #2563eb;
}

/* ── Attachments timeline ── */
.contact-note-attachments-timeline {
    width: 100%;
    max-height: 280px;
    overflow-y: auto;
    padding: 4px 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.12) transparent;
}

.contact-note-attachments-timeline::-webkit-scrollbar {
    width: 5px;
}

.contact-note-attachments-timeline::-webkit-scrollbar-track {
    background: transparent;
}

.contact-note-attachments-timeline::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.12);
    border-radius: 3px;
}

.contact-note-attachments-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.contact-note-attachment-row {
    border: 0;
    text-align: left;
    border-radius: 8px;
    background: #F3F3F3;
    color: #475569;
    padding: 10px 12px;
    font-size: 13px;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.contact-note-attachment-row:hover {
    background: #dcdcdc;
}

/* ── Tag picker inline popover ── */
.contact-note-tag-picker-wrapper {
    position: relative;
}

.contact-note-tag-popover {
    position: absolute;
    bottom: 100%;
    left: 0;
    width: 50%;
    min-width: 260px;
    z-index: 30;
    border-radius: 8px;
    border: 1px solid rgba(10, 10, 10, 0.08);
    background: #F5F5F5;
    box-shadow: 0 -8px 24px rgba(15, 23, 42, 0.10), 0 4px 12px rgba(15, 23, 42, 0.06);
    box-sizing: border-box;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
    margin-bottom: 6px;
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.12) transparent;
}

.contact-note-tag-popover::-webkit-scrollbar {
    width: 5px;
}

.contact-note-tag-popover::-webkit-scrollbar-track {
    background: transparent;
}

.contact-note-tag-popover::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.12);
    border-radius: 3px;
}

.contact-note-tag-popover-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.contact-note-tag-popover-chip {
    justify-content: flex-start;
}

.contact-note-tag-popover-grid .contact-note-tag-chip.is-added {
    cursor: default;
}

.contact-note-tag-popover-grid .contact-note-tag-chip.is-added:hover {
    transform: none;
}

.contact-note-tag-popover-delete {
    width: 16px;
    min-width: 16px;
    height: 16px;
    border-radius: 999px;
    margin-left: 2px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    transition: background-color 0.15s ease, opacity 0.15s ease;
}

.contact-note-tag-popover-delete img {
    width: 12px;
    height: 12px;
    display: block;
    opacity: 0.76;
}

.contact-note-tag-popover-delete:hover {
    background: rgba(239, 68, 68, 0.08);
}

.contact-note-tag-popover-delete:hover img {
    opacity: 1;
}
.contact-note-tag-popover-empty {
    color: #64748b;
    font-size: 13px;
    text-align: center;
    padding: 14px 8px;
}

.contact-note-tag-popover-create-trigger {
    border: 1.5px dashed #B3B3B3;
    border-radius: 10px;
    background: transparent;
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    padding: 10px;
    cursor: pointer;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
    transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}

.contact-note-tag-popover-create-trigger:hover {
    border-color: #334155;
    color: #334155;
    background: rgba(51, 65, 85, 0.04);
}

.contact-note-tag-popover-back {
    border: none;
    background: transparent;
    color: #64748b;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    padding: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: color 0.15s ease;
}

.contact-note-tag-popover-back:hover {
    color: #0f172a;
}

.contact-note-tag-popover-submit {
    border: 0;
    border-radius: 10px;
    background: #0f172a;
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    padding: 10px 18px;
    cursor: pointer;
    width: 100%;
    box-sizing: border-box;
    transition: background-color 0.15s ease;
}

.contact-note-tag-popover-submit:hover:not(:disabled) {
    background: #1e293b;
}

.contact-note-tag-popover-submit:disabled {
    opacity: 0.6;
    cursor: default;
}

.contact-note-tag-create-label {
    font-size: 12px;
    font-weight: 700;
    color: #475569;
}

.contact-note-tag-create-input {
    border: 1px solid #d8dee9;
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 14px;
    color: #0f172a;
    outline: none;
}

.contact-note-tag-create-input:focus {
    border-color: #94a3b8;
    box-shadow: 0 0 0 2px rgba(148, 163, 184, 0.16);
}

.contact-note-tag-swatch-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.contact-note-tag-swatch {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    padding: 0;
    cursor: pointer;
}

.contact-note-tag-swatch.selected {
    transform: translateY(-1px);
}

.contact-note-tag-create-validation {
    min-height: 18px;
    color: #b91c1c;
    font-size: 12px;
}

/* ── Action bar ── */
.contact-note-action-bar {
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    background: #F5F5F5;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 3px 8px rgba(0, 0, 0, 0.05);
}

.contact-note-action-icons {
    display: flex;
    align-items: center;
    gap: 10px;
}

.contact-note-action-right {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.contact-note-icon-btn {
    position: relative;
    width: 34px;
    height: 34px;
    border-radius: 6px;
    border: 0;
    background-color: transparent;
    cursor: pointer;
    transition: background-color 0.2s ease, box-shadow 0.15s ease;
}

.contact-note-icon-btn:hover:not(:disabled) {
    background-color: #f3f3f3;
}

.contact-note-icon-btn.active {
    background-color: #e8e8e8;
    box-shadow: inset 0 0 0 1px #c9cdd3;
}

.contact-note-icon-btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px rgba(15, 23, 42, .12);
}

.contact-note-icon-btn.active:focus-visible {
    box-shadow: inset 0 0 0 1px #c9cdd3, 0 0 0 2px rgba(15, 23, 42, .12);
}

.contact-note-icon-related,
.contact-note-icon-attachment,
.contact-note-icon-tag,
.contact-note-icon-comment,
.contact-note-icon-print {
    background-size: 20px 20px;
    background-position: center;
    background-repeat: no-repeat;
}
.contact-note-icon-related    { background-image: url(/images/contacts/related.svg); background-size: 26px 26px; }
.contact-note-icon-attachment { background-image: url(/images/contacts/attachment.svg); background-size: 18px 18px; }
.contact-note-icon-tag        { background-image: url(/images/contacts/tag.svg); background-size: 26px 26px; }
.contact-note-icon-comment    { background-image: url(/images/contacts/chat.svg); }
.contact-note-icon-print      { background-image: url(/images/contacts/print.svg); }

.contact-note-icon-badge {
    position: absolute;
    top: -2px;
    right: -2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #3b82f6;
    color: #ffffff;
    font-size: 8px;
    line-height: 16px;
    text-align: center;
    font-weight: 500;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

/* ── Action buttons ── */
.contact-note-btn {
    border: 0;
    border-radius: 8px;
    color: #ffffff;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    min-width: 100px;
    padding: 0 16px;
    height: 32px;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.15s cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.contact-note-btn:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.contact-note-btn:active:not(:disabled) {
    transform: translateY(0);
    box-shadow: none;
}

.contact-note-btn-delete {
    background: #ef4444;
    margin-left: 6px;
}

.contact-note-btn-delete:hover:not(:disabled) {
    background: #dc2626;
}

.contact-note-btn-save {
    background: transparent;
    color: #00529b;
    border: 1.5px solid #00529b;
    box-sizing: border-box;
}

.contact-note-btn-save:hover:not(:disabled) {
    background: #00529b;
    color: #fff;
}

.contact-note-btn-complete {
    background: #00529b;
    color: #fff;
}

.contact-note-btn-complete:hover:not(:disabled) {
    background: #003d75;
}

.contact-note-save-indicator {
    min-height: 32px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: transparent;
    color: #B3B3B3;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
    text-align: center;
    white-space: nowrap;
}

.contact-note-save-indicator.is-hidden {
    display: none;
}

.contact-note-save-indicator.locked {
    padding: 0 16px;
    border-radius: 8px;
    background: #00529b;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    min-width: 100px;
    opacity: 0.5;
    gap: 6px;
    cursor: default;
}

.contact-note-btn-save.just-saved {
    box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.18);
}

.contact-note-btn.disabled,
.contact-note-btn:disabled,
.contact-note-comment-submit:disabled,
.contact-note-dynamic-toggle:disabled,
.contact-note-icon-btn:disabled {
    opacity: 0.45;
    cursor: default;
}

.contact-note-btn-save.disabled,
.contact-note-btn-save:disabled {
    opacity: 0.5;
    cursor: default;
    pointer-events: none;
    background: transparent;
    border-color: #00529b;
    color: #00529b;
}

.contact-note-btn-complete.disabled,
.contact-note-btn-complete:disabled {
    opacity: 0.5;
    cursor: default;
    pointer-events: none;
    background: #00529b;
    color: #fff;
}

.contact-note-search-input {
    margin-left: 8px;
    border: 1px solid #dcdcdc;
    border-radius: 8px;
    background: #ffffff;
    color: #334155;
    padding: 5px 10px;
    min-width: 200px;
    font-size: 13px;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.contact-note-search-input:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.12);
}

@media (max-width: 1180px) {
    .contact-note-workspace {
        flex-direction: column;
        height: auto;
        min-height: 0;
    }

    .contact-note-left-panel {
        flex: 1 1 auto;
        min-width: 0;
        padding-right: 12px;
    }

    .contact-note-right-panel {
        display: none;
    }

    .contact-note-workspace.detail-view,
    .contact-note-workspace.expanded-detail-active {
        min-height: calc(100vh - 314px);
    }

    .contact-note-workspace.detail-view .contact-note-left-panel,
    .contact-note-workspace.expanded-detail-active .contact-note-left-panel {
        display: none;
    }

    .contact-note-workspace.detail-view .contact-note-right-panel,
    .contact-note-workspace.expanded-detail-active .contact-note-right-panel {
        display: flex;
        flex-direction: column;
        flex: 1 1 auto;
        min-width: 0;
        padding-left: 12px;
    }

    .contact-note-back-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 28px;
        height: 28px;
        background: transparent;
        border: 1px solid #e2e8f0;
        border-radius: 50%;
        color: #64748b;
        cursor: pointer;
        padding: 0;
        margin-right: 8px;
        transition: all 0.15s ease;
    }

    .contact-note-back-btn:hover {
        background: #f1f5f9;
        border-color: #cbd5e1;
        color: #334155;
    }

    .contact-note-btn {
        min-width: 88px;
        font-size: 13px;
        padding: 7px 12px;
    }

    .contact-note-subject {
        font-size: 16px;
        padding: 0;
    }

    .contact-note-action-bar {
        flex-wrap: wrap;
    }
}

@media (max-width: 520px) {
    .contact-note-filter-btn {
        min-width: 43px;
        padding: 0 12px;
    }

    .contact-note-filter-btn-label {
        display: none;
    }

    .contact-note-filter-presets {
        width: 116px;
        flex-basis: 116px;
    }
}


/* ── Filter Results Bulk Action Bar ─────────────────────── */
/* Filter results inline bulk toolbar (mirrors task-tb-bulk-toolbar) */
.filter-tb-bulk-toolbar {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #E5E5E5;
	padding: 4px 10px;
	border-radius: 6px;
	flex-shrink: 0;
}
.filter-tb-bulk-count {
	font-size: 13px;
	font-weight: 500;
	color: #333;
	white-space: nowrap;
}
.filter-tb-bulk-actions {
	display: flex;
	gap: 4px;
}
.filter-tb-bulk-btn {
	width: 24px;
	height: 24px;
	border: none;
	background: transparent;
	color: #555;
	cursor: pointer;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	padding: 0;
	transition: background 0.15s, color 0.15s;
}
.filter-tb-bulk-btn:hover:not(:disabled) {
	background: rgba(0,0,0,0.08);
	color: #333;
}
.filter-tb-bulk-btn.filter-tb-bulk-danger:hover:not(:disabled) {
	background: #ffebee;
	color: #d32f2f;
}
.filter-tb-bulk-btn.filter-tb-bulk-disabled {
	opacity: 0.25;
	cursor: not-allowed;
}
.filter-tb-bulk-btn.filter-tb-bulk-clear:hover {
	background: rgba(0,0,0,0.08);
	color: #333;
}

/*
   Relationship Map
*/

.record-content-host {
	display: flex;
	flex-direction: column;
	gap: 18px;
	min-height: 100%;
}

.relationship-map-host {
	display: none;
	height: 100%;
	min-height: 0;
}

.record-shell-account.relationship-map-open .contact_left {
	display: none;
}

.record-shell-account.relationship-map-open .ct-hd-form-host {
	display: none;
}

.record-shell-account.relationship-map-open .contact_right {
	padding: 0;
	overflow: hidden;
}

.record-shell-account.relationship-map-open .record-content-host {
	display: none;
}

.record-shell-account.relationship-map-open .relationship-map-host {
	display: block;
}

.relationship-map-panel {
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 0;
	background: #f5f5f5;
	background-image: radial-gradient(circle, #ddd 1px, transparent 1px);
	background-size: 20px 20px;
	overflow: hidden;
}

.relationship-map-metadata {
	display: none;
}

.relationship-map-floating-title {
	position: absolute;
	left: 16px;
	top: 14px;
	z-index: 5;
	display: flex;
	flex-direction: column;
	padding: 0;
	max-width: min(320px, calc(100% - 32px));
	background: transparent;
	pointer-events: none;
}

.relationship-map-floating-title-heading {
	font-size: 21px;
	font-weight: 700;
	color: #13263b;
	letter-spacing: -0.03em;
	line-height: 1.18;
}

.relationship-map-summary-chip {
	display: inline-flex;
	align-items: center;
	padding: 6px 10px;
	border-radius: 999px;
	background: rgba(20, 44, 66, 0.08);
	color: #314457;
	font-size: 12px;
	font-weight: 600;
}

.relationship-map-body {
	display: flex;
	flex: 1;
	min-height: 0;
	background: #f5f5f5;
	background-image: radial-gradient(circle, #ddd 1px, transparent 1px);
	background-size: 20px 20px;
}

.relationship-map-stage {
	position: relative;
	flex: 1;
	min-width: 0;
	min-height: 0;
}

.relationship-map-stage-canvas {
	position: absolute;
	inset: 0;
}

.relationship-map-status {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	padding: 12px 18px;
	border-radius: 14px;
	background: rgba(19, 38, 59, 0.92);
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	z-index: 4;
	box-shadow: 0 16px 40px rgba(15, 30, 48, 0.2);
}

.relationship-map-inspector-wrapper {
	width: 376px;
	min-width: 376px;
	flex-shrink: 0;
	min-height: 0;
	background: #f5f5f5;
	background-image: radial-gradient(circle, #ddd 1px, transparent 1px);
	background-size: 20px 20px;
	padding: 16px;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
}

.relationship-map-inspector {
	flex: 1;
	min-height: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 14px;
	overflow: visible;
	box-sizing: border-box;
}

.relationship-map-inspector-section {
	display: flex;
	flex-direction: column;
	gap: 12px;
	background: #fff;
	border: 1px solid rgba(16, 38, 60, 0.06);
	border-radius: 16px;
	box-shadow: 0 10px 28px rgba(18, 39, 61, 0.08), 0 2px 8px rgba(18, 39, 61, 0.06);
	padding: 18px;
	box-sizing: border-box;
}

.relationship-map-inspector-section:last-child {
	flex: 1;
	min-height: 0;
	overflow: hidden;
}

.relationship-map-inspector-title {
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #6c7783;
}

.relationship-map-category-list {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.relationship-map-category-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	padding: 9px 10px 9px 12px;
	border-radius: 12px;
	border: 1px solid rgba(26, 49, 74, 0.1);
	background: #f8fafc;
	color: #314457;
	cursor: pointer;
	transition: background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.relationship-map-category-toggle:hover {
	background: #f2f6fa;
	border-color: rgba(26, 49, 74, 0.16);
}

.relationship-map-category-toggle.is-enabled {
	border-color: rgba(0, 82, 155, 0.22);
	background: #f3f8fe;
}

.relationship-map-category-copy {
	display: inline-flex;
	align-items: center;
	min-width: 0;
	gap: 8px;
}

.relationship-map-category-name {
	font-size: 13px;
	font-weight: 600;
	text-align: left;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.relationship-map-category-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 24px;
	height: 24px;
	border-radius: 999px;
	background: rgba(24, 50, 77, 0.1);
	font-size: 12px;
	font-weight: 700;
}

.relationship-map-category-switch {
	position: relative;
	display: inline-flex;
	width: 34px;
	height: 20px;
	flex: 0 0 auto;
	border-radius: 999px;
	background: #c7d0dc;
	transition: background 0.16s ease;
}

.relationship-map-category-switch::after {
	content: '';
	position: absolute;
	top: 3px;
	left: 3px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 3px rgba(20, 35, 50, 0.24);
	transition: transform 0.16s ease;
}

.relationship-map-category-toggle.is-enabled .relationship-map-category-switch {
	background: #00529b;
}

.relationship-map-category-toggle.is-enabled .relationship-map-category-switch::after {
	transform: translateX(14px);
}

.relationship-map-filter-empty,
.relationship-map-details-empty {
	font-size: 13px;
	line-height: 1.6;
	color: #66737f;
}

.relationship-map-details {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	gap: 12px;
	min-height: 0;
	overflow-y: auto;
	padding-right: 2px;
}

.relationship-map-detail-heading {
	font-size: 20px;
	font-weight: 700;
	color: #14283d;
	line-height: 1.2;
}

.relationship-map-detail-subheading {
	font-size: 13px;
	font-weight: 600;
	color: #64717d;
}

.relationship-map-detail-stats {
	font-size: 13px;
	line-height: 1.6;
	color: #52616e;
}

.relationship-map-detail-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.relationship-map-detail-btn {
	border: 1px solid rgba(21, 40, 61, 0.12);
	background: #fff;
	color: #24384b;
	border-radius: 12px;
	padding: 10px 12px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
}

.relationship-map-detail-btn.is-primary {
	background: linear-gradient(135deg, #173a57 0%, #244f73 100%);
	border-color: transparent;
	color: #fff;
}

.relationship-map-provenance-card {
	padding: 12px 14px;
	border-radius: 14px;
	background: rgba(245, 248, 252, 0.9);
	border: 1px solid rgba(26, 49, 74, 0.08);
}

.relationship-map-provenance-heading {
	font-size: 13px;
	font-weight: 700;
	color: #203446;
	line-height: 1.5;
}

.relationship-map-provenance-meta {
	margin-top: 4px;
	font-size: 12px;
	color: #66737f;
}

.relationship-map-related-card {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 12px 14px;
	border-radius: 12px;
	background: #f8fafc;
	border: 1px solid rgba(26, 49, 74, 0.08);
}

.relationship-map-related-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
}

.relationship-map-related-name {
	min-width: 0;
	color: #203446;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.35;
}

.relationship-map-related-type {
	flex: 0 0 auto;
	color: #66737f;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	text-transform: uppercase;
}

.relationship-map-related-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.relationship-map-related-chip {
	display: inline-flex;
	align-items: center;
	min-height: 22px;
	border-radius: 999px;
	background: #eef4fb;
	border: 1px solid #d8e5f2;
	color: #23415f;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	padding: 3px 8px;
}

.relationship-map-canvas-container {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	cursor: grab;
	touch-action: none;
	background: #f5f5f5;
	background-image: radial-gradient(circle, #ddd 1px, transparent 1px);
	background-size: 20px 20px;
}

.relationship-map-canvas-container:active {
	cursor: grabbing;
}

.relationship-map-canvas {
	position: absolute;
	left: 0;
	top: 0;
	transform-origin: 0 0;
}

.relationship-map-edges,
.relationship-map-nodes {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.relationship-map-edge-line {
	stroke: rgba(49, 70, 93, 0.34);
	opacity: 0.25;
	stroke-width: 2.5px;
	stroke-linecap: round;
}

.relationship-map-edge-group.is-connected-to-hovered-node .relationship-map-edge-line {
	opacity: 0.62;
}

.relationship-map-edge-group.is-selected .relationship-map-edge-line {
	stroke: #123e63;
	opacity: 1;
	stroke-width: 4px;
}

.relationship-map-edge-group.is-connected-to-selected-node .relationship-map-edge-line {
	stroke: #7BA7D9;
	opacity: 0.85;
}

.relationship-map-edge-hit {
	stroke: transparent;
	stroke-width: 18px;
	cursor: pointer;
}

.relationship-map-node-card {
	position: absolute;
	width: 240px;
	min-height: 136px;
	transform: translate(-50%, -50%);
	padding: 14px;
	border-radius: 22px;
	background: #fff;
	border: 1px solid rgba(17, 38, 60, 0.08);
	box-shadow: 0 14px 34px rgba(25, 45, 67, 0.1);
	cursor: pointer;
	touch-action: none;
	transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.relationship-map-node-card:hover {
	transform: translate(-50%, -50%) translateY(-2px);
	box-shadow: 0 20px 40px rgba(23, 42, 62, 0.12);
}

.relationship-map-node-card.is-selected {
	border-color: rgba(17, 38, 60, 0.1);
	background: linear-gradient(180deg, #f4f9fe 0%, #fff 42%);
	box-shadow: 0 0 0 4px rgba(31, 111, 208, 0.14), 0 26px 50px rgba(16, 59, 95, 0.18);
}

.relationship-map-node-card.is-selected .relationship-map-node-badge {
	background: rgba(17, 76, 121, 0.14);
	color: #0f4b78;
}

.relationship-map-node-card.is-selected .relationship-map-node-avatar {
	box-shadow: 0 0 0 3px rgba(17, 76, 121, 0.16);
}

.relationship-map-node-card.is-selected .relationship-map-node-title {
	color: #123a5c;
}

.relationship-map-node-card.is-selected .relationship-map-node-meta {
	color: #355066;
}

.relationship-map-node-card.is-root.is-selected,
.relationship-map-node-card.is-household.is-selected {
	border-color: rgba(255, 255, 255, 0.18);
	box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.26), 0 30px 58px rgba(10, 36, 58, 0.3);
}

.relationship-map-node-card.is-root.is-selected .relationship-map-node-badge,
.relationship-map-node-card.is-household.is-selected .relationship-map-node-badge {
	background: rgba(255, 255, 255, 0.24);
	color: rgba(255, 255, 255, 0.96);
}

.relationship-map-node-card.is-dragging,
.relationship-map-node-card.is-dragging:hover {
	cursor: grabbing;
	transition: none;
	transform: translate(-50%, -50%);
	box-shadow: 0 26px 54px rgba(18, 62, 99, 0.18);
}

.relationship-map-node-card.is-root,
.relationship-map-node-card.is-household {
	background: linear-gradient(135deg, #123e63 0%, #255882 100%);
	color: #fff;
	min-height: 0;
}

.relationship-map-node-badge {
	display: inline-flex;
	align-items: center;
	padding: 5px 10px;
	border-radius: 999px;
	background: rgba(20, 44, 66, 0.08);
	color: #425567;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.07em;
}

.relationship-map-node-card.is-root .relationship-map-node-badge,
.relationship-map-node-card.is-household .relationship-map-node-badge {
	background: rgba(255, 255, 255, 0.16);
	color: rgba(255, 255, 255, 0.9);
}

.relationship-map-node-title-row {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 12px;
}

.relationship-map-node-avatar {
	width: 42px;
	height: 42px;
	border-radius: 16px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	flex-shrink: 0;
}

.relationship-map-node-title-wrap {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.relationship-map-node-title {
	font-size: 18px;
	font-weight: 700;
	color: #182b3f;
	line-height: 1.2;
	word-break: break-word;
}

.relationship-map-node-card.is-root .relationship-map-node-title,
.relationship-map-node-card.is-root .relationship-map-node-meta,
.relationship-map-node-card.is-household .relationship-map-node-title,
.relationship-map-node-card.is-household .relationship-map-node-meta {
	color: #fff;
}

.relationship-map-node-meta {
	font-size: 12px;
	font-weight: 600;
	color: #6b7884;
}

.relationship-map-node-footer {
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	gap: 10px;
	margin-top: 14px;
}

.relationship-map-node-actions {
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
	gap: 8px;
	min-width: 0;
}

.relationship-map-node-action {
	border: none;
	border-radius: 12px;
	padding: 8px 10px;
	background: rgba(17, 38, 60, 0.08);
	color: #213447;
	font-size: 12px;
	font-weight: 700;
	white-space: nowrap;
	cursor: pointer;
}

.relationship-map-node-card.is-root .relationship-map-node-action,
.relationship-map-node-card.is-household .relationship-map-node-action {
	background: rgba(255, 255, 255, 0.16);
	color: #fff;
}

.relationship-map-node-action.is-open {
	background: #173a57;
	color: #fff;
}

.relationship-map-node-card.is-household .relationship-map-node-action.is-open {
	background: rgba(255, 255, 255, 0.18);
	color: #fff;
}

.relationship-map-zoom-controls {
	position: absolute;
	right: 16px;
	bottom: 32px;
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 6px;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	z-index: 10;
}

.relationship-map-zoom-controls button {
	border: none;
	width: 32px;
	height: 32px;
	padding: 0;
	border-radius: 4px;
	background: transparent;
	color: #666;
	font-size: 16px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.15s, color 0.15s;
}

.relationship-map-zoom-controls button:hover {
	background: #f0f0f0;
	color: #333;
}

.relationship-map-zoom-controls .zoom-divider {
	height: 1px;
	background: #e0e0e0;
	margin: 4px 0;
}
.account-relationships-workspace {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.account-relationships-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 4px;
}

.account-relationships-filter-chip {
    border: 1px solid #d7dde8;
    background: #f7f9fc;
    color: #3c4a63;
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.account-relationships-filter-chip.is-active {
    background: #1f6fd0;
    border-color: #1f6fd0;
    color: #ffffff;
}

.account-relationships-status,
.account-relationships-empty {
    padding: 14px 16px;
    border: 1px dashed #d7dde8;
    border-radius: 10px;
    background: #fafcff;
    color: #5b6b85;
    font-size: 13px;
}

.account-relationships-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.account-relationships-group-heading {
    font-size: 14px;
    font-weight: 700;
    color: #24324a;
}

.account-relationships-table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #e2e8f2;
    border-radius: 12px;
    overflow: hidden;
    background: #ffffff;
}

.account-relationships-table th,
.account-relationships-table td {
    padding: 12px 14px;
    border-bottom: 1px solid #edf1f7;
    vertical-align: top;
    text-align: left;
    font-size: 13px;
}

.account-relationships-table th {
    background: #f7f9fc;
    color: #51617c;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.account-relationships-table tr:last-child td {
    border-bottom: none;
}

.account-relationships-identity {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.account-relationships-name {
    color: #1f2d44;
    font-weight: 700;
}

.account-relationships-meta {
    color: #6f7f97;
    font-size: 12px;
}

.account-relationships-inline-badge {
    display: inline-flex;
    align-self: flex-start;
    border-radius: 999px;
    padding: 3px 9px;
    font-size: 11px;
    font-weight: 700;
}

.account-relationships-inline-badge.needs-role {
    background: #fff2d9;
    color: #8a5a00;
}

.account-relationships-status-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 700;
}

.account-relationships-status-badge.is-active {
    background: #eaf8ef;
    color: #207245;
}

.account-relationships-status-badge.is-inactive {
    background: #f3f4f7;
    color: #69788f;
}

.account-relationships-cell-role,
.account-relationships-cell-source,
.account-relationships-cell-summary {
    color: #43526a;
}

.account-relationships-cell-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.account-relationships-action {
    border: 1px solid #d5dcea;
    border-radius: 8px;
    background: #ffffff;
    color: #2f4668;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 10px;
    cursor: pointer;
}

.account-relationships-action:hover {
    border-color: #1f6fd0;
    color: #1f6fd0;
}

.account-relationships-dialog {
    padding: 8px 6px 0;
}

.account-relationships-editor-shell {
    overflow: visible;
}

.account-relationships-editor-shell .ui-dialog-content {
    overflow: visible;
}

.account-relationships-dialog-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.account-relationships-dialog-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.account-relationships-dialog-field > label {
    font-size: 12px;
    font-weight: 700;
    color: #42516a;
}

.account-relationships-dialog-static,
.account-relationships-text-input,
.account-relationships-role-select {
    border: 1px solid #d5dcea;
    border-radius: 8px;
    background: #ffffff;
    color: #25354e;
    font-size: 13px;
    min-height: 38px;
    padding: 8px 10px;
    box-sizing: border-box;
}

.account-relationships-text-input {
    width: 100%;
}

.account-relationships-dialog-copy {
    color: #4f5f78;
    font-size: 13px;
    margin-bottom: 10px;
}

.account-relationships-source-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.account-relationships-source-item {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #25354e;
    font-size: 13px;
}

.contact-relationships-flow-card.is-auto-link {
    width: min(500px, calc(100% - 40px));
    padding: 18px 20px 20px;
    gap: 14px;
    background: #ffffff;
    border: 1px solid rgba(160, 181, 209, 0.75);
    box-shadow: 0 24px 60px rgba(32, 52, 77, 0.22), 0 2px 8px rgba(32, 52, 77, 0.08);
}

.contact-relationships-flow-card.is-auto-link .contact-relationships-flow-title {
    color: #25354e;
    font-size: 15px;
}

.contact-relationships-flow-card.is-auto-link .contact-relationships-flow-form {
    gap: 10px;
}

.contact-relationships-flow-card.is-auto-link .contact-relationships-flow-copy {
    margin-bottom: 0;
}

.contact-relationships-flow-card.is-auto-link > .contact-relationships-flow-form > .contact-relationships-flow-copy:first-child {
    color: #51627a;
    font-size: 13px;
    line-height: 19px;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-list {
    gap: 8px;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-section {
    display: flex;
    flex-wrap: wrap;
    gap: 3px 4px;
    margin-top: 6px;
    padding-top: 2px;
    color: #5d6e86;
    font-size: 12px;
    line-height: 17px;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-section strong {
    color: #25354e;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-item {
    gap: 10px;
    width: 100%;
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid #e4ebf5;
    border-radius: 8px;
    background: #ffffff;
    color: #25354e;
    cursor: pointer;
    box-sizing: border-box;
    transition: border-color 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-item:hover {
    border-color: #b8cce5;
    background: #fbfdff;
    box-shadow: 0 5px 14px rgba(18, 54, 84, 0.08);
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-item-with-controls {
    align-items: stretch;
    flex-direction: column;
    cursor: default;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-toggle-label {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    cursor: pointer;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-toggle-input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-toggle {
    position: relative;
    width: 34px;
    height: 20px;
    flex: 0 0 34px;
    border-radius: 999px;
    background: #d9e2ef;
    box-shadow: inset 0 0 0 1px rgba(62, 82, 112, 0.18);
    transition: background-color 0.16s ease, box-shadow 0.16s ease;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-toggle::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 1px 4px rgba(24, 42, 62, 0.2);
    transition: transform 0.16s ease;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-toggle-input:checked + .account-relationships-source-toggle {
    background: #0b66b2;
    box-shadow: inset 0 0 0 1px rgba(11, 102, 178, 0.2);
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-toggle-input:checked + .account-relationships-source-toggle::after {
    transform: translateX(14px);
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-toggle-input:focus-visible + .account-relationships-source-toggle {
    box-shadow: 0 0 0 3px rgba(11, 102, 178, 0.18), inset 0 0 0 1px rgba(11, 102, 178, 0.2);
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-label {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1 1 auto;
    color: #25354e;
    font-size: 13px;
    line-height: 18px;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-primary {
    color: #25354e;
    font-weight: 500;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-detail {
    color: #6d7d92;
    font-size: 12px;
    line-height: 16px;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-selects {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding-left: 44px;
}

.contact-relationships-flow-card.is-auto-link .account-relationships-source-selects .entity-list-quick-filter-editor-input {
    min-width: 0;
    width: 100%;
}

.contact-relationships-workspace,
.contact_right .addon_section > .contact-relationships-workspace,
.contact_right .form-container-v3 .addon_section > .contact-relationships-workspace,
.contact_right .addon_section > .account-relationships-workspace,
.contact_right .form-container-v3 .addon_section > .account-relationships-workspace,
.account-relationships-workspace {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 16px;
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	height: auto;
	min-height: 0;
	max-height: var(--contact-record-workspace-height);
	overflow: hidden;
	border-radius: 16px;
	background: #f3f3f3;
	font-family: 'Manrope', sans-serif;
}

.contact-relationships-workspace,
.account-relationships-workspace {
	--contact-relationships-row-gap: 5px;
}

/* The add-relationship flow and the account-type lock are laid over the panel, so the panel takes
   its full working height while either is up, however short the tab behind it is
   (#1609 CON-228 / #1610 ACC-219). */
.contact-relationships-workspace.is-add-flow-open,
.contact-relationships-workspace.is-account-type-locked,
.account-relationships-workspace.is-add-flow-open,
.account-relationships-workspace.is-account-type-locked,
.contact_right .addon_section > .contact-relationships-workspace.is-add-flow-open,
.contact_right .addon_section > .contact-relationships-workspace.is-account-type-locked,
.contact_right .addon_section > .account-relationships-workspace.is-add-flow-open,
.contact_right .addon_section > .account-relationships-workspace.is-account-type-locked,
.contact_right .form-container-v3 .addon_section > .contact-relationships-workspace.is-add-flow-open,
.contact_right .form-container-v3 .addon_section > .contact-relationships-workspace.is-account-type-locked,
.contact_right .form-container-v3 .addon_section > .account-relationships-workspace.is-add-flow-open,
.contact_right .form-container-v3 .addon_section > .account-relationships-workspace.is-account-type-locked {
	height: var(--contact-record-workspace-height);
}

.account-relationships-workspace.is-account-type-locked .contact-relationships-toolbar,
.account-relationships-workspace.is-account-type-locked > .contact-relationships-content {
	filter: blur(3px);
	opacity: 0.42;
	pointer-events: none;
	user-select: none;
}

.account-relationships-lock-overlay {
	position: absolute;
	inset: 0;
	z-index: 6;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	box-sizing: border-box;
	background: rgba(243, 243, 243, 0.46);
	pointer-events: auto;
}

.account-relationships-lock-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
	width: min(520px, 100%);
	padding: 28px 32px;
	box-sizing: border-box;
	border: 1px solid rgba(21, 42, 61, 0.12);
	border-radius: 14px;
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 18px 45px rgba(21, 42, 61, 0.12);
	text-align: center;
}

.account-relationships-lock-message {
	max-width: 440px;
	color: #152A3D;
	font-family: 'Manrope', sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.45;
}

.account-relationships-lock-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
}

.account-relationships-lock-action {
	min-height: 38px;
	border: 1px solid #9DB5D7;
	border-radius: 8px;
	background: #FFFFFF;
	color: #1D5FAE;
	padding: 8px 14px;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 700;
	line-height: 18px;
	cursor: pointer;
	transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, transform 0.16s ease;
}

.account-relationships-lock-action:hover {
	border-color: #1D5FAE;
	background: #EEF6FF;
	transform: translateY(-1px);
}

.account-relationships-lock-action:focus-visible {
	outline: 2px solid #3B82F6;
	outline-offset: 2px;
}

.account-relationships-lock-action:disabled {
	opacity: 0.45;
	cursor: default;
	transform: none;
}

.contact-relationships-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.contact-relationships-tabs {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 5px;
	border-radius: 10px;
	background: #e4e4e4;
}

.contact-relationships-tab {
	border: none;
	border-radius: 6px;
	background: transparent;
	color: #8b8b8b;
	padding: 5px 8px;
	min-height: 29px;
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	font-weight: 500;
	line-height: 19px;
	cursor: pointer;
	transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.contact-relationships-tab:hover {
	color: #4b5563;
}

.contact-relationships-tab.is-active {
	background: #ffffff;
	color: #111827;
	box-shadow: 0 1px 2px rgba(17, 24, 39, 0.06);
}

.contact-relationships-add-button {
	width: 44px;
	height: 44px;
	border: none;
	border-radius: 999px;
	background: #3b82f6 url('/images/plus-icon.svg') center / 24px 24px no-repeat;
	color: transparent;
	font-size: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: 0 10px 20px rgba(59, 130, 246, 0.18);
	transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}

.contact-relationships-add-button:hover {
	background-color: #2563eb;
	transform: translateY(-1px);
	box-shadow: 0 12px 24px rgba(59, 130, 246, 0.24);
}

.contact-relationships-add-button:focus-visible,
.contact-relationships-tab:focus-visible,
.contact-relationships-referral-subtab:focus-visible,
.contact-relationships-actions-button:focus-visible,
.contact-relationships-status-button:focus-visible,
.contact-relationships-row:focus-visible {
	outline: 2px solid #3b82f6;
	outline-offset: 2px;
}

.contact-relationships-status,
.contact-relationships-empty {
	flex: 1 1 auto;
	width: 100%;
	min-height: 0;
	padding: 16px;
	box-sizing: border-box;
	border: 1px dashed #d7dde8;
	border-radius: 12px;
	background: transparent;
	color: #5b6b85;
	font-size: 13px;
	line-height: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.contact-relationships-content,
.contact-relationships-table {
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.contact-relationships-content {
	flex: 1 1 auto;
	min-width: 0;
	width: 100%;
}

.contact-relationships-referral-groups {
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: 100%;
	min-width: 0;
}

.contact-relationships-referral-layout {
	display: flex;
	flex-direction: column;
	gap: 12px;
	width: 100%;
	min-width: 0;
}

.contact-relationships-referral-subtabs {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

.contact-relationships-referral-subtab {
	padding: 7px 14px;
	border: 1px solid rgba(17, 24, 39, 0.12);
	border-radius: 999px;
	background: transparent;
	color: #5b6b85;
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	font-weight: 500;
	line-height: 19px;
	cursor: pointer;
	transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.contact-relationships-referral-subtab:hover {
	color: #334155;
	background: transparent;
	border-color: rgba(17, 24, 39, 0.18);
}

.contact-relationships-referral-subtab.is-active {
	border-color: transparent;
	background: #ffffff;
	color: #111827;
	box-shadow: 0 1px 2px rgba(17, 24, 39, 0.08);
}

.contact-relationships-referral-group {
	display: flex;
	flex-direction: column;
	gap: 10px;
	min-width: 0;
}

.contact-relationships-referral-group-title {
	color: #111827;
	font-size: 13px;
	font-weight: 700;
	line-height: 18px;
}

.contact-relationships-table-shell {
	display: flex;
	width: 100%;
	flex: 1 1 auto;
	min-width: 0;
	min-height: 0;
	overflow-x: auto;
	overflow-y: hidden;
}

.contact-relationships-table {
	flex: 1 1 auto;
	gap: 5px;
}

.contact-relationships-header,
.contact-relationships-row {
	display: grid;
	grid-template-columns: minmax(320px, 1fr) 110px 72px;
	gap: 16px;
	min-width: 540px;
}

.contact-relationships-table.is-referral-two-column .contact-relationships-header,
.contact-relationships-row.is-two-column {
	grid-template-columns: minmax(320px, 1fr) 72px;
	min-width: 420px;
}

.contact-relationships-header {
	align-items: end;
	padding: 0 12px;
}

.contact-relationships-header-cell {
	color: #999999;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.05em;
	line-height: 14px;
	text-transform: uppercase;
}

.contact-relationships-header-cell:nth-child(2),
.contact-relationships-header-cell:nth-child(3) {
	text-align: center;
}

.contact-relationships-row {
	align-items: center;
	box-sizing: border-box;
	min-height: 70px;
	padding: 12px;
	border: 1px solid #eaeaea;
	border-radius: 12px;
	background: #ffffff;
	box-shadow: 0 1px 2px rgba(17, 24, 39, 0.04);
	cursor: pointer;
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.contact-relationships-row:hover {
	transform: translateY(-1px);
	border-color: #d8dde6;
	box-shadow: 0 6px 20px rgba(17, 24, 39, 0.06);
}

.contact-relationships-cell {
	min-width: 0;
}

.contact-relationships-rows {
	display: flex;
	flex-direction: column;
	gap: var(--contact-relationships-row-gap);
	flex: 1 1 auto;
	min-height: 0;
	max-height: none;
	overflow-y: auto;
	overflow-x: hidden;
	padding-right: 0;
}

.contact-relationships-relationship-cell {
	display: flex;
	align-items: center;
	gap: 12px;
}

.contact-relationships-avatar {
	width: 36px;
	height: 36px;
	min-width: 36px;
	border-radius: 999px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	overflow: hidden;
	background: linear-gradient(135deg, #dfe8ff 0%, #bdd2ff 100%);
	color: #35507a;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.4px;
}

.contact-relationships-avatar.is-contact-fallback {
	color: #ffffff;
}

.contact-relationships-avatar-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.contact-relationships-identity {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 1px;
}

.contact-relationships-name,
.contact-relationships-secondary {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.contact-relationships-name {
	color: #1f2937;
	font-size: 14px;
	font-weight: 600;
	line-height: 18px;
}

.contact-relationships-secondary {
	color: #6b7280;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
}

.contact-relationships-secondary-inline-row {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
	flex-wrap: nowrap;
}

.contact-relationships-role-chip-list {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 6px;
}

.contact-relationships-role-chip {
	display: inline-flex;
	align-items: center;
	padding: 3px 8px;
	border-radius: 999px;
	background: var(--relationship-role-chip-bg, #eef3f8);
	box-shadow: inset 0 0 0 1px var(--relationship-role-chip-border, rgba(81, 97, 115, 0.16));
	color: var(--relationship-role-chip-text, #516173);
	font-size: 11px;
	font-weight: 600;
	line-height: 14px;
}

.contact-relationships-role-chip.is-conflict {
	background: #fde7dd;
	box-shadow: inset 0 0 0 1px rgba(155, 61, 32, 0.18);
	color: #9b3d20;
}

.contact-relationships-referral-empty {
	padding: 18px 16px;
	border: 1px dashed #d7dde8;
	border-radius: 12px;
	background: #fbfcfe;
	color: #5b6b85;
	font-size: 13px;
	line-height: 18px;
}

button.contact-relationships-role-pill {
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	justify-content: center;
	margin-top: 4px;
	padding: 4px 10px;
	border: none;
	border-radius: 999px;
	background: #fff2d9;
	color: #8a5a00;
	font-family: inherit !important;
	font-size: 11px !important;
	font-style: normal !important;
	font-weight: 400 !important;
	line-height: 14px !important;
	cursor: pointer;
	transition: background-color 0.18s ease, box-shadow 0.18s ease;
}

button.contact-relationships-role-pill.is-inline-row {
	align-self: auto;
	margin-top: 0;
	flex-shrink: 0;
}

button.contact-relationships-role-pill:hover {
	background: #ffe8bf;
}

button.contact-relationships-role-pill:focus-visible {
	outline: 2px solid #3b82f6;
	outline-offset: 2px;
}

.contact-relationships-status-cell {
	display: flex;
	align-items: center;
	justify-content: center;
}

.contact-relationships-status-button {
	padding: 0;
	border: none;
	background: transparent;
	font: inherit;
	cursor: pointer;
}

.contact-relationships-status-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 5px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	line-height: 14px;
}

.contact-relationships-status-badge.is-active {
	background: #e8f7ef;
	color: #22824b;
}

.contact-relationships-status-badge.is-inactive {
	background: #f2f4f7;
	color: #6b7280;
}

/* A suggested link — the product noticed it, nobody has recorded what the relationship is.
   It used to carry the same green "Active" badge as a saved relationship (#1610 ACC-217). */
.contact-relationships-status-badge.is-suggested {
	background: #fff7ed;
	color: #9a3412;
	border: 1px dashed #fdba74;
}

.contact-relationships-row.is-unroled-suggestion {
	background: #fffdf8;
	border-left: 3px solid #fdba74;
}

.contact-relationships-status-badge.is-pending {
	background: #fff2d8;
	color: #946200;
}

.contact-relationships-status-badge.is-converted {
	background: #e4f5ea;
	color: #227148;
}

.contact-relationships-status-badge.is-lost {
	background: #f9e3e7;
	color: #995167;
}

.contact-relationships-actions-cell {
	display: flex;
	align-items: center;
	justify-content: center;
}

.contact-relationships-actions-cell.is-empty {
	justify-content: flex-end;
}

.contact-relationships-actions-button {
	width: 24px;
	height: 24px;
	border: none;
	border-radius: 6px;
	background: transparent;
	color: #9ca3af;
	font-size: 18px;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background-color 0.18s ease, color 0.18s ease;
}

.contact-relationships-actions-button:hover {
	background: #f3f4f6;
	color: #4b5563;
}

.contact-relationships-flow-overlay {
	position: absolute;
	inset: 0;
	z-index: 6;
	overflow: auto;
	pointer-events: auto;
}

.contact-relationships-flow-scrim {
	position: absolute;
	inset: 0;
	background: rgba(255, 255, 255, 0.48);
	backdrop-filter: blur(2px);
	pointer-events: auto;
}

.contact-relationships-flow-stage {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 100%;
	height: auto;
	padding: 16px;
	box-sizing: border-box;
	pointer-events: none;
}

.contact-relationships-flow-card {
	width: 265px;
	max-width: calc(100% - 32px);
	min-height: 0;
	pointer-events: auto;
	flex-shrink: 0;
	overflow-x: hidden;
	overflow-y: hidden;
}

.contact-relationships-flow-card.is-chooser {
	width: min(960px, calc(100% - 16px));
	max-width: calc(100% - 16px);
	padding: 15px 20px 20px;
	border-radius: 12px;
	gap: 8px;
	overflow-y: auto;
}

.contact-relationships-flow-card.is-dialog {
	width: min(456px, calc(100% - 40px));
	max-width: calc(100% - 40px);
	padding: 18px 20px 20px;
	border-radius: 12px;
	gap: 12px;
}

.contact-relationships-flow-card.is-stacked {
	width: min(340px, calc(100% - 0px));
}

.contact-relationships-flow-header {
	display: grid;
	grid-template-columns: 24px minmax(0, 1fr) 24px;
	align-items: center;
	gap: 8px;
}

.contact-relationships-flow-header.is-left-aligned {
	display: flex;
	grid-template-columns: none;
}

.contact-relationships-flow-header-spacer {
	width: 100%;
	height: 24px;
}

.contact-relationships-flow-header-button {
	width: 24px;
	height: 24px;
	padding: 0;
	border: none;
	border-radius: 7px;
	background: transparent;
	color: rgba(0, 0, 0, 0.45);
	cursor: pointer;
}

.contact-relationships-flow-header-button:hover {
	background: rgba(0, 0, 0, 0.05);
	color: rgba(0, 0, 0, 0.65);
}

.contact-relationships-flow-header-button::before {
	content: '';
	display: block;
	width: 16px;
	height: 16px;
	margin: 0 auto;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.contact-relationships-flow-header-button.is-back {
	position: relative;
	left: -4px;
}

.contact-relationships-flow-header-button.is-back::before {
	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 18L9 12L15 6' stroke='%236C7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.contact-relationships-flow-header-button.is-close {
	position: relative;
	right: -4px;
}

.contact-relationships-flow-header-button.is-close::before {
	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 6L6 18M6 6L18 18' stroke='%236C7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.contact-relationships-flow-title {
	color: #6b7280;
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 16px;
	text-align: center;
	white-space: nowrap;
}

.contact-relationships-flow-title.is-left-aligned {
	flex: 1 1 auto;
	text-align: left;
}

.contact-relationships-flow-chooser {
	display: grid;
	grid-template-columns: repeat(var(--contact-relationships-kind-count, 3), minmax(0, 1fr));
	gap: 17px;
}

.contact-relationships-flow-card.is-stacked .contact-relationships-flow-chooser {
	grid-template-columns: minmax(0, 1fr);
}

.contact-relationships-flow-kind-button {
	height: 160px;
	min-height: 160px;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
	gap: 3px;
	padding: 10px;
	border-radius: 6px;
	background: #f3f3f3;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.contact-relationships-flow-kind-button:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.contact-relationships-flow-kind-button:active {
	transform: translateY(0) scale(0.98);
	box-shadow: none;
	transition-duration: 0.06s;
}

.contact-relationships-flow-card.is-stacked .contact-relationships-flow-kind-button {
	height: 124px;
	min-height: 124px;
}

.contact-relationships-flow-kind-heading {
	display: flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
}

.contact-relationships-flow-kind-icon {
	width: 14px;
	height: 14px;
	display: block;
	flex-shrink: 0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.contact-relationships-flow-kind-icon.is-person {
	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cdefs%3E%3CclipPath id='personIconClip'%3E%3Crect width='23.906' height='23.918' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23personIconClip)'%3E%3Cpath d='M11.953 23.906C18.492 23.906 23.906 18.48 23.906 11.953C23.906 5.414 18.48 0 11.941 0C5.414 0 0 5.414 0 11.953C0 18.48 5.426 23.906 11.953 23.906ZM11.953 21.914C6.422 21.914 2.004 17.484 2.004 11.953C2.004 6.422 6.41 1.992 11.941 1.992C17.473 1.992 21.914 6.422 21.914 11.953C21.914 17.484 17.484 21.914 11.953 21.914ZM19.969 19.676L19.934 19.547C19.359 17.824 16.266 15.938 11.953 15.938C7.652 15.938 4.559 17.824 3.973 19.535L3.938 19.676C6.047 21.762 9.668 22.98 11.953 22.98C14.25 22.98 17.836 21.773 19.969 19.676ZM11.953 13.945C14.215 13.969 15.973 12.047 15.973 9.527C15.973 7.16 14.203 5.203 11.953 5.203C9.703 5.203 7.922 7.16 7.934 9.527C7.945 12.047 9.703 13.922 11.953 13.945Z' fill='%236B7180D9'/%3E%3C/g%3E%3C/svg%3E");
}

.contact-relationships-flow-kind-icon.is-household {
	background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cdefs%3E%3CclipPath id='householdIconClip'%3E%3Crect width='18' height='18' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23householdIconClip)'%3E%3Cpath d='M1 8.162C1 7.183 1.478 6.266 2.28 5.704L7.28 2.204C8.313 1.481 9.687 1.481 10.72 2.204L15.72 5.704C16.522 6.266 17 7.183 17 8.162V15.4C17 15.824 16.813 16.231 16.479 16.531C16.146 16.831 15.694 17 15.222 17H2.778C2.306 17 1.854 16.831 1.521 16.531C1.187 16.231 1 15.824 1 15.4V8.162Z' stroke='%236B7180' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M6 17V10H12V17' stroke='%236B7180' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3C/svg%3E");
}

.contact-relationships-flow-kind-icon.is-company {
	background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 19H19M3 19V5L11 1V19M17 19V9L11 5M7 7V7.01M7 10V10.01M7 13V13.01M7 16V16.01' stroke='%236B7180' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.contact-relationships-flow-kind-icon.is-referral {
	background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 4H15M5 10H10M5 16H15' stroke='%236B7180' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M12 8L15 10L12 12' stroke='%236B7180' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.contact-relationships-flow-kind-label {
	color: #6b7280;
	font-size: 14px;
	font-weight: 700;
	line-height: 16px;
}

.contact-relationships-flow-kind-meta {
	color: rgba(107, 114, 128, 0.8);
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	margin-left: 0;
}

.contact-relationships-flow-list {
	flex: 1 1 auto;
	min-height: 0;
	max-height: none;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.contact-relationships-flow-list.is-role-catalog {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.contact-relationships-flow-search-field {
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
}

.contact-relationships-flow-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.contact-relationships-flow-card input.contact-relationships-flow-search {
	flex-shrink: 0;
	width: 100%;
	height: 34px;
	min-height: 34px;
	padding: 0 10px;
	border: 1px solid #C6C6C6;
	border-radius: 10px;
	background: transparent;
	box-shadow: none;
	appearance: none;
	-webkit-appearance: none;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	color: rgba(0, 0, 0, 0.5);
	outline: none;
}

.contact-relationships-flow-card input.contact-relationships-flow-search::placeholder {
	color: rgba(0, 0, 0, 0.5);
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
}

.contact-relationships-flow-card input.contact-relationships-flow-search:focus {
	border-color: #999;
	background: transparent;
}

.contact-relationships-flow-card input.contact-relationships-flow-search::-webkit-search-decoration,
.contact-relationships-flow-card input.contact-relationships-flow-search::-webkit-search-cancel-button,
.contact-relationships-flow-card input.contact-relationships-flow-search::-webkit-search-results-button,
.contact-relationships-flow-card input.contact-relationships-flow-search::-webkit-search-results-decoration {
	-webkit-appearance: none;
	appearance: none;
	display: none;
}

.contact-relationships-flow-list::-webkit-scrollbar {
	display: none;
}

.contact-relationships-flow-list-item {
	height: 34px;
	min-height: 34px;
	align-items: center;
}

.contact-relationships-flow-list-item.is-disabled,
.contact-relationships-flow-list-item:disabled {
	cursor: not-allowed;
	opacity: 0.6;
	background: #f8f8f8;
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06);
}

.contact-relationships-flow-list-item.is-disabled:hover,
.contact-relationships-flow-list-item.is-disabled:active,
.contact-relationships-flow-list-item:disabled:hover,
.contact-relationships-flow-list-item:disabled:active {
	background: #f8f8f8;
}

.contact-relationships-flow-list-item.is-disabled .entity-list-quick-filter-picker-item-label,
.contact-relationships-flow-list-item.is-disabled .entity-list-quick-filter-picker-item-meta,
.contact-relationships-flow-list-item:disabled .entity-list-quick-filter-picker-item-label,
.contact-relationships-flow-list-item:disabled .entity-list-quick-filter-picker-item-meta {
	color: rgba(0, 0, 0, 0.5);
}

.contact-relationships-flow-role-section {
	display: flex;
	flex-direction: column;
	background: #F3F3F3;
	border-radius: 10px;
}

.contact-relationships-flow-role-section.is-expanded {
	flex: 1 1 auto;
	min-height: 0;
}

.contact-relationships-flow-role-section-toggle {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 10px 10px;
	border: 0;
	border-radius: 10px;
	background: transparent;
	color: rgba(0, 0, 0, 0.58);
	cursor: pointer;
	font-family: 'Manrope', sans-serif;
	transition: background-color 0.15s ease;
	box-sizing: border-box;
}

.contact-relationships-flow-role-section-toggle:hover {
	background: rgba(0, 0, 0, 0.04);
}

.contact-relationships-flow-role-section-toggle:active {
	background: rgba(0, 0, 0, 0.07);
}

.contact-relationships-flow-role-section-label {
	font-size: 14px;
	font-weight: 700;
	line-height: 16px;
	text-transform: capitalize;
}

.contact-relationships-flow-role-section-meta {
	margin-left: auto;
	font-size: 10px;
	font-weight: 600;
	line-height: 14px;
	color: rgba(0, 0, 0, 0.36);
	min-width: 18px;
	height: 18px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.06);
	border-radius: 9px;
	padding: 0 5px;
	box-sizing: border-box;
}

.contact-relationships-flow-role-section-icon {
	font-size: 0;
	color: transparent;
	width: 16px;
	height: 16px;
	flex-shrink: 0;
	display: block;
	transform: rotate(-90deg);
	transform-origin: center;
	transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}

.contact-relationships-flow-role-section-icon::before {
	content: '';
	display: block;
	width: 16px;
	height: 16px;
	background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%23000000' stroke-opacity='0.36' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.contact-relationships-flow-role-section-toggle.is-expanded .contact-relationships-flow-role-section-icon {
	transform: rotate(0deg);
}

.contact-relationships-flow-role-section-toggle.is-expanded {
	border-radius: 10px 10px 0 0;
}

.contact-relationships-flow-role-section-items {
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 0 10px 8px;
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.contact-relationships-flow-role-section-items::-webkit-scrollbar {
	display: none;
}

.contact-relationships-flow-role-section-items .entity-list-quick-filter-picker-item {
	height: 34px;
	min-height: 34px;
	border-radius: 6px;
	background: #ffffff;
	transition: background-color 0.15s ease;
}

.contact-relationships-flow-role-section-items .entity-list-quick-filter-picker-item-label {
	font-size: 12px;
}

.contact-relationships-flow-role-section-items .entity-list-quick-filter-picker-item:hover {
	background: #f0f0f0;
}

.contact-relationships-flow-role-section-items .entity-list-quick-filter-picker-item:active {
	background: #e8e8e8;
}

.contact-relationships-flow-card .entity-list-quick-filter-picker-item-expand {
	margin-top: 4px;
}

.contact-relationships-flow-list-loading {
	padding: 8px 4px 2px;
	color: rgba(0, 0, 0, 0.45);
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	line-height: 16px;
}

.contact-relationships-flow-list-item.is-selected {
	background: #e9f2ff;
	box-shadow: inset 0 0 0 1px #8cb2e5;
}

.contact-relationships-flow-list-item.is-selected .entity-list-quick-filter-picker-item-label {
	color: #0d417c;
	font-weight: 500;
}

.contact-relationships-flow-list-copy {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
	width: 100%;
}

.contact-relationships-flow-list-copy .entity-list-quick-filter-picker-item-label {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.contact-relationships-flow-target-type-switch {
	align-self: flex-start;
}

.contact-relationships-flow-target-type-option {
	min-width: 0;
}

.contact-relationships-flow-form {
	display: flex;
	flex-direction: column;
	gap: 12px;
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
}

.contact-relationships-flow-form .account-relationships-dialog-field {
	width: 100%;
}

.contact-relationships-flow-form .entity-list-quick-filter-editor-input {
	background: #ffffff;
	color: rgba(0, 0, 0, 0.7);
}

.contact-relationships-flow-form .entity-list-quick-filter-editor-input.is-readonly,
.contact-relationships-flow-form .entity-list-quick-filter-editor-input[readonly] {
	background: #f8f8f8;
	color: rgba(0, 0, 0, 0.56);
	cursor: default;
}

.contact-relationships-flow-copy {
	margin-bottom: 0;
}

.contact-relationships-flow-footer {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	flex-shrink: 0;
}

.contact-relationships-flow-footer .entity-list-quick-filter-action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 96px;
}

.contact-relationships-flow-footer .entity-list-quick-filter-action-primary {
	color: #ffffff;
}

.contact-relationships-flow-footer .entity-list-quick-filter-action-primary:disabled {
	opacity: 0.45;
}

.contact-relationships-flow-saving {
	padding: 28px 12px;
	text-align: center;
	color: rgba(0, 0, 0, 0.58);
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 500;
	line-height: 18px;
}

@media (max-width: 1180px) {
	.contact-relationships-workspace,
	.contact_right .addon_section > .contact-relationships-workspace,
	.contact_right .form-container-v3 .addon_section > .contact-relationships-workspace,
	.contact_right .addon_section > .account-relationships-workspace,
	.contact_right .form-container-v3 .addon_section > .account-relationships-workspace,
	.account-relationships-workspace {
		height: auto;
		min-height: 0;
	}

	.contact-relationships-flow-stage {
		align-items: flex-start;
	}
}

@media (prefers-reduced-motion: reduce) {
	.contact-relationships-flow-kind-button,
	.contact-relationships-flow-role-section-toggle,
	.contact-relationships-flow-role-section-icon,
	.contact-relationships-flow-role-section-items .entity-list-quick-filter-picker-item {
		transition: none !important;
	}
}

/* WS→IPC Stage 6: non-disruptive "new items — refresh" pill in entity-list headers (Contacts/Accounts).
   Shown when remote changes arrive while the user is scrolled down; click to refresh on demand. */
.entity-list-new-items-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 8px;
    padding: 4px 12px;
    background: #2563eb;
    color: #fff;
    border: none;
    border-radius: 14px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}
.entity-list-new-items-pill:hover { background: #1d4ed8; }
.entity-list-new-items-arrow { font-weight: 700; }

/* ---- Calendar initial-sync progress (sticky bottom-center overlay) ---- */
.cal-sync-progress {
    position: fixed;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9000;
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 340px;
    max-width: 520px;
    padding: 14px 18px;
    background: rgba(28, 30, 36, 0.94);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    font-size: 13px;
    animation: cal-sync-progress-enter 0.35s ease;
}

@keyframes cal-sync-progress-enter {
    from { opacity: 0; transform: translate(-50%, 12px); }
    to { opacity: 1; transform: translate(-50%, 0); }
}

.cal-sync-progress-leaving {
    opacity: 0;
    transform: translate(-50%, 12px);
    transition: opacity 0.35s ease, transform 0.35s ease;
}

.cal-sync-progress-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    border: 2px solid rgba(255, 255, 255, 0.25);
    border-top-color: #6db3ff;
    border-radius: 50%;
    animation: cal-sync-progress-spin 0.9s linear infinite;
}

@keyframes cal-sync-progress-spin {
    to { transform: rotate(360deg); }
}

.cal-sync-progress-body {
    flex: 1;
    min-width: 0;
}

.cal-sync-progress-label {
    font-weight: 500;
    letter-spacing: 0.1px;
    margin-bottom: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cal-sync-progress-track {
    height: 4px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    overflow: hidden;
    position: relative;
}

.cal-sync-progress-fill {
    height: 100%;
    width: 0;
    border-radius: 999px;
    background: linear-gradient(90deg, #4f9cf9, #7cc4ff);
    transition: width 0.6s ease;
}

.cal-sync-progress-fill.indeterminate {
    position: absolute;
    width: 36%;
    animation: cal-sync-progress-slide 1.4s ease-in-out infinite;
}

@keyframes cal-sync-progress-slide {
    0% { left: -36%; }
    100% { left: 100%; }
}

.cal-sync-progress-count {
    flex-shrink: 0;
    font-variant-numeric: tabular-nums;
    color: rgba(255, 255, 255, 0.85);
    font-weight: 600;
}

.cal-sync-progress-close {
    flex-shrink: 0;
    cursor: pointer;
    color: rgba(255, 255, 255, 0.45);
    font-size: 16px;
    line-height: 1;
    padding: 2px 4px;
}

.cal-sync-progress-close:hover {
    color: #fff;
}

.cal-sync-progress-done .cal-sync-progress-icon,
.cal-sync-progress-failed .cal-sync-progress-icon {
    border: none;
    animation: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
}

.cal-sync-progress-done .cal-sync-progress-icon {
    background: #2ecc71;
    color: #0a3820;
}

.cal-sync-progress-done .cal-sync-progress-icon::after {
    content: '\2713';
}

.cal-sync-progress-done .cal-sync-progress-fill {
    background: linear-gradient(90deg, #2ecc71, #6ee7a8);
}

.cal-sync-progress-failed .cal-sync-progress-icon {
    background: #f3b23e;
    color: #4a2f00;
}

.cal-sync-progress-failed .cal-sync-progress-icon::after {
    content: '!';
}

.cal-sync-progress-failed .cal-sync-progress-fill {
    background: linear-gradient(90deg, #f3b23e, #f7cd7a);
}


/* ===========================================================================
   APPLIED PROCESSES (tkrv_mod_applied_processes.ts)
   One view, two surfaces: the grouped run list on the grey stage, the
   selected run's step timeline in a stacked header-card + body-card panel.
   Shares the module header, the segmented switch, the title-level scope
   trigger and the Recycle Bin row shape. Status reads through colour on
   the step bar and the next-step column; there are no status pills.
   =========================================================================== */

.apv-root > .mod-view-head {
	position: relative;
}

.apv-body {
	display: flex;
	gap: var(--workspace-layout-gap);
	flex: 1 1 auto;
	min-height: 0;
}

/* --- list stage --- */
.apv-stage {
	flex: 1 1 auto;
	min-width: 0;
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
	background: #F3F3F3;
	border-radius: 12px;
	padding: 10px;
}

.apv-stage::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 30px;
	pointer-events: none;
	border-radius: 0 0 12px 12px;
	background: linear-gradient(to bottom, rgba(243, 243, 243, 0), #F3F3F3 74%);
}

.apv-scroll {
	padding-bottom: 26px;
}

.apv-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.apv-cols,
.apv-row {
	display: grid;
	grid-template-columns: minmax(220px, 1.5fr) 150px minmax(200px, 1.2fr) 32px;
	align-items: center;
	gap: 14px;
}

.apv-cols {
	padding: 4px 10px 0 14px;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #9aa3ad;
}

/* One card per process template. The title row is quiet (it names the pipeline,
   it is not a control) and the runs sit flush inside, hairline-separated. */
.apv-group {
	background: #ffffff;
	border-radius: 10px;
	overflow: hidden;
}

.apv-group-head {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 11px 14px 9px;
	border-bottom: 1px solid #EEF1F4;
	font-family: 'Manrope', sans-serif;
}

.apv-group-glyph {
	width: 14px;
	height: 14px;
	flex: 0 0 auto;
	background-color: #9aa3ad;
	-webkit-mask: url(/images/icons/ribbon_menu/processes-menu-icon.svg) center / contain no-repeat;
	mask: url(/images/icons/ribbon_menu/processes-menu-icon.svg) center / contain no-repeat;
}

.apv-group-name {
	font-size: 13px;
	font-weight: 700;
	color: #18212B;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.apv-group-count {
	font-size: 12px;
	font-weight: 600;
	color: #9aa3ad;
	font-variant-numeric: tabular-nums;
}

.apv-group-note {
	margin-left: auto;
	font-size: 11px;
	font-weight: 600;
	color: #8A5A00;
	white-space: nowrap;
}

.apv-group-rows {
	display: flex;
	flex-direction: column;
}

/* --- row --- */
.apv-row {
	position: relative;
	padding: 10px 8px 10px 14px;
	cursor: pointer;
	outline: 0;
	transition: background-color 0.15s ease;
}

.apv-row + .apv-row {
	border-top: 1px solid #EEF1F4;
}

.apv-row:hover {
	background: #F8FAFC;
}

.apv-row.is-selected {
	background: #F1F6FD;
}

.apv-row.is-selected::before {
	content: '';
	position: absolute;
	left: 0;
	top: 8px;
	bottom: 8px;
	width: 3px;
	border-radius: 0 3px 3px 0;
	background: #00529b;
}

.apv-who {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.apv-avatar {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: 'Manrope', sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: #ffffff;
}

.apv-avatar.is-account {
	border-radius: 8px;
}

.apv-who-name {
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 600;
	color: #24384d;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.apv-progress {
	display: flex;
	align-items: center;
	gap: 10px;
}

.apv-bar {
	display: flex;
	gap: 2px;
}

.apv-bar i {
	display: block;
	width: 10px;
	height: 6px;
	border-radius: 2px;
	background: #D9DFE7;
}

.apv-bar i.is-done {
	background: #3E9B6A;
}

.apv-bar i.is-over {
	background: #D98A14;
}

.apv-bar i.is-gone {
	background: repeating-linear-gradient(135deg, #cfd6df 0 2px, transparent 2px 4px);
}

.apv-frac {
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	font-variant-numeric: tabular-nums;
	color: #7d8794;
	white-space: nowrap;
}

.apv-frac b {
	font-weight: 700;
	color: #24384d;
}

.apv-next {
	display: flex;
	align-items: baseline;
	gap: 8px;
	min-width: 0;
	font-family: 'Manrope', sans-serif;
	font-size: 12px;
	color: #5c6b7c;
	white-space: nowrap;
	overflow: hidden;
}

.apv-next-subject {
	font-weight: 600;
	color: #24384d;
	overflow: hidden;
	text-overflow: ellipsis;
}

.apv-next-when {
	flex: 0 0 auto;
	color: #8a94a0;
}

.apv-next.is-over .apv-next-when,
.apv-next.is-over .apv-next-text {
	color: #8A5A00;
	font-weight: 600;
}

.apv-next.is-done {
	align-items: center;
	color: #316347;
}

.apv-next-check {
	width: 14px;
	height: 14px;
	flex: 0 0 auto;
	border-radius: 50%;
	background-color: #3E9B6A;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M4 7.3l2 2 4-4' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.apv-kebab {
	width: 28px;
	height: 28px;
	padding: 0;
	border: 0;
	border-radius: 7px;
	background-color: transparent;
	background-image: radial-gradient(circle, #7d8a98 1.4px, transparent 1.6px);
	background-size: 100% 6px;
	background-position: center;
	background-repeat: repeat-y;
	background-clip: content-box;
	padding: 5px 0;
	cursor: pointer;
	opacity: 0;
	transition: opacity 0.15s ease, background-color 0.15s ease;
}

.apv-row:hover .apv-kebab,
.apv-row.is-selected .apv-kebab,
.apv-kebab.is-visible {
	opacity: 1;
}

.apv-kebab:hover {
	background-color: #eef1f5;
}

.apv-empty {
	padding: 60px 16px;
	text-align: center;
	font-family: 'Manrope', sans-serif;
}

.apv-empty-title {
	font-size: 13px;
	font-weight: 600;
	color: #64707c;
}

.apv-empty-hint {
	margin-top: 4px;
	font-size: 12px;
	color: #99a2ac;
}

/* Status switch: the calendar's view switch, unchanged (cal-view-switch gives the
   equal 1fr segments); only the row height is pinned so it sits level with the
   scope trigger beside it. */
.apv-switch .apv-switch-btn {
	line-height: 28px; /* 28 + the wrapper's 3px borders = the 34px scope trigger beside it */
}

/* --- scope picker (sits under the title-level trigger) --- */
.apv-scope-trigger.is-open {
	border-color: #8cb2e5;
	box-shadow: 0 0 0 3px rgba(140, 178, 229, 0.25);
}

.apv-picker {
	position: absolute;
	z-index: 40;
	width: 300px;
	max-height: 60vh;
	overflow-y: auto;
	padding: 8px;
	border-radius: 14px;
	background: #ffffff;
	box-shadow: 0 18px 45px rgba(0, 0, 0, 0.18), 0 4px 12px rgba(0, 0, 0, 0.08);
}

.apv-picker-item.is-selected {
	background: #E9F2FF;
	color: #0D417C;
	font-weight: 600;
}

.apv-picker-count {
	margin-left: 8px;
	flex: 0 0 auto;
	font-variant-numeric: tabular-nums;
	font-size: 11px;
	color: #9aa3ad;
}

.apv-picker-item.is-selected .apv-picker-count {
	color: #0D417C;
}

/* --- detail panel: header card over body card --- */
.apv-panel {
	width: 380px;
	flex: 0 0 380px;
	display: flex;
	flex-direction: column;
	gap: var(--workspace-layout-gap);
	min-height: 0;
}

.apv-panel-head {
	flex-shrink: 0;
	height: var(--workspace-module-header-height);
	min-height: var(--workspace-module-header-height);
	padding: var(--workspace-module-header-padding);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap: 10px;
	background: #F3F3F3;
	border-radius: 12px;
}

.apv-panel-glyph,
.apv-panel-empty-glyph {
	flex: 0 0 auto;
	width: 34px;
	height: 34px;
	border-radius: 9px;
	background: #ffffff;
	box-shadow: inset 0 0 0 1px rgba(23, 43, 71, 0.08);
	position: relative;
}

.apv-panel-glyph::after,
.apv-panel-empty-glyph::after {
	content: '';
	position: absolute;
	inset: 8px;
	background-color: #00529b;
	-webkit-mask: url(/images/icons/ribbon_menu/processes-menu-icon.svg) center / contain no-repeat;
	mask: url(/images/icons/ribbon_menu/processes-menu-icon.svg) center / contain no-repeat;
}

.apv-panel-title {
	flex: 1 1 auto;
	min-width: 0;
	font-family: 'Manrope', sans-serif;
	font-size: 16px;
	font-weight: 700;
	color: #25282d;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.apv-panel-body {
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
	background: #F3F3F3;
	border-radius: 12px;
	padding: 10px;
	overflow: hidden;
}

.apv-panel-scroll {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	gap: 8px;
	scrollbar-width: none;
}

.apv-panel-scroll::-webkit-scrollbar {
	display: none;
}

.apv-card {
	background: #ffffff;
	border-radius: 10px;
	padding: 14px;
	font-family: 'Manrope', sans-serif;
}

.apv-subject {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.apv-subject .apv-avatar {
	width: 40px;
	height: 40px;
	font-size: 13px;
}

.apv-subject-text {
	min-width: 0;
	flex: 1 1 auto;
}

.apv-subject-name {
	display: flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
	font-size: 15px;
	line-height: 20px;
	font-weight: 700;
	color: #18212B;
	text-decoration: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

a.apv-subject-name:hover {
	color: #00529b;
	text-decoration: none;
}

/* the open-arrow: present but quiet, lit on hover of the link */
.apv-subject-open {
	width: 12px;
	height: 12px;
	flex: 0 0 auto;
	background-color: #B7C0CA;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5l5-5M4.5 3.5h4v4'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5l5-5M4.5 3.5h4v4'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: background-color 0.15s ease, transform 0.15s ease;
}

a.apv-subject-name:hover .apv-subject-open {
	background-color: #00529b;
	transform: translate(1px, -1px);
}

.apv-subject-by {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 3px;
	min-width: 0;
}

.apv-subject-by .apv-avatar {
	width: 18px;
	height: 18px;
	font-size: 8px;
}

.apv-avatar-img {
	object-fit: cover;
	background: #E9EDF2;
}

.apv-avatar-user {
	background: #E9EDF2 !important;
	color: #4C6076;
}

.apv-subject-by-name {
	font-size: 12px;
	line-height: 16px;
	font-weight: 500;
	color: #5c6b7c;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* the start date, in the card's corner */
.apv-subject-date {
	flex: 0 0 auto;
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	height: 22px;
	padding: 0 8px 0 7px;
	border-radius: 999px;
	background: #F3F5F8;
	font-size: 11.5px;
	font-weight: 600;
	color: #5c6b7c;
	white-space: nowrap;
	cursor: default;
}

.apv-subject-date-glyph {
	width: 12px;
	height: 12px;
	background-color: #7d8a98;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Crect x='1.5' y='2.5' width='11' height='10' rx='2'/%3E%3Cpath d='M1.5 6h11M4.5 1.5v2M9.5 1.5v2'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Crect x='1.5' y='2.5' width='11' height='10' rx='2'/%3E%3Cpath d='M1.5 6h11M4.5 1.5v2M9.5 1.5v2'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apply-time rules, as small badges in the Steps title row */
.apv-badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	height: 20px;
	padding: 0 7px 0 6px;
	border-radius: 6px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.01em;
	cursor: default;
}

.apv-badge-glyph {
	width: 11px;
	height: 11px;
	background-color: currentColor;
	-webkit-mask: center / contain no-repeat;
	mask: center / contain no-repeat;
}

.apv-badge.is-dynamic {
	background: #E9F2FF;
	color: #0D417C;
}

.apv-badge.is-dynamic .apv-badge-glyph {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 6h8M6.5 3l3 3-3 3'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 6h8M6.5 3l3 3-3 3'/%3E%3C/svg%3E");
}

.apv-badge.is-weekend {
	background: #F2F4F6;
	color: #4C6076;
}

.apv-badge.is-weekend .apv-badge-glyph {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Crect x='1.5' y='2.5' width='9' height='8' rx='1.5'/%3E%3Cpath d='M1.5 5.5h9M4 8h1.5'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Crect x='1.5' y='2.5' width='9' height='8' rx='1.5'/%3E%3Cpath d='M1.5 5.5h9M4 8h1.5'/%3E%3C/svg%3E");
}

/* progress: a slim per-step track, then "n of m complete" on the left and what
   happens next on the right */
.apv-progress-block {
	margin-top: 14px;
	padding-top: 12px;
	border-top: 1px solid #EEF1F4;
}

.apv-progress-block .apv-bar {
	width: 100%;
	gap: 2px;
}

.apv-progress-block .apv-bar i {
	flex: 1 1 0;
	width: auto;
	height: 5px;
	border-radius: 2px;
}

.apv-progress-row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	margin-top: 8px;
	font-size: 12px;
	line-height: 16px;
}

.apv-progress-done {
	font-weight: 700;
	color: #24384d;
}

.apv-progress-next {
	font-weight: 500;
	color: #758090;
	white-space: nowrap;
}

.apv-progress-next.is-over {
	color: #A4680A;
	font-weight: 600;
}

.apv-progress-next.is-done {
	color: #316347;
	font-weight: 600;
}

.apv-steps-card {
	padding: 12px 8px 6px 14px;
}

.apv-steps-title {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 0 6px 8px 2px;
	font-size: 13px;
	font-weight: 700;
	color: #18212B;
}

.apv-steps-flags {
	margin-left: auto;
	display: inline-flex;
	gap: 6px;
}

.apv-steps-count {
	font-size: 12px;
	font-weight: 600;
	color: #9aa3ad;
	font-variant-numeric: tabular-nums;
}

.apv-steps-empty {
	padding: 6px 6px 8px 0;
	font-size: 12px;
	line-height: 1.5;
	color: #758090;
}

/* The rail: one 28px node per step that carries the activity glyph; its fill and
   ring say where the step stands. A 2px line joins the nodes. */
.apv-rail {
	display: flex;
	flex-direction: column;
}

.apv-step {
	display: grid;
	grid-template-columns: 28px 1fr;
	gap: 10px;
}

.apv-node-col {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	padding-top: 8px;
}

.apv-node-col::before {
	content: '';
	position: absolute;
	top: 36px;
	bottom: -8px;
	left: 50%;
	width: 2px;
	transform: translateX(-50%);
	background: #E3E8EE;
}

.apv-step:last-child .apv-node-col::before {
	display: none;
}

.apv-node {
	position: relative;
	z-index: 1;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: #F1F4F7;
	box-shadow: inset 0 0 0 1px #DFE5EC;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.apv-node-glyph {
	width: 14px;
	height: 14px;
	background-color: #7d8a98;
	-webkit-mask: center / contain no-repeat;
	mask: center / contain no-repeat;
}

.apv-node-glyph.is-appt {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Crect x='1.5' y='2.5' width='11' height='10' rx='2'/%3E%3Cpath d='M1.5 6h11M4.5 1.5v2M9.5 1.5v2'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Crect x='1.5' y='2.5' width='11' height='10' rx='2'/%3E%3Cpath d='M1.5 6h11M4.5 1.5v2M9.5 1.5v2'/%3E%3C/svg%3E");
}

.apv-node-glyph.is-task {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1.5' y='1.5' width='11' height='11' rx='2.5'/%3E%3Cpath d='m4.2 7.2 2 2 3.6-4'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1.5' y='1.5' width='11' height='11' rx='2.5'/%3E%3Cpath d='m4.2 7.2 2 2 3.6-4'/%3E%3C/svg%3E");
}

.apv-step.is-today .apv-node {
	background: #E9F2FF;
	box-shadow: inset 0 0 0 1.5px #00529b;
}

.apv-step.is-today .apv-node-glyph {
	background-color: #00529b;
}

.apv-step.is-over .apv-node {
	background: #FFF4E0;
	box-shadow: inset 0 0 0 1.5px #D98A14;
}

.apv-step.is-over .apv-node-glyph {
	background-color: #B06F0E;
}

.apv-step.is-done .apv-node {
	background-color: #3E9B6A;
	box-shadow: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3.5 7.4l2.3 2.3 4.7-4.9' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-size: 16px 16px;
	background-repeat: no-repeat;
	background-position: center;
}

.apv-step.is-done .apv-node-glyph {
	display: none;
}

.apv-step.is-gone .apv-node {
	background: #ffffff;
	box-shadow: inset 0 0 0 1px #D6DCE4;
}

.apv-step.is-gone .apv-node-glyph {
	background-color: #C3CAD3;
}

.apv-step-card {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	padding: 7px 8px 7px 6px;
	border-radius: 9px;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.apv-step-trail {
	display: inline-flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	min-width: 22px;
}

.apv-step-who {
	width: 22px;
	height: 22px;
	font-size: 9px;
	background: #E9EDF2 !important;
	color: #4C6076;
}

.apv-step.is-done .apv-step-who {
	opacity: 0.6;
}

.apv-step.is-gone .apv-step-card {
	cursor: default;
}

.apv-step-card:hover {
	background: #f6f8fb;
}

.apv-step-text {
	min-width: 0;
}

.apv-step-subject {
	font-size: 13px;
	line-height: 1.3;
	font-weight: 600;
	color: #18212B;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	word-break: break-word;
}

.apv-step.is-done .apv-step-subject {
	color: #5c6b7c;
}

.apv-step.is-gone .apv-step-subject {
	color: #99a2ac;
	text-decoration: line-through;
}

.apv-step-meta {
	margin-top: 2px;
	font-size: 11.5px;
	line-height: 1.4;
	font-weight: 500;
	color: #758090;
}

.apv-step-meta.is-over {
	color: #A4680A;
}

/* The one quick action: a check that fades in beside the assignee on hover.
   It holds its space, so nothing shifts and nothing is covered. */
.apv-step-done-btn {
	width: 24px;
	height: 24px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background-color: #ffffff;
	box-shadow: inset 0 0 0 1.5px #CBD3DD;
	position: relative;
	cursor: pointer;
	opacity: 0;
	transition: opacity 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

.apv-step-done-btn::after {
	content: '';
	position: absolute;
	inset: 5px;
	background-color: #9aa3ad;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3.5 7.4l2.3 2.3 4.7-4.9' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3.5 7.4l2.3 2.3 4.7-4.9' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: background-color 0.15s ease;
}

.apv-step-card:hover .apv-step-done-btn {
	opacity: 1;
}

.apv-step-done-btn:hover {
	background-color: #3E9B6A;
	box-shadow: none;
}

.apv-step-done-btn:hover::after {
	background-color: #ffffff;
}

.apv-step-done-btn:focus-visible {
	opacity: 1;
	outline: none;
	box-shadow: 0 0 0 3px rgba(62, 155, 106, 0.3), inset 0 0 0 1.5px #3E9B6A;
}

.apv-panel-empty {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	text-align: center;
	font-family: 'Manrope', sans-serif;
}

.apv-panel-empty-glyph {
	width: 44px;
	height: 44px;
	border-radius: 12px;
	margin-bottom: 8px;
}

.apv-panel-empty-glyph::after {
	background-color: #9aa4b0;
	inset: 11px;
}

.apv-panel-empty-title {
	font-size: 13px;
	font-weight: 600;
	color: #64707c;
}

.apv-panel-empty-hint {
	font-size: 12px;
	color: #99a2ac;
	max-width: 240px;
}

/* record-level host: the view fills the jQuery UI dialog body */
.apv-dialog .ui-dialog-content {
	padding: 10px;
	overflow: hidden;
	box-sizing: border-box;
}

.apv-dialog-host {
	height: 100%;
}

.apv-dialog .apv-panel {
	width: 340px;
	flex-basis: 340px;
}

@media (max-width: 1280px) {
	.apv-cols,
	.apv-row {
		grid-template-columns: minmax(180px, 1fr) 140px 32px;
		row-gap: 2px;
	}

	.apv-cols > span:nth-child(3) {
		display: none;
	}

	.apv-row .apv-next {
		grid-column: 1 / -1;
		grid-row: 2;
		padding-left: 38px;
	}

	.apv-panel {
		width: 320px;
		flex-basis: 320px;
	}
}

/* ===========================================================================
   DIMENSIONAL BUTTONS
   ===========================================================================
   The one place the raised-button surface is defined. Adopters keep their own
   geometry - height, padding, radius, type - and inherit only the surface, so
   joining the list never moves anything. New markup should use .vc-button; the
   rest of the list is existing per-module class names.

   Two choices keep adoption free of layout risk:

     - the edge is an inset ring rather than a real border, and the shared rule
       zeroes border-width, so an adopter's box metrics are untouched. The four
       adopters that are sized by padding cannot lose their border, so they
       keep it and stand the ring down instead (see the end of this block).
     - the face is a fixed sheen over an animatable fill, not two gradients
       swapped on hover. Chrome cannot interpolate gradients but interpolates
       background-color exactly, and this leaves both pseudo-elements free for
       icon masks.

   To recolour a button, override --btn-fill and --btn-fill-hover on it (see
   .entity-list-save-view-button). Never reintroduce a flat background-color -
   it flattens the face back out.

   This block is intentionally LAST in the file, so states that must still win
   - disabled greys, view-only modes - do so on their own higher specificity.
   =========================================================================== */

/* .vc-button is the canonical class for new markup: the shared surface below
   plus a default box. Existing adopters bring their own geometry. */
.vc-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	height: 34px;
	padding: 0 16px;
	border-radius: var(--btn-radius);
	box-sizing: border-box;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: var(--btn-font-weight);
	color: #fff;
	cursor: pointer;
	white-space: nowrap;
}

.vc-button,
.fb_v4_button,
.mod-tb-create-button,
.mod-tb-export-button,
.task-tb-create-button,
.entity-list-create-button,
button.fc-tb-clone-create-button,
.vc-modal-btn-primary,
.vc-confirm-button-primary,
.vc-utility-button-primary,
.docs-action-dialog-primary,
.fs-tree-new-folder-btn,
.fs-share-create,
.scheduler-primary-action,
.scheduler-location-connect-zoom,
.scheduler-questions-add,
.scheduler-question-dialog-primary,
.scheduler-availability-save-override,
.scheduler-reminders-action,
.ct-hd-save-btn,
.process-header-btn--primary,
.contact-relationships-flow-footer .entity-list-quick-filter-action-primary,
.workflow-builder-save,
.floating-pill-btn.primary,
.sidebar-actions .btn-save {
	--btn-ring: inset 0 0 0 1px var(--btn-border);
	font-weight: var(--btn-font-weight);
	border-width: 0;
	background-image: var(--btn-sheen);
	background-color: var(--btn-fill);
	box-shadow:
		0 1px 1px rgba(var(--btn-shadow-hue), 0.18),
		0 3px 7px rgba(var(--btn-shadow-hue), 0.16),
		var(--btn-ring),
		inset 0 1px 0 var(--btn-specular),
		inset 0 -1px 0 var(--btn-underside);
	transition: background-color 140ms ease, box-shadow 140ms ease, transform 140ms ease, opacity 140ms ease;
}

.vc-button:hover,
.fb_v4_button:hover,
.mod-tb-create-button:hover,
.mod-tb-export-button:hover,
.task-tb-create-button:hover,
.entity-list-create-button:hover,
.fc-tb-clone-create-button:hover,
.vc-modal-btn-primary:hover,
.vc-confirm-button-primary:hover,
.vc-utility-button-primary:hover,
.docs-action-dialog-primary:hover,
.fs-tree-new-folder-btn:hover,
.fs-share-create:hover,
.scheduler-primary-action:hover,
.scheduler-location-connect-zoom:hover,
.scheduler-questions-add:hover,
.scheduler-question-dialog-primary:hover,
.scheduler-availability-save-override:hover,
.scheduler-reminders-action:hover,
.ct-hd-save-btn:hover,
.process-header-btn--primary:hover,
.contact-relationships-flow-footer .entity-list-quick-filter-action-primary:hover,
.workflow-builder-save:hover,
.floating-pill-btn.primary:hover,
.sidebar-actions .btn-save:hover {
	background-color: var(--btn-fill-hover);
	box-shadow:
		0 2px 2px rgba(var(--btn-shadow-hue), 0.18),
		0 5px 11px rgba(var(--btn-shadow-hue), 0.2),
		var(--btn-ring),
		inset 0 1px 0 var(--btn-specular),
		inset 0 -1px 0 var(--btn-underside);
}

/* Pressed: the object sinks onto the page, so the cast shadow tightens and
   the face picks up an inner shade instead of a specular edge. */
.vc-button:active,
.fb_v4_button:active,
.mod-tb-create-button:active,
.mod-tb-export-button:active,
.task-tb-create-button:active,
.entity-list-create-button:active,
.fc-tb-clone-create-button:active,
.vc-modal-btn-primary:active,
.vc-confirm-button-primary:active,
.vc-utility-button-primary:active,
.docs-action-dialog-primary:active,
.fs-tree-new-folder-btn:active,
.fs-share-create:active,
.scheduler-primary-action:active,
.scheduler-location-connect-zoom:active,
.scheduler-questions-add:active,
.scheduler-question-dialog-primary:active,
.scheduler-availability-save-override:active,
.scheduler-reminders-action:active,
.ct-hd-save-btn:active,
.process-header-btn--primary:active,
.contact-relationships-flow-footer .entity-list-quick-filter-action-primary:active,
.workflow-builder-save:active,
.floating-pill-btn.primary:active,
.sidebar-actions .btn-save:active {
	transform: scale(0.98);
	box-shadow:
		0 1px 2px rgba(var(--btn-shadow-hue), 0.16),
		var(--btn-ring),
		inset 0 1px 2px var(--btn-press);
}

.vc-button:focus-visible,
.fb_v4_button:focus-visible,
.mod-tb-create-button:focus-visible,
.mod-tb-export-button:focus-visible,
.task-tb-create-button:focus-visible,
.entity-list-create-button:focus-visible,
.fc-tb-clone-create-button:focus-visible,
.vc-modal-btn-primary:focus-visible,
.vc-confirm-button-primary:focus-visible,
.vc-utility-button-primary:focus-visible,
.docs-action-dialog-primary:focus-visible,
.fs-tree-new-folder-btn:focus-visible,
.fs-share-create:focus-visible,
.scheduler-primary-action:focus-visible,
.scheduler-location-connect-zoom:focus-visible,
.scheduler-questions-add:focus-visible,
.scheduler-question-dialog-primary:focus-visible,
.scheduler-availability-save-override:focus-visible,
.scheduler-reminders-action:focus-visible,
.ct-hd-save-btn:focus-visible,
.process-header-btn--primary:focus-visible,
.contact-relationships-flow-footer .entity-list-quick-filter-action-primary:focus-visible,
.workflow-builder-save:focus-visible,
.floating-pill-btn.primary:focus-visible,
.sidebar-actions .btn-save:focus-visible {
	outline: none;
	box-shadow:
		0 0 0 3px var(--btn-focus-ring),
		0 3px 7px rgba(var(--btn-shadow-hue), 0.16),
		var(--btn-ring),
		inset 0 1px 0 var(--btn-specular);
}

/* Disabled: an inert object sits flat on the page - no lift, no press. */
.vc-button:disabled,
.fb_v4_button:disabled,
.mod-tb-create-button:disabled,
.mod-tb-export-button:disabled,
.task-tb-create-button:disabled,
.entity-list-create-button:disabled,
.fc-tb-clone-create-button:disabled,
.vc-modal-btn-primary:disabled,
.vc-confirm-button-primary:disabled,
.vc-utility-button-primary:disabled,
.docs-action-dialog-primary:disabled,
.fs-tree-new-folder-btn:disabled,
.fs-share-create:disabled,
.scheduler-primary-action:disabled,
.scheduler-location-connect-zoom:disabled,
.scheduler-questions-add:disabled,
.scheduler-question-dialog-primary:disabled,
.scheduler-availability-save-override:disabled,
.scheduler-reminders-action:disabled,
.ct-hd-save-btn:disabled,
.process-header-btn--primary:disabled,
.contact-relationships-flow-footer .entity-list-quick-filter-action-primary:disabled,
.workflow-builder-save:disabled,
.floating-pill-btn.primary:disabled,
.sidebar-actions .btn-save:disabled,
.vc-button.disabled,
.fb_v4_button.disabled,
.mod-tb-create-button.disabled,
.mod-tb-export-button.disabled,
.task-tb-create-button.disabled,
.entity-list-create-button.disabled,
.fc-tb-clone-create-button.disabled,
.vc-modal-btn-primary.disabled,
.vc-confirm-button-primary.disabled,
.vc-utility-button-primary.disabled,
.docs-action-dialog-primary.disabled,
.fs-tree-new-folder-btn.disabled,
.fs-share-create.disabled,
.scheduler-primary-action.disabled,
.scheduler-location-connect-zoom.disabled,
.scheduler-questions-add.disabled,
.scheduler-question-dialog-primary.disabled,
.scheduler-availability-save-override.disabled,
.scheduler-reminders-action.disabled,
.ct-hd-save-btn.disabled,
.process-header-btn--primary.disabled,
.contact-relationships-flow-footer .entity-list-quick-filter-action-primary.disabled,
.workflow-builder-save.disabled,
.floating-pill-btn.primary.disabled,
.sidebar-actions .btn-save.disabled {
	box-shadow: none;
	transform: none;
}

/* Sized by padding, so the 1px border cannot be removed without moving them.
   The border draws the edge and the ring stands down - stacked, the two would
   read as a 2px line. */
.vc-modal-btn-primary,
.vc-confirm-button-primary,
.vc-utility-button-primary,
.docs-action-dialog-primary {
	--btn-ring: 0 0 transparent;
	border-width: 1px;
	border-style: solid;
	border-color: var(--btn-border);
}

@media (prefers-reduced-motion: reduce) {
	.vc-button,
	.fb_v4_button,
	.mod-tb-create-button,
	.mod-tb-export-button,
	.task-tb-create-button,
	.entity-list-create-button,
	.fc-tb-clone-create-button,
	.vc-modal-btn-primary,
	.vc-confirm-button-primary,
	.vc-utility-button-primary,
	.docs-action-dialog-primary,
	.fs-tree-new-folder-btn,
	.fs-share-create,
	.scheduler-primary-action,
	.scheduler-location-connect-zoom,
	.scheduler-questions-add,
	.scheduler-question-dialog-primary,
	.scheduler-availability-save-override,
	.scheduler-reminders-action,
	.ct-hd-save-btn,
	.process-header-btn--primary,
	.contact-relationships-flow-footer .entity-list-quick-filter-action-primary,
	.workflow-builder-save,
	.floating-pill-btn.primary,
	.sidebar-actions .btn-save {
		transition: none;
	}

	.vc-button:active,
	.fb_v4_button:active,
	.mod-tb-create-button:active,
	.mod-tb-export-button:active,
	.task-tb-create-button:active,
	.entity-list-create-button:active,
	.fc-tb-clone-create-button:active,
	.vc-modal-btn-primary:active,
	.vc-confirm-button-primary:active,
	.vc-utility-button-primary:active,
	.docs-action-dialog-primary:active,
	.fs-tree-new-folder-btn:active,
	.fs-share-create:active,
	.scheduler-primary-action:active,
	.scheduler-location-connect-zoom:active,
	.scheduler-questions-add:active,
	.scheduler-question-dialog-primary:active,
	.scheduler-availability-save-override:active,
	.scheduler-reminders-action:active,
	.ct-hd-save-btn:active,
	.process-header-btn--primary:active,
	.contact-relationships-flow-footer .entity-list-quick-filter-action-primary:active,
	.workflow-builder-save:active,
	.floating-pill-btn.primary:active,
	.sidebar-actions .btn-save:active {
		transform: none;
	}
}

/* "Try new experience" switch (see new_app_banner.ts) on the top black menu bar (#menubar, a
   fixed 32px dark gradient bar), just left of the user-name/alerts cluster. Sized to sit inside
   the 32px bar so it does not inflate the bar height. Placeholder styling pending designer cues. */
.new_app_switch {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 14px;
	vertical-align: middle;
	color: #ffffff;
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
	cursor: pointer;
	-webkit-user-select: none;
	user-select: none;
}

.new_app_switch_icon {
	display: inline-flex;
	width: 18px;
	height: 18px;
}

.new_app_switch_icon svg {
	display: block;
	width: 18px;
	height: 18px;
}

.new_app_switch_label {
	color: #ffffff;
}

.new_app_switch_toggle {
	position: relative;
	display: inline-block;
	flex: 0 0 auto;
	width: 34px;
	height: 18px;
	border-radius: 9px;
	background-color: #1a73e8;
	transition: background-color 0.2s ease;
}

.new_app_switch:hover .new_app_switch_toggle {
	background-color: #1765cc;
}

/* OFF state (master/old side): grey track, knob on the left. */
.new_app_switch_toggle.off {
	background-color: #6b7785;
}

.new_app_switch:hover .new_app_switch_toggle.off {
	background-color: #5c6874;
}

.new_app_switch_knob {
	position: absolute;
	top: 2px;
	left: 18px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background-color: #ffffff;
	transition: left 0.15s ease;
}

.new_app_switch_toggle.off .new_app_switch_knob {
	left: 2px;
}

/* One-time promo tooltip anchored below the toggle. */
.new_app_tooltip {
	position: fixed;
	z-index: 100000;
	max-width: 320px;
	padding: 16px 18px;
	border-radius: 8px;
	background-color: #2b2b2b;
	color: #ffffff;
	font-size: 15px;
	line-height: 1.4;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
	cursor: pointer;
	opacity: 1;
	transition: opacity 0.4s ease;
}

.new_app_tooltip_hiding {
	opacity: 0;
}

.new_app_tooltip_arrow {
	position: absolute;
	top: -7px;
	right: 40px;
	width: 0;
	height: 0;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 8px solid #2b2b2b;
}

.new_app_tooltip_close {
	position: absolute;
	top: 6px;
	right: 8px;
	width: 18px;
	height: 18px;
	line-height: 18px;
	text-align: center;
	font-size: 18px;
	color: #cccccc;
	cursor: pointer;
	opacity: 0.85;
}
.new_app_tooltip_close:hover {
	color: #ffffff;
	opacity: 1;
}

/* #1699: the password-field and recycle-bin rules below were dropped from this file by the
   MR !37 merge (fa255d7b, its branch's copy of screen.css lacked them); restored verbatim from
   the release side. Without .vc-caps-warning's display:none the "Caps Lock is on" warning
   showed permanently under every enhanced password input. */
/* ===== Password field enhancements (reveal toggle, caps-lock, strength, match, generator) ===== */
.vc-password-field {
	position: relative;
	display: block;
}
.vc-password-field > input {
	width: 100%;
	padding-right: 34px;
	box-sizing: border-box;
}
.vc-password-toggle {
	position: absolute;
	top: 50%;
	right: 4px;
	transform: translateY(-50%);
	border: none;
	background: transparent;
	cursor: pointer;
	color: #6b7785;
	padding: 2px 6px;
	font-size: 14px;
	line-height: 1;
}
.vc-password-toggle:hover {
	color: #2b5b83;
}
.vc-caps-warning {
	display: none;
	color: #b8860b;
	font-size: 12px;
	margin: 3px 0 4px;
}
.vc-caps-warning i {
	margin-right: 4px;
}
.vc-password-strength {
	display: none;
	margin: 5px 0 6px;
}
.vc-password-strength-bar {
	height: 5px;
	background: #e3e7ea;
	border-radius: 3px;
	overflow: hidden;
}
.vc-password-strength-bar > span {
	display: block;
	height: 100%;
	width: 0;
	transition: width 0.2s ease;
	background: #c0392b;
}
.vc-password-strength-bar > span.vc-strength-2 { background: #e67e22; }
.vc-password-strength-bar > span.vc-strength-3 { background: #f1c40f; }
.vc-password-strength-bar > span.vc-strength-4 { background: #27ae60; }
.vc-password-strength-label {
	font-size: 11px;
	color: #6b7785;
	margin-top: 2px;
}
.vc-password-match {
	display: none;
	font-size: 12px;
	margin: 3px 0 4px;
}
.vc-password-match.vc-match-ok { color: #27ae60; }
.vc-password-match.vc-match-bad { color: #c0392b; }
.vc-password-match i {
	margin-right: 4px;
}
.vc-password-generate {
	margin: 4px 0 6px;
	font-size: 12px;
	cursor: pointer;
}
.vc-password-generate i {
	margin-right: 4px;
}

/* ===== Modern look for the user-facing Password Change dialog (reuses .vc-utility-dialog chrome) ===== */
.vc-password-change-dialog .password_change_form {
	padding: 0;
}
.vc-password-change-intro {
	margin: 0 0 16px;
	color: #6f7782;
	font-size: 12.5px;
	line-height: 17px;
}
.vc-password-change-dialog label {
	display: block;
	width: auto;
	margin: 14px 0 5px;
	color: #3b4856;
	font-size: 12px;
	font-weight: 600;
}
.vc-password-change-dialog .vc-password-change-intro + label {
	margin-top: 0;
}
.vc-password-change-dialog input[type=password],
.vc-password-change-dialog input[type=text] {
	display: block;
	width: 100%;
	height: 38px;
	margin: 0;
	padding: 0 38px 0 12px;
	border: 1px solid #d5dce4;
	border-radius: 8px;
	background: #fff;
	color: #23384f;
	font-size: 13px;
	box-sizing: border-box;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.vc-password-change-dialog input[type=password]:focus,
.vc-password-change-dialog input[type=text]:focus {
	outline: none;
	border-color: #8cb2e5;
	box-shadow: 0 0 0 3px rgba(0, 82, 155, 0.14);
}
.vc-password-change-dialog .vc-password-toggle {
	color: #8a94a0;
	right: 6px;
}
.vc-password-change-dialog .vc-password-toggle:hover {
	color: #00529b;
}
.vc-password-change-dialog .vc-password-generate {
	margin-top: 6px;
	padding: 5px 11px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background: #f5f8fb;
	color: #00529b;
	font-weight: 600;
}
.vc-password-change-dialog .vc-password-generate:hover {
	background: #eaf1f9;
	border-color: #bfcad6;
}
.vc-password-change-dialog .message_div {
	/* The global .message_div is a fixed 385px content-box (+padding/border = 397px), wider than
	   this dialog's 392px content area - which put a horizontal scrollbar on the form. (#1712) */
	width: auto;
	box-sizing: border-box;
	margin-top: 12px;
	color: #c0392b;
	font-size: 12.5px;
	line-height: 17px;
}
.vc-password-change-dialog .message_div:empty {
	display: none;
}
/* Generate lives in the button bar, pushed to the far left; Change/Cancel stay right */
.vc-password-change-dialog .ui-dialog-buttonpane .vc-password-generate-btn {
	margin-right: auto;
}
.vc-password-change-dialog .ui-dialog-buttonpane .vc-password-generate-btn .ui-button-text:before {
	content: "\f074";
	font-family: FontAwesome;
	margin-right: 6px;
}
/* Generous, consistent padding so content/labels/buttons don't hug the dialog edges */
.vc-password-change-dialog .ui-dialog-content {
	padding: 20px 24px 22px;
}
.vc-password-change-dialog .ui-dialog-titlebar {
	padding: 16px 52px 10px 24px;
}
.vc-password-change-dialog .ui-dialog-buttonpane {
	padding: 12px 24px 16px;
}

/* #1537 Recycle Bin record view: a normal record tab opened read-only from the bin. Hide the
   editing affordances (Save / Save-and-Close) and show a banner with Restore / Delete Permanently. */
.recycle-bin-view .ct-hd-save-btn,
.recycle-bin-view .ct-hd-snc-btn {
	display: none !important;
}

.recycle-bin-banner {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	margin: 0 0 12px 0;
	padding: 12px 16px;
	border: 1px solid #e6c200;
	border-left: 4px solid #e6a700;
	border-radius: 8px;
	background: #fff9e6;
	color: #6b5300;
	font-family: 'Manrope', sans-serif;
	font-size: 14px;
}

.recycle-bin-banner .rb-banner-msg {
	flex: 1 1 auto;
	min-width: 200px;
}

.recycle-bin-banner .rb-banner-actions {
	display: flex;
	gap: 8px;
	flex-shrink: 0;
}

.recycle-bin-banner button {
	padding: 7px 14px;
	border-radius: 6px;
	cursor: pointer;
	font-weight: 600;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
}

.recycle-bin-banner .rb-banner-restore {
	border: none;
	background: #2f6fed;
	color: #fff;
}

.recycle-bin-banner .rb-banner-restore:disabled {
	opacity: 0.5;
	cursor: default;
}

.recycle-bin-banner .rb-banner-perm {
	border: 1px solid #d33;
	background: #fff;
	color: #d33;
}

.recycle-bin-banner .rb-banner-perm:disabled {
	opacity: 0.5;
	cursor: default;
}

/* Simple management dialogs share the modern editor chrome. */
.modern-utility-dialog.ui-dialog {
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 32px);
}
.modern-utility-dialog-title {
    flex: 0 0 auto;
    margin: 0 40px 16px 0;
    color: #24282d;
    font-size: 18px;
    font-weight: 700;
    line-height: 28px;
}
.option-sets-dialog-list {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    padding-bottom: 14px;
}
.clone-filter-dialog.ui-dialog {
    height: auto !important;
}
.clone-filter-name-label {
    margin-bottom: 8px;
    font-weight: 600;
}
.clone-filter-dialog input.clone-filter-name-input {
    width: 100%;
    box-sizing: border-box;
    height: 38px;
    padding: 8px 10px;
    margin-bottom: 20px;
    border: 1px solid #d9dee5;
    border-radius: 6px;
    font: inherit;
}

/* #1612: delete-impact prompt — what still uses the record, and where those rows can go instead. */
.vc-delete-impact {
	min-height: 0;
	font-size: 13px;
}

.vc-delete-impact p {
	margin: 0 0 8px 0;
}

.vc-delete-impact-list {
	margin: 0 0 12px 0;
	padding-left: 20px;
}

.vc-delete-impact-list li {
	margin: 2px 0;
	font-weight: 600;
}

.vc-delete-impact-reassign-label {
	margin-top: 4px;
}

select.vc-delete-impact-reassign {
	width: 100%;
	margin-bottom: 12px;
}

.vc-delete-impact-note {
	color: #666;
	font-size: 12px;
	line-height: 1.45;
}

/* Read-only time zone picker input: it opens a chooser on click (#1614 TKC-17). */
.tz-picker-input {
	cursor: pointer;
}

/* A stored zone this server cannot resolve: flagged rather than shown as empty, and kept until
   the user picks a replacement (#1657). */
.tz-picker-input.tz-picker-unrecognised {
	border-color: #d97706;
	background-color: #fffbeb;
	color: #92400e;
}

/* Boolean list cells: a false value shows a muted cross instead of nothing (#1615 TKP-12). */
.gtd-bool.incomplete {
	background-image: url(/images/icons/18/gray/cross.png);
	opacity: 0.45;
}

/* #1605 CAL-029: a lookup option that draws a colour alongside its label. Opt-in per data
   source; every other lookup still renders as plain text. */
.lookup-option-with-mark {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-width: 0;
}

/* In the dropdown panel the swatch is a direct child of the row, which is already a flex
   line, so it only needs to keep its size. */
.lookup-dropdown-option > .lookup-option-swatch {
	margin-right: 8px;
}

.lookup-option-swatch {
	flex: 0 0 auto;
	width: 12px;
	height: 12px;
	border-radius: 3px;
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.18);
}

.lookup-option-label {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ---------------------------------------------------------------------------
   #1666: the shared print dialog. There were three hand-rolled ones - the
   calendar's options dialog, the contact/account print-type list and the email
   date-range chooser - and between them no CSS at all: the classes existed in
   the markup and nothing styled them, so every print dialog was bare jQuery UI.
   One set of rules now covers all of them.
   --------------------------------------------------------------------------- */
.print-dialog {
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	color: #292929;
}

.print-dialog-intro {
	margin: 0 0 12px;
	color: #6b7280;
	font-size: 12px;
	line-height: 1.45;
}

.print-dialog-content {
	margin-bottom: 12px;
}

.print-dialog-section-title {
	margin: 0 0 8px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .3px;
	text-transform: uppercase;
	color: #6b7280;
}

.print-option-section {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

/* The whole row is the target, so the label and the hint are clickable too -
   the old dialogs made only the anchor text hittable. */
.print-option-row {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 9px 11px;
	border: 1px solid #e1e5e9;
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
	transition: border-color .15s ease, background-color .15s ease;
}

.print-option-row:hover {
	border-color: #cbd3da;
	background: #f8fafc;
}

.print-option-row:focus-within {
	border-color: #1b74c9;
	box-shadow: 0 0 0 3px rgba(27, 116, 201, .14);
	outline: none;
}

.print-option-row:has(.print-option-radio:checked) {
	border-color: #1b74c9;
	background: #f2f7fc;
}

.print-option-radio {
	margin: 2px 0 0;
	flex: 0 0 auto;
	accent-color: #1b74c9;
}

.print-option-copy {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.print-option-label {
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
}

.print-option-hint {
	color: #6b7280;
	font-size: 12px;
	line-height: 1.35;
}

/* On/off options (e.g. the calendar's "Descriptions") sit under the choices as a lighter group:
   no card per row, and checking one doesn't make it look like the selected choice. */
.print-toggle-section {
	margin-top: 12px;
	padding-top: 10px;
	border-top: 1px solid #eef1f4;
	gap: 2px;
}

.print-toggle-section .print-toggle-row {
	align-items: center;
	padding: 5px 4px;
	border-color: transparent;
	background: transparent;
}

.print-toggle-section .print-toggle-row:hover,
.print-toggle-section .print-toggle-row:has(.print-option-radio:checked) {
	border-color: transparent;
	background: transparent;
}

.print-toggle-section .print-toggle-row .print-option-radio {
	margin: 0;
}

.print-toggle-section .print-toggle-row .print-option-copy {
	flex-direction: row;
	align-items: baseline;
	gap: 8px;
}

.print-toggle-section .print-toggle-row .print-option-label {
	font-weight: 500;
}

/* Inline, beside what it is about - these used to be alert() dialogs. */
.print-dialog-error {
	margin-top: 10px;
	padding: 8px 10px;
	border: 1px solid #f0c2c2;
	border-radius: 6px;
	background: #fdf3f3;
	color: #a32020;
	font-size: 12px;
}

.print-dialog-field {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

.print-dialog-field-label {
	font-size: 12px;
	font-weight: 600;
	color: #6b7280;
}

.print-dialog-field-controls {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.print-dialog-field-sep {
	color: #9aa1a9;
	font-size: 12px;
}

.print-dialog-date {
	box-sizing: border-box;
	width: 118px;
	height: 32px;
	padding: 5px 9px;
	border: 1px solid #d4d9df;
	border-radius: 7px;
	background: #fff;
	font: inherit;
	font-size: 13px;
	outline: 0;
}

.print-dialog-date:focus {
	border-color: #1b74c9;
	box-shadow: 0 0 0 3px rgba(27, 116, 201, .12);
}

/* ---------------------------------------------------------------------------
   #1666: the print dialog's chrome, matching the modern entity editor dialogs -
   rounded, no title bar, the title inside the body and the close button floating
   over the top-right corner. Deliberately not reusing .modern-entity-editor-dialog:
   that one fixes its own height, and a print chooser should size to its content.
   --------------------------------------------------------------------------- */
.print-dialog-shell.ui-dialog {
	padding: 0;
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 18px 45px rgba(0, 0, 0, .18), 0 4px 12px rgba(0, 0, 0, .08);
	overflow: hidden;
	box-sizing: border-box;
}

/* The bar becomes just the close button, sitting over the content. */
.print-dialog-shell .ui-dialog-titlebar {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 4;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	width: auto;
	height: 28px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.print-dialog-shell .ui-dialog-title {
	display: none;
}

.print-dialog-shell .ui-dialog-titlebar-close {
	position: static !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px !important;
	height: 28px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0;
	border-radius: 6px;
	background: transparent;
	opacity: .55;
	transition: background-color .15s ease, opacity .15s ease;
}

.print-dialog-shell .ui-dialog-titlebar-close:hover,
.print-dialog-shell .ui-dialog-titlebar-close:focus-visible {
	background: #f0f2f4;
	opacity: 1;
	outline: none;
}

.print-dialog-shell .ui-dialog-titlebar-maximize {
	display: none !important;
}

.print-dialog-shell .ui-dialog-content {
	padding: 16px 18px 14px;
	background: #fff;
}

.print-dialog-shell .ui-dialog-buttonpane {
	margin: 0;
	padding: 10px 14px 12px;
	border-width: 1px 0 0;
	border-style: solid;
	border-color: #e7ebef;
	background: #fff;
	box-sizing: border-box;
}

.print-dialog-shell .ui-dialog-buttonpane .ui-dialog-buttonset {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	margin: 0;
	float: none;
}

/* The in-body title the shell reveals by hiding the bar. Right padding keeps it
   clear of the close button floating above it. */
.print-dialog-title {
	margin: 0 34px 10px 0;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.25;
	color: #1a1a1a;
}

/* #1666: the dialog's actions, matching the modern entity editor's - a bordered
   secondary and a solid primary, rather than stock jQuery UI grey. */
.print-dialog-shell .ui-dialog-buttonpane button.ui-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	height: 32px;
	margin: 0;
	padding: 0 14px;
	border: 1px solid #d5dce4;
	border-radius: 7px;
	background: #fff;
	color: #395066;
	box-shadow: none;
	font-family: 'Manrope', sans-serif;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	box-sizing: border-box;
	cursor: pointer;
}

.print-dialog-shell .ui-dialog-buttonpane button.ui-button:hover {
	border-color: #bfcad6;
	background: #f5f8fb;
	color: #23384f;
}

.print-dialog-shell .ui-dialog-buttonpane button.ui-button:focus-visible {
	outline: none;
	border-color: #8cb2e5;
	box-shadow: 0 0 0 2px rgba(0, 82, 155, .16);
}

.print-dialog-shell .ui-dialog-buttonpane button.ui-button .ui-button-text {
	padding: 0;
	line-height: 1;
}

.print-dialog-shell .ui-dialog-buttonpane button.ui-button.print-dialog-button-primary {
	border-color: #00529b;
	background: #00529b;
	color: #fff;
}

.print-dialog-shell .ui-dialog-buttonpane button.ui-button.print-dialog-button-primary:hover {
	border-color: #003d73;
	background: #003d73;
	color: #fff;
}

/* Record conflict review ("This record has changed"). Rides the vc-utility-dialog modal
   shell; rules here style the comparison content only. */
.record-recovery-dialog .ui-dialog-content {
	padding: 6px 16px 16px;
}

.record-recovery-lead {
	margin: 0 0 14px;
	overflow-wrap: anywhere;
}

.record-recovery-grid {
	max-height: 46vh;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	overflow: auto;
}

.record-recovery-head,
.record-recovery-row {
	display: grid;
	grid-template-columns: minmax(130px, 1.1fr) minmax(0, 1fr) minmax(0, 1fr);
	gap: 12px;
	align-items: start;
	padding: 9px 12px;
}

.record-recovery-head {
	position: sticky;
	top: 0;
	z-index: 1;
	border-bottom: 1px solid #e2e8f0;
	background: #f8fafc;
	color: #64748b;
	font-size: 10.5px;
	font-weight: 700;
	line-height: 14px;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.record-recovery-row + .record-recovery-row {
	border-top: 1px solid #eef2f6;
}

.record-recovery-row.is-conflict {
	background: #fffaf0;
}

.record-recovery-field {
	min-width: 0;
	color: #151d29;
	font-weight: 700;
	overflow-wrap: anywhere;
}

.record-recovery-flag {
	display: inline-block;
	margin-left: 8px;
	padding: 0 7px;
	border: 1px solid #f5d795;
	border-radius: 999px;
	background: #fff7e6;
	color: #a86100;
	font-size: 10.5px;
	font-weight: 700;
	line-height: 16px;
	vertical-align: 1px;
	white-space: nowrap;
}

.record-recovery-value {
	min-width: 0;
	color: #3b4856;
	font-weight: 500;
	overflow-wrap: anywhere;
	white-space: pre-wrap;
}

.record-recovery-value-empty,
.record-recovery-value-untouched,
.record-recovery-value-pending {
	color: #94a3b8;
	font-style: italic;
}

.record-recovery-note {
	margin: 12px 0 0;
	color: #6f7782;
	font-size: 12px;
	line-height: 17px;
}

/* Hydration failure: a scoped empty state with Retry, never an incomplete editable form. */
.record-load-error {
	display: flex;
	justify-content: center;
	padding: 64px 24px;
}

.record-load-error-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: 380px;
	padding: 28px 28px 24px;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(20, 32, 46, .05);
	text-align: center;
}

.record-load-error-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-bottom: 14px;
	border: 1px solid #f5d795;
	border-radius: 999px;
	background: #fff7e6;
	color: #a86100;
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	box-sizing: border-box;
}

.record-load-error-icon:before {
	content: "!";
}

.record-load-error-title {
	margin: 0 0 6px;
	color: #151d29;
	font-size: 15px;
	font-weight: 700;
	line-height: 20px;
}

.record-load-error-text {
	margin: 0 0 18px;
	color: #3b4856;
	font-size: 13px;
	font-weight: 500;
	line-height: 18px;
}

/* #1759: a start/end pair whose End is at or before its Start (ParetoPickerSpanner). The editor
   field styles strip borders and shadows with very specific selectors, so this needs !important. */
input.pareto_picker_input.pareto-range-invalid {
	color: #c62828 !important;
	box-shadow: inset 0 -2px 0 #d93025 !important;
}

/* #1766: a note's state at the end of its title line in the activity notes list:
   "Draft" (styled like the contact notes panel's status) or a lock once completed. */
.appointment-editor-notes-card-title {
	display: flex;
	align-items: center;
	gap: 6px;
}

.appointment-editor-notes-card-title-text {
	flex: 1 1 auto;
}

.appointment-editor-notes-card-state {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	color: #9aa5b1;
}

.appointment-editor-notes-card-state.is-draft {
	font-size: 9px;
	font-weight: 600;
	letter-spacing: 0.5px;
	line-height: 12px;
	color: #8a8a8a;
	border: 1px dashed #c8c8c8;
	border-radius: 4px;
	padding: 1px 4px;
}