/* =====================================================================
   DESIGN TOKENS — single source of truth for the task-list palette.
   Every table / toolbar / badge / chip / board rule below reads its colour
   from these var(--ai-*) tokens instead of a hardcoded hex. To restyle the
   whole list, change values HERE — nothing else. To theme another Docent
   site, override this :root block and the components follow automatically.
   ===================================================================== */
:root {
  /* Brand accent — links, primary button, active chip, owner avatar */
  --ai-accent:        #3d6aa5;   /* softer denim */
  --ai-accent-dark:   #315887;   /* hover / pressed */
  --ai-accent-soft:   #eaf1f8;   /* tint background   */
  --ai-accent-border: #cdddee;   /* tint border       */
  --ai-accent-rgb:    61,106,165;/* focus ring (matches --ai-accent) */

  /* Status hues — dots, priority chips, state pills */
  --ai-green:         #2f9e57;
  --ai-green-soft:    #e5f5ec;
  --ai-green-border:  #bfe6cd;
  --ai-red:           #d23b3b;
  --ai-red-soft:      #fde8e8;
  --ai-red-border:    #f4cccc;
  --ai-amber:         #c98a12;
  --ai-amber-soft:    #fdf3dc;

  /* Neutrals — text, borders */
  --ai-ink:           #1a2231;   /* strongest text  */
  --ai-text:          #5a6273;   /* body / labels   */
  --ai-muted:         #647087;   /* secondary text  */
  --ai-border:        #cfd6e4;   /* control borders */
  --ai-border-soft:   #e2e7f0;   /* hairlines       */

  /* Table header + soft surfaces */
  --ai-header-bg:     #f6f7fb;
  --ai-header-text:   #5b6577;
  --ai-header-border: #e6eaf1;
  --ai-surface-soft:  #f8fafc;   /* chips, board columns */

  /* Structure — line weights, corner radii, spacing */
  --ai-border-w:      1px;       /* standard hairline / control border */
  --ai-stripe-w:      3px;       /* board card status stripe            */
  --ai-radius:        8px;       /* buttons, inputs, cards              */
  --ai-radius-lg:     10px;      /* board columns, lane container       */
  --ai-radius-sm:     6px;       /* pagination, length select           */
  --ai-radius-xs:     5px;       /* priority chip                       */
  --ai-radius-pill:   999px;     /* filter chips, state pills, counts   */

  /* Type — sizes + weights (icons scale off --ai-ic) */
  --ai-label:         11.5px;    /* header labels + badges              */
  --ai-row:           13.5px;    /* row body text                       */
  --ai-weight-semi:   600;
  --ai-weight-bold:   700;
  --ai-weight-title:  500;      /* task-title text — "half bold"        */
  --ai-ic:            12px;      /* standard chip / control icon size   */
}

body,
html body {
	color: #222
}

body #portal-footer-wrapper {
   background: #47a3b6;
   padding: 0.3rem;
   font-size: 85%;
}

#project_name {max-width: 160px; ;}

body.template-login #portal-anontools {
	display: none !important;
}

input[type=checkbox],
input[type=radio] {
	opacity: 1;
}

.userrole-anonymous #content-header {
	max-width: 1300px;
	margin: auto
}

.userrole-anonymous #portal-top {
	color: white;
}

#portal-anontools {
	margin: auto;
	width: 100%;
	display: block
}

#portal-anontools ul {
	margin: auto !important;
	max-width: 1380px;
	width: 100%;
	text-align: right;
	display: block;
}

#portal-anontools li a {
	text-decoration: none;
	color: #05386B;
	transition: 0.4s;
	font-family: "Roboto", sans-serif;
	padding: 12px 25px;
	border-radius: 30px;
	font-weight: 500;
	font-size: 15px;
	min-width: 150px;
	border: 1px solid;
	background: #F24C3D;
	color: white;
}

#portal-anontools li a:hover {
	text-decoration: underline;
	color: white !important;
}

.profile-setup a {
	font-weight: bolder;
}

.profile-setup a:hover {
	text-decoration: underline
}

.managePortlets-row {
	display: none !important
}

body.template-manage-portlets #portal-column-two {
	display: block !important
}

thead,
.dataTable th {
	font-weight: bold;
	margin-bottom: 3px;
	color: black
}

.mention,
.mentions {
	background: #D2B48C
}

#mainnavigation-wrapper {
	display: none !important
}

#header a {
	color: black;
}

.hidden {
	display: none !important
}

#viewlet-below-content-title {
	display: none
}

#viewlet-below-content legend {
	font-size: 14px;
	display: none
}

#viewlet-below-content fieldset>p {
	display: none
}

#commenting {
	padding: 10px
}

.mentions-dropdown div {
	padding: 4px 8px;
	cursor: pointer;
}

.mentions-dropdown div:hover {
	background-color: #007acc;
	color: white;
}

h1.priority-1 {
	color: #F24C3D
}

h1.priority-3 {
	color: #22A699
}

h1.priority-2 {
	color: #F2BE22
}

h1.priority-x3 {
	color: #F29727
}

h1.priority-xx1 {
	color: #F24C3D
}

h1.priority-x1 {
	color: red
}

.black {
	color: black
}

.autotoc-nav {
	xbackground: whitesmoke
}

.autotoc-nav .active {
	xbackground: white
}

.white-background {
	xbackground: white
}

body {
	xbackground: whitesmoke
}

.xpat-autotoc.autotabs {
	background: white
}

fieldset {
	xbackground: white;
	padding-left: 2rem;
	padding-right: 2rem;
}

td {
	padding: 3px 12px;
	xbackground: rgba(254, 255, 255, 0.5913176);
	margin: 1px;
}

.calendarsheet {
	max-width: 120px;
	min-width: 90px;
	float: right;
	display: block;
}

.calendarsheet.left {
	float: left;
	opacity: 0.6
}

.redborder.calendarsheet time {
	background: red;
}

.calendarsheet time,
.calendarsheet p,
.calendarsheet date {
	display: block;
	text-align: center;
}

.colorborder {
	border: 5px solid;
}

.redborder {
	border: 5px solid red;
}

.urgent_red {
	border-color: red
}

.soon_yellow {
	border-color: orange
}

.future_green {
	border-color: green
}

.long_grey {
	border-color: #123456
}

.redborder p.theading,
.urgent_red p.theading {
	background: red
}

.soon_yellow p.theading {
	background: orange
}

.future_green p.theading {
	background: green
}

.long_grey p.theading {
	background: #123456
}

.calendarsheet time,
.calendarsheet p.theading {
	color: white !important;
	margin: 0
}

