html, body {
 font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* Defensive: hide stray Form.io/FA chevrons appended at body level (seen after visiting signature widget) */
body > i.fa-chevron-up,
body > i.fa-chevron-down,
html > body > i.fa.fa-chevron-up,
html > body > i.fa.fa-chevron-down {
 display: none !important;
}

/* Hide any stray Flatpickr calendar injected at body root (cleanup fallback) */
body > .flatpickr-calendar { display:none !important; }

a, .btn-link {
 color: #006bb7;
}

.btn-primary {
 color: #fff;
 background-color: #1b6ec2;
 border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
 box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
 padding-top:1.1rem;
}

h1:focus {
 outline: none;
}

.valid.modified:not([type=checkbox]) {
 outline:1px solid #26b050;
}

.invalid {
 outline:1px solid #e50000;
}

.validation-message {
 color: #e50000;
}

.blazor-error-boundary {
 background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1zbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJyYW5zbGF0ZSgtMjM1IC01MikiPjxwYXRoIGQ9Ik0yNjMuNTA2IDUxQzI2NC43MTc 9MiAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTNsNTEzIDI5MSA9NC4wODE1IDI5MSA9NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNFAzMy43NjIgOTlDMzQuMTk5IDk5IDM2NiA9NC42NzgyIDM2NiA9NC4zNzk5IDM2Ni4wMzEgOTQuMDg4NiAyMzYuMDg5IDkzLjgwNzJMMjM2LjMzOCA5My4wMTYyIDIzNi44NTggOTIuMTMxNCAyNTkuNDczIDUzLjYyOTQgMjU5Ljk2MSA1Mi43OTg1IDI2MC40MDcgNTIuMjY1OEMyNjEuMiA1MS40ODM3IDI2Mi4yOTYgNTEgMjYzLjUwNiA1MVpNMjYwLjU4NiA2Ni4wMTgzQzI2MC43MzcgNjYuMDE4MyAyNTkuMzEzIDY3LjEyNDUgMjU5LjMxMyA2OS4zMzcgMjU5LjMxMyA2OS42MTAyIDI1OS4zMzIgNjkuODYwOCAyNTkuMzcxIDcwLjA4ODdMMjYxLjc5NSA4NC4wMTYxIDI2NS4zOCA4NC4wMTYxIDI2Ny44MjEgNjkuNzQ3NUMyNjcuODYgNjkuNzMwOSAyNjcuODc5IDY5LjU4NzcgMjY3Ljg3OSA2OS4zMTc5IDI2Ny44NzkgNjcuMTE4MiAyNjYuNDQ4NiA2Ni4wMTgzIDI2My41ODYgNjYuMDE4MyBaTYyMy41NzYgPC00LjA4OSA1NC42MDQsMTA1LjY1LDI2NC42MjEgNjQwLjk0NUMxMDAuNDMyLDc4LjcwOSAxMTUuNDksODIuNjMsMTIwLjUsMTE3LjcwMDY9KQ==) no-repeat 1rem/contain, #b32121;
 padding: 1rem 1rem 1.5rem 1rem;
 border-radius: 6px;
}

.blazor-error-boundary::after {
 content: "An error has occurred."
 }

.darker-border-checkbox.form-check-input {
 border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
 color: var(--bs-secondary-color);
 text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
 text-align: start;
}

/* Preserve newlines in MudBlazor ShowMessageBox */
.mud-dialog-content .mud-typography {
 white-space: pre-line !important;
}

/* Make MudBlazor form input text semi-bold (normally 400) */
.mud-input-control .mud-input,
.mud-select .mud-input,
.mud-input-control input,
.mud-input-control textarea {
 font-weight:500 !important; 
}

/* Scoped override: ensure normal weight for inputs inside the notes data grid */
.notes-data-grid .mud-input-control .mud-input,
.notes-data-grid .mud-input-control input,
.notes-data-grid .mud-input-control textarea {
 font-weight:400 !important;
}

/* DataGrid rows non-bold, keep headers bold */
.mud-datagrid .mud-table-body td,
.mud-datagrid .mud-table-body td * {
 font-weight:400 !important;
}

/* Show pointer cursor only for the appointments table rows */
.appt-table .mud-table-body .mud-table-row:hover {
 cursor: pointer;
}

/* Show pointer on hover for client table rows */
.client-table .mud-table-body .mud-table-row:hover {
 cursor: pointer;
}

/* Title icon/text alignment */
.title-with-icon {
 display: inline-flex;
 align-items: center;
 gap:10px;
}

/* Global typography weights for MudBlazor and Bootstrap */
:root {
 --mud-typography-default-weight:400;
 --mud-typography-body1-weight:400;
 --mud-typography-body2-weight:400;
 --bs-body-font-weight:400;
}

/* Spacing under appointments table to match notes grid */
.appt-table { margin-bottom:12px; }
/* Hide header row in Notes DataGrid (minimal rule) */
.notes-data-grid th { display: none !important; height:0 !important; padding:0 !important; border:0 !important; }
/* Match ClientNotesDataGrid: rows normal weight for settings grids, keep headers bold */
.settings-datagrid .mud-table-body td,
.settings-datagrid .mud-table-body td * {
 font-weight:400 !important;
}

