/*************************************************************
 **
 ** AffirmX Core
 ** Copyright 2025
 **
 **************************************************************/
:root {
      --heading-background: var(--surface-a);
      --branding-background: var(--blue-100);
      /*    --header-height: 150px;*/
      --footer-height: 35px;
      --horizontal-padding: 10px;
      --horizontal-padding-header: 22px;
      --screen-width: 100%;
      --menu-width: 200px;
      --content-inset: 10px;
      --font-size: 13px;
      --screen-width: 100%;
      --h2-font-color: var(--primary-300);
      --h3-font-color: var(--primary-300);
      --rating-star-on-color: var(--primary-700);
      --rating-star-off-color: black;
}

body {
      height: 100%;
      width: 100%;
}

body .ui-splitbutton .ui-button.ui-splitbutton-menubutton {
      height: 31px;
      top: 0px;
}

.platform-header {
      position: absolute;
      top: 0px;
      left: 0px;
      height: var(--header-height);
      right: 0px;
}

.menuwrapper {
      display: flex;
}

.sun-editor input, .sun-editor select, .sun-editor textarea {
      display: none;
}

small {
      display: inline-block;
}

.menu2wrapper {
      flex-grow: 1;
}

.column-actions {
      width: 110px;
}

.platform-content {
      position: absolute;
      top: var(--header-height);
      bottom: var(--footer-height);
      left: 0px;
      right: 0px;
      overflow: auto;
      padding-left: var(--horizontal-padding);
      padding-right: var(--horizontal-padding);
      padding-bottom: 10px;
      margin-left: var(--content-inset);
      margin-right: var(--content-inset);
      margin-top: 0px;
      margin-bottom: 20px;
      margin-left: var(--content-inset);
      scrollbar-color: var(--brand-primary-color) var(--brand-secondary-color);
}

.platform-footer {
      position: absolute;
      bottom: 0px;
      height: var(--footer-height);
      left: 0px;
      right: 0px;
      overflow: hidden;
      text-align: center;
      font-size: 12px;
      font-weight: bold;
      padding-left: var(--padding-left);
      padding-right: var(--padding-right);
      color: var(--footer-text-color);
      background: var(--foooter-background);
      padding-left: var(--padding-left);
      border-top-color: var(--heading-background);
}

.alert-me {
      float: right;
      margin-right: 60px;
      margin-top: 10px;
      display: inline;
      z-index: 100000;
}

.alert-me-wrapper {
      width: 100%;
      z-index: 100000;
}

/* Tooltip container */
.tooltip {
      position: relative;
      display: inline-block;
}

/* Tooltip text */
.tooltip .tooltiptext {
      visibility: hidden;
      width: 120px;
      background-color: black;
      color: #fff;
      text-align: center;
      padding: 5px 0;
      border-radius: 6px;
      /* Position the tooltip text - see examples below! */
      position: absolute;
      z-index: 1;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
      visibility: visible;
}

.message-info {
      background: #b3e5fc;
}

.centered {
      text-align: center;
      vertical-align: middle;
}

body .ui-rating .ui-rating-star a:hover {
      color: var(--rating-star-off-color);
}

body .ui-rating .ui-rating-star a {
      color: var(--rating-star-off-color);
}

body .ui-rating .ui-rating-star-on a {
      color: var(--rating-star-on-color);
}

body .ui-datatable .ui-datatable-header {
      padding: 0px;
      margin-bottom: 20px;
      border: 1px;
}

body .ui-button .action-button {
      border-color: black;
}

.ui-menubar .ui-menuitem-text {
      font-size: 100% !important;
      top: -1px;
}

body .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link .ui-menuitem-icon {
      margin-right: 2px;
}

body .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link {
      padding-left: 8px;
      padding-right: 8px;
}

.hot-pills {
      padding-top: 10px;
      padding-left: 20px;
      padding-bottom: 2px;
      position: fixed;
      top: 110px;
      width: 70%;
      z-index: 999;
      padding-left: 20px;
}

.branding {
      height: 60px;
      width: 100%;
      top: 0;
      padding-left: 40px;
      padding-right: 40px;
      background: var(--branding-background);
}

.branding .branding-client {
      float: left;
}

.branding .theme {
      float: none;
}

.branding img {
      height: 50px;
}

.branding .branding-client img {
      margin-right: 5px;
}

.branding .branding-client span {
      font-size: 20pt;
      font-family: arial;
      line-height: 50px;
      vertical-align: top;
      color: #5a5b5e;
}