.calendarsheet .days,
.calendarsheet date {
	background: white;
	color: black;
	font-size: 3rem;
	font-weight: 500;
	letter-spacing: -3px;
	margin: 0;
}

.larger {
	font-size: 120%
}

@media (min-width:100px) {

	div.soon_yellow.colorborder.calendarsheet {
		position: relative;
		top: -2.5rem;
		;
	}

}

.pri-box.flex {
	display: flex
}

.priority-1 span {
	color: red;
	padding: 1px 5px
}

.priority-2 span {
	color: orange;
	padding: 1px 5px
}

.priority-3 span {
	color: green;
	padding: 1px 5px
}

span.previousdue-True {
	color: silver;
}

#traffic-light {
	background: #444;
	border-radius: 3px;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	align-items: center;
	width: 17px;
	height: 35px;
}

#traffic-light>span {
	border-radius: 50%;
	width: 6px;
	height: 6px;
	padding: 0;
	display: block;
	opacity: 0.33
}

#traffic-light .active-True {
	opacity: 1 !important;
	width: 10px;
	height: 10px
}

.late14-True {
	color: red
}

span.late14-True {}

.soon14-True {
	color: orange
}

span.later-True {
	color: green
}

#toolbar select {
	background: none !important
}

.pat-discussion span.required,
.pat-discussion .formControls {
	display: none
}

.section-notes.template-full_view .item h1,
.section-notes.template-full_view p.lead,
.template-note-view.template-full_view h1,
.template-note-view.template-full_view p.lead,
.section-postit_notes.template-full_view .item h1,
.section-postit_notes.template-full_view p.lead,
.template-post-it-note-view.template-full_view h1,
.template-post-it-note-view.template-full_view p.lead,
.section-notes #content-core header {
	display: none
}

.section-notes.template-full_view #content-core,
.template-note-view.template-full_view #content-core,
.section-postit_notes.template-full_view #content-core,
.template-post-it-note-view.template-full_view #content-core {
	display: grid;
	grid-template-columns: 1fr;
	/* default to 1 column */
	gap: 1rem;
	/* optional spacing between items */
}

.subsection-postit-collection #main-container {
	display: flex;
	flex-direction: column-reverse;
	width: 100%;
}

#portal-column-two.overlay {
	display: flex !important;
	max-width: calc(100% + 1rem) !important;
	width: calc(100% + 1rem) !important;
	margin: 1rem 0 1rem 1rem;
	height: auto;
	background: whitesmoke !important;
}

#portal-column-two.overlay .portletWrapper {
	background: none !important;
	padding: 0;
	margin: 1rem 0 0
}

@media (min-width: 768px) {

	.section-notes.template-full_view #content-core,
	.template-note-view.template-full_view #content-core,
	.section-postit_notes.template-full_view #content-core,
	.template-post-it-note-view.template-full_view #content-core {
		xgrid-template-columns: 1fr 1fr;
		/* two 

columns on large screens */
	}

}

.card-big-shadow {
	max-width: 620px;
	position: relative;
}

.coloured-cards .card {
	margin-top: 30px;
}

.card[data-radius="none"] {
	border-radius: 0px;
}

.card {
	border-radius: 8px;
	box-shadow: 0 2px 2px rgba(204, 197, 185, 0.5);
	background-color: #FFFFFF;
	color: #252422;
	margin-bottom: 20px;
	position: relative;
	z-index: 1;
}

.card[data-background="image"] .title,
.card[data-background="image"] .stats,
.card[data-background="image"] .category,
.card[data-background="image"] .description,
.card[data-background="image"] .content,
.card[data-background="image"] .card-footer,
.card[data-background="image"] small,
.card[data-background="image"] .content a,
.card[data-background="color"] .title,
.card[data-background="color"] .stats,
.card[data-background="color"] .category,
.card[data-background="color"] .description,
.card[data-background="color"] .content,
.card[data-background="color"] .card-footer,
.card[data-background="color"] small,
.card[data-background="color"] .content a {
	color: #444;
}

.card.card-just-text .content {
	padding: 50px 65px;
	text-align: xcenter;
}

.card .content {
	padding: 10px 10px 10px 10px;
}

.card[data-color="blue"] .category {
	color: #7a9e9f;
}

.card .category,
.card .label {
	font-size: 14px;
	margin-bottom: 0px;
}

.card-big-shadow:before {
	background-image: url("http://static.tumblr.com/i21wc39/coTmrkw40/shadow.png");
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	bottom: -12%;
	content: "";
	display: block;
	left: -12%;
	position: absolute;
	right: 0;
	top: -1px;
	z-index: 0;
}

h4,
.h4 {
	font-size: 1.5em;
	font-weight: 600;
	line-height: 1.2em;
}

h6,
.h6 {
	font-size: 0.9em;
	font-weight: 600;
	text-transform: uppercase;
}

.card .description {
	font-size: 16px;
	color: #66615b;
}

.content-card {
	margin-top: 30px;
}

a:hover,
a:focus {
	text-decoration: none;
}

/*======== COLORS ===========*/

.card[data-color="blue"] {
	background: #b8d8d8;
}

.card[data-color="blue"] .description {
	color: #506568;
}

.card[data-color="green"] {
	background: #d5e5a3;
}

.card[data-color="green"] .description {
	color: #60773d;
}

.card[data-color="green"] .category {
	color: #92ac56;
}

.card[data-color="yellow"] {
	background: #ffe28c;
}

.card[data-color="yellow"] .description {
	color: #b25825;
}

.card[data-color="yellow"] .category {
	color: #d88715;
}

.card[data-color="brown"] {
	background: #d6c1ab;
}

.card[data-color="brown"] .description {
	color: #75442e;
}

.card[data-color="brown"] .category {
	color: #a47e65;
}

.card[data-color="purple"] {
	background: #baa9ba;
}

.card[data-color="purple"] .description {
	color: #3a283d;
}

.card[data-color="purple"] .category {
	color: #5a283d;
}

.card[data-color="orange"] {
	background: #ff8f5e;
}

.card[data-color="orange"] .description {
	color: #772510;
}

.card[data-color="orange"] .category {
	color: #e95e37;
}

.greyed {
	opacity: 0.25
}

a {
	opacity: 1
}

.flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}

.flex-start {
	justify-content: flex-start !important;
}

#toolbar {
	padding: 0;
	max-width: 1680px;
	margin: auto;
	min-height: 122px;
}

#toolbar .flex {
	justify-content: space-between;
	margin: 0
}

#toolbar img {
	width: 2rem;
}

#document_manager img,
#meeting_select img {
	width: 1.3rem;
}

#toolbar {
	background: #D2D2D2;
	font-size: 10pt;
	width: 100%; 
}

#toolbar .not-toggle img:active {
	transform: rotate(15deg);
  }


#toolbar .border {
	border-right: 1px solid #333;
	width: 1px;
}

#pmtoolbargroup {
	border-left: 1px solid silver;
}
 
#pmtoolbargroup .toolbargroup  {
	border-right: 0 none;
	border-left: 0 none;
} 

.toolbargroup {
	border-left: 1px solid silver;
	padding-left: 1rem;
	padding-right: 1rem;
}

#teamtoolbargroup {
	border-right: 1px solid silver;
}

#toolbar>div {
	padding: 0.4rem 1rem 1.5rem;
	flex-grow: 1;
	position: relative
}

.toolbar_label {
	text-align: center;
	font-weight: 600 !important;
	position: absolute;
	bottom: -7px;
	left: 0;
	right: 0;
	xbackground: black;
	line-height: 125%;
	color: #555555 !important
}

.toolbar_label a {
	font-weight: 600 !important;
}

#toolbar {
	text-align: center;
	font-size: 10pt;
	text-transform: none !important
}

#toolbar * {
	text-transform: none !important;
	font-size: 10pt;
	font-family: Helvetica !important;
	font-weight: normal;
	color: black !important
}

#toolbar .messagetype,
#toolbar .stoplight {
	font-size: 90%;
	margin: 4px 0 8px;
	padding-left: 1px;
	padding-right: 0;
	width: 15pt;
	height: 15pt;
	padding: 3px;
	border-radius: 50%;
	background-color: gray
}

#toolbar .red {
	background: red;
	color: white
}

#toolbar .yellow {
	background: yellow
}

#toolbar .green {
	background: green;
	color: white
}

#toolbar .info {
	background: #40E0D0
}

#toolbar select {
	border-color: black;
	border-width: 1px;
	padding: 0 3px;
	margin-bottom: 9px;
	border-radius: 4px;
}

#toolbar input,
#toolbar select {
	height: auto
}

#toolbar a {
	color: black;
	text-decoration: none;
	text-transform: none !important;
	border-bottom: 0 dotted #E2E2E2 !important
}

#toolbar p {
	padding: 0;
	margin: 0;
	line-height: 120%
}

#toolbar #help_div {
	border-right: 0 none
}

#document_type_select {
	text-align: center
}

#toolbar #site_logo img {
	width: 3rem;
	height: 3rem;
	margin-bottom: 4px
}

#xmeeting_create img {
	margin-bottom: 10px;
}

p.align-left {
	text-align: left
}

#xcreate_meeting {
	border: 0 none !important;
	background: none
}

#create_meeting {
	background-image: none
}

/* Fake toolbar dropdown */

#toolbar .custom-select {
	position: relative;
	display: inline-block;
	text-align: left;
}

#toolbar .selected {
	border: 1px solid;
	border-radius: 3px;
}

#toolbar .selected img {
	width: 20px;
	height: 20px;
	margin-right: 8px;
}

#toolbar .options {
	display: none;
	position: absolute;
	background: #EEE;
	width: 150px;
	top: 0;
	border: 1px solid #ccc;
	z-index: 10;
	border-radius: 6px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}


#customSelect div {
	padding: 0 3px;
}

#toolbar .option {
	padding: 3px;
	display: flex;
	align-items: center;
	cursor: pointer;
}

#toolbar .option img {
	width: 16px;
	height: 16px;
	margin-right: 4px;
}

#show-toobar button {
	border: 0 none;
	padding: 0 10px 0 0;
	padding-inline: 0;
	background: white;
	line-height: 120%;
}

#show-toobar img {
	margin: 0 5px 0 0;
	padding: 0
}

body #portal-column-two {
	background: white !important;
	border: 1px solid;
	border-radius: 5px;
	background: white !important;
	padding-bottom: 2rem
}

.portletWrapper {
	background: white !important
}

.pat-collectionfilter .card-body,
.pat-collectionfilter,
.collectionFilter .card-body,
.collectionFilter,
.pat-collectionfilter,
.card-header.portletHeader {
	background: none !important;
	padding: 0 7px;
	font-weight: bold;
	border: 0 none !important;
	margin: 0;
}

.margin-auto {
	margin: auto;
}

body {
	 background: #FAFAF9 !important;
 
	/* background: #FAF9F6 !important; */
}

.frontend fieldset {
	background: white
}

.frontend fieldset.autotoc-section {
	padding: 1rem;
}

.frontend .pat-autotoc.autotabs .autotoc-nav {
	margin-bottom: 0;
}

.frontend .autotoc-level-1.active {
	background: white;
	color: black !important;
}

/* Tab labels: unselected tabs use a muted palette grey instead of the site's
   red link colour. The selected tab keeps its colour (rule above). */
.pat-autotoc.autotabs .autotoc-nav a:not(.active) {
	color: var(--ai-muted) !important;
}
.pat-autotoc.autotabs .autotoc-nav a:not(.active):hover {
	color: var(--ai-ink) !important;
}

#toggle-filters,
#toggle-filters img {
	background: white;
	border-radius: 5px;
}

#toggle-filters {
	padding: 3px 5px 0;
}

#portal-breadcrumbs {
	background: none !important;
}

h1.priority-1 {
	color: #F24C3D
}

h1.priority-3 {
	color: #22A699
}

h1.priority-2 {
	color: #F2BE22
}

h1.priority-x3 {
	color: #F29727
}

h1.priority-xx1 {
	color: #F24C3D
}

h1.priority-x1 {
	color: red
}

.black {
	color: black
}

.autotoc-nav {
	xbackground: whitesmoke
}

.autotoc-nav .active {
	xbackground: white
}

.white-background {
	xbackground: white
}

body {
	xbackground: whitesmoke
}

.xpat-autotoc.autotabs {
	background: white
}

fieldset {
	padding-left: 2rem;
	padding-right: 2rem;
}

td {
	padding: 3px 12px;
	margin: 1px;
}

.calendarsheet {
	max-width: 120px;
	min-width: 90px;
	float: right;
	display: block;
}

.calendarsheet.left {
	float: left;
	opacity: 0.6
}

.redborder.calendarsheet time {
	background: red;
}

.calendarsheet time,
.calendarsheet p,
.calendarsheet date {
	display: block;
	text-align: center;
}

.colorborder {
	border: 5px solid;
}

.redborder {
	border: 5px solid red;
}

.urgent_red {
	border-color: red
}

.soon_yellow {
	border-color: orange
}

.future_green {
	border-color: green
}

.long_grey {
	border-color: #123456
}

.redborder p.theading,
.urgent_red p.theading {
	background: red
}

.soon_yellow p.theading {
	background: orange
}

.future_green p.theading {
	background: green
}

.long_grey p.theading {
	background: #123456
}

#tl-1 {
	background: #FF0000
}

#tl-2 {
	background: #FFFF00
}

#tl-3 {
	background: #00FF00
}

.calendarsheet time,
.calendarsheet p.theading {
	color: white !important;
	margin: 0
}

.calendarsheet .days,
.calendarsheet date {
	background: white;
	color: black;
	font-size: 3rem;
	font-weight: 500;
	letter-spacing: -3px;
	margin: 0;
}

.larger {
	font-size: 120%
}

@media (min-width:100px) {

	div.soon_yellow.colorborder.calendarsheet {
		position: relative;
		top: -2.5rem;
	}

}

#portal-column-two.overlay {
	display: flex !important;
	max-width: calc(100% + 1rem) !important;
	width: calc(100% + 1rem) !important;
	margin: 1rem 0 1rem 1rem;
	height: auto;
	background: whitesmoke !important;
}

#portal-column-two.overlay .portletWrapper {
	background: none !important;
	padding: 0;
	margin: 1rem 0 0
}

div.comment {
	xborder-top: 1px dotted black;
	box-shadow: 5px 5px 16px #CCC;
	margin-bottom: 1rem !important;
}

.pat-discussion .comment-action,
form.comment-action,
.comment-action.action-delete {
	margin-bottom: 0 !important
}

.comment-body {
	display: flex;
	justify-content: space-between
}

form .hidden-widget {
	display: none
}

.comment:not(.level-0)::before {
	content: "↳";
	width: 1rem;
	float: left;
	display: block;
	left: -2rem;
	top: -1rem;
	;
}

#formfield-form-widgets-in_reply_to,
#formfield-form-widgets-author_name {
	margin-bottom: 0
}


div.comment button {
	border: none;
	background: none;
	color: #007bb1;
}

div.comment div.comment-author a {
	font-size: 150%;
	font-weight: bold;
	color: black !important;
	margin-right: auto;
	;
}

div.comment-author {
	display: flex;
	width: 100%
}


.table,
table.invisible-grid,
table.listing,
table.listing-compact,
table.plain {
	--bs-table-color-type: initial;
	--bs-table-bg-type: initial;
	--bs-table-color-state: initial;
	--bs-table-bg-state: initial;
	--bs-table-color: var(--bs-emphasis-color);
	--bs-table-bg: var(--bs-body-bg);
	--bs-table-border-color: var(--bs-border-color);
	--bs-table-accent-bg: transparent;
	--bs-table-striped-color: red;
	--bs-table-striped-bg: rgba(var(--bs-emphasis-color-rgb), 0.05);
	--bs-table-active-color: var(--bs-emphasis-color);
	--bs-table-active-bg: rgba(var(--bs-emphasis-color-rgb), 0.1);
	--bs-table-hover-color: var(--bs-emphasis-color);
	--bs-table-hover-bg: rgba(var(--bs-emphasis-color-rgb), 0.075);
	width: 100%;
	margin-bottom: 1rem;
	vertical-align: top;
	border-color: var(--bs-table-border-color);
}

.table>:not(caption)>*>*,
table.invisible-grid>:not(caption)>*>*,
table.listing-compact>:not(caption)>*>*,
table.listing>:not(caption)>*>*,
table.plain>:not(caption)>*>* {
	padding: .5rem .5rem;
	color: var(--bs-table-color-state, var(--bs-table-color-type, var(--bs-table-color)));
	background-color: var(--bs-table-bg);
	border-bottom-width: var(--bs-border-width);
	box-shadow: inset 0 0 0 9999px var(--bs-table-bg-state, var(--bs-table-bg-type, var(--bs-table-accent-bg)))
}

.table>tbody,
table.invisible-grid>tbody,
table.listing-compact>tbody,
table.listing>tbody,
table.plain>tbody {
	vertical-align: inherit
}

.table>thead,
table.invisible-grid>thead,
table.listing-compact>thead,
table.listing>thead,
table.plain>thead {
	vertical-align: bottom
}

.table-group-divider {
	border-top: calc(var(--bs-border-width) * 2) solid currentcolor
}

.caption-top {
	caption-side: top
}

.table-sm>:not(caption)>*>*,
table.listing-compact>:not(caption)>*>* {
	padding: .25rem .25rem
}

.table-bordered>:not(caption)>*,
table.plain>:not(caption)>* {
	border-width: var(--bs-border-width) 0
}

.table-bordered>:not(caption)>*>*,
table.plain>:not(caption)>*>* {
	border-width: 0 var(--bs-border-width)
}

.table-borderless>:not(caption)>*>*,
table.invisible-grid>:not(caption)>*>* {
	border-bottom-width: 0
}

.table-borderless>:not(:first-child),
table.invisible-grid>:not(:first-child) {
	border-top-width: 0
}

.table-striped>tbody>tr:nth-of-type(odd)>* {
	--bs-table-color-type: var(--bs-table-striped-color);
	--bs-table-bg-type: var(--bs-table-striped-bg)
}

.table-striped-columns>:not(caption)>tr>:nth-child(2n) {
	--bs-table-color-type: var(--bs-table-striped-color);
	--bs-table-bg-type: var(--bs-table-striped-bg)
}

.table-active {
	--bs-table-color-state: var(--bs-table-active-color);
	--bs-table-bg-state: var(--bs-table-active-bg)
}

.table-hover>tbody>tr:hover>* {
	--bs-table-color-state: var(--bs-table-hover-color);
	--bs-table-bg-state: var(--bs-table-hover-bg)
}

.table-primary {
	--bs-table-color: #000;
	--bs-table-bg: #cce5ef;
	--bs-table-border-color: #a3b7bf;
	--bs-table-striped-bg: #c2dae3;
	--bs-table-striped-color: #000;
	--bs-table-active-bg: #b8ced7;
	--bs-table-active-color: #000;
	--bs-table-hover-bg: #bdd4dd;
	--bs-table-hover-color: #000;
	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color)
}

.table-secondary {
	--bs-table-color: #000;
	--bs-table-bg: #e2e3e5;
	--bs-table-border-color: #b5b6b7;
	--bs-table-striped-bg: #d7d8da;
	--bs-table-striped-color: #000;
	--bs-table-active-bg: #cbccce;
	--bs-table-active-color: #000;
	--bs-table-hover-bg: #d1d2d4;
	--bs-table-hover-color: #000;
	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color)
}

.table-success {
	--bs-table-color: #000;
	--bs-table-bg: #d1e7dd;
	--bs-table-border-color: #a7b9b1;
	--bs-table-striped-bg: #c7dbd2;
	--bs-table-striped-color: #000;
	--bs-table-active-bg: #bcd0c7;
	--bs-table-active-color: #000;
	--bs-table-hover-bg: #c1d6cc;
	--bs-table-hover-color: #000;
	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color)
}

.table-info {
	--bs-table-color: #000;
	--bs-table-bg: #cff4fc;
	--bs-table-border-color: #a6c3ca;
	--bs-table-striped-bg: #c5e8ef;
	--bs-table-striped-color: #000;
	--bs-table-active-bg: #badce3;
	--bs-table-active-color: #000;
	--bs-table-hover-bg: #bfe2e9;
	--bs-table-hover-color: #000;
	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color)
}

.table-warning {
	--bs-table-color: #000;
	--bs-table-bg: #fff3cd;
	--bs-table-border-color: #ccc2a4;
	--bs-table-striped-bg: #f2e7c3;
	--bs-table-striped-color: #000;
	--bs-table-active-bg: #e6dbb9;
	--bs-table-active-color: #000;
	--bs-table-hover-bg: #ece1be;
	--bs-table-hover-color: #000;
	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color)
}

.table-danger {
	--bs-table-color: #000;
	--bs-table-bg: #f8d7da;
	--bs-table-border-color: #c6acae;
	--bs-table-striped-bg: #eccccf;
	--bs-table-striped-color: #000;
	--bs-table-active-bg: #dfc2c4;
	--bs-table-active-color: #000;
	--bs-table-hover-bg: #e5c7ca;
	--bs-table-hover-color: #000;
	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color)
}

.table-light {
	--bs-table-color: #000;
	--bs-table-bg: #f8f9fa;
	--bs-table-border-color: #c6c7c8;
	--bs-table-striped-bg: #ecedee;
	--bs-table-striped-color: #000;
	--bs-table-active-bg: #dfe0e1;
	--bs-table-active-color: #000;
	--bs-table-hover-bg: #e5e6e7;
	--bs-table-hover-color: #000;
	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color)
}

.table-dark {
	--bs-table-color: #fff;
	--bs-table-bg: #212529;
	--bs-table-border-color: #4d5154;
	--bs-table-striped-bg: #2c3034;
	--bs-table-striped-color: #fff;
	--bs-table-active-bg: #373b3e;
	--bs-table-active-color: #fff;
	--bs-table-hover-bg: #323539;
	--bs-table-hover-color: #fff;
	color: var(--bs-table-color);
	border-color: var(--bs-table-border-color)
}

.table-responsive {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch
}


.fc-day,
.fc-scrollgrid,
.fc-theme-standard td,
.fc-theme-standard th {
	border-style: solid !important;
	border-color: #414141 !important;
}

.fc-scrollgrid {
	border: 1px sold black !important
}

.fc-col-header-cell {
	background: whitesmoke;
}

a.fc-daygrid-day-number {
	border-bottom: 0px solid green;
}

.dropdown-container {
	display: flex;
	xgap: 20px;
}

.dropdown-item {
	position: relative;
	max-width: 120px;;
}

.not-dropdown,
.not-toggle,
.not-dropdown a,
.dropdown-toggle a {
	background: none;
	border: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px; 
}

.dropdown-toggle {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px; 
	background: none;
	border: none;
}

.dropdown-toggle span,
.dropdown-toggle span:hover,
.dropdown-toggle::after {
	 cursor: default !important; 
}

.main-icon {
	width: 48px;
	height: 48px;
}

.dropdown-content {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	background: white;
	border: 1px solid #ccc;
	min-width: 200px;
	padding: 8px 0;
	z-index: 1000;
}

.dropdown-item.open .dropdown-content {
	display: block;
}

.dropdown-line {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px 12px;
	text-decoration: none;
	color: black;
}

.dropdown-line:hover {
	background: #f0f0f0;
}

.prjdocsblock, 
#myteambargroup { height: 85px}

.prjdocsblock {
	border-left: 1px solid  silver !important;
	margin-left: 1rem;
}

#toolbar img.main-icon,
#toolbargroup img, 
#toolbar img.small-icon,
img.small-icon {
	width: auto !important;
	height: 28px !important;
}

 

.dropdown-toggle.not-toggle::after {
	display: none !important
}

.modal-content .pat-structure .navbar,
.modal-content .pat-structure.navbar  { font-size: 70%}