/* Tighten rows for settings grids (ApptLocation and FileType) similar to notes */
.settings-datagrid .mud-table-row {
 min-height:0 !important;
 height: auto !important;
}
.settings-datagrid .mud-table-body td,
.settings-datagrid .mud-table-body th,
.settings-datagrid td,
.settings-datagrid th,
.settings-datagrid .mud-table-cell {
 padding-top:5px !important;
 padding-bottom:5px !important;
 line-height:1.25 !important;
 height: auto !important;
 vertical-align: middle !important;
}
.settings-datagrid .mud-table-content,
.settings-datagrid .mud-table-container,
.settings-datagrid .mud-table {
 overflow: visible !important;
 border-collapse: collapse !important;
 border-spacing:0 !important;
}
.settings-datagrid .mud-input-root,
.settings-datagrid .mud-input-root-outlined {
 margin-top:0 !important;
 margin-bottom:0 !important;
 padding-top:0 !important;
 padding-bottom:0 !important;
}

/* Align Actions column icon vertically with text */
.settings-datagrid .mud-table-body td:last-child,
.settings-datagrid tbody td:last-child {
 vertical-align: middle !important;
 text-align: center;
}
.settings-datagrid .mud-table-body td:last-child .mud-icon-button,
.settings-datagrid tbody td:last-child .mud-icon-button {
 margin-top:0 !important;
 position: relative;
 top: -1px; /* nudge icon up slightly */
}

/* Make RTE fill its container (even when empty) */
.editor-paper {
 display: flex;
 flex-direction: column;
 /* Ensure a sensible working area and a definite height so children can stretch */
 min-height:60vh;
 height:60vh; /* gives children a concrete 100% height target */
}
.editor-paper .appt-rte {
 /* Let the RTE grow to fill remaining space below the title */
 flex:1 1 auto;
 min-height:0; /* allow child overflow to calculate correctly in flex containers */
 display: flex; /* make inner parts stack vertically */
 flex-direction: column;
}
/* In some cases Syncfusion inner panes need min-height reset inside flex parents */
.editor-paper .appt-rte .e-rte-content,
.editor-paper .appt-rte .e-source-content {
 min-height:0;
}
/* Ensure toolbar keeps natural height and content fills the rest */
.editor-paper .appt-rte .e-toolbar {
 flex:0 0 auto;
}
.editor-paper .appt-rte .e-rte-content {
 flex:1 1 auto;
 height:100% !important;
 box-sizing: border-box;
 overflow: auto;
}

/* Ensure content area fills even when empty */
.editor-paper .appt-rte .e-content.e-lib,
.editor-paper .appt-rte .e-rte-content .e-content {
 min-height:100% !important;
 height:100% !important;
}

/* Ensure the RTE wrapper stretches (covers classic, iframe, and markdown modes) */
.editor-paper .appt-rte .e-rte-wrapper,
.editor-paper .appt-rte .e-rte-container,
.editor-paper .appt-rte .e-richtexteditor {
 display: flex;
 flex-direction: column;
 flex:1 1 auto;
 min-height:0;
}

/* When using iframe content, also stretch the iframe */
.editor-paper .appt-rte .e-rte-content iframe {
 width:100% !important;
 height:100% !important;
}


/* Add spacing below titles and RTE panels on Appointment page */
/* Gap under the title row inside editor papers */
.editor-paper .title-with-icon {
 margin-bottom:12px;
}

/* Gap below each RTE panel container */
#appt-interpretation-panel,
#appt-recommendations-panel {
 margin-bottom:16px;
}

/* Ensure MudBlazor dialogs appear above components like LiveView that use high z-indices */
/* Target only dialog containers, not general overlays (which MudMenu also uses) */
.mud-dialog-container {
 z-index:6000 !important;
}

.mud-dialog,
.mud-dialog-surface {
 z-index:6001 !important;
}

.mud-message-box {
 z-index:6001 !important;
}

/* --- Form.io builder usability fixes --- */
.formio-builder, .formio-form, .formio-container {
 -webkit-user-select: auto !important;
 -moz-user-select: auto !important;
 -ms-user-select: auto !important;
 user-select: auto !important;
}
/* Ensure drop zone accepts pointer events */
.formio-builder .formarea, .formio-drop-zone, .formbuilder .formarea, .builder-components {
 pointer-events: auto !important;
 min-height:320px;
}
/* Do not block clicks with overlays */
.formio-component-overlay, .component-settings .formio-component-overlay {
 pointer-events: none !important;
}
/* Ensure the builder canvas is visible and scrollable */
.formio-builder .formarea, .formio-builder .stage {
 overflow: auto;
}

/* --- Simple button improvements for Form.io builder sidebar --- */
/* AGGRESSIVE approach to ensure full-width buttons without visible "flip" */

/* Hide Form.io sidebar until styles are ready (prevents flash) */
.formio-builder .formcomponents,
.formio-builder .builder-sidebar {
 opacity:0;
 transition: opacity 0.15s ease-in;
}