.branding .branding-theme {
      float: right;
      padding-right: 30px
}

.branding .branding-theme span {
      float: left;
      font-size: 12pt;
      line-height: 72px;
      color: #5a5b5e;
      font-family: arial;
}

.branding .branding-system {
      float: right;
      padding-right: 30px
}

.branding .branding-system span {
      float: left;
      font-size: 12pt;
      line-height: 72px;
      color: #5a5b5e;
      font-family: arial;
}

body .ui-menu.ui-menubar {
      border: var(--brand-primary-color);
      border-style: outset;
      border-width: 2px;
}

.sun-editor {
      border: 2px solid var(--branding-background);
}

/* Notes Display Container - Theme Aware (PLAT-1086) */
.notes-display-container {
      width: 800px;
      min-height: 150px;
      max-height: 300px;
      overflow-y: auto;
      padding: 10px;
      border: 2px solid var(--branding-background, var(--blue-100, #b3d4fc));
      border-radius: 4px;
      background-color: var(--surface-a, #1e1e1e);
      color: var(--text-color, inherit);
      display: inline-block;
      line-height: 1.5;
      box-sizing: border-box;
}

.sun-editor-editable {
      background: var(--sun-editor-background);
      color: var(--sun-editor-color);
}

.sun-editor .se-toolbar {
      background: var(--heading-background);
}

.sun-editor button {
      color: var(--h2-font-color);
}

.sun-editor .se-btn-module-border {
      border: none;
}

.sun-editor .se-btn:enabled:hover {
      background: var(--h2-font-color);
      border-color: black;
      color: black;
}

.sun-editor .se-resizing-bar {
      background-color: var(--heading-background);
}

/* SunEditor dropdown menu styling - Theme Aware */
.sun-editor .se-list-layer {
      background: var(--surface-a) !important;
      border-color: var(--surface-border) !important;
}

.sun-editor .se-list-layer .se-list-inner {
      background: var(--surface-a) !important;
}

.sun-editor .se-list-layer .se-list-inner .se-list-basic li {
      color: var(--text-color) !important;
      background: var(--surface-a) !important;
}

.sun-editor .se-list-layer .se-list-inner .se-list-basic li:hover {
      background: var(--surface-b) !important;
      color: var(--text-color) !important;
}

.sun-editor .se-list-layer .se-list-inner .se-list-basic li button {
      color: var(--text-color) !important;
}

.sun-editor .se-btn-list {
      color: var(--text-color) !important;
}

.sun-editor .se-btn-list:hover {
      background: var(--surface-b) !important;
}

/* SunEditor toolbar select boxes (Font, Size, etc.) */
.sun-editor .se-btn-select {
      background: var(--surface-a) !important;
      color: var(--text-color) !important;
}

.sun-editor .se-btn-select .txt {
      color: var(--text-color) !important;
}

/* SunEditor dropdown selected/active item */
.sun-editor .se-list-layer .se-list-inner .se-list-basic li.active,
.sun-editor .se-list-layer .se-list-inner .se-list-basic li[class*="active"] {
      background: var(--primary-color) !important;
      color: var(--primary-color-text) !important;
}

.sun-editor .se-list-layer .se-list-inner .se-list-basic li.active button,
.sun-editor .se-list-layer .se-list-inner .se-list-basic li[class*="active"] button {
      color: var(--primary-color-text) !important;
}

/* Font list specific styling */
.sun-editor .se-list-layer.se-list-font-family .se-list-inner {
      background: var(--surface-a) !important;
}

.sun-editor .se-list-layer.se-list-font-family .se-list-basic li {
      background: var(--surface-a) !important;
      color: var(--text-color) !important;
}

.sun-editor .se-list-layer.se-list-font-family .se-list-basic li:hover {
      background: var(--surface-b) !important;
}

/* Aggressive SunEditor dropdown overrides for all themes */
/* NOTE: Exclude color picker swatch buttons [data-value] from background override.
   SunEditor 2.47.8 uses [data-value], not [data-color]/.se-color-btn on swatch buttons. */
.sun-editor .se-toolbar .se-btn-module .se-btn-select,
.sun-editor .se-toolbar .se-btn-select {
      background-color: var(--surface-a) !important;
}

.sun-editor .se-toolbar .se-btn-module .se-btn-select .txt,
.sun-editor .se-toolbar .se-btn-select .txt {
      color: var(--text-color) !important;
}

.sun-editor .se-list-layer *:not(.se-color-pallet):not([data-value]):not([data-color]):not(.se-color-btn),
.sun-editor .se-list-inner *:not(.se-color-pallet):not([data-value]):not([data-color]):not(.se-color-btn),
.sun-editor .se-list-basic *:not(.se-color-pallet):not([data-value]):not([data-color]):not(.se-color-btn) {
      background-color: var(--surface-a) !important;
      color: var(--text-color) !important;
}

.sun-editor .se-list-layer li:hover:not(.se-color-pallet),
.sun-editor .se-list-layer li:hover *:not(.se-color-pallet):not([data-value]):not([data-color]):not(.se-color-btn),
.sun-editor .se-list-basic li:hover:not(.se-color-pallet),
.sun-editor .se-list-basic li:hover *:not(.se-color-pallet):not([data-value]):not([data-color]):not(.se-color-btn) {
      background-color: var(--surface-b) !important;
}

/* Ensure color picker container doesn't carry theme background behind swatch buttons */
.sun-editor .se-color-pallet {
      background-color: unset !important;
}

/* Re-theme font/size/format list buttons excluded by :not([data-value]) above */
.sun-editor .se-btn-list,
.sun-editor .se-list-layer .se-btn-list {
      background-color: var(--surface-a) !important;
}

/* Selected item in dropdown - exclude color picker elements */
.sun-editor .se-list-basic .se-select-item.active:not(.se-color-pallet):not([data-color]),
.sun-editor .se-list-basic .se-select-item.active *:not(.se-color-pallet):not([data-color]):not(.se-color-btn),
.sun-editor .se-list-basic li.active:not(.se-color-pallet):not([data-color]),
.sun-editor .se-list-basic li.active *:not(.se-color-pallet):not([data-color]):not(.se-color-btn) {
      background-color: var(--primary-color) !important;
      color: var(--primary-color-text, #ffffff) !important;
}

.menubar-button .ui-button.ui-splitbutton-menubutton.ui-splitbutton-menubutton {
      margin-top: 15px;
      height: 31px;
      top: -12px;
}

.menubar-button>.ui-button {
      padding-top: 0rem;
   
}
.menubar-button>.ui-button:first-child {
     margin-top: 15px;
      height: 31px;
      top: -12px;
}

ul.ui-menu-child {
      white-space: nowrap;
      width: 210px !important;
      z-index: 99999;
}

.ui-contextmenu {
      width: 210px;
}

element.style {
      z-index: 1001;
      display: block;
      top: 40.5625px;
      left: 0px;
}

body .ui-menu.ui-menubar {
      padding: 0px;
      height: 35px;
      border: none;
}

body .ui-menu .ui-menu-list .ui-menu-child.ui-shadow {
      width: var(--menu-width)
}

body .ui-panel .ui-panel-content {
      border: none;
      width: var(--screen-width)
}

body .ui-panel {
      padding: 2px;
}

body .ui-inputfield {
      font-size: var(--font-size);
}

.zebra-striped {
      overflow-x: hidden;
}

.zebra-striped tbody tr:hover {
      border: 1px solid red;
}

.zebradiv {
      padding: 10px 10px 10px 20px;
      border: 2px solid black;
}

.zebradiv:nth-of-type(odd) {
      border: 2px solid black;
}

.zebradiv:hover {
      border: 2px solid red;
}

.action-button {
      float: right;
      border: 1px;
}

.float-right-table>span.ui-column-title {
      float: right;
      padding-right: 40px;
}

body .ui-datatable .ui-datatable-data>tr>td {
      padding: 8px 8px;
}

body .ui-selectonemenu .ui-selectonemenu-label {
      height: 27px;
}

body .ui-button {
      margin-right: 5px;
}

body .ui-widget {
      font-size: var(--font-size);
}

body .ui-button.ui-button-text-only .ui-button-text {
      padding: .3em .3em;
}

.ui-datepicker {
      z-index: 10001 !important;
}

.clientEvent {
      background: #46a546 !important;
      color: black !important;
      padding: 2px;
}

.globalEvent {
      background: #00BFFF !important;
      color: #000000 !important;
      padding: 2px;
}

.tpaEvent {
      background: #ff80ff !important;
      color: #000000 !important;
      padding: 2px;
}

.completedNotification {
      background: #00869B !important;
      color: #ffffff !important;
      padding: 2px;
}

.pendingNotification {
      background: #f89406 !important;
      color: black !important;
      padding: 2px
}

.overdueNotification {
      background: #c43c35 !important;
      color: #ffffff !important;
      padding: 2px;
}

.incompleteNotification {
      background: #FFFFB7 !important;
      color: #7F0000 !important;
      padding: 2px;
}

.futureRequest {
      background: #dddddd !important;
      color: #7F0000 !important;
      padding: 2px;
}

.jqplot-table-legend {
      width: 50px;
}

div.answer {
      margin-top: 3px;
}

div.divider {
      line-height: 5px;
      border-bottom: 1px solid #ccc;
      margin: 10px 0px 15px 0px;
}

.ui-columntoggler-item label {
      float: none;
}

.ui-selectcheckboxmenu-item>label {
      float: none;
}

.question {
      border: 1px solid var(--primary-color);
      padding: 15px 10px 20px 5px;
      margin-bottom: 5px;
}

.questionnaire-textinput {
      margin-left: 20px;
      margin-right: 20px;
      margin-top: 20px;
}

.questionnaire-textarea {
      width: 97% !important;
}

.risk10 {
      position: relative;
      z-index: 1;
      border: 4px solid #729a1f;
}

.risk10::before {
      position: absolute;
      z-index: -1;
      top: 0;
      left: 0;
      width: 100%;
      height: 10px;
      content: "";
      background-color: #729a1f;
}

.risk20 {
      position: relative;
      z-index: 1;
      border: 4px solid #abd372;
}

.risk20::before {
      position: absolute;
      z-index: -1;
      top: 0;
      left: 0;
      width: 100%;
      height: 10px;
      content: "";
      background-color: #abd372;
}

.risk30 {
      position: relative;
      z-index: 1;
      border: 4px solid #efe676;
}

.risk30::before {
      position: absolute;
      z-index: -1;
      top: 0;
      left: 0;
      width: 100%;
      height: 10px;
      content: "";
      background-color: #efe676;
}

.risk40 {
      position: relative;
      z-index: 1;
      border: 4px solid #d8923d;
}

.risk40::before {
      position: absolute;
      z-index: -1;
      top: 0;
      left: 0;
      width: 100%;
      height: 10px;
      content: "";
      background-color: #d8923d;
}

.risk50 {
      position: relative;
      z-index: 1;
      border: 4px solid #d25640;
}

.risk50::before {
      position: absolute;
      z-index: -1;
      top: 0;
      left: 0;
      width: 100%;
      height: 10px;
      content: "";
      background-color: #d25640;
}

body .ui-progressbar .ui-progressbar-label {
      color: white;
      padding-top: 4px;
      font-size: 20px;
}

body .ui-progressbar .ui-progressbar-value {
      background: var(--brand-primary-color);
}

body .ui-progressbar {
      background: var(--brand-secondary-color);
}

.questionnaire {
      padding: 5px 5px 5px 5px;
      border: 1px thin #73bb37;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.questionnaire table {
      background-color: inherit;
      border-collapse: separate;
      border-spacing: 10px 20px;
}

.question table td {
      border-top: 0px;
}

.question .lovradio, .question .riskradio {
      background-color: inherit;
      margin-bottom: 0px;
      margin-top: 5px;
}

.question .lovradio td, .question .riskradio td {
      padding: 2px 80px 20px 5px;
}

.question .lovradio td:hover, .question .riskradio td:hover {
      background-color: var(--primary-color);
      border: 2px solid #FF0000;
      color: black;
}

.question .lovradio label, .question .riskradio label {
      float: none;
      cursor: pointer;
}

.question .lovselected {
      background-color: var(--primary-color);
      border: 2px solid #000000;
      border-top: 2px solid #000000;
      margin-top: 20px;
      color: black;
}

.question .riskselected {
      border: 2px solid #000000;
      border-top: 2px solid #000000;
      margin-top: 20px;
}

.questionlayout {
      width: 100%;
}

.questionnaire-controls {
      padding: 5px 0px 0px 0px;
}

.questionnaire-controls a {
      float: right;
      margin-left: 5px;
}

.answer {
      padding: 0px 10px 0px 10px;
}

.unaswered {
      background-color: #fddfde;
      border: 1px solid #C40600;
}

.marked-question-green {
      background-color: #80ff80;
      border: 1px solid #C40600;
}

.instructions {
      background: var(--instructions-background);
      color: var(--instructions-color);
      border: 1px solid var(--primary-color);;
      padding: 10px;
      margin-right: 0px;
      margin-bottom: 20px;
      width: 98%;
      margin-left: 20px;
      margin-top: 10px;
}

.ui-helper-hidden-accessible {
      border: 0;
      clip: rect(0, 0, 0, 0);
      height: 0px;
      margin: 0px;
      overflow: hidden;
      padding: 0;
      position: absolute;
      width: 0px
}

.landing-title {
      color: #005978;
      font-size: 20pt;
      font-family: arial;
      line-height: 50px;
      vertical-align: top;
      text-align: left;
      line-height: 120%;
}

.resource-title {
      color: #005978;
      font-size: 20pt;
      font-family: arial;
      line-height: 50px;
      vertical-align: top;
      text-align: left;
}

.column-6 {
      float: left;
      width: 16.6%;
      float: left;
}

.column-5 {
      float: left;
      width: 20%;
      float: left;
}

.column-4 {
      float: left;
      width: 25%;
      float: left;
}

.column-3 {
      float: left;
      width: 33.33%;
      float: left;
}

.column-2 {
      float: left;
      width: 50%;
}

.column-1 {
      float: left;
      width: 100%;
      float: left;
}

.img-center {
      margin: auto;
      display: block;
}

.project-attribute-col-3 {
      float: left;
      width: 33%;
      padding-left: 2px;
}

/* Clear floats after the columns */
.project-attribute-row-3:after {
      content: "";
      display: table;
      clear: both;
}

.btn-disabled {
      pointer-events: none;
}

.answerClass1 {
      background-color: #C4F2C8;
}

.answerClass2 {
      background-color: #F2D8CB;
}

.answerClass3 {
      background-color: #C5E2E3;
}

.answerClass4 {
      background-color: #FCFFD9;
}

.answerClass5 {
      background-color: #FFCCCC;
}

body .ui-messages {
      padding-top: 1px;
      padding-bottom: 2px;
      width: 100%;
}

body .ui-breadcrumb {
      /*	background: #fffff0;
	border: 1px solid #73bb37; */
      border-radius: 4px;
      padding: 1rem;
      margin-bottom: 20px;
      width: 100%;
}

.ui-widget-content {
      border: none;
      color: inherit;
}

.ui-widget-content a {
      color: var(--link-color);
}

body .ui-selectcheckboxmenu .ui-selectcheckboxmenu-multiple-container.ui-inputfield {
      height: 27px;
}

body .ui-dialog .ui-dialog-titlebar {
      font-weight: 700;
      border-bottom: 0 none;
      padding: 0rem;
}

body .ui-dialog .ui-dialog-content {
      /* 	background: #FFFFF0; */
      overflow: auto;
}

body .ui-dialog .ui-dialog-titlebar .ui-dialog-title {
      float: left;
      margin: 0.5em 16px 0.1em 1.0em;
}

.ui-accordion .ui-accordion-header .ui-icon {
      display: block;
      /*	background-color: #73bb37; */
}

input, select, .uneditable-input {
      height: 27px;
}

.checkboxtable table {
      border-spacing: 0;
      -webkit-border-horizontal-spacing: 0px;
      -webkit-border-vertical-spacing: 0px;
}

.ui-picklist .ui-picklist-list {
      height: 350px;
      width: 300px;
}

picklist-input {
      margin-left: 200px;
}

.jstree-default .jstree-clicked {
      background: var(--heading-background);
      border-radius: 22x;
      box-shadow: inset 0 0 1px #999;
}

.jstree-default .jstree-hovered {
      background: var(--heading-background);
      border: 1px;
      border-style: solid;
      border-color: red;
}

.project-panel {
      width: 98%;
}

body .ui-panel .ui-panel-content {
      padding: 0rem;
}

.card {
      width: 100%;
      margin-top: 60px;
}

.fc .fc-bg-event {
      opacity: .8;
}

.body .fc .fc-event, body .fc .fc-event .fc-event-main {
      background: inherit;
}

/*************************************************************
 **
 ** Calendar Enhancements - Modern Styling
 ** Added: November 2024
 ** Theme-aware with dynamic scaling
 **
 **************************************************************/

/* Modern Calendar Container Styling */
.clientCalendarDisplay {
      border-radius: 8px;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
      overflow: visible !important;
      transition: box-shadow 0.3s ease;
      background: var(--surface-a, white);
}

.clientCalendarDisplay:hover {
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.clientCalendarDisplay .ui-panel-content {
      padding: 0;
      overflow: visible !important;
      background: transparent;
}

/* REMOVED - This entire block was deleted: */

/* CONSERVATIVE FIX: Allow full month display without breaking rendering */
.fc-scroller-liquid,
.fc-scroller-liquid-absolute {
      overflow-y: visible !important;
}

.fc-daygrid-body .fc-scroller {
      overflow: visible !important;
}

.fc-scrollgrid-section-body {
      height: auto !important;
}

.fc-daygrid-day-frame {
      min-height: 60px !important;
      overflow: visible !important;
}

.fc-daygrid-day-events {
      margin: 0 !important;
      overflow: visible !important;
}

/* Only hide "more" links in month view */
.fc-dayGridMonth-view .fc-daygrid-more-link {
      display: none !important;
}

/* Compact event spacing for days with many events */
.fc-daygrid-event-harness {
      margin: 0.5px 0 !important;
}

/* Compact event spacing for days with many events */
.fc-daygrid-event-harness {
      margin: 0.5px 0 !important;
}

/* Compact event spacing for days with many events */
.fc-daygrid-event-harness {
      margin: 0.5px 0 !important;
}

/* Compact event spacing for days with many events */
.fc-daygrid-event-harness {
      margin: 0.5px 0 !important;
}

/* Calendar Toolbar Modernization - Theme Aware */
.fc-toolbar {
      background: linear-gradient(135deg, var(--brand-primary-color) 0%, var(--brand-secondary-color) 100%) !important;
      padding: 12px !important;
      border-radius: 8px 8px 0 0 !important;
      border: none !important;
}

.fc-toolbar-title {
      color: white !important;
      font-weight: 600 !important;
      font-size: 1.2em !important;
      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

/* Calendar Navigation Buttons */
.fc-button {
      background: rgba(255, 255, 255, 0.2) !important;
      border: 1px solid rgba(255, 255, 255, 0.3) !important;
      color: white !important;
      border-radius: 4px !important;
      transition: all 0.3s ease !important;
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
      padding: 4px 8px !important;
      font-size: 0.9em !important;
}

.fc-button:hover {
      background: rgba(255, 255, 255, 0.3) !important;
      transform: translateY(-1px);
      box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) !important;
}

.fc-button-active {
      background: rgba(255, 255, 255, 0.4) !important;
      box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

.fc-button:disabled {
      opacity: 0.5;
      cursor: not-allowed;
}

/* Calendar Grid Styling - Theme Aware */
.fc-view {
      background: var(--surface-a, white);
}

.fc-theme-standard td,
.fc-theme-standard th {
      border-color: var(--surface-border, #dee2e6) !important;
}

.fc-col-header-cell {
      background: var(--surface-b, #f8f9fa) !important;
      font-weight: 600;
      color: var(--text-color, var(--brand-secondary-color));
      padding: 8px 5px !important;
      font-size: 0.9em;
}

.fc-daygrid-day {
      transition: background-color 0.2s ease;
      background: var(--surface-a, white) !important;
}

.fc-daygrid-day:hover {
      background: var(--surface-b, #f8f9fa) !important;
}

.fc-daygrid-day-top {
      flex-direction: row;
      padding: 2px;
}

.fc-daygrid-day-number {
      padding: 2px 4px;
      font-size: 0.85em;
}

/* Today Highlight */
.fc-day-today {
      background: rgba(115, 187, 55, 0.08) !important;
      border: 2px solid var(--brand-primary-color) !important;
      position: relative;
}

.fc-day-today .fc-daygrid-day-number {
      background: var(--brand-primary-color);
      color: white;
      border-radius: 50%;
      width: 24px;
      height: 24px;
      line-height: 24px;
      display: inline-block;
      text-align: center;
      font-weight: 600;
      font-size: 0.8em;
}

/* Event Styling with Depth - Responsive sizing */
.fc-event {
      border-radius: 3px !important;
      padding: 1px 3px !important;
      border-left: 3px solid rgba(0, 0, 0, 0.2) !important;
      transition: transform 0.2s ease, box-shadow 0.2s ease !important;
      margin: 0.5px 1px !important;
      font-size: 0.75em !important;
      line-height: 1.2 !important;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
}

.fc-event:hover {
      transform: scale(1.05);
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15) !important;
      cursor: pointer;
      z-index: 100 !important;
      overflow: visible;
      white-space: normal;
}

.fc-event-main {
      padding: 1px 2px;
      overflow: hidden;
}

.fc-event-title {
      overflow: hidden;
      text-overflow: ellipsis;
}

/* Enhanced Event Type Colors - Maintaining existing color scheme but with better depth */
.overdueNotification { 
      border-left-color: #8b2020 !important;
}

.pendingNotification { 
      border-left-color: #b37700 !important;
}

.completedNotification { 
      border-left-color: #006070 !important;
}

.incompleteNotification { 
      border-left-color: #5f0000 !important;
}

.futureRequest { 
      border-left-color: #999999 !important;
}

.globalEvent { 
      border-left-color: #0090c0 !important;
}

.clientEvent { 
      border-left-color: #2e7030 !important;
}

.tpaEvent { 
      border-left-color: #cc60cc !important;
}

/* Event Details Dialog - FIXED FOR SCROLLING - Theme Aware */
.eventDetails.ui-dialog {
      border-radius: 12px !important;
      overflow: visible !important;
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15) !important;
      border: none !important;
}

.eventDetails .ui-dialog-titlebar {
      background: linear-gradient(135deg, var(--brand-primary-color) 0%, var(--brand-secondary-color) 100%) !important;
      color: white !important;
      padding: 20px !important;
      border: none !important;
      border-radius: 12px 12px 0 0 !important;
}

.eventDetails .ui-dialog-titlebar .ui-dialog-title {
      font-size: 1.2em;
      font-weight: 600;
      color: white !important;
}

.eventDetails .ui-dialog-titlebar-close {
      color: white !important;
      background: rgba(255, 255, 255, 0.2) !important;
      border-radius: 50% !important;
      width: 32px !important;
      height: 32px !important;
      transition: all 0.3s ease !important;
}

.eventDetails .ui-dialog-titlebar-close:hover {
      background: rgba(255, 255, 255, 0.3) !important;
      transform: rotate(90deg);
}

.eventDetails .ui-dialog-titlebar-close .ui-icon {
      color: white !important;
}

.eventDetails .ui-dialog-content {
      padding: 0 !important;
      background: var(--surface-a, white) !important;
      overflow: visible !important;
}

/* Event Details Panel Grid - Theme Aware */
.clientEventDetails {
      width: 100%;
      border-collapse: separate;
      border-spacing: 0;
}

.clientEventDetails td {
      padding: 12px 10px !important;
      border-bottom: 1px solid var(--surface-border, #f0f0f0);
      vertical-align: top;
}

.clientEventDetails tr:last-child td {
      border-bottom: none;
}

.clientEventDetails td:first-child {
      font-weight: 600;
      color: var(--text-color, var(--brand-secondary-color));
      width: 30%;
      padding-right: 15px !important;
}

.clientEventDetails td:nth-child(2) {
      color: var(--text-color, #333);
      line-height: 1.5;
      word-wrap: break-word;
}

.clientEventDetails img {
      vertical-align: middle;
      margin-right: 8px;
      border-radius: 50%;
}

.clientEventDetails a {
      color: var(--brand-primary-color);
      text-decoration: none;
      transition: color 0.2s ease;
}

.clientEventDetails a:hover {
      color: var(--brand-secondary-color);
      text-decoration: underline;
}

/* Calendar Legend Modernization - COMPACT VERSION - Theme Aware */
.calendar-legend {
      background: var(--surface-a, linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%));
      border-radius: 8px !important;
      padding: 10px 12px !important;
      margin-top: 15px !important;
      border: 1px solid var(--surface-border, #e9ecef) !important;
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

.calendar-legend .ui-panel-content {
      padding: 0 !important;
      background: transparent;
}

.calendar-legend .legend-content h3 {
      margin: 0 0 8px 0 !important;
      color: var(--text-color, var(--brand-secondary-color)) !important;
      font-size: 0.95em !important;
      font-weight: 600 !important;
      padding-bottom: 6px;
      border-bottom: 2px solid var(--brand-primary-color);
}

.calendar-legend .legend-row {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      margin-bottom: 6px;
      gap: 4px;
}

.calendar-legend .legend-row:last-child {
      margin-bottom: 0;
}

.calendar-legend .legend-category {
      color: var(--text-color, var(--brand-secondary-color));
      font-size: 0.85em;
      font-weight: 600;
      min-width: 85px;
      margin-right: 4px;
}

.calendar-legend .label {
      display: inline-block;
      padding: 3px 8px !important;
      border-radius: 10px !important;
      font-size: 0.7em !important;
      font-weight: 600 !important;
      margin: 0 !important;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
      transition: transform 0.2s ease, box-shadow 0.2s ease !important;
      cursor: default;
      white-space: nowrap;
}

.calendar-legend .label:hover {
      transform: translateY(-1px);
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) !important;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
      .fc-toolbar {
            flex-direction: column;
            gap: 10px;
            padding: 10px !important;
      }
      
      .fc-toolbar-title {
            font-size: 1em !important;
      }
      
      .fc-button {
            font-size: 0.8em !important;
            padding: 3px 6px !important;
      }
      
      .eventDetails.ui-dialog {
            width: 95% !important;
            max-width: 95% !important;
      }
      
      .clientEventDetails td:first-child {
            width: 40%;
            font-size: 0.9em;
      }
      
      .calendar-legend .legend-category {
            display: block;
            margin-bottom: 4px;
            width: 100%;
      }
      
      .calendar-legend .legend-row {
            flex-direction: column;
            align-items: flex-start;
      }
      
      .fc-event {
            font-size: 0.7em !important;
      }
}

/* Loading Animation */
@keyframes fadeIn {
      from {
            opacity: 0;
            transform: translateY(10px);
      }
      to {
            opacity: 1;
            transform: translateY(0);
      }
}

.clientCalendarDisplay {
      animation: fadeIn 0.4s ease-out;
}

/* Scrollbar Styling for Event Dialog - Theme Aware */
.eventDetails div[style*="overflow-y"]::-webkit-scrollbar {
      width: 8px;
}

.eventDetails div[style*="overflow-y"]::-webkit-scrollbar-track {
      background: var(--surface-b, #f1f1f1);
      border-radius: 4px;
}

.eventDetails div[style*="overflow-y"]::-webkit-scrollbar-thumb {
      background: var(--brand-primary-color);
      border-radius: 4px;
}

.eventDetails div[style*="overflow-y"]::-webkit-scrollbar-thumb:hover {
      background: var(--brand-secondary-color);
}

/* Accessibility Improvements */
.fc-event:focus {
      outline: 2px solid var(--brand-primary-color);
      outline-offset: 2px;
}

.fc-button:focus {
      outline: 2px solid white;
      outline-offset: 2px;
}

/*************************************************************
 **
 ** Dashboard Client Title
 ** Added: November 2024
 ** Theme-aware title display
 **
 **************************************************************/

.dashboard-client-title {
      text-align: center;
      margin-bottom: 25px;
      margin-top: 10px;
      padding: 15px 0;
      border-bottom: 2px solid var(--brand-primary-color);
}

.dashboard-client-title h1 {
      font-size: 2.5em;
      margin: 0;
      padding: 0;
      font-weight: 600;
      letter-spacing: 0.5px;
      /* Smart contrast: Use light color on dark themes, dark color on light themes */
      color: var(--text-color, #333333);
      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

/* Enhanced contrast for specific theme types */
/* For dark themes (nova-dark, arya, etc.) */
body[class*="dark"] .dashboard-client-title h1,
.ui-dark .dashboard-client-title h1 {
      color: #e0e0e0;
      text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

/* For very light themes */
body[class*="light"] .dashboard-client-title h1,
.ui-light .dashboard-client-title h1 {
      color: #2c3e50;
      text-shadow: 0 1px 2px rgba(255, 255, 255, 0.5);
}

/* Responsive sizing */
@media (max-width: 1200px) {
      .dashboard-client-title h1 {
            font-size: 2em;
      }
}

@media (max-width: 768px) {
      .dashboard-client-title h1 {
            font-size: 1.6em;
      }
      
      .dashboard-client-title {
            margin-bottom: 15px;
            padding: 10px 0;
      }
}

/* Ensure proper sizing relative to subhead h3 elements */
.subhead h3 {
      font-size: 1.2em;
}

.subhead h3 a {
      color: var(--text-color, inherit);
      text-decoration: none;
}

.subhead h3 a:hover {
      color: var(--brand-primary-color);
      text-decoration: underline;
}

/*
 * Fix: Quick Artifact Request overlay — when "Override Instructions" is
 * checked the SunEditor expands the panel beyond the viewport, hiding the
 * Save button.  Scope the scroll constraint to .quickPendingRequest so
 * selectOneMenu dropdowns (appended to body by default) are not clipped.
 */
.ui-overlaypanel-content .quickPendingRequest {
      max-height: 70vh;
      overflow-y: auto;
}

.ui-overlaypanel-content .quickPendingRequest > .ui-button {
      position: sticky;
      bottom: 0;
      z-index: 1;
      background: var(--surface-a, #ffffff);
}