/* --- Transition note popup ---------------------------------------------- */
.transition-note-overlay {
  position: fixed; inset: 0; z-index: 10000;
  background: rgba(20, 30, 50, 0.55);
  display: flex; align-items: center; justify-content: center;
}
.transition-note-dialog {
  background: #fff; border-radius: 10px; padding: 24px 26px;
  width: min(440px, 92vw); box-shadow: 0 12px 40px rgba(0,0,0,0.3);
}
.transition-note-dialog .transition-note-title { margin: 0 0 14px; font-size: 1.2rem; }
.transition-note-dialog .transition-note-label { display: block; margin-bottom: 6px; font-weight: 600; }
.transition-note-dialog .transition-note-required { font-weight: 400; color: #a4620f; }
.transition-note-dialog textarea { width: 100%; box-sizing: border-box; margin-bottom: 16px; }
.transition-note-dialog .transition-note-buttons { display: flex; justify-content: flex-end; gap: 10px; }

/* Standalone (no-JS) fallback page: keep the form compact */
.transition-note-wrapper .transition-note-form { max-width: 480px; }
.transition-note-wrapper textarea { width: 100%; box-sizing: border-box; margin-bottom: 16px; }
.transition-note-wrapper .transition-note-buttons { display: flex; gap: 10px; }

/* Native <dialog> variant of the transition note popup */
dialog.transition-note-dialog { border: none; }
dialog.transition-note-dialog::backdrop { background: rgba(20, 30, 50, 0.55); }

/* =====================================================================
   Signal table — status atoms for the Action Items overview.
   These style KNOWN field types (review_state / state, priority,
   stoplight) wherever they appear as a configured column, plus a
   column-independent stoplight stripe on the row's first cell. The set
   of columns itself stays admin-configurable (table_columns registry).
   ===================================================================== */

/* (Row stoplight stripe removed — the dedicated status-dot column now carries
   the stoplight color; see .ai-col-dot below.) */

/* Workflow state pill */
.ai-state {
  display: inline-block;
  font-size: var(--ai-label);
  font-weight: var(--ai-weight-semi);
  line-height: 1.4;
  padding: 2px 9px;
  border-radius: var(--ai-radius-pill);
  white-space: nowrap;
  border: var(--ai-border-w) solid transparent;
  background: #eef1f6;
  color: var(--ai-text);
  border-color: var(--ai-border);
}
.ai-state-created   { background: #f1f3f7; color: var(--ai-text);   border-color: var(--ai-border); }
.ai-state-submitted { background: #eef1fd; color: #4658b8;          border-color: #d6ddf8; }
.ai-state-assigned  { background: var(--ai-accent-soft); color: var(--ai-accent); border-color: var(--ai-accent-border); }
.ai-state-accepted  { background: var(--ai-green-soft);  color: var(--ai-green);  border-color: var(--ai-green-border); }
.ai-state-completed { background: var(--ai-green-soft);  color: var(--ai-green);  border-color: var(--ai-green-border); }
.ai-state-rejected  { background: var(--ai-red-soft);    color: var(--ai-red);    border-color: var(--ai-red-border); }
.ai-state-closed    { background: #eceff4; color: var(--ai-text);   border-color: var(--ai-border); }
.ai-state-archived  { background: #e7e9ee; color: #6b7385;          border-color: var(--ai-border); }
.ai-state-published { background: var(--ai-accent-soft); color: var(--ai-accent); border-color: var(--ai-accent-border); }

/* Priority chip */
.ai-prio {
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-size: 11px;
  font-weight: var(--ai-weight-bold);
  padding: 1px 6px;
  border-radius: var(--ai-radius-xs);
  border: var(--ai-border-w) solid;
  white-space: nowrap;
}
.ai-prio-1 { color: var(--ai-red);   border-color: var(--ai-red);   background: var(--ai-red-soft); }
.ai-prio-2 { color: var(--ai-amber); border-color: var(--ai-amber); background: var(--ai-amber-soft); }
.ai-prio-3 { color: var(--ai-green); border-color: var(--ai-green); background: var(--ai-green-soft); }

/* Stoplight dot (only when a 'stoplight' column is configured) */
.ai-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block;
  vertical-align: middle; margin-right: 6px; }
.ai-dot-red    { background: var(--ai-red); }
.ai-dot-yellow { background: var(--ai-amber); }
.ai-dot-green  { background: var(--ai-green); }
.ai-sl-label { font-size: 12.5px; color: var(--ai-text); vertical-align: middle; }

/* =====================================================================
   Tasks list — toolbar + relocated DataTables controls (signal table).
   The search box is moved into .ai-tt-right; the length menu drops to
   the bottom beside the info text; pagination is hidden on a single page.
   ===================================================================== */

.ai-tasks-toolbar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; flex-wrap: wrap;
  padding: 6px 2px 14px; margin-bottom: 10px;
  border-bottom: 1px solid var(--ai-border-soft);
}
.ai-tasks-toolbar .ai-tt-title { font-size: 16px; font-weight: 700; color: var(--ai-ink); letter-spacing: -.01em; }
.ai-tasks-toolbar .ai-tt-right { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

.ai-tt-create {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: var(--ai-weight-semi); color: #fff !important;
  background: var(--ai-accent); border: var(--ai-border-w) solid var(--ai-accent); border-radius: var(--ai-radius);
  padding: 8px 14px; text-decoration: none; white-space: nowrap;
}
.ai-tt-create:hover { background: var(--ai-accent-dark); border-color: var(--ai-accent-dark); color: #fff !important; text-decoration: none; }
.ai-tt-create .ai-tt-plus { font-size: 15px; line-height: 1; font-weight: 700; }

/* ---------------------------------------------------------------------
   Shared DataTables controls — themed the SAME on every listing table.
   The task list additionally relocates its search into .ai-tt-right, but
   the visual styling below is global so all tables match.
   --------------------------------------------------------------------- */

/* Search box: drop the "Search:" label, round it, add a magnifier + focus ring */
.dt-search label, .dataTables_filter label { font-size: 0; margin: 0; }
.dt-search input, .dataTables_filter input {
  border: var(--ai-border-w) solid var(--ai-border); border-radius: var(--ai-radius);
  padding: 7px 11px 7px 32px; font-size: 13px; min-width: 210px; margin: 0;
  color: var(--ai-ink);
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23647087' stroke-width='1.5'%3E%3Ccircle cx='7' cy='7' r='4.5'/%3E%3Cpath d='M11 11l3 3' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat left 11px center;
  background-size: 14px;
}
.dt-search input:focus, .dataTables_filter input:focus {
  outline: none; border-color: var(--ai-accent); box-shadow: 0 0 0 3px rgba(var(--ai-accent-rgb), .18);
}
.ai-tt-right .dt-search, .ai-tt-right .dataTables_filter { margin: 0; }

/* Bottom footer bar: "Show N entries" grouped with "Showing x to y of z".
   Built by the shared JS (and the task-list script) so the length menu drops
   from the top-left into this bar at the bottom-left. */
.ai-dt-foot { display: inline-flex; align-items: center; gap: 4px 12px; flex-wrap: wrap; padding-top: 10px; }
.ai-dt-foot .dt-info::before, .ai-dt-foot .dataTables_info::before {
  content: "·"; margin-right: 12px; color: var(--ai-border); font-weight: 700;
}
.dt-length, .dataTables_length { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--ai-muted); margin: 0; }
.dt-length select, .dataTables_length select {
  border: var(--ai-border-w) solid var(--ai-border); border-radius: var(--ai-radius-sm);
  padding: 3px 26px 3px 9px; font-size: 12.5px; color: var(--ai-ink); background-color: #fff;
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23647087' stroke-width='1.5'%3E%3Cpath d='M4 6l4 4 4-4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 8px center; background-size: 11px;
}
.dt-info, .dataTables_info { font-size: 12.5px; color: var(--ai-muted); padding: 0; margin: 0; }

/* Pagination — tidy denim buttons across every DataTables flavour: plain
   (.dt-paging-button), legacy (.paginate_button) and Bootstrap-integrated
   (ul.pagination > .page-item > .page-link). Anchored to #content (an id) so
   the base theme's red link/border styling can't bleed through. */
#content .dt-paging, #content .dataTables_paginate, #content ul.pagination {
  display: inline-flex; gap: 4px; flex-wrap: wrap; margin: 0; padding: 0; list-style: none;
}
#content .pagination .page-item { margin: 0; list-style: none; }
/* Borderless / minimal (option C): drop the First (« ) and Last ( ») buttons,
   leaving the ‹ › chevrons for prev/next. Height ~22px ≈ 80% of the length
   ("entries per page") control on the left. */
#content .pagination .page-item.first, #content .pagination .page-item.last,
#content .dt-paging .dt-paging-button.first, #content .dt-paging .dt-paging-button.last,
#content .dataTables_paginate .paginate_button.first, #content .dataTables_paginate .paginate_button.last {
  display: none !important;
}
#content .dt-paging .dt-paging-button,
#content .dataTables_paginate .paginate_button,
#content .pagination .page-link {
  border: 1px solid transparent !important;
  border-radius: var(--ai-radius-sm) !important;
  padding: 0 8px !important; margin: 0 !important; height: 22px; min-width: 22px;
  display: inline-flex !important; align-items: center; justify-content: center;
  color: var(--ai-accent) !important; background: transparent !important;
  font-size: 12px !important; line-height: 1 !important;
  box-shadow: none !important; text-decoration: none !important;
}
#content .dt-paging .dt-paging-button:hover,
#content .dataTables_paginate .paginate_button:hover,
#content .pagination .page-link:hover {
  background: var(--ai-accent-soft) !important; border-color: transparent !important;
  color: var(--ai-accent) !important;
}
#content .dt-paging .dt-paging-button.current,
#content .dataTables_paginate .paginate_button.current,
#content .pagination .page-item.active .page-link,
#content .pagination .active > .page-link {
  background: var(--ai-accent) !important; border-color: var(--ai-accent) !important; color: #fff !important;
}
#content .dt-paging .dt-paging-button.disabled,
#content .dataTables_paginate .paginate_button.disabled,
#content .pagination .page-item.disabled .page-link,
#content .pagination .disabled > .page-link {
  opacity: .5 !important; color: var(--ai-muted) !important;
}