/* Show sidebar once builder is initialized */
.formio-builder-ready .formcomponents,
.formio-builder-ready .builder-sidebar {
 opacity:1;
}

/* Force container to be full-width */
.formio-builder .formcomponents,
.formio-builder .builder-sidebar,
.formio-builder [ref="sidebar"],
.formio-builder .formio-component-list {
 width:100% !important;
 box-sizing: border-box !important;
}

/* Limit the Form.io sidebar button rules to the sidebar only – avoid matching CKEditor toolbar buttons */
.formio-builder .formcomponents .btn,
.formio-builder .builder-sidebar .btn,
.formio-builder .formio-component-list .btn,
.formio-builder .formcomponents button.btn,
.formio-builder .builder-sidebar button.btn,
.formio-builder .formio-component-list button.btn {
 width:100% !important;
 max-width:100% !important;
 min-width:100% !important;
 text-align: left !important;
 margin-bottom:0.25rem !important;
 padding:0.5rem 0.75rem !important;
 font-size:0.875rem !important;
 border-radius:0.25rem !important;
 display: flex !important;
 align-items: center !important;
 gap:0.5rem !important;
 justify-content: flex-start !important;
 box-sizing: border-box !important;
 white-space: normal !important;
 flex-wrap: nowrap !important;
}

/* Ensure button text spans full width ONLY in the Form.io sidebar/palette buttons */
.formio-builder .formcomponents .btn span,
.formio-builder .builder-sidebar .btn span,
.formio-builder .formio-component-list .btn span {
  flex: 1 !important;
  text-align: left !important;
}

/* Ensure FontAwesome icons display properly with correct spacing, limited to sidebar/palette .btns */
.formio-builder .formcomponents .btn i,
.formio-builder .formcomponents .btn .fa,
.formio-builder .builder-sidebar .btn i,
.formio-builder .builder-sidebar .btn .fa,
.formio-builder .formio-component-list .btn i,
.formio-builder .formio-component-list .btn .fa {
  display: inline-block !important;
  flex-shrink: 0 !important;
  width: 1.25em !important;
  min-width: 1.25em !important;
  text-align: center !important;
  margin-right: 0 !important;
  font-style: normal !important;
}

/* Defensive: explicitly neutralize any flex expansion on CKEditor button labels within Form.io dialogs */
.formio-dialog .ck-toolbar .ck-button .ck-button__label,
.formio-component-edit .ck-toolbar .ck-button .ck-button__label {
  flex: 0 0 auto !important;
}

/* Component group headers */
.formio-builder .card-header,
.formio-builder h5 {
 background-color: #f8f9fa !important;
 font-weight: 600 !important;
 padding: 0.5rem 0.75rem !important;
 font-size: 0.875rem !important;
 margin: 0.5rem 0 !important;
}

/* Ensure the sidebar panels themselves are properly sized */
.formio-builder .formcomponents > div,
.formio-builder .builder-sidebar > div {
 width: 100% !important;
}

/* --- Form.io field labels bold (NOT select options or checkboxes) --- */
/* Main field labels */
.formio-form label.control-label,
.formio-builder label.control-label,
.formio-component > label.control-label,
.formio-component > .formio-component-label,
.formio-form .formio-component > label,
.formio-builder .formio-component > label,
.formio-form .form-group > label,
.formio-builder .form-group > label,
.formio-component-textfield > label,
.formio-component-textarea > label,
.formio-component-number > label,
.formio-component-email > label,
.formio-component-phoneNumber > label,
.formio-component-datetime > label,
.formio-component-day > label,
.formio-component-time > label,
.formio-component-currency > label,
.formio-component-select > label,
.formio-component-selectboxes > label.field-required,
.formio-component-radio > label.field-required,
.formio-component-checkbox > label.field-required:not(.form-check-label) {
 font-weight: 600 !important;
 font-size: 1.2em !important;
}

/* Ensure select options, radio buttons, and checkboxes remain normal weight */
.formio-form select option,
.formio-form .radio label,
.formio-form .checkbox label,
.formio-form .form-radio label,
.formio-form .form-check-label,
.formio-form .radio-inline label,
.formio-form .checkbox-inline label,
.formio-builder select option,
.formio-builder .radio label,
.formio-builder .checkbox label,
.formio-builder .form-radio label,
.formio-builder .form-check-label,
.formio-builder .radio-inline label,
.formio-builder .checkbox-inline label,
.formio-component-selectboxes .form-check-label,
.formio-component-radio .form-radio label,
.formio-component-checkbox .form-check-label {
 font-weight: 400 !important;
}


/* ---------------- RTE preview typography normalization for email authoring ---------------- */
/* Align editor body to typical email client base sizing (Gmail ~14px) */
.appt-rte .e-rte-content .e-content {
 font-size:14px !important;
 line-height:1.55 !important;
}
/* Heading sizes scaled to approximate Gmail rendering */
.appt-rte .e-rte-content .e-content h1 { font-size:24px !important; line-height:1.3 !important; margin:0.6em 0 0.4em !important; }
.appt-rte .e-rte-content .e-content h2 { font-size:20px !important; line-line