/******************************************************************************
 *
 * CRDM Shared Theme
 *
 * Shared design tokens and reusable components for the CRDM staff and public
 * experiences. These styles capture the established CRDM visual language
 * without changing legacy selectors.
 *
 ******************************************************************************/

:root {
	/* Brand and typography */
	--crdm-font-brand: "Palatino Linotype", Georgia, "Times New Roman", serif;
	--crdm-font-ui: Arial, Verdana, sans-serif;
	--crdm-font-size-control-label: 12px;
	--crdm-font-size-control: 16px;
	--crdm-text-on-accent: var(--crdm-page);
	/*
	--crdm-brand-gold: #d6b47b;
	*/
	--crdm-brand-gold: #E4B85A;
	--crdm-brand-tan: #d2c3a1;
	--crdm-brand-bronze: #af6e30;
	--crdm-brand-button: #74482b;
	--crdm-brand-button-hover: #603913;
	--crdm-brand-button-border: #977660;
	/* Previous gold calendar treatment:
	--crdm-date-icon-month: #1e88e5;
	--crdm-date-icon-month-text: #fff;
	*/
	--crdm-date-icon-month: var(--crdm-brand-gold);
	--crdm-date-icon-month-text: var(--crdm-text-on-accent);
	--crdm-date-icon-day-background: var(--crdm-text-value);
	--crdm-date-icon-day-text: var(--crdm-page);

	/* Application surfaces */
	--crdm-page: #221d1a;
	--crdm-background: #191513;
	--crdm-surface: #1d1917;
	--crdm-surface-embedded: #221e1b;
	--crdm-surface-raised: #241f1b;
	--crdm-surface-featured: #231e1b;
	--crdm-surface-hover: #302822;
	--crdm-surface-control: #2c2520;
	--crdm-surface-control-hover: #392e27;
	--crdm-surface-option-highlight: #363534;
	--crdm-surface-subtle: rgba(255, 255, 255, .018);
	--crdm-surface-subtle-hover: rgba(255, 255, 255, .045);
	--crdm-table-head: #4e4139;
	--crdm-table-head-text: var(--crdm-brand-tan);
	--crdm-table-head-accent: var(--crdm-brand-gold);
	--crdm-table-row: transparent;
	--crdm-table-row-stripe: #302925;
	--crdm-table-row-hover: var(--crdm-surface-control-hover);
	--crdm-border: #4c423a;
	--crdm-border-hover: #5a4d44;
	--crdm-border-strong: #6a5a50;

	/* Text hierarchy */
	--crdm-text: #aaa49d;
	--crdm-text-strong: #eee8e3;
	--crdm-text-value: #f8f3ef;
	--crdm-text-label: #9f9690;
	--crdm-text-muted: #918982;
	--crdm-text-subtle: #8f8781;
	--crdm-text-faint: #817973;

	/* Semantic accents */
	--crdm-neutral: #7d8793;
	--crdm-neutral-rgb: 125, 135, 147;
	--crdm-neutral-light: #cbd2da;
	--crdm-info: #6fa4ff;
	--crdm-info-rgb: 111, 164, 255;
	--crdm-info-light: #8ebcff;
	--crdm-success: #57d66f;
	--crdm-success-rgb: 87, 214, 111;
	--crdm-success-light: #8ee19d;
	--crdm-warning: #f0d157;
	--crdm-warning-rgb: 240, 209, 87;
	--crdm-warning-light: #f4dc80;
	--crdm-note: #f4d35e;
	--crdm-danger: #cc0000;
	--crdm-danger-rgb: 204, 0, 0;
	--crdm-danger-soft: #ff6565;
	--crdm-danger-soft-rgb: 255, 101, 101;
	--crdm-danger-light: #ff9d9d;
	--crdm-purple: #b27cff;
	--crdm-purple-rgb: 178, 124, 255;
	--crdm-purple-light: #c99cff;
	--crdm-purple-soft: #d9c8ff;
	--crdm-teal: #3dc9c2;
	--crdm-teal-rgb: 61, 201, 194;
	--crdm-teal-light: #9ee4df;
	--crdm-orange: #f5591f;
	--crdm-orange-rgb: 245, 89, 31;
	/*
	--crdm-orange: #ff7e50;
	--crdm-orange-rgb: 255, 126, 80;
	*/

	--crdm-orange-light: #ffad8d;
	--crdm-neutral-foreground: var(--crdm-neutral-light);
	--crdm-info-foreground: var(--crdm-info-light);
	--crdm-success-foreground: var(--crdm-success-light);
	--crdm-warning-foreground: var(--crdm-warning-light);
	--crdm-danger-foreground: var(--crdm-danger);
	--crdm-purple-foreground: var(--crdm-purple-soft);
	--crdm-teal-foreground: var(--crdm-teal-light);
	--crdm-orange-foreground: var(--crdm-orange);


	/* Shape, spacing and motion */
	--crdm-radius-sm: 7px;
	--crdm-radius-md: 11px;
	--crdm-radius-lg: 12px;
	--crdm-radius-pill: 999px;
	--crdm-space-1: 4px;
	--crdm-space-2: 8px;
	--crdm-space-3: 10px;
	--crdm-space-4: 12px;
	--crdm-space-5: 14px;
	--crdm-space-6: 16px;
	--crdm-space-7: 20px;
	--crdm-space-8: 24px;
	--crdm-transition-fast: .18s ease;
	--crdm-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .025);
	--crdm-shadow-raised: 0 5px 18px rgba(0, 0, 0, .2);
	--crdm-shadow-popover: 0 8px 24px rgba(0, 0, 0, .25);

	/* High-contrast picker surface */
	--crdm-picker-surface: #fff;
	--crdm-picker-text: #333;
	--crdm-picker-text-strong: #111827;
	--crdm-picker-border: #e5e5e5;
	--crdm-picker-hover: #e6e6e6;
}

/*
 * Opt-in shared light theme.
 *
 * This promotes the established report palette into the shared component
 * layer without changing the dark default or opting in any production page.
 */
.crdm-theme--light {
	--crdm-background: #eee9e4;
	--crdm-surface: #fff;
	--crdm-surface-embedded: #f8f5f2;
	--crdm-surface-raised: #fff;
	--crdm-surface-featured: #fbf8f5;
	--crdm-surface-hover: #f1e9e2;
	--crdm-surface-control: #fff;
	--crdm-surface-control-hover: #faf6f2;
	--crdm-surface-option-highlight: #e6ddd4;
	--crdm-surface-subtle: rgba(116, 72, 43, .035);
	--crdm-surface-subtle-hover: var(--crdm-surface-hover);
	--crdm-table-head: var(--crdm-brand-button);
	--crdm-table-head-text: var(--crdm-surface-control);
	--crdm-table-head-accent: var(--crdm-warning);
	--crdm-table-row: var(--crdm-surface-raised);
	--crdm-table-row-stripe: var(--crdm-surface-embedded);
	--crdm-table-row-hover: var(--crdm-surface-hover);
	--crdm-border: #d8cec5;
	--crdm-border-hover: #b9aa9e;
	--crdm-border-strong: #b4a397;
	--crdm-text: #5e5751;
	--crdm-text-strong: #302a26;
	--crdm-text-value: #211d1a;
	--crdm-text-label: #746a63;
	--crdm-text-muted: #766e68;
	--crdm-text-subtle: #6f6761;
	--crdm-text-faint: #847a72;
	--crdm-brand-gold: #875526;
	--crdm-brand-tan: #745d47;
	--crdm-info: #2563eb;
	--crdm-info-rgb: 37, 99, 235;
	--crdm-info-light: #1d4ed8;
	--crdm-neutral-foreground: var(--crdm-text-subtle);
	--crdm-info-foreground: var(--crdm-info-light);
	--crdm-success-foreground: #316b46;
	--crdm-warning-foreground: var(--crdm-brand-gold);
	--crdm-danger-foreground: var(--crdm-danger);
	--crdm-purple-foreground: #512da8;
	--crdm-teal-foreground: var(--crdm-text-value);
	--crdm-orange-foreground: var(--crdm-brand-gold);
	--crdm-text-on-accent: var(--crdm-surface-control);
	--crdm-date-icon-month: var(--crdm-brand-gold);
	--crdm-date-icon-month-text: var(--crdm-text-on-accent);
	--crdm-date-icon-day-background: var(--crdm-surface-control);
	--crdm-date-icon-day-text: var(--crdm-text-value);
	--crdm-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .78);
	--crdm-shadow-raised: 0 5px 18px rgba(60, 45, 36, .12);
	--crdm-shadow-popover: 0 8px 24px rgba(60, 45, 36, .18);
	color-scheme: light;
}

/******************************************************************************
 * Shared form controls
 ******************************************************************************/

.crdm-control-label {
	color: var(--crdm-text-label);
	font-family: var(--crdm-font-ui);
	font-size: var(--crdm-font-size-control-label);
	font-weight: 700;
	letter-spacing: .045em;
	line-height: 1.25;
	text-align: left;
	text-transform: uppercase;
}

.crdm-control {
	box-sizing: border-box;
	width: 100%;
	height: 38px;
	min-width: 0;
	margin: 0;
	padding: 0 10px;
	vertical-align: middle;
	color: var(--crdm-text-value);
	background-color: var(--crdm-surface-control);
	border: 1px solid var(--crdm-border-strong) !important;
	border-radius: var(--crdm-radius-sm) !important;
	font-family: var(--crdm-font-ui);
	font-size: var(--crdm-font-size-control);
	font-weight: 400;
}

.crdm-control--auto {
	width: auto;
	max-width: 100%;
}

/* Preserve modern text contrast when a legacy field class supplies its color. */
input.crdm-control,
select.crdm-control,
textarea.crdm-control {
	color: var(--crdm-text-value);
}

textarea.crdm-control--multiline {
	height: auto;
	min-height: 96px;
	padding-top: 9px;
	padding-bottom: 9px;
	resize: vertical;
}

/* Native file selection, with the same opt-in themed control surface. */
.crdm-control--file {
	height: auto;
	max-width: 360px;
	padding: 6px;
}

.crdm-control--file::file-selector-button {
	margin-right: var(--crdm-space-2);
	padding: 6px 10px;
	color: var(--crdm-text-value);
	background: linear-gradient(180deg, var(--crdm-brand-button), var(--crdm-brand-button-hover));
	border: 1px solid var(--crdm-brand-button-border);
	border-radius: var(--crdm-radius-sm);
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}

.crdm-control--file::file-selector-button:hover {
	background: var(--crdm-brand-button-hover);
}

.crdm-control--short {
	max-width: 90px;
}

.crdm-control--standard {
	max-width: 240px;
}

.crdm-control--wide {
	max-width: 360px;
}

.crdm-control--card-entry {
	font-family: "Farrington 7B", Consolas, "Courier New", monospace;
	font-variant-numeric: tabular-nums;
	font-size: 16px;
}

.card-wrapper .jp-card .jp-card-front .jp-card-lower .jp-card-number,
.card-wrapper .jp-card .jp-card-front .jp-card-lower .jp-card-expiry,
.card-wrapper .jp-card .jp-card-front .jp-card-lower .jp-card-name {
	font-family: "Farrington 7B", Consolas, "Courier New", monospace;
	font-variant-numeric: tabular-nums;
}

.crdm-card-entry-layout {
	display: grid;
	width: 100%;
	max-width: 100%;
	grid-template-columns: max-content minmax(315px, 1fr);
	align-items: start;
	gap: var(--crdm-space-6);
}

.crdm-card-entry-fields {
	margin: 0;
}

.crdm-card-entry-fields td {
	vertical-align: middle;
}

.crdm-card-entry-layout > .card-container {
	margin: 0;
	justify-self: end;
}

@media (max-width: 700px) {
	.crdm-card-entry-layout {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--crdm-space-4);
	}

	.crdm-card-entry-fields,
	.crdm-card-entry-fields > tbody,
	.crdm-card-entry-fields > tbody > tr,
	.crdm-card-entry-fields > tbody > tr > td {
		display: block;
	}

	.crdm-card-entry-fields > tbody > tr + tr {
		margin-top: var(--crdm-space-2);
	}

	.crdm-card-entry-fields > tbody > tr > td {
		text-align: left !important;
	}

	.crdm-card-entry-layout > .card-container {
		float: none !important;
		justify-self: start;
	}
}

input[type="tel"].crdm-control,
.crdm-control--phone {
	width: 164px;
	max-width: 164px;
}

@media (min-width: 1024px) {
	.crdm-control--desktop-medium {
		max-width: 175px;
	}
}

.crdm-control::placeholder {
	color: var(--crdm-text-faint);
}

/* Let high-contrast modes retain their system selection colors. */
@media (forced-colors: none) {
	.crdm-control::selection {
		color: var(--crdm-text-on-accent);
		background-color: var(--crdm-brand-gold);
	}
}

select.crdm-control {
	-webkit-appearance: none;
	appearance: none;
	padding-right: 34px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.25 6 6.25 11 1.25' fill='none' stroke='%23d6b47b' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 12px 8px;
}

.crdm-control option,
.crdm-control optgroup {
	color: var(--crdm-text-value);
	background: var(--crdm-surface-control);
}

.crdm-control:focus {
	border-color: var(--crdm-info) !important;
	box-shadow: 0 0 0 2px rgba(var(--crdm-info-rgb), .16);
	outline: none;
}

/* Opt-in surface for the existing jQuery autocomplete widget. */
.ui-autocomplete.crdm-autocomplete-popup {
	max-height: 300px;
	overflow-x: hidden;
	overflow-y: auto;
	color: var(--crdm-text-value);
	background: var(--crdm-surface-raised);
	border: 1px solid var(--crdm-border-strong);
	border-radius: var(--crdm-radius-sm);
	box-shadow: var(--crdm-shadow-popover);
	font-family: var(--crdm-font-ui);
	font-size: var(--crdm-font-size-control);
}

.crdm-autocomplete-popup .ui-menu-item-wrapper {
	color: var(--crdm-text-value);
}

.crdm-autocomplete-popup .ui-menu-item-wrapper.ui-state-active {
	color: var(--crdm-text-on-accent);
	background: var(--crdm-brand-gold);
	border-color: var(--crdm-brand-gold);
}

input[type="date"].crdm-control,
input[type="datetime-local"].crdm-control,
input[type="time"].crdm-control {
	color-scheme: dark;
}

.crdm-theme--light input[type="date"].crdm-control,
.crdm-theme--light input[type="datetime-local"].crdm-control,
.crdm-theme--light input[type="time"].crdm-control {
	color-scheme: light;
}

/******************************************************************************
 * Shared layout, feedback and data components
 ******************************************************************************/

.crdm-panel {
	background: var(--crdm-surface-embedded);
	border: 1px solid var(--crdm-border);
	border-radius: var(--crdm-radius-md);
	box-shadow: var(--crdm-shadow-inset);
}

.crdm-panel--strong {
	border-color: var(--crdm-border-strong);
}

.crdm-field {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 5px;
}

/* Opt-in stacking for side-by-side legacy form sections with long labels. */
@media (max-width: 900px) {
	table.crdm-form-columns,
	table.crdm-form-columns > tbody,
	table.crdm-form-columns > tbody > tr,
	table.crdm-form-columns > tbody > tr > td {
		display: block;
	}
	table.crdm-form-columns > tbody > tr > td {
		width: auto !important;
	}
	table.crdm-form-columns > tbody > tr > td > table {
		margin-left: 0;
	}
	table.crdm-form-columns > tbody > tr > td > label,
	table.crdm-form-columns > tbody > tr > td > .crdm-control-label {
		display: block;
		text-align: left;
	}
}

/* Match the legacy breakpoint where nested label/value cells actually stack. */
@media (max-width: 767px) {
	/* A table-row still creates an intrinsic-width grid around block cells. */
	table.crdm-form-columns > tbody > tr > td > table > tbody > tr {
		display: block;
	}

	/* Keep nested inline label/value pairs, without their intrinsic overflow. */
	table.crdm-form-pairs > tbody {
		display: grid;
		grid-template-columns: minmax(0, max-content) minmax(0, 1fr);
		align-items: center;
	}

	table.crdm-form-pairs > tbody > tr {
		display: contents;
	}

	table.crdm-form-pairs > tbody > tr > td {
		display: block !important;
		min-width: 0;
		width: auto !important;
	}

	table.crdm-form-pairs > tbody > tr > td[colspan="2"] {
		grid-column: 1 / -1;
	}

	/* Keep opt-in summary labels and right-aligned values paired on phones. */
	tr.crdm-summary-row,
	.crdm-form-columns tr.crdm-summary-row {
		display: grid;
		grid-template-columns: minmax(0, 1fr) max-content;
		align-items: baseline;
		column-gap: var(--crdm-space-4);
		padding-top: 5px;
		padding-bottom: 5px;
	}

	tr.crdm-summary-row > td {
		min-width: 0;
		padding-top: 0;
		padding-bottom: 0;
	}

	tr.crdm-summary-row > td:last-child {
		white-space: nowrap;
	}

	tr.crdm-summary-row > td:last-child > span {
		margin-right: 0 !important;
	}
}

/* Keep compact financial labels, controls, and totals paired while they fit. */
@media (min-width: 361px) and (max-width: 767px) {
	form#ResSysForm table.crdm-financial-summary {
		display: table !important;
		width: auto;
		max-width: 100%;
		margin: 0;
	}

	form#ResSysForm table.crdm-financial-summary > tbody {
		display: table-row-group !important;
	}

	form#ResSysForm table.crdm-financial-summary > tbody > tr,
	form#ResSysForm table.crdm-financial-summary > tbody > tr.crdm-summary-row {
		display: table-row !important;
		padding: 0;
	}

	form#ResSysForm table.crdm-financial-summary > tbody > tr > td {
		display: table-cell !important;
		width: auto !important;
		vertical-align: middle;
	}

	form#ResSysForm table.crdm-financial-summary > tbody > tr > td:first-child {
		padding-right: var(--crdm-space-4);
		text-align: right !important;
	}

	form#ResSysForm table.crdm-financial-summary .crdm-control-label {
		display: inline !important;
		white-space: nowrap;
		text-align: right !important;
	}
}

/* Long translated labels and 300px fields need a single column on phones. */
@media (max-width: 480px) {
	table.crdm-form-pairs > tbody {
		grid-template-columns: minmax(0, 1fr);
	}

	table.crdm-form-pairs > tbody > tr > td {
		grid-column: 1;
		text-align: left !important;
	}
}

.crdm-filter-panel {
	display: flow-root;
	margin-bottom: var(--crdm-space-5);
	padding: var(--crdm-space-4);
}

.crdm-availability-filter .crdm-filter-date-pair-row > td:nth-child(5),
.crdm-availability-filter .crdm-filter-actions {
	white-space: nowrap;
}

/* Actions follow the floated groups once the desktop filter layout contracts. */
@media (max-width: 1023px) {
	form.crdm-filter-panel--responsive > table:not([style*="float"]) {
		clear: both;
	}
}

/* Dense legacy filter tables keep their desktop rows, then use aligned pairs. */
@media (min-width: 768px) and (max-width: 1023px) {
	form.crdm-availability-filter > table {
		width: 100%;
		border-spacing: 0;
		table-layout: fixed;
	}

	form.crdm-availability-filter .crdm-filter-date-pair-row > td:nth-child(1) {
		width: 68px;
	}

	form.crdm-availability-filter .crdm-filter-date-pair-row > td:nth-child(2) {
		width: calc(50% - 174px);
	}

	form.crdm-availability-filter .crdm-filter-date-pair-row > td:nth-child(3) {
		width: 95px;
	}

	form.crdm-availability-filter .crdm-filter-date-pair-row > td:nth-child(4) {
		width: calc(50% - 174px);
	}

	form.crdm-availability-filter .crdm-filter-date-pair-row > td:nth-child(5) {
		width: 110px;
	}

	form.crdm-availability-filter .crdm-filter-date-pair-row > td:nth-child(6) {
		width: 75px;
	}

	form.crdm-filter-panel--responsive > table {
		display: block;
	}

	form.crdm-filter-panel--responsive > table > tbody {
		display: grid;
		grid-template-columns: max-content minmax(0, 1fr);
		align-items: center;
	}

	form.crdm-filter-panel--responsive > table > tbody > tr {
		display: contents;
	}

	form.crdm-filter-panel--responsive > table > tbody > tr > td {
		display: block !important;
		min-width: 0;
		width: auto !important;
	}

	form.crdm-filter-panel--responsive > table > tbody > tr > td:has(> .crdm-button) {
		grid-column: 1 / -1;
	}
}

/* Supersede old inline table-cell widths/displays when filter labels stack. */
@media (max-width: 767px) {
	form.crdm-filter-panel--responsive > table > tbody > tr > td {
		display: block !important;
		width: auto !important;
	}
}

/* Keep legacy floated filter groups in order on narrow screens. */
@media (max-width: 767px) {
	.crdm-filter-panel > table {
		float: none !important;
	}

	.crdm-filter-panel .crdm-filter-actions {
		text-align: left !important;
	}

	.crdm-filter-panel tr.crdm-filter-date-pair-row {
		display: grid !important;
		width: 100%;
		grid-template-columns: 150px 150px max-content;
		column-gap: var(--crdm-space-2);
	}

	.crdm-filter-date-pair-row > td:nth-child(1) {
		grid-column: 1;
		grid-row: 1;
	}

	.crdm-filter-date-pair-row > td:nth-child(2) {
		grid-column: 1;
		grid-row: 2;
	}

	.crdm-filter-date-pair-row > td:nth-child(3) {
		grid-column: 2;
		grid-row: 1;
	}

	.crdm-filter-date-pair-row > td:nth-child(4) {
		grid-column: 2;
		grid-row: 2;
	}

	.crdm-filter-date-pair-row > td:nth-child(5) {
		grid-column: 3;
		grid-row: 1;
		text-align: left !important;
	}

	.crdm-filter-date-pair-row > td:nth-child(6) {
		grid-column: 3;
		grid-row: 2;
	}

	.crdm-filter-date-pair-row .crdm-date-control {
		width: 150px;
	}

	.crdm-filter-panel tr.crdm-filter-two-field-row {
		display: grid !important;
		width: 100%;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: var(--crdm-space-2);
	}

	.crdm-filter-two-field-row > td:nth-child(1) {
		grid-column: 1;
		grid-row: 1;
	}

	.crdm-filter-two-field-row > td:nth-child(2) {
		grid-column: 1;
		grid-row: 2;
	}

	.crdm-filter-two-field-row > td:nth-child(3) {
		grid-column: 2;
		grid-row: 1;
		text-align: left !important;
	}

	.crdm-filter-two-field-row > td:nth-child(4) {
		grid-column: 2;
		grid-row: 2;
	}

	.crdm-filter-two-field-row > td:nth-child(5) {
		margin-top: var(--crdm-space-3);
		grid-column: 1 / -1;
		grid-row: 3;
	}

	.crdm-filter-two-field-row .crdm-control {
		width: 100%;
		max-width: 240px;
	}
}

@media (max-width: 480px) {
	.crdm-filter-panel tr.crdm-filter-date-pair-row {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.crdm-filter-date-pair-row > td:nth-child(5) {
		margin-top: var(--crdm-space-2);
		grid-column: 1 / -1;
		grid-row: 3;
	}

	.crdm-filter-date-pair-row > td:nth-child(6) {
		grid-column: 1 / -1;
		grid-row: 4;
	}

	.crdm-filter-date-pair-row .crdm-date-control {
		width: 150px;
		max-width: 100%;
	}
}

@media (min-width: 700px) and (max-width: 767px) {
	.crdm-filter-panel tr.crdm-filter-two-field-row {
		grid-template-columns: 220px 220px max-content;
	}

	.crdm-filter-two-field-row > td:nth-child(5) {
		margin-top: 0;
		align-self: end;
		grid-column: 3;
		grid-row: 2;
	}
}

@media (max-width: 360px) {
	.crdm-filter-panel tr.crdm-filter-two-field-row {
		grid-template-columns: minmax(0, 1fr);
	}

	.crdm-filter-two-field-row > td:nth-child(1) {
		grid-column: 1;
		grid-row: 1;
	}

	.crdm-filter-two-field-row > td:nth-child(2) {
		grid-column: 1;
		grid-row: 2;
	}

	.crdm-filter-two-field-row > td:nth-child(3) {
		margin-top: var(--crdm-space-2);
		grid-column: 1;
		grid-row: 3;
	}

	.crdm-filter-two-field-row > td:nth-child(4) {
		grid-column: 1;
		grid-row: 4;
	}

	.crdm-filter-two-field-row > td:nth-child(5) {
		grid-column: 1;
		grid-row: 5;
	}
}

@media (max-width: 720px) {
	.crdm-filter-panel {
		padding: var(--crdm-space-3);
	}
}

.crdm-control-actions {
	display: flex;
	min-width: 0;
	align-items: center;
	gap: var(--crdm-space-2);
}

.crdm-control-actions > .crdm-control {
	flex: 1;
}

.crdm-control-actions > .crdm-button {
	flex-shrink: 0;
}

.crdm-filter-row {
	display: flex;
	align-items: center;
	gap: var(--crdm-space-4);
	flex-wrap: wrap;
}

.crdm-filter-pair {
	display: grid;
	min-width: 0;
	max-width: 100%;
	align-items: center;
	grid-template-columns: max-content max-content;
	column-gap: var(--crdm-space-2);
	row-gap: var(--crdm-space-2);
}

.crdm-filter-pair > .crdm-filter-field {
	display: contents;
}

.crdm-filter-field {
	display: flex;
	min-width: 0;
	max-width: 100%;
	align-items: center;
	gap: var(--crdm-space-2);
}

.crdm-filter-field > label {
	margin-right: 0;
	flex-shrink: 0;
}

.crdm-action-row {
	display: flex;
	align-items: center;
	gap: var(--crdm-space-1);
	flex-wrap: wrap;
}

.crdm-action-row--nowrap {
	min-width: 0;
	flex-wrap: nowrap;
}

.crdm-action-row--nowrap > .crdm-button {
	flex-shrink: 0;
}

.crdm-financial-amount {
	display: inline-block;
	box-sizing: border-box;
	width: 100px;
	font-variant-numeric: tabular-nums;
	text-align: right;
	white-space: nowrap;
	padding-right: 10px;
	font-size: var(--crdm-font-size-control);
	font-family: var(--crdm-font-ui);
}

.crdm-financial-summary__amount-cell {
	text-align: left;
}

.crdm-phone-control > .crdm-control {
	flex: 1 1 160px;
}

.crdm-phone-control__actions {
	flex: 0 0 auto;
	flex-wrap: nowrap;
}

.crdm-phone-control__actions[hidden] {
	display: none !important;
}

.crdm-heading-action-row {
	display: flex;
	width: 100%;
	align-items: center;
	gap: var(--crdm-space-3) var(--crdm-space-6);
	flex-wrap: wrap;
}

.crdm-heading-action-row--section {
	margin-bottom: 34px;
}

.crdm-heading-action-row > h1.crdm-heading-action-row__title {
	max-width: 100%;
	margin: 0 auto 0 0;
	flex: 0 0 auto;
	text-align: left;
}

.crdm-heading-action-row__actions {
	max-width: 100%;
	margin: 0;
	flex: 0 0 auto;
}

.crdm-pagination {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	margin-top: var(--crdm-space-5);
	align-items: center;
	gap: var(--crdm-space-3);
	font-family: var(--crdm-font-ui);
	font-size: 12px;
}

.crdm-pagination > :first-child {
	text-align: left;
}

.crdm-pagination > :nth-child(2) {
	text-align: center;
}

.crdm-pagination > :last-child {
	text-align: right;
}

.crdm-helper-text {
	color: var(--crdm-text-muted);
	font-family: var(--crdm-font-ui);
	font-size: 13px;
	line-height: 1.45;
}

.crdm-helper-text--small {
	color: var(--crdm-text-faint);
	font-size: 11px;
	line-height: 1.4;
}

.crdm-alert {
	margin: 0 0 var(--crdm-space-5);
	padding: var(--crdm-space-4);
	border: 1px solid;
	border-radius: var(--crdm-radius-md);
	font-family: var(--crdm-font-ui);
	font-weight: 700;
}

.crdm-alert--danger {
	color: var(--crdm-danger-foreground);
	background: rgba(var(--crdm-danger-soft-rgb), .08);
	border-color: rgba(var(--crdm-danger-soft-rgb), .4);
}

.crdm-alert--success {
	color: var(--crdm-success-foreground);
	background: rgba(var(--crdm-success-rgb), .08);
	border-color: rgba(var(--crdm-success-rgb), .35);
}

.crdm-language-control,
.crdm-flag-control {
	display: flex;
	width: 100%;
	max-width: 320px;
	min-width: 0;
	align-items: center;
	gap: var(--crdm-space-1);
}

.crdm-language-control > select,
.crdm-flag-control > select {
	min-width: 0;
	flex: 1 1 auto;
}

.crdm-language-control--fill,
.crdm-flag-control--fill {
	max-width: none;
}

.crdm-language-flag,
.crdm-flag-button {
	display: inline-flex;
	box-sizing: border-box;
	width: 38px;
	height: 38px;
	align-items: center;
	justify-content: center;
	background: var(--crdm-surface-control);
	border: 1px solid var(--crdm-border-strong);
	border-radius: var(--crdm-radius-sm);
	transition: background var(--crdm-transition-fast), border-color var(--crdm-transition-fast);
	flex: 0 0 38px;
}

.crdm-language-flag:hover,
.crdm-language-flag:focus-visible,
.crdm-flag-button:hover,
.crdm-flag-button:focus-visible {
	background: var(--crdm-surface-control-hover);
	border-color: var(--crdm-brand-gold);
	outline: none;
}

.crdm-language-flag:focus-visible,
.crdm-flag-button:focus-visible {
	box-shadow: 0 0 0 2px rgba(var(--crdm-info-rgb), .16);
}

.crdm-language-flag img,
.crdm-flag-button img {
	display: block;
	width: auto;
	max-width: 28px;
	height: auto;
	max-height: 21px;
}

.crdm-toggle-control {
	display: flex;
	box-sizing: border-box;
	width: fit-content;
	max-width: 100%;
	height: 38px;
	padding: 0 var(--crdm-space-3);
	align-items: center;
	align-self: flex-start;
	justify-self: start;
	gap: var(--crdm-space-3);
	flex: 0 0 auto;
	color: var(--crdm-text-value);
	background: var(--crdm-surface-control);
	border: 1px solid var(--crdm-border-strong);
	border-radius: var(--crdm-radius-sm);
	font-family: var(--crdm-font-ui);
	font-size: var(--crdm-font-size-control);
}

.crdm-toggle-control--compact {
	display: inline-flex;
}

.crdm-toggle-control .fancyCheck {
	height: 20px;
	margin: 0;
	flex: 0 0 20px;
}

.crdm-toggle-control .fancyCheck label {
	top: 0;
}

/* Shared radio choices, first proven in the UI Laboratory. */
.crdm-radio-group {
	display: flex;
	align-items: center;
	gap: var(--crdm-space-5);
	flex-wrap: wrap;
	font-family: var(--crdm-font-ui);
	font-size: var(--crdm-font-size-control);
	line-height: 1.25;
}

.crdm-radio-group label {
	display: inline-flex;
	margin-right: 0;
	align-items: center;
	gap: 6px;
	color: var(--crdm-text-strong);
	text-align: left;
}

.crdm-radio-group input[type="radio"] {
	width: auto;
	height: auto;
	margin: 0;
	accent-color: var(--crdm-brand-gold);
	color-scheme: dark;
}

.crdm-scroll-region {
	max-width: 100%;
	overflow-x: auto;
}

.crdm-data-table {
	width: 100%;
	color: var(--crdm-text);
	background: var(--crdm-table-row);
	table-layout: fixed;
}

.crdm-data-table th,
.crdm-data-table td {
	box-sizing: border-box;
}

.crdm-data-table thead th {
	color: var(--crdm-table-head-text);
	background: var(--crdm-table-head);
	border-bottom: 1px solid var(--crdm-border-strong);
}

.crdm-data-table thead th a {
	color: var(--crdm-table-head-text);
}

.crdm-data-table thead th a:hover,
.crdm-data-table thead th a:focus,
.crdm-data-table thead .crdm-list-sort-indicator.is-active {
	color: var(--crdm-table-head-accent);
}

.crdm-data-table thead .crdm-list-sort-indicator:not(.is-active) {
	color: var(--crdm-table-head-text);
	opacity: .55;
}

.crdm-data-table tbody tr {
	color: var(--crdm-text);
	background: var(--crdm-table-row);
	transition: background var(--crdm-transition-fast);
}

.crdm-data-table tbody tr.StandardListHighlight {
	background: var(--crdm-table-row-stripe);
}

.crdm-data-table tbody tr:hover {
	background: var(--crdm-table-row-hover);
}

.crdm-data-table tbody td {
	color: inherit;
	border-bottom: 1px solid var(--crdm-border);
}

.crdm-data-table tbody a {
	color: var(--crdm-brand-gold);
}

.crdm-data-table tfoot td {
	color: var(--crdm-text-strong);
	background: var(--crdm-surface-embedded);
	border-top: 1px solid var(--crdm-border-strong);
}

.crdm-empty-state td {
	padding: var(--crdm-space-7);
	color: var(--crdm-text-muted);
	font-family: var(--crdm-font-ui);
	text-align: center;
}

.crdm-count-badge {
	display: inline-flex;
	box-sizing: border-box;
	min-width: 24px;
	height: 20px;
	padding: 0 7px;
	align-items: center;
	justify-content: center;
	color: var(--crdm-text-muted);
	background: var(--crdm-surface-control);
	border: 1px solid var(--crdm-border);
	border-radius: var(--crdm-radius-pill);
	font-family: var(--crdm-font-ui);
	font-size: 11px;
	font-variant-numeric: tabular-nums;
}

.crdm-status-badge {
	display: inline-flex;
	padding: 2px 7px;
	align-items: center;
	justify-content: center;
	color: var(--crdm-neutral-foreground);
	background: rgba(var(--crdm-neutral-rgb), .12);
	border: 1px solid rgba(var(--crdm-neutral-rgb), .42);
	border-radius: var(--crdm-radius-pill);
	font-family: var(--crdm-font-ui);
	font-size: 9px;
	font-weight: 700;
	letter-spacing: .035em;
	line-height: 1.45;
	text-transform: uppercase;
	white-space: nowrap;
}

.crdm-status-badge--success {
	color: var(--crdm-success-foreground);
	background: rgba(var(--crdm-success-rgb), .12);
	border-color: rgba(var(--crdm-success-rgb), .42);
}

.crdm-status-badge--warning {
	color: var(--crdm-warning-foreground);
	background: rgba(var(--crdm-warning-rgb), .12);
	border-color: rgba(var(--crdm-warning-rgb), .42);
}

.crdm-status-badge--danger {
	color: var(--crdm-danger-foreground);
	background: rgba(var(--crdm-danger-soft-rgb), .11);
	border-color: rgba(var(--crdm-danger-rgb), .42);
}

.crdm-status-badge--purple {
	color: var(--crdm-purple-foreground);
	background: rgba(var(--crdm-purple-rgb), .13);
	border-color: rgba(var(--crdm-purple-rgb), .42);
}

.crdm-status-badge--teal {
	color: var(--crdm-teal-foreground);
	background: rgba(var(--crdm-teal-rgb), .12);
	border-color: rgba(var(--crdm-teal-rgb), .42);
}

.crdm-status-badge--orange {
	color: var(--crdm-orange-foreground);
	background: rgba(var(--crdm-orange-rgb), .2);
	border-color: rgba(var(--crdm-orange-rgb), .42);
}

@media (max-width: 720px) {
	.crdm-filter-pair {
		width: 100%;
	}

	.crdm-language-flag,
	.crdm-flag-button {
		width: 42px;
		height: 42px;
		flex-basis: 42px;
	}

	.crdm-toggle-control {
		height: 42px;
	}

	.crdm-pagination {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.crdm-pagination > :nth-child(2) {
		grid-column: 1 / -1;
		grid-row: 1;
	}

	.crdm-pagination .crdm-button {
		width: 100%;
	}
}

@media (max-width: 480px) {
	.crdm-filter-pair {
		display: flex;
		align-items: stretch;
		gap: var(--crdm-space-3);
		flex-direction: column;
	}

	.crdm-filter-pair > .crdm-filter-field {
		display: flex;
		align-items: stretch;
		flex-direction: column;
	}
}

/******************************************************************************
 * Shared guest-facing brand header
 ******************************************************************************/

.crdm-guest-brand {
	display: flex;
	padding: 0 48px;
	align-items: flex-start;
	gap: 32px;
	background: linear-gradient(180deg, rgba(255, 255, 255, .018), transparent);
	text-align: center;
}

.crdm-guest-brand__home {
	display: block;
	line-height: 0;
	flex: 0 0 auto;
}

.crdm-guest-brand img {
	width: 230px;
	height: auto;
	flex: 0 0 auto;
}

.crdm-guest-brand p {
	margin: 42px 0 0;
	color: var(--crdm-brand-gold);
	font: italic 27px/1.25 Georgia, "Times New Roman", serif;
	flex: 1;
}

.crdm-guest-brand span,
.crdm-guest-brand strong {
	display: block;
}

.crdm-guest-brand strong {
	margin: 5px 0;
	color: var(--crdm-text-value);
	font-size: 32px;
	font-weight: 400;
}

@media (max-width: 800px) {
	.crdm-guest-brand {
		padding: 0 24px;
	}

	.crdm-guest-brand img {
		width: 180px;
	}

	.crdm-guest-brand p {
		margin-top: 31px;
		font-size: 21px;
	}

	.crdm-guest-brand strong {
		font-size: 26px;
	}
}

@media (max-width: 560px) {
	.crdm-guest-brand {
		padding: 0 16px;
		gap: 12px;
	}

	.crdm-guest-brand img {
		width: 135px;
	}

	.crdm-guest-brand p {
		margin-top: 23px;
		font-size: 15px;
	}

	.crdm-guest-brand strong {
		font-size: 19px;
	}
}