/* =====================================================================
   Tasks list — fixed leading columns, lighter header, owner avatar,
   filter chips, and the Workflow Board / Triage Lane tabs.
   ===================================================================== */

/* Lighter header row (was a heavy dark-blue bar). Cover thead / tr / th and
   kill any background image so the softer colour always wins. */
table.pat-datatables thead,
table.pat-datatables thead tr,
table.pat-datatables thead th,
table.pat-datatables.dataTable thead th,
table.listing thead,
table.listing thead tr,
table.listing thead th {
  background: var(--ai-header-bg) !important;
  background-image: none !important;
  color: var(--ai-header-text) !important;
  font-weight: var(--ai-weight-semi) !important;
  font-size: var(--ai-label) !important;
  letter-spacing: .04em;
  text-transform: uppercase;
  border-bottom: var(--ai-border-w) solid var(--ai-header-border) !important;
  border-top: none !important;
  text-shadow: none !important;
}

/* Stronger override. On folder-listing pages (Documents, Project Docs, …) a
   base-theme rule paints the header row blue with a higher-specificity
   (multi-class) selector that beats the rule above. Anchoring to #content /
   #content-core (an id) outranks any class-only rule, so #f6f7fb always wins. */
#content table.listing thead, #content table.listing thead tr, #content table.listing thead th,
#content table.pat-datatables thead, #content table.pat-datatables thead tr, #content table.pat-datatables thead th,
#content table.dataTable thead th, #content table.dataTable thead tr,
#content-core table.listing thead th, #content-core table.listing thead tr,
#content-core table.pat-datatables thead th, #content-core table.dataTable thead th {
  background: var(--ai-header-bg) !important;
  background-image: none !important;
  color: var(--ai-header-text) !important;
  font-weight: var(--ai-weight-semi) !important;
  font-size: var(--ai-label) !important;
  text-transform: uppercase;
  border-bottom: var(--ai-border-w) solid var(--ai-header-border) !important;
  border-top: none !important;
  text-shadow: none !important;
}

/* Fixed leading columns: status dot, ID, Title */
.ai-col-dot { width: 24px; text-align: center; padding-left: 10px !important; padding-right: 4px !important; }
.ai-col-id  { width: 1%; white-space: nowrap; font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-variant-numeric: tabular-nums; color: var(--ai-muted); }
.ai-col-title b { font-weight: var(--ai-weight-title); }
.ai-col-date { width: 1%; white-space: nowrap; color: var(--ai-muted); }
.ai-col-title a { text-decoration: none; }
.ai-col-title a:hover b { text-decoration: underline; }

/* Status dot (first column), keyed off stoplight (due / days-left) */
.ai-dot { width: 11px; height: 11px; border-radius: 50%; display: inline-block; vertical-align: middle; }
.ai-dot-red    { background: var(--ai-red); }
.ai-dot-yellow { background: var(--ai-amber); }
.ai-dot-green  { background: var(--ai-green); }

/* Responsible person: avatar circle + last name only */
.ai-owner { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.ai-owner-name { font-size: 13px; }
.ai-av {
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--av-bg, var(--ai-accent)); color: #fff; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 10px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase;
}

/* Filter chips (All / Mine / Urgent / Open only) */
.ai-tt-left { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ai-filters { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.ai-chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12.5px; font-weight: var(--ai-weight-semi); color: var(--ai-muted);
  background: var(--ai-surface-soft); border: var(--ai-border-w) solid var(--ai-border); border-radius: var(--ai-radius-pill);
  padding: 4px 12px; cursor: pointer; line-height: 1.4;
  text-decoration: none;
}
.ai-chip-ic { width: var(--ai-ic); height: var(--ai-ic); flex: none; opacity: .55; }
.ai-chip:hover .ai-chip-ic { opacity: .8; }
.ai-chip.active .ai-chip-ic { opacity: 1; }
.ai-chip:hover { border-color: #a9b4c8; text-decoration: none; }
.ai-chip.active { color: var(--ai-accent); background: var(--ai-accent-soft); border-color: var(--ai-accent); }

/* Shared intro/description text under a tab's legend — one look for the
   Priority, Urgency, Workflow Board and Triage Lane tabs so they all match. */
.ai-tab-intro {
  font-size: 14px; line-height: 1.5; color: var(--ai-text);
  margin: 4px 0 16px; max-width: 70ch;
}

/* ---------- Workflow Board ---------- */
.ai-board-caption { color: var(--ai-muted); font-size: 13px; margin: 4px 0 14px; }
.ai-board { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 8px; }
.ai-col {
  flex: 0 0 230px; background: var(--ai-surface-soft); border: var(--ai-border-w) solid var(--ai-border-soft); border-radius: var(--ai-radius-lg);
  display: flex; flex-direction: column; max-height: 560px;
}
.ai-colhead {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 10px 12px; border-bottom: var(--ai-border-w) solid var(--ai-border-soft);
}
.ai-cname { font-size: 12.5px; font-weight: var(--ai-weight-bold); color: var(--ai-ink); }
.ai-cnt {
  font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 11px; color: var(--ai-muted);
  background: #fff; border: var(--ai-border-w) solid var(--ai-border); border-radius: var(--ai-radius-pill); padding: 0 7px;
}
.ai-colbody { padding: 10px; display: flex; flex-direction: column; gap: 10px; overflow-y: auto; }
.ai-card {
  display: block; text-decoration: none; color: inherit;
  background: #fff; border: var(--ai-border-w) solid var(--ai-border-soft); border-left: var(--ai-stripe-w) solid var(--ai-border);
  border-radius: var(--ai-radius); padding: 10px 11px;
  box-shadow: 0 1px 2px rgba(20,30,50,.05);
}
.ai-card:hover { border-color: #b9c3d6; box-shadow: 0 3px 10px rgba(20,30,50,.10); }
.ai-card.ai-cl-red    { border-left-color: var(--ai-red); }
.ai-card.ai-cl-yellow { border-left-color: var(--ai-amber); }
.ai-card.ai-cl-green  { border-left-color: var(--ai-green); }
.ai-ct { font-size: 13px; font-weight: 600; line-height: 1.35; margin-bottom: 8px; color: var(--ai-ink); }
.ai-cmeta { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ai-cid { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 10.5px; color: var(--ai-muted); }
.ai-empty { color: #9aa6bd; font-size: 12px; text-align: center; padding: 8px 0; margin: 0; }

/* ---------- Triage Lanes ---------- */
.ai-lanes { display: flex; flex-direction: column; border: var(--ai-border-w) solid var(--ai-border-soft); border-radius: var(--ai-radius-lg); overflow: hidden; }
.ai-lane { display: grid; grid-template-columns: 150px 1fr; border-bottom: var(--ai-border-w) solid var(--ai-border-soft); }
.ai-lane:last-child { border-bottom: none; }
.ai-lhead { padding: 14px 16px; display: flex; flex-direction: column; gap: 3px; border-right: var(--ai-border-w) solid var(--ai-border-soft); }
.ai-lname { font-weight: var(--ai-weight-bold); font-size: 14px; color: var(--ai-ink); }
.ai-lcount { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12px; color: var(--ai-muted); }
.ai-lane-red    { background: linear-gradient(90deg, #fdecec, transparent 42%); }
.ai-lane-yellow { background: linear-gradient(90deg, #fdf5e3, transparent 42%); }
.ai-lane-green  { background: linear-gradient(90deg, #e9f6ef, transparent 42%); }
.ai-lbody { display: flex; gap: 10px; padding: 12px 14px; overflow-x: auto; }
.ai-mini {
  flex: 0 0 220px; text-decoration: none; color: inherit;
  background: #fff; border: var(--ai-border-w) solid var(--ai-border-soft); border-radius: var(--ai-radius); padding: 10px 11px;
  box-shadow: 0 1px 2px rgba(20,30,50,.05);
}
.ai-mini:hover { border-color: #b9c3d6; box-shadow: 0 3px 10px rgba(20,30,50,.10); }
.ai-mt { font-size: 12.5px; font-weight: 600; line-height: 1.35; margin-bottom: 8px; min-height: 34px; color: var(--ai-ink); }
.ai-mm { display: flex; align-items: center; justify-content: space-between; gap: 8px; }

/* Collection-filter widget, relocated into the toolbar next to search and compacted */
.ai-tt-right .ai-compact-filter {
  margin: 0 !important; padding: 0 !important; border: none !important;
  box-shadow: none !important; background: none !important; max-width: 220px;
}
.ai-tt-right .ai-compact-filter .portletHeader,
.ai-tt-right .ai-compact-filter .card-header,
.ai-tt-right .ai-compact-filter .portletFooter { display: none !important; }
.ai-tt-right .ai-compact-filter .card-body,
.ai-tt-right .ai-compact-filter .filterContent,
.ai-tt-right .ai-compact-filter .portletContent { padding: 0 !important; margin: 0 !important; }
.ai-tt-right .ai-compact-filter select {
  border: var(--ai-border-w) solid var(--ai-border); border-radius: var(--ai-radius); padding: 7px 11px; font-size: 13px;
}

/* =====================================================================
   Document-manager table — type icon, creator avatar, icon-only actions.
   Reuses the shared theme tokens + .ai-av avatar. Icons are drawn with a
   CSS mask so they take a theme colour (muted, accent on hover) instead of
   a fixed-colour raster.
   ===================================================================== */
.ai-doc-center { text-align: center !important; white-space: nowrap; }

/* Type-of-document icon — the file glyph, tinted to its brand colour. The
   colour comes from an .ai-t-<key> class; the glyph shape from --ic (mask). */
.ai-doc-ic {
  display: inline-block; width: 20px; height: 20px; vertical-align: middle;
  background: var(--ai-muted);
  -webkit-mask: var(--ic) center / contain no-repeat;
          mask: var(--ic) center / contain no-repeat;
}
.ai-t-pdf    { background: #e2483d; }  /* PDF red          */
.ai-t-word   { background: #2b579a; }  /* Word blue        */
.ai-t-excel  { background: #217346; }  /* Excel green      */
.ai-t-ppt    { background: #c43e1c; }  /* PowerPoint orange */
.ai-t-image  { background: #7a70c9; }  /* image violet     */
.ai-t-zip    { background: #b0863a; }  /* archive amber    */
.ai-t-folder { background: var(--ai-accent); }
.ai-t-text   { background: var(--ai-muted); }
.ai-t-file   { background: var(--ai-muted); }

/* Icon-only action buttons (Download / View / Email) */
.ai-iconbtn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: var(--ai-radius);
  text-decoration: none;
}
.ai-iconbtn:hover { background: var(--ai-accent-soft); text-decoration: none; }
.ai-iconbtn .ai-i {
  display: inline-block; width: 18px; height: 18px;
  background: var(--ai-muted);
  -webkit-mask: var(--ic) center / contain no-repeat;
          mask: var(--ic) center / contain no-repeat;
  transition: background .12s ease;
}
.ai-iconbtn:hover .ai-i { background: var(--ai-accent); }