/* ==========================================================================
   Project Central - Component Styles
   Moved from media/com_projectcentral/css/default.css into the Asteroid 2
   template so styles are editable within the template workflow.

   Loaded via Astroid customcssfiles param (before custom.css).
   GUI-controlled values (body font-size, background colors) are set in
   Asteroid 2 > Body > Typography / Colors — do not duplicate here.
   ========================================================================== */

/* ===== TOKENS / GLOBAL TYPOGRAPHY ===== */
:root {
	--pc-font-ui: 1rem;

	--pc-radius: 0.5rem;
	--pc-radius-sm: 0.375rem;

	/* Layout spacing - consistent gaps between sections */
	--pc-section-gap: 1rem;
	--pc-side-margin: 0.75rem;

	--pc-table-pad-y: 8px;
	--pc-table-pad-x: 6px;

	/* Table header - Light mode */
	--pc-thead-bg: rgba(87, 104, 122, 1);
	--pc-thead-fg: #fff;

	/* Page backgrounds */
	--pc-bg-light: #f8f9fa;
	--pc-bg-dark: #1a1d21;

	/* Module colors - Light mode */
	--pc-module-bg: #e5e7eb;
	--pc-module-border: #d1d5db;
	--pc-module-text: #374151;

	/* Module colors - Dark mode */
	--pc-module-bg-dark: #2d3748;
	--pc-module-border-dark: #4a5568;
	--pc-module-text-dark: #e2e8f0;
}

/* Mobile: reduce spacing */
@media (max-width: 768px) {
	:root {
		--pc-section-gap: 0.5rem;
		--pc-side-margin: 0.25rem;
	}

	/* Shrink Bootstrap container gutter on mobile */
	.container, .container-fluid, .container-sm, .container-md,
	.container-lg, .container-xl, .container-xxl {
		--bs-gutter-x: 0.5rem;
	}

	/* Component area - minimal padding (container gutter already provides some) */
	main.astroid-component-area {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	/* Address selector cards - full width on mobile */
	.address-selector .address-cards {
		flex-direction: column !important;
	}
	.address-selector .address-card {
		flex: 1 1 100% !important;
		min-width: 100% !important;
	}
}

/* Override Astroid's enlarged container gutter at 960px+ */
@media (min-width: 960px) {
	.container, .container-fluid, .container-sm, .container-md,
	.container-lg, .container-xl, .container-xxl {
		--bs-gutter-x: 1.5rem;
	}
}

/* Dark mode variable overrides */
[data-bs-theme="dark"] {
	--pc-module-bg: var(--pc-module-bg-dark);
	--pc-module-border: var(--pc-module-border-dark);
	--pc-module-text: var(--pc-module-text-dark);
	--pc-thead-bg: var(--as-header-bg);
}

/* Hide empty Astroid layout sections (module position rendered but no modules assigned) */
.astroid-section:has(.astroid-module-position:empty):not(:has(.moduletable, main, a)),
.astroid-row:has(.astroid-module-position:empty):not(:has(.moduletable, main, a)) {
	display: none !important;
}

/* Generic module styling class */
.pc-module {
	background-color: var(--pc-module-bg) !important;
	border: 1px solid var(--pc-module-border) !important;
	border-radius: var(--pc-radius) !important;
	color: var(--pc-module-text) !important;
	margin: 0 var(--pc-side-margin) !important;
	padding: 1rem !important;
}
.pc-module a,
.pc-module label {
	color: var(--pc-module-text) !important;
}

/* ===== CONSISTENT LAYOUT SPACING SYSTEM =====
   All content containers use:
   - margin: 0 var(--pc-side-margin) for side alignment
   - No top margin (gap controlled by preceding element's margin-bottom)

   Spacing elements (breadcrumb, btn-stack) use:
   - margin-bottom: var(--pc-section-gap) for gap to next element
   ============================================= */

/* Content containers - consistent side margins */
.pc-content-box,
.pc-photogallery,
.pc-photogallery-upload,
.pc-module,
main.astroid-component-area > .card,
main.astroid-component-area > form > .card,
main.astroid-component-area > joomla-tab {
	margin-left: var(--pc-side-margin);
	margin-right: var(--pc-side-margin);
}

/* NOTE: html/body font-size and background-color are now controlled via
   Asteroid 2 template GUI settings (Body Typography & Body Background Color).
   Do not re-add them here. */

/* Inherit base font size into common content nodes */
.alert,
.system-message,
.message,
p,
span {
	font-size: inherit;
}

/* Joomla system messages - match breadcrumbs margins */
#system-message-container,
.system-message-container {
	margin: 0 var(--pc-side-margin) var(--pc-section-gap) var(--pc-side-margin) !important;
}
/* Collapse empty system-message and its Astroid wrapper */
#system-message-container:empty,
.system-message-container:empty {
	display: none !important;
}
.astroid-message:has(#system-message-container:empty) {
	display: none !important;
}
/* Collapse empty search filters container (Joomla searchtools) */
.js-stools-container-filters:empty {
	display: none !important;
}

/* Main content area - match header/breadcrumb margins */
main.astroid-component-area {
	padding-left: var(--pc-side-margin) !important;
	padding-right: var(--pc-side-margin) !important;
}
/* Remove child side margins inside main to avoid double spacing
   (main padding already provides the same var(--pc-side-margin) inset) */
main.astroid-component-area > .card,
main.astroid-component-area > form > .card,
main.astroid-component-area > joomla-tab,
main.astroid-component-area > .pc-content-box,
main.astroid-component-area > .pc-photogallery,
main.astroid-component-area > .pc-photogallery-upload,
main.astroid-component-area > .pc-module {
	margin-left: 0;
	margin-right: 0;
}

/* Visited links same as regular links */
a:visited {
	color: inherit;
}

/* Buttons: visited/link state should match normal state */
a.btn-primary,
a.btn-primary:visited,
a.btn-primary:link,
a.btn-primary:active {
	color: #fff !important;
}
a.btn-secondary,
a.btn-secondary:visited,
a.btn-secondary:link,
a.btn-secondary:active {
	color: #fff !important;
}
a.btn-success,
a.btn-success:visited,
a.btn-success:link,
a.btn-success:active {
	color: #fff !important;
}
a.btn-danger,
a.btn-danger:visited,
a.btn-danger:link,
a.btn-danger:active {
	color: #fff !important;
}
a.btn-warning,
a.btn-warning:visited,
a.btn-warning:link,
a.btn-warning:active {
	color: #212529 !important;
}
a.btn-info,
a.btn-info:visited,
a.btn-info:link,
a.btn-info:active {
	color: #000 !important;
}
a.btn-light,
a.btn-light:visited,
a.btn-light:link,
a.btn-light:active {
	color: #212529 !important;
}
a.btn-dark,
a.btn-dark:visited,
a.btn-dark:link,
a.btn-dark:active {
	color: #fff !important;
}
a.btn-outline-primary,
a.btn-outline-primary:visited,
a.btn-outline-primary:link {
	color: #0d6efd !important;
}
a.btn-outline-primary:hover,
a.btn-outline-primary:focus,
a.btn-outline-primary:active {
	color: #fff !important;
}
a.btn-outline-secondary,
a.btn-outline-secondary:visited,
a.btn-outline-secondary:link {
	color: #6c757d !important;
}
a.btn-outline-secondary:hover,
a.btn-outline-secondary:focus,
a.btn-outline-secondary:active {
	color: #fff !important;
}
a.btn-outline-success,
a.btn-outline-success:visited,
a.btn-outline-success:link {
	color: #198754 !important;
}
a.btn-outline-success:hover,
a.btn-outline-success:focus,
a.btn-outline-success:active {
	color: #fff !important;
}
a.btn-outline-danger,
a.btn-outline-danger:visited,
a.btn-outline-danger:link {
	color: #dc3545 !important;
}
a.btn-outline-danger:hover,
a.btn-outline-danger:focus,
a.btn-outline-danger:active {
	color: #fff !important;
}
a.btn-outline-warning,
a.btn-outline-warning:visited,
a.btn-outline-warning:link {
	color: #ffc107 !important;
}
a.btn-outline-warning:hover,
a.btn-outline-warning:focus,
a.btn-outline-warning:active {
	color: #212529 !important;
}
a.btn-outline-info,
a.btn-outline-info:visited,
a.btn-outline-info:link {
	color: #0dcaf0 !important;
}
a.btn-outline-info:hover,
a.btn-outline-info:focus,
a.btn-outline-info:active {
	color: #000 !important;
}
a.btn-outline-light,
a.btn-outline-light:visited,
a.btn-outline-light:link {
	color: #f8f9fa !important;
}
a.btn-outline-light:hover,
a.btn-outline-light:focus,
a.btn-outline-light:active {
	color: #212529 !important;
}
a.btn-outline-dark,
a.btn-outline-dark:visited,
a.btn-outline-dark:link {
	color: #212529 !important;
}
a.btn-outline-dark:hover,
a.btn-outline-dark:focus,
a.btn-outline-dark:active {
	color: #fff !important;
}

/* Dark mode button colors */
[data-bs-theme="dark"] a.btn-warning,
[data-bs-theme="dark"] a.btn-warning:visited,
[data-bs-theme="dark"] a.btn-warning:link,
[data-bs-theme="dark"] a.btn-warning:active {
	color: #212529 !important;
}
[data-bs-theme="dark"] a.btn-info,
[data-bs-theme="dark"] a.btn-info:visited,
[data-bs-theme="dark"] a.btn-info:link,
[data-bs-theme="dark"] a.btn-info:active {
	color: #000 !important;
}
[data-bs-theme="dark"] a.btn-light,
[data-bs-theme="dark"] a.btn-light:visited,
[data-bs-theme="dark"] a.btn-light:link,
[data-bs-theme="dark"] a.btn-light:active {
	color: #212529 !important;
}
[data-bs-theme="dark"] a.btn-outline-primary,
[data-bs-theme="dark"] a.btn-outline-primary:visited,
[data-bs-theme="dark"] a.btn-outline-primary:link {
	color: #6ea8fe !important;
}
[data-bs-theme="dark"] a.btn-outline-primary:hover,
[data-bs-theme="dark"] a.btn-outline-primary:focus,
[data-bs-theme="dark"] a.btn-outline-primary:active {
	color: #fff !important;
}
[data-bs-theme="dark"] a.btn-outline-secondary,
[data-bs-theme="dark"] a.btn-outline-secondary:visited,
[data-bs-theme="dark"] a.btn-outline-secondary:link {
	color: #a7acb1 !important;
}
[data-bs-theme="dark"] a.btn-outline-secondary:hover,
[data-bs-theme="dark"] a.btn-outline-secondary:focus,
[data-bs-theme="dark"] a.btn-outline-secondary:active {
	color: #fff !important;
}
[data-bs-theme="dark"] a.btn-outline-success,
[data-bs-theme="dark"] a.btn-outline-success:visited,
[data-bs-theme="dark"] a.btn-outline-success:link {
	color: #75b798 !important;
}
[data-bs-theme="dark"] a.btn-outline-success:hover,
[data-bs-theme="dark"] a.btn-outline-success:focus,
[data-bs-theme="dark"] a.btn-outline-success:active {
	color: #fff !important;
}
[data-bs-theme="dark"] a.btn-outline-danger,
[data-bs-theme="dark"] a.btn-outline-danger:visited,
[data-bs-theme="dark"] a.btn-outline-danger:link {
	color: #ea868f !important;
}
[data-bs-theme="dark"] a.btn-outline-danger:hover,
[data-bs-theme="dark"] a.btn-outline-danger:focus,
[data-bs-theme="dark"] a.btn-outline-danger:active {
	color: #fff !important;
}
[data-bs-theme="dark"] a.btn-outline-warning,
[data-bs-theme="dark"] a.btn-outline-warning:visited,
[data-bs-theme="dark"] a.btn-outline-warning:link {
	color: #ffda6a !important;
}
[data-bs-theme="dark"] a.btn-outline-warning:hover,
[data-bs-theme="dark"] a.btn-outline-warning:focus,
[data-bs-theme="dark"] a.btn-outline-warning:active {
	color: #212529 !important;
}
[data-bs-theme="dark"] a.btn-outline-info,
[data-bs-theme="dark"] a.btn-outline-info:visited,
[data-bs-theme="dark"] a.btn-outline-info:link {
	color: #6edff6 !important;
}
[data-bs-theme="dark"] a.btn-outline-info:hover,
[data-bs-theme="dark"] a.btn-outline-info:focus,
[data-bs-theme="dark"] a.btn-outline-info:active {
	color: #000 !important;
}
[data-bs-theme="dark"] a.btn-outline-light,
[data-bs-theme="dark"] a.btn-outline-light:visited,
[data-bs-theme="dark"] a.btn-outline-light:link {
	color: #f8f9fa !important;
}
[data-bs-theme="dark"] a.btn-outline-light:hover,
[data-bs-theme="dark"] a.btn-outline-light:focus,
[data-bs-theme="dark"] a.btn-outline-light:active {
	color: #212529 !important;
}
[data-bs-theme="dark"] a.btn-outline-dark,
[data-bs-theme="dark"] a.btn-outline-dark:visited,
[data-bs-theme="dark"] a.btn-outline-dark:link {
	color: #adb5bd !important;
}
[data-bs-theme="dark"] a.btn-outline-dark:hover,
[data-bs-theme="dark"] a.btn-outline-dark:focus,
[data-bs-theme="dark"] a.btn-outline-dark:active {
	color: #fff !important;
}

/* Prevent horizontal scroll on mobile */
@media (max-width: 991.98px) {
	html,
	body {
		overflow-x: hidden !important;
		max-width: 100vw !important;
	}
}

/* Mobile breadcrumb spacing (SP Page Title wrapper) */
@media (max-width: 768px) {
	.sp-page-title {
		padding-top: 1rem !important;
	}
}

/* ===== GLOBAL TABLE STYLING ===== */
.table thead th {
	background-color: var(--pc-thead-bg) !important;
	color: var(--pc-thead-fg) !important;
	border-color: var(--pc-thead-bg) !important;
	font-size: var(--pc-font-ui) !important;
	padding: var(--pc-table-pad-y) var(--pc-table-pad-x);
	vertical-align: bottom;
}

.table thead th a,
.table thead th a:link,
.table thead th a:visited {
	color: var(--pc-thead-fg) !important;
	text-decoration: none;
}

.table thead th a:hover,
.table thead th a:focus {
	color: #c8e8ea !important;
	text-decoration: underline;
}

/* Light theme table header */
[data-bs-theme="light"] .table thead th {
	background-color: var(--pc-thead-bg) !important;
	color: var(--pc-thead-fg) !important;
	border-color: var(--pc-thead-bg) !important;
}
[data-bs-theme="light"] .table thead th a,
[data-bs-theme="light"] .table thead th a:link,
[data-bs-theme="light"] .table thead th a:visited {
	color: #fff !important;
}
[data-bs-theme="light"] .table thead th a:hover,
[data-bs-theme="light"] .table thead th a:focus {
	color: #c8e8ea !important;
}

/* Dark theme table header */
[data-bs-theme="dark"] .table thead th {
	background-color: #4a5568 !important;
	color: #f0f4f8 !important;
	border-color: #3a4550 !important;
}
[data-bs-theme="dark"] .table thead th a,
[data-bs-theme="dark"] .table thead th a:link,
[data-bs-theme="dark"] .table thead th a:visited {
	color: #f0f4f8 !important;
}
[data-bs-theme="dark"] .table thead th a:hover,
[data-bs-theme="dark"] .table thead th a:focus {
	color: #90cdf4 !important;
}

/* ===== LIGHT MODE ENHANCEMENTS ===== */
/* Light mode tab panels - warm off-white cards */
[data-bs-theme="light"] joomla-tab > joomla-tab-element {
	background-color: #f9fafb !important;
	border: 1px solid #e5e7eb !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

/* ===== DARK MODE ENHANCEMENTS ===== */
/* Dark mode tab panels - slightly lighter than page background */
[data-bs-theme="dark"] joomla-tab > joomla-tab-element {
	background-color: #2b3035 !important;
	border: 1px solid #3a4550 !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

/* Light mode tables - subtle styling */
[data-bs-theme="light"] .table {
	background-color: #f9fafb;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}
[data-bs-theme="light"] .table tbody tr:hover {
	background-color: #f3f4f6 !important;
}
[data-bs-theme="light"] .table-striped > tbody > tr:nth-of-type(odd) {
	background-color: #f3f4f6;
}

/* Light mode form cards */
[data-bs-theme="light"] .front-end-edit,
[data-bs-theme="light"] .lead-edit,
[data-bs-theme="light"] .contact-edit,
[data-bs-theme="light"] .project-edit,
[data-bs-theme="light"] .event-edit {
	background-color: #f9fafb;
	border: 1px solid #e5e7eb;
	border-radius: var(--pc-radius);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
	padding: 1.5rem;
}

/* Light mode buttons - polish */
[data-bs-theme="light"] .btn {
	transition: all 0.15s ease;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
[data-bs-theme="light"] .btn:hover {
	transform: translateY(-1px);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
/* Consistent button colors for both light and dark modes */
.btn-primary {
	background: linear-gradient(180deg, #5a7db5 0%, #4a6da5 100%) !important;
	border-color: #4a6da5 !important;
	color: #fff !important;
}
.btn-primary:hover,
.btn-primary:focus {
	background: linear-gradient(180deg, #4a6da5 0%, #3a5d95 100%) !important;
	border-color: #3a5d95 !important;
	color: #fff !important;
}

/* Light mode form inputs - enhanced visibility */
[data-bs-theme="light"] .form-control,
[data-bs-theme="light"] .form-select {
	border: 1px solid #b0b8c4;
	background-color: #fff;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.06);
}
[data-bs-theme="light"] .form-control:focus,
[data-bs-theme="light"] .form-select:focus {
	border-color: #0d6efd;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.06), 0 0 0 3px rgba(13, 110, 253, 0.15);
}
[data-bs-theme="light"] .form-control:disabled,
[data-bs-theme="light"] .form-control[readonly],
[data-bs-theme="light"] .form-select:disabled {
	background-color: #f0f2f5;
	border-color: #ced4da;
}


/* Table body typography & padding */
.table tbody td {
	font-size: inherit !important;
	padding: var(--pc-table-pad-y) var(--pc-table-pad-x);
}

/* Edge padding so text doesn’t hug table borders */
.table thead th:first-child,
.table tbody td:first-child {
	padding-left: 1rem;
}
.table thead th:last-child,
.table tbody td:last-child {
	padding-right: 1rem;
}

/* Rounded corners */
.table {
	border-radius: var(--pc-radius);
	overflow: hidden;
	border-collapse: separate;
	border-spacing: 0;
}
.table-responsive {
	border-radius: var(--pc-radius);
	overflow: hidden;
	clear: both;
}

/* Round top corners */
.table thead tr:first-child th:first-child {
	border-top-left-radius: var(--pc-radius);
}
.table thead tr:first-child th:last-child {
	border-top-right-radius: var(--pc-radius);
}
/* Round bottom corners */
.table tbody tr:last-child td:first-child {
	border-bottom-left-radius: var(--pc-radius);
}
.table tbody tr:last-child td:last-child {
	border-bottom-right-radius: var(--pc-radius);
}
/* Tables without thead */
.table tbody tr:first-child td:first-child {
	border-top-left-radius: var(--pc-radius);
}
.table tbody tr:first-child td:last-child {
	border-top-right-radius: var(--pc-radius);
}

/* List view wrappers */
.projects-list,
.events-list,
.contacts-list,
.reports-list,
div[class*="-list"] {
}

/* Ensure table pieces inherit the same font */
table,
.table,
tbody,
td,
th {
	font-size: inherit;
}

/* Links inside tables */
.table a {
	font-size: inherit !important;
}

/* Buttons / pagination */
.btn {
	font-size: var(--pc-font-ui) !important;
	border-radius: var(--pc-radius) !important;
}
.pagination,
.page-link,
.page-item {
	font-size: var(--pc-font-ui) !important;
}
.pagination {
	margin-top: var(--pc-section-gap);
}
.page-link {
	border-radius: var(--pc-radius-sm) !important;
}

/* ===== SEARCH TOOLS (joomla.searchtools.default) ===== */
/* HTML Structure:
   .js-stools > .js-stools-container-bar > .btn-toolbar >
     .filter-search-bar.btn-group (shrinks)
     .filter-search-actions.btn-group (fixed) */

.js-stools .form-control,
.js-stools .form-select,
.js-stools input,
.js-stools select {
	border-radius: var(--pc-radius) !important;
}
.js-stools .btn {
	border-radius: var(--pc-radius) !important;
}

/* Search tools - right aligned */
.js-stools {
	display: flex;
	justify-content: flex-end;
	margin: 0 var(--pc-side-margin);
}

/* The key fix: btn-toolbar must NEVER wrap */
.js-stools .btn-toolbar {
	display: flex !important;
	flex-wrap: nowrap !important;
	gap: 0.25rem !important;
	align-items: center !important;
}

/* Search bar can shrink */
.js-stools .filter-search-bar {
	flex: 1 1 auto !important;
	min-width: 0 !important;
}
.js-stools .filter-search-bar .input-group {
	flex-wrap: nowrap !important;
	height: 38px !important;
}
.js-stools .filter-search-bar input[type="search"],
.js-stools .filter-search-bar input[type="text"],
.js-stools .filter-search-bar .form-control {
	min-width: 0 !important;
	flex: 1 1 auto !important;
	height: 38px !important;
}

/* Search button in input-group */
.js-stools .filter-search-bar .input-group .btn,
.js-stools .filter-search-bar__button {
	height: 38px !important;
	width: 38px !important;
	padding: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

/* Actions bar must NOT shrink or wrap */
.js-stools .filter-search-actions {
	flex: 0 0 auto !important;
	display: inline-flex !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	gap: 0.25rem !important;
	height: 38px !important;
}

/* Clear button - icon only, always visible, exact same size as search btn */
.js-stools .js-stools-btn-clear {
	visibility: visible !important;
	opacity: 1 !important;
	font-size: 0 !important;
	height: 38px !important;
	width: 38px !important;
	padding: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}
.js-stools .js-stools-btn-clear::before {
	content: "\f62a";
	font-family: "bootstrap-icons" !important;
	font-size: 1rem;
	line-height: 1;
}

/* Search container - replaces inline float:right */
.pc-search-container {
	float: right;
	clear: right;
}

/* Mobile adjustments - centered */
@media (max-width: 768px) {
	.pc-search-container {
		float: none !important;
		width: 100% !important;
		display: flex !important;
		justify-content: center !important;
		margin-bottom: 0.5rem !important;
	}
	.js-stools {
		float: none !important;
		width: auto !important;
	}
	.js-stools-container-bar {
		display: flex !important;
		justify-content: center !important;
	}
	.js-stools .btn-toolbar {
		display: inline-flex !important;
		justify-content: center !important;
	}
}

/* Toolbar row: when buttons + search share a parent, vertically center them */
div:has(> .pc-search-container):has(> .pc-btn-stack) {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--pc-side-margin);
	margin-bottom: var(--pc-section-gap);
}
div:has(> .pc-search-container):has(> .pc-btn-stack) > .pc-search-container {
	float: none;
	clear: none;
	order: 2;
	margin-left: auto;
}
div:has(> .pc-search-container):has(> .pc-btn-stack) > .pc-btn-stack {
	order: 1;
	margin: 0;
}
/* Remaining children (table, tab-gap, etc.) go full width on next row */
div:has(> .pc-search-container):has(> .pc-btn-stack) > :not(.pc-search-container):not(.pc-btn-stack) {
	flex-basis: 100%;
	order: 3;
}

/* Content elements - consistent top spacing */
joomla-tab,
.card {
	margin-top: var(--pc-section-gap);
}
.table-responsive,
.table {
	margin-top: 0 !important;
}

/* Consecutive cards - mb-3 from first card provides spacing, remove margin-top from second */
.card + .card {
	margin-top: 0;
}


/* Clearfix for adminForm container */
form[name="adminForm"]::after {
	content: "";
	display: block;
	clear: both;
}

/* Add button spacing */
form[name="adminForm"] > .btn,
form[name="adminForm"] > a.btn {
	margin-bottom: 1rem;
}

/* List actions: minimal width, no wrap */
td.text-center.text-nowrap,
td.center.text-nowrap,
td.pc-contact-icons,
td.pc-actions-col,
th.pc-actions-col,
td:has(.pc-icon-btn) {
	white-space: nowrap !important;
	width: 1%;
	text-align: center;
}
th.center,
th.text-center,
th.money {
	width: 1%;
	text-align: center;
}
.pc-ordering-input {
	width: 60px !important;
	min-width: 50px;
	max-width: 70px;
}

/* ===== PROJECT INFO HEADER AREA ===== */
/* Make Astroid section/container/row fully transparent */
.astroid-section.contact_header,
.astroid-section.contact_header > .container,
.astroid-section.contact_header .astroid-row,
.astroid-section.contact_header .astroid-column {
	background: transparent !important;
	background-color: transparent !important;
	background-image: none !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 !important;
}

/* Contact info wrapper - matches page title */
.contactinfo-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	width: auto;
	margin: 0 var(--pc-side-margin) var(--pc-section-gap) var(--pc-side-margin);
	padding: 0.75rem 1rem;
	border-radius: var(--pc-radius);
	background-color: var(--pc-module-bg);
	border: 1px solid var(--pc-module-border);
	color: var(--pc-module-text);
}
.contactinfo-wrapper a {
	color: var(--pc-module-text);
}

/* Project Header Module */
/* Make all parent containers transparent and reset spacing */
.moduletable:has(.projectheader-wrapper),
.astroid-module-position:has(.projectheader-wrapper),
.astroid-column:has(.projectheader-wrapper),
.astroid-row:has(.projectheader-wrapper),
.astroid-section:has(.projectheader-wrapper),
header:has(.projectheader-wrapper),
.container:has(.projectheader-wrapper),
div.container:has(.projectheader-wrapper),
[class*="col-"]:has(.projectheader-wrapper),
[class*="-position"]:has(.projectheader-wrapper) {
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	background-color: transparent !important;
	background-image: none !important;
	border: none !important;
	border-bottom: none !important;
}

/* Main wrapper - theme-aware background, margin, rounded corners */
.projectheader-wrapper {
	display: block !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 var(--pc-side-margin) var(--pc-section-gap) var(--pc-side-margin) !important;
	padding: 1rem !important;
	border-radius: var(--pc-radius) !important;
	box-sizing: border-box !important;
	background-color: var(--pc-module-bg) !important;
	border: 1px solid var(--pc-module-border) !important;
	color: var(--pc-module-text) !important;
}
.projectheader-wrapper a,
.projectheader-wrapper label {
	color: var(--pc-module-text);
}
/* Project select - full width on mobile, auto on desktop */
.projectheader-wrapper #project-select {
	width: 100%;
}
/* Mobile: info columns as cards */
.ph-card {
	background-color: var(--pc-module-bg);
	border: 1px solid var(--pc-module-border);
	border-radius: var(--pc-radius);
	padding: 0.75rem 1rem;
	width: 100%;
}
.ph-info-columns {
	width: 100%;
}
@media (min-width: 992px) {
	.projectheader-wrapper #project-select {
		width: auto;
		max-width: 450px;
	}
	.projectheader-wrapper .w-lg-auto {
		width: auto !important;
	}
	/* Desktop: remove card styling */
	.ph-card {
		background-color: transparent;
		border: none;
		border-radius: 0;
		padding: 0;
		width: auto;
	}
	.ph-info-columns {
		width: auto;
	}
}
div#project_info_container,
div#project_select,
.completion_date,
.completion_container,
.panic {
	clear: both;
	float: left;
}

div#project_select {
	display: flex;
	align-items: center;
}

/* Center project info container */
.project_info_container {
	display: flex;
	justify-content: center;
	width: 100%;
}
.project_info_container .project_info {
	display: flex;
	justify-content: center;
	width: 100%;
}
/* Light mode project info text */
[data-bs-theme="light"] .project_info_container .project_info,
[data-bs-theme="light"] .project_info_container .project_info a,
[data-bs-theme="light"] .project_info_container .project_info span {
	color: #374151 !important;
}
/* Dark mode project info text */
[data-bs-theme="dark"] .project_info_container .project_info,
[data-bs-theme="dark"] .project_info_container .project_info a,
[data-bs-theme="dark"] .project_info_container .project_info span {
	color: #e2e8f0 !important;
}

/* Links in project info - no decoration, blend with text */
.project_info_container a,
.project_info_container a:visited,
.project_info_container a:link {
	color: inherit !important;
	text-decoration: none !important;
}
/* Hover effect for links */
.project_info_container a:hover {
	text-decoration: underline !important;
}

/* Email addresses never wrap */
a[href^="mailto:"] {
	white-space: nowrap;
}

/* Mobile: project info as cards */
@media (max-width: 768px) {
	.project_info_container,
	.project_info_container .project_info {
		width: 100% !important;
		max-width: 100% !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	.project_info_container .project_info .d-flex.flex-row {
		flex-direction: column !important;
		align-items: center !important;
		gap: 0.75rem !important;
		width: 100%;
	}

	.project_info_container .project_info .d-flex.flex-row > div {
		width: 100% !important;
		max-width: 100% !important;
		min-width: unset !important;
		margin: 0 !important;
		background: #f8f9fa;
		border: 1px solid #dee2e6;
		border-radius: var(--pc-radius);
		padding: 1rem 1.25rem;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
		color: #212529 !important;
		text-align: left !important;
	}

	.project_info_container .project_info .d-flex.flex-row > div,
	.project_info_container .project_info .d-flex.flex-row > div a,
	.project_info_container .project_info .d-flex.flex-row > div a:visited,
	.project_info_container .project_info .d-flex.flex-row > div span,
	.project_info_container .project_info .d-flex.flex-row > div p {
		color: #212529 !important;
		text-decoration: none !important;
	}

	[data-bs-theme="dark"] .project_info_container .project_info .d-flex.flex-row > div {
		background: #2d3748;
		border-color: #4a5568;
		color: #e2e8f0 !important;
	}
	[data-bs-theme="dark"] .project_info_container .project_info .d-flex.flex-row > div,
	[data-bs-theme="dark"] .project_info_container .project_info .d-flex.flex-row > div a,
	[data-bs-theme="dark"] .project_info_container .project_info .d-flex.flex-row > div a:visited,
	[data-bs-theme="dark"] .project_info_container .project_info .d-flex.flex-row > div span,
	[data-bs-theme="dark"] .project_info_container .project_info .d-flex.flex-row > div p {
		color: #e2e8f0 !important;
		text-decoration: none !important;
	}
}

/* ===== FIELDSET / LEGEND / MISC ===== */
fieldset {
	border: 1px solid;
	padding: 1.5rem;
	border-radius: var(--pc-radius);
	position: relative;
}
legend {
	float: none;
	width: auto;
	padding: 0 0.5rem;
	font-size: var(--pc-font-ui);
	font-weight: 500;
}

/* chosen search input in light areas */
.chosen-search-input {
	color: black;
}

/* Rotated table headers */
th.rotate {
	height: 150px;
	white-space: nowrap;
}
th.rotate > div {
	transform: rotate(-60deg);
	transform-origin: left bottom;
	width: 30px;
	font-size: 0.75rem;
}

/* Folder list nowrap + icon spacing */
#folderList td.text-nowrap {
	white-space: nowrap !important;
}
#folderList td.text-nowrap a {
	white-space: nowrap !important;
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
}
#folderList td.text-nowrap a img {
	flex-shrink: 0;
	max-width: 20px;
}

/* ===== ADDRESS MODAL THEME ===== */
#pcAddressModal .modal-content {
	background-color: var(--bs-body-bg, #ffffff);
	color: var(--bs-body-color, #212529);
	border: 1px solid var(--bs-border-color, #dee2e6);
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
}
#pcAddressModal .modal-header {
	background: linear-gradient(to bottom, var(--bs-body-bg, #ffffff), var(--bs-secondary-bg, #f8f9fa));
	border-bottom: 3px solid var(--bs-primary, #0d6efd);
	padding: 1rem 1.5rem;
}
#pcAddressModal .modal-title {
	color: var(--bs-emphasis-color, #212529);
	font-weight: 600;
}
#pcAddressModal .modal-body {
	background-color: var(--bs-body-bg, #ffffff);
	padding: 1.5rem;
}
#pcAddressModal .modal-footer {
	background-color: var(--bs-secondary-bg, #f8f9fa);
	border-top: 1px solid var(--bs-border-color, #dee2e6);
	padding: 1rem 1.5rem;
}
#pcAddressModal .form-label {
	color: var(--bs-body-color, #212529);
}
#pcAddressModal .form-control,
#pcAddressModal .form-select {
	background-color: var(--bs-body-bg, #ffffff);
	color: var(--bs-body-color, #212529);
	border-color: var(--bs-border-color, #dee2e6);
}
#pcAddressModal .form-control:focus,
#pcAddressModal .form-select:focus {
	border-color: var(--bs-primary, #0d6efd);
	box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

/* Dark contexts (Bootstrap / Astroid / legacy theme flags) */
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .modal-content {
	background-color: #1e1e1e !important;
	color: #e9ecef !important;
	border-color: #495057 !important;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .modal-header {
	background: linear-gradient(to bottom, #212529, #2b2b2b) !important;
	border-bottom-color: #0d6efd !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .modal-title {
	color: #f8f9fa !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .modal-body {
	background-color: #212529 !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .modal-footer {
	background-color: #1a1d20 !important;
	border-top-color: #495057 !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .btn-close {
	filter: invert(1) grayscale(100%) brightness(200%);
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .form-label {
	color: #e9ecef !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .form-control,
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .form-select {
	background-color: #2b2b2b !important;
	color: #e9ecef !important;
	border-color: #495057 !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .form-control:focus,
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .form-select:focus {
	background-color: #2b2b2b !important;
	border-color: #0d6efd !important;
	box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.4);
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .form-control::placeholder {
	color: #6c757d !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .alert-danger {
	background-color: #2c1215 !important;
	border-color: #842029 !important;
	color: #ea868f !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) #pcAddressModal .alert-warning {
	background-color: #332701 !important;
	border-color: #997404 !important;
	color: #ffda6a !important;
}

/* ===== GENERIC PC MODAL THEME ===== */
/* Use .pc-modal class on any modal for consistent light/dark theming */
.pc-modal .modal-content {
	background-color: #fff;
	border-color: #dee2e6;
}
.pc-modal .modal-header {
	background-color: #f8f9fa;
	border-color: #dee2e6;
}
.pc-modal .modal-title {
	color: #212529;
}
.pc-modal .modal-body {
	color: #212529;
}
.pc-modal .modal-footer {
	background-color: #f8f9fa;
	border-color: #dee2e6;
}
.pc-modal .form-label {
	color: #212529;
}
.pc-modal .form-control,
.pc-modal .form-select {
	background-color: #fff;
	border-color: #dee2e6;
	color: #212529;
}
.pc-modal .form-control:focus,
.pc-modal .form-select:focus {
	background-color: #fff;
	border-color: #86b7fe;
	color: #212529;
}

/* Dark mode for .pc-modal */
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) .pc-modal .modal-content {
	background-color: #212529 !important;
	border-color: #495057 !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) .pc-modal .modal-header {
	background-color: #2b3035 !important;
	border-color: #495057 !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) .pc-modal .modal-title {
	color: #e9ecef !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) .pc-modal .modal-body {
	color: #e9ecef !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) .pc-modal .modal-footer {
	background-color: #2b3035 !important;
	border-color: #495057 !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) .pc-modal .btn-close {
	filter: invert(1) grayscale(100%) brightness(200%);
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) .pc-modal .form-label {
	color: #e9ecef !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) .pc-modal .form-control,
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) .pc-modal .form-select {
	background-color: #343a40 !important;
	border-color: #495057 !important;
	color: #e9ecef !important;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) .pc-modal .form-control:focus,
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) .pc-modal .form-select:focus {
	background-color: #343a40 !important;
	border-color: #6ea8fe !important;
	box-shadow: 0 0 0 0.25rem rgba(110, 168, 254, 0.25);
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) .pc-modal .form-control::placeholder {
	color: #adb5bd !important;
}

/* Delete confirmation modal - danger styling */
.pc-modal.pc-modal-danger .modal-header {
	border-bottom-color: rgba(220, 53, 69, 0.3);
}
.pc-modal.pc-modal-danger .modal-title {
	color: #dc3545;
}
:is([data-bs-theme="dark"], .astroid-dark, html[data-theme="dark"], body.theme-dark) .pc-modal.pc-modal-danger .modal-title {
	color: #f8d7da !important;
}

/* ===== LOGIN LOGO ===== */
.com-users-login__description .login-image,
.com-users-login__description .com-users-login__image {
	display: block;
	width: 100% !important;
	max-width: 100%;
	height: auto !important;
}
.com-users-login__description--cover .login-image {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}
.com-users-login__description--contain .login-image {
	width: 100% !important;
	height: 100% !important;
	object-fit: contain;
}

/* ===== FORM VALIDATION ===== */
.form-validate .invalid,
.form-validate .is-invalid,
.form-validate input.invalid,
.form-validate select.invalid,
.form-validate textarea.invalid {
	border-color: #dc3545 !important;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right calc(0.375em + 0.1875rem) center;
	background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
	padding-right: calc(1.5em + 0.75rem);
}

.form-validate .invalid-feedback,
.form-validate .validation-error-message {
	display: block;
	width: 100%;
	margin-top: 0.25rem;
	font-size: 0.875em;
	color: #dc3545;
}

.form-validate .control-group.has-error label,
.form-validate .invalid-label {
	color: #dc3545;
}

.form-validate .invalid + .invalid-feedback,
.form-validate .is-invalid + .invalid-feedback {
	display: block;
}

:is([data-bs-theme="dark"], .astroid-dark) .form-validate .invalid,
:is([data-bs-theme="dark"], .astroid-dark) .form-validate .is-invalid {
	border-color: #ea868f !important;
}
:is([data-bs-theme="dark"], .astroid-dark) .form-validate .invalid-feedback,
:is([data-bs-theme="dark"], .astroid-dark) .form-validate .validation-error-message {
	color: #ea868f;
}

/* Joomla validation error messages (in label) */
.form-validate .form-control-feedback {
	display: block;
	width: 100%;
	margin-top: 0.25rem;
	font-size: 0.875em;
	color: #dc3545;
}
:is([data-bs-theme="dark"], .astroid-dark) .form-validate .form-control-feedback {
	color: #ea868f;
}

/* ===== INLINE CHECKBOXES (ADMIN CHECKLIST) ===== */
#admin_checklist .control-group {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 0.75rem;
}
#admin_checklist .control-group .controls {
	order: 1;
	flex-shrink: 0;
	width: auto;
}
#admin_checklist .control-group .control-label {
	order: 2;
	flex: 1;
	margin-bottom: 0;
}
#admin_checklist .control-group .control-label label {
	margin-bottom: 0;
	cursor: pointer;
	font-weight: normal;
}
#admin_checklist .form-check {
	padding-left: 0;
	margin-bottom: 0;
}
#admin_checklist input[type="checkbox"],
#admin_checklist .form-check-input {
	width: 1.25rem;
	height: 1.25rem;
	cursor: pointer;
	margin: 0;
}


/* ===== BREADCRUMBS ===== */
/* Make all breadcrumb parent containers invisible */
.mod-breadcrumbs__wrapper,
.breadcrumb-position,
.breadcrumb-position .moduletable,
.moduletable:has(.mod-breadcrumbs),
nav:has(.mod-breadcrumbs),
.astroid-module-position:has(.mod-breadcrumbs),
.astroid-column:has(.mod-breadcrumbs),
.astroid-row:has(.mod-breadcrumbs),
.astroid-section:has(.mod-breadcrumbs),
.container:has(.mod-breadcrumbs),
div.container:has(.mod-breadcrumbs),
[class*="col-"]:has(.mod-breadcrumbs),
[class*="-position"]:has(.mod-breadcrumbs) {
	margin: 0 !important;
	margin-bottom: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	background-color: transparent !important;
	border: none !important;
}

.mod-breadcrumbs__wrapper .mod-breadcrumbs {
	justify-content: flex-start !important;
	text-align: left !important;
}

ol.mod-breadcrumbs {
	margin: 0 var(--pc-side-margin) var(--pc-section-gap) var(--pc-side-margin) !important;
	padding: 0.75rem 1rem !important;
	background-color: var(--pc-module-bg) !important;
	border: 1px solid var(--pc-module-border) !important;
	border-radius: var(--pc-radius) !important;
	color: var(--pc-module-text) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: flex-start !important;
}
ol.mod-breadcrumbs li,
ol.mod-breadcrumbs .breadcrumb-item {
	padding: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
}
ol.mod-breadcrumbs a,
ol.mod-breadcrumbs span {
	color: var(--pc-module-text) !important;
}
/* FIRST: Hide ALL dividers by default */
ol.mod-breadcrumbs .mod-breadcrumbs__divider,
ol.mod-breadcrumbs .divider {
	display: none !important;
	visibility: hidden !important;
	width: 0 !important;
	height: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	font-size: 0 !important;
}
ol.mod-breadcrumbs .mod-breadcrumbs__divider::before,
ol.mod-breadcrumbs .divider::before {
	display: none !important;
	content: none !important;
}
/* THEN: Show dividers ONLY for items that are NOT the first child */
ol.mod-breadcrumbs > li:not(:first-child) .mod-breadcrumbs__divider,
ol.mod-breadcrumbs > li:not(:first-child) .divider {
	display: inline-flex !important;
	visibility: visible !important;
	width: auto !important;
	height: auto !important;
	padding: 0 0.6rem !important;
	align-items: center !important;
}
ol.mod-breadcrumbs > li:not(:first-child) .mod-breadcrumbs__divider::before,
ol.mod-breadcrumbs > li:not(:first-child) .divider::before {
	content: "\f285" !important;
	font-family: "bootstrap-icons" !important;
	font-size: 1.1rem !important;
	line-height: 1;
	display: inline-block !important;
	color: var(--pc-module-text) !important;
	opacity: 0.5;
}
/* Bootstrap breadcrumb separator - only after first item */
ol.mod-breadcrumbs .breadcrumb-item + .breadcrumb-item::before {
	content: "\f285" !important;
	font-family: "bootstrap-icons" !important;
	color: var(--pc-module-text) !important;
	opacity: 0.5;
	font-size: 1.1rem !important;
	line-height: 1;
	display: inline-flex !important;
	align-items: center !important;
	padding-right: 0.6rem !important;
	padding-left: 0.6rem !important;
}
ol.mod-breadcrumbs .breadcrumb-item:first-child::before {
	display: none !important;
	content: none !important;
}

/* Mobile spacing - consistent 0.5rem gap */
@media (max-width: 768px) {
	/* Breadcrumbs wrapper */
	.mod-breadcrumbs__wrapper,
	nav:has(.mod-breadcrumbs) {
		max-width: 100vw !important;
		width: auto !important;
		overflow-x: auto !important;
		overflow-y: hidden !important;
		-webkit-overflow-scrolling: touch;
		margin: 0 var(--pc-side-margin) var(--pc-section-gap) var(--pc-side-margin) !important;
		box-sizing: border-box !important;
		position: relative;
	}

	/* Breadcrumbs parent sections - no extra spacing */
	.astroid-section:has(.mod-breadcrumbs),
	.astroid-row:has(.mod-breadcrumbs),
	[class*="astroid-"]:has(.mod-breadcrumbs) {
		padding: 0 !important;
		margin: 0 !important;
	}

	ol.mod-breadcrumbs {
		display: flex;
		flex-wrap: nowrap !important;
		white-space: nowrap;
		width: max-content !important;
		min-width: 100%;
		padding: 0.5rem 0.75rem !important;
		margin: 0 !important;
		scrollbar-width: none;
		-ms-overflow-style: none;
	}
	ol.mod-breadcrumbs::-webkit-scrollbar {
		display: none;
	}
	ol.mod-breadcrumbs li,
	ol.mod-breadcrumbs .breadcrumb-item {
		flex-shrink: 0;
		white-space: nowrap;
	}

	/* Scroll indicator */
	.mod-breadcrumbs__wrapper::after,
	nav:has(.mod-breadcrumbs)::after {
		content: "";
		position: absolute;
		right: 0;
		top: 0;
		bottom: 0;
		width: 1.5rem;
		background: linear-gradient(to right, transparent, #e9ecef);
		pointer-events: none;
	}
	[data-bs-theme="dark"] .mod-breadcrumbs__wrapper::after,
	[data-bs-theme="dark"] nav:has(.mod-breadcrumbs)::after {
		background: linear-gradient(to right, transparent, #2d3748);
	}

	/* Component containers - no extra top spacing */
	#sp-component,
	#sp-main-body,
	.com-projectcentral,
	[class*="astroid-"]:has(.project-edit),
	[class*="astroid-"]:has(.front-end-edit) {
		padding-top: 0 !important;
		margin-top: 0 !important;
	}
}

/* Page title - make parent containers transparent */
.moduletable:has(.pagetitle-wrapper),
.astroid-module-position:has(.pagetitle-wrapper),
.astroid-column:has(.pagetitle-wrapper),
.astroid-row:has(.pagetitle-wrapper),
.astroid-section:has(.pagetitle-wrapper),
header:has(.pagetitle-wrapper),
.container:has(.pagetitle-wrapper),
div.container:has(.pagetitle-wrapper),
[class*="col-"]:has(.pagetitle-wrapper),
[class*="-position"]:has(.pagetitle-wrapper) {
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	background-color: transparent !important;
	border: none !important;
	overflow: visible !important;
}

/* Page title wrapper - consistent with other modules */
.pagetitle-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: auto !important;
	overflow: visible;
	margin: var(--pc-section-gap) var(--pc-side-margin) var(--pc-section-gap) var(--pc-side-margin) !important;
	padding: 0.75rem 1rem;
	border-radius: var(--pc-radius);
	background-color: var(--pc-module-bg) !important;
	border: 1px solid var(--pc-module-border) !important;
	color: var(--pc-module-text) !important;
}
.pagetitle-wrapper h1,
.pagetitle-wrapper h2,
.pagetitle-wrapper h3,
.pagetitle-wrapper h4 {
	color: var(--pc-module-text) !important;
}
.pagetitle-wrapper h1,
.pagetitle-wrapper h2,
.pagetitle-wrapper h3,
.pagetitle-wrapper h4,
.component-page-title h1,
.component-page-title h2,
.component-page-title h3,
.component-page-title h4 {
	margin: 0;
	padding: 0.25rem 0;
	text-align: center;
	font-size: 1.25rem !important;
	font-weight: 600;
	letter-spacing: 0.01em;
}

/* Compact layout: stacked on mobile, 3-column grid on desktop */
.pagetitle-wrapper--compact {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 0.5rem;
}
.pagetitle-wrapper--compact .pagetitle-select {
	width: 100%;
	order: 1;
}
.pagetitle-wrapper--compact .pagetitle-select #project-select {
	width: 100%;
}
.pagetitle-wrapper--compact .pagetitle-heading {
	width: 100%;
	text-align: center;
	order: 2;
}
.pagetitle-wrapper--compact a,
.pagetitle-wrapper--compact label {
	color: var(--pc-module-text);
}
.pagetitle-user {
	width: 100%;
	text-align: right;
	order: 3;
}
.pagetitle-user .dropdown-menu {
	z-index: 1050;
	padding: 0.5rem 0;
}
@media (min-width: 992px) {
	.pagetitle-wrapper--compact {
		display: grid;
		grid-template-columns: 1fr auto 1fr;
		align-items: center;
		gap: 1rem;
	}
	.pagetitle-wrapper--compact .pagetitle-select {
		width: auto;
		min-width: 220px;
		max-width: 450px;
		justify-self: start;
	}
	.pagetitle-wrapper--compact .pagetitle-select #project-select {
		width: 100%;
		max-width: 450px;
	}
	.pagetitle-wrapper--compact .pagetitle-heading {
		text-align: center;
		justify-self: center;
		min-width: 0;
		max-width: 100%;
	}
	.pagetitle-wrapper--compact .pagetitle-heading h1,
	.pagetitle-wrapper--compact .pagetitle-heading h2,
	.pagetitle-wrapper--compact .pagetitle-heading h3,
	.pagetitle-wrapper--compact .pagetitle-heading h4 {
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.pagetitle-user {
		width: auto;
		justify-self: end;
		white-space: nowrap;
	}
}
/* Classic layout: title centered, user dropdown right */
.pagetitle-wrapper:not(.pagetitle-wrapper--compact) {
	position: relative;
}
@media (min-width: 992px) {
	.pagetitle-wrapper:not(.pagetitle-wrapper--compact) .pagetitle-user {
		position: absolute;
		right: 1rem;
		top: 50%;
		transform: translateY(-50%);
		width: auto;
	}
}

/* Compact header: info cards centered, no select column */
.projectheader-wrapper--compact {
	display: block !important;
}
.projectheader-wrapper--compact .ph-info-columns {
	justify-content: center;
}

/* Reduce top spacing around forms */
#adminForm,
form[id^="form-"] {
	margin-top: 0;
}


/* ===== HIDE MODULE EDIT BUTTONS ===== */
.jmoddiv,
.jmodedit,
[data-jmodediturl]::before,
[data-jmodediturl]::after {
	cursor: default !important;
}
.jmoddiv-edit,
.module-edit,
.jmodedit-icon,
.edit-module,
a[href*="task=module.edit"],
a[href*="option=com_config&view=modules"] {
	display: none !important;
}

/* ===== CURRENCY + POPUP ===== */
.currency-box {
	display: inline-block;
	width: 6ch;
	white-space: nowrap;
	text-align: right;
	font-variant-numeric: tabular-nums;
}

/* Currency display cells (from CurrencyField) */
.pc-currency-cell {
	display: inline-flex;
	justify-content: flex-end;
}
.pc-currency {
	display: inline-block;
	text-align: right;
	font-variant-numeric: tabular-nums;
	font-feature-settings: "tnum";
	min-width: 6em;
	white-space: nowrap;
}
.pc-currency-negative {
	color: var(--bs-danger, #dc3545);
}
/* Money cells: centered column with decimal-aligned values */
td.money {
	text-align: center !important;
}
td.money .pc-currency-cell {
	display: inline-block;
	min-width: 80px;
	text-align: right;
}

/* Prevent money wraps */
td.money,
td[data-label*="Amount"],
td[data-label*="Cost"],
td[data-label*="Total"],
td[data-label*="Price"],
td[data-label*="Budget"],
td[data-label*="Balance"],
td.money strong,
td[data-label*="Amount"] strong,
td[data-label*="Cost"] strong,
td[data-label*="Total"] strong {
	white-space: nowrap !important;
}

/* Keep currency input group together */
.input-group:has(.pc-currency-input) {
	flex-wrap: nowrap !important;
}
.input-group:has(.pc-currency-input) .input-group-text {
	flex-shrink: 0;
}
.input-group:has(.pc-currency-input) input {
	min-width: 0;
}

/* Popup overlay */
.popup-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: #00000088;
	z-index: 999;
}
.popup-container {
	display: none;
	position: fixed;
	top: 5vh;
	left: 50%;
	transform: translateX(-50%);
	width: 90vw;
	max-width: 1100px;
	height: 90vh;
	background: #ffffff;
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
	z-index: 1000;
	box-sizing: border-box;
	overflow: hidden;
	padding: 1rem;
}
.popup-close {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	background: #444;
	color: #fff;
	border: none;
	padding: 0.5rem;
	cursor: pointer;
	z-index: 1001;
	font-size: 1.25rem;
	line-height: 1;
}
.popup-iframe-wrapper {
	width: 100%;
	height: 100%;
}
.popup-iframe {
	width: 100%;
	height: 100%;
	border: none;
	display: block;
}

/* ===== FORMS (BASE) ===== */

.control-group {
	margin-bottom: 0.25rem !important;
}

form .form-label,
.control-label label,
label.control-label {
	font-size: var(--pc-font-ui) !important;
	margin-bottom: 0.2rem !important;
}

.front-end-edit .form-control,
.front-end-edit .form-select,
.event-edit .form-control,
.event-edit .form-select,
.project-edit .form-control,
.project-edit .form-select,
.control-group .form-control,
.control-group .form-select,
.control-group textarea {
	padding: 0.4rem 0.65rem !important;
	margin-bottom: 0 !important;
}

/* Textareas / editors full width */
textarea,
.form-control[type="textarea"],
textarea.form-control {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box;
}

.js-editor-tinymce,
.joomla-editor-tinymce,
.tox-tinymce,
.tox.tox-tinymce,
.js-editor-tinymce iframe,
.joomla-editor-tinymce iframe,
.tox-tinymce iframe {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box;
}

.control-group:has(.js-editor-tinymce) .controls,
.control-group:has(.joomla-editor-tinymce) .controls,
.control-group:has(.tox-tinymce) .controls {
	width: 100%;
	display: block;
}

/* Field-type sizing */
.front-end-edit .control-group .form-control:not([type="checkbox"]):not([type="radio"]):not(.form-check-input) {
	width: auto !important;
	min-width: 180px;
	max-width: 100%;
}

.front-end-edit input[type="checkbox"],
.front-end-edit input[type="radio"],
.front-end-edit .form-check-input,
.front-end-edit .switcher input,
.front-end-edit .form-check,
.front-end-edit .switcher {
	width: auto !important;
	min-width: 0 !important;
	max-width: none !important;
}

.front-end-edit input[name*="percent"],
.front-end-edit input[name*="probability"],
.front-end-edit input[name*="ordering"],
.front-end-edit input[name*="days_to_add"] {
	min-width: 100px;
	max-width: 150px !important;
}

.front-end-edit .field-calendar {
	max-width: 320px !important;
}
.front-end-edit .field-calendar .input-group {
	width: auto !important;
	max-width: 320px !important;
	flex-wrap: nowrap;
}
.front-end-edit .field-calendar input.form-control {
	min-width: 200px;
	max-width: 280px !important;
}

.front-end-edit input[type="number"],
.front-end-edit input.pc-currency-input,
.front-end-edit input[name*="amount"],
.front-end-edit input[name*="cost"],
.front-end-edit input[name*="price"],
.front-end-edit input[name*="budget"],
.front-end-edit input[name*="zip"],
.front-end-edit input[name*="postal"] {
	min-width: 120px;
	max-width: 220px !important;
}

.front-end-edit input[type="tel"],
.front-end-edit input[name*="phone"],
.front-end-edit input[name*="fax"],
.front-end-edit input[name*="mobile"],
.front-end-edit input[name*="cell"] {
	min-width: 180px;
	max-width: 250px !important;
}

.front-end-edit input[type="email"],
.front-end-edit input[name*="email"] {
	min-width: 250px;
	max-width: 400px !important;
}

.front-end-edit input[name*="name"]:not([name*="username"]):not([name*="project_name"]),
.front-end-edit input[name*="company"],
.front-end-edit input[name*="municipality"],
.front-end-edit input[name*="city"] {
	min-width: 250px;
	max-width: 500px !important;
}

.front-end-edit .control-group input[name*="title"],
.front-end-edit .control-group input[name*="project_name"],
.project-edit input#jform_title,
.lead-edit input#jform_project_name,
#jform_title,
#jform_project_name {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
}

.front-end-edit input[type="url"],
.front-end-edit input[name*="url"],
.front-end-edit input[name*="website"],
.front-end-edit input[name*="address"],
.front-end-edit input[name*="street"] {
	min-width: 300px;
	max-width: 600px !important;
}

.front-end-edit .control-group .form-select,
.front-end-edit .control-group select.form-control {
	width: auto !important;
	min-width: 250px;
	max-width: 600px;
}

.front-end-edit input[name*="description"],
.front-end-edit input[name*="notes"],
.front-end-edit input[name*="comment"],
.front-end-edit .control-group textarea {
	width: 100% !important;
	max-width: 100% !important;
}

.front-end-edit .input-group:has(.pc-currency-input) {
	width: auto !important;
	max-width: 240px;
}

/* Optional: tighten editor height */
.joomla-editor-tinymce {
	height: 250px !important;
}

/* Form container - no padding, elements inside handle their own spacing */
.front-end-edit,
.lead-edit,
.contact-edit,
.project-edit,
.event-edit {
	padding: 0;
	width: 100%;
}

/* Light mode form fields - enhanced visibility */
[data-bs-theme="light"] .front-end-edit .form-control,
[data-bs-theme="light"] .front-end-edit .form-select,
[data-bs-theme="light"] .control-group .form-control,
[data-bs-theme="light"] .control-group .form-select,
[data-bs-theme="light"] .control-group textarea {
	border: 1px solid #a0a8b4;
	background-color: #fff;
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.08);
}
[data-bs-theme="light"] .front-end-edit .form-control:focus,
[data-bs-theme="light"] .front-end-edit .form-select:focus,
[data-bs-theme="light"] .control-group .form-control:focus,
[data-bs-theme="light"] .control-group .form-select:focus,
[data-bs-theme="light"] .control-group textarea:focus {
	border-color: #0d6efd;
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.08), 0 0 0 3px rgba(13, 110, 253, 0.15);
	outline: none;
}
[data-bs-theme="light"] .front-end-edit .form-control[readonly],
[data-bs-theme="light"] .front-end-edit .form-control:disabled,
[data-bs-theme="light"] .control-group .form-control[readonly],
[data-bs-theme="light"] .control-group .form-control:disabled {
	background-color: #f5f6f8;
	border-color: #c5ccd4;
	color: #6c757d;
}

/* ===== TABS SPACING ===== */
/* Content inside tabs controls its own spacing via margin */

/* ===== TABS (DESKTOP CLEAN) ===== */
@media (min-width: 769px) {
	html[data-bs-theme="light"] .nav-tabs,
	html[data-bs-theme="light"] #mytabs > div,
	html[data-bs-theme="light"] joomla-tab > div:first-child {
		border-bottom: 2px solid #dee2e6;
		background: transparent;
		padding: 0;
	}
	html[data-bs-theme="light"] .nav-tabs .nav-item {
		margin-bottom: -2px;
	}
	html[data-bs-theme="light"] .nav-tabs .nav-link {
		color: #495057;
		background-color: transparent;
		border: none;
		border-bottom: 2px solid transparent;
		border-radius: 0;
		padding: 0.75rem 1.25rem;
		margin-right: 0.5rem;
		font-weight: 500;
		transition: color 0.15s ease, border-color 0.15s ease;
	}
	html[data-bs-theme="light"] .nav-tabs .nav-link:hover {
		color: #0d6efd;
		border-bottom-color: #dee2e6;
	}
	html[data-bs-theme="light"] .nav-tabs .nav-link.active {
		color: #0d6efd;
		border-bottom: 2px solid #0d6efd;
		font-weight: 600;
	}
	html[data-bs-theme="light"] .tab-content,
	html[data-bs-theme="light"] joomla-tab-element {
		background-color: transparent;
		border: none;
		padding: 0 1.5rem 1.5rem 1.5rem;
	}

	html[data-bs-theme="dark"] .nav-tabs,
	html[data-bs-theme="dark"] #mytabs > div,
	html[data-bs-theme="dark"] joomla-tab > div:first-child {
		border-bottom: 2px solid #495057;
		background: transparent;
		padding: 0;
	}
	html[data-bs-theme="dark"] .nav-tabs .nav-item {
		margin-bottom: -2px;
	}
	html[data-bs-theme="dark"] .nav-tabs .nav-link {
		color: #adb5bd;
		background-color: transparent;
		border: none;
		border-bottom: 2px solid transparent;
		border-radius: 0;
		padding: 0.75rem 1.25rem;
		margin-right: 0.5rem;
		font-weight: 500;
		transition: color 0.15s ease, border-color 0.15s ease;
	}
	html[data-bs-theme="dark"] .nav-tabs .nav-link:hover {
		color: #6ea8fe;
		border-bottom-color: #495057;
	}
	html[data-bs-theme="dark"] .nav-tabs .nav-link.active {
		color: #6ea8fe;
		border-bottom: 2px solid #6ea8fe;
		font-weight: 600;
	}
	html[data-bs-theme="dark"] .tab-content,
	html[data-bs-theme="dark"] joomla-tab-element {
		background-color: transparent;
		border: none;
		padding: 0 1.5rem 1.5rem 1.5rem;
	}

}

/* ===== MOBILE FORMS + MOBILE TABS ===== */
@media (max-width: 768px) {
	/* Form containers full width */
	.front-end-edit,
	.lead-edit,
	.contact-edit,
	.project-edit,
	.event-edit,
	.allowance-edit,
	form.form-validate,
	form[id^="form-"],
	form#emailForm {
		padding-left: 0.25rem !important;
		padding-right: 0.25rem !important;
		padding-top: 0 !important;
		margin-top: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
		overflow-x: hidden !important;
	}

	/* Joomla tab component full width on mobile - width only, don't change display */
	joomla-tab {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
	}

	/* Tab content panels full width with small side padding */
	joomla-tab-element,
	.tab-content {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
		padding-left: var(--pc-side-margin) !important;
		padding-right: var(--pc-side-margin) !important;
		padding-bottom: 0.5rem !important;
	}

	/* Email form - ensure subject and all fields are full width */
	#emailForm .control-group,
	#emailForm .controls,
	#emailForm input,
	#emailForm textarea,
	#emailForm select {
		width: 100% !important;
		max-width: 100% !important;
	}

	fieldset {
		padding: 0.75rem 0.5rem !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
	}

	.control-group {
		width: 100% !important;
		max-width: 100% !important;
	}

	.control-group .controls,
	.control-group .form-control,
	.control-group .form-select,
	.control-group textarea,
	.control-group input[type="text"],
	.control-group input[type="email"],
	.control-group input[type="number"],
	.control-group input[type="tel"],
	.control-group input[type="date"] {
		width: 100% !important;
		max-width: 100% !important;
	}

	/* Cards in forms full width */
	.card {
		width: 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.table-responsive {
		width: 100%;
		max-width: 100vw;
		padding: 0;
		margin: 0;
	}

	/* Tab content - remove padding on mobile, let control-groups handle spacing */
	.pc-tab-content {
		padding: var(--pc-section-gap) 0 0 !important;
	}

	/* Control groups in tabs - consistent small margin on mobile */
	joomla-tab-element .control-group,
	.tab-pane .control-group {
		margin-left: var(--pc-side-margin) !important;
		margin-right: var(--pc-side-margin) !important;
	}

	/* Fieldsets in tabs - no additional margin on mobile */
	joomla-tab-element fieldset,
	.tab-pane fieldset {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.field-calendar .input-group {
		display: flex;
		flex-wrap: nowrap;
	}
	.field-calendar .input-group input {
		flex: 1 1 auto;
		min-width: 0;
		width: auto !important;
	}
	.field-calendar .input-group .btn {
		flex-shrink: 0;
	}

	/* Accordion-like joomla-tab buttons (mobile) - all uitab patterns */
	joomla-tab > [role="tablist"],
	#mytabs[role="tablist"],
	#lead-uitab > [role="tablist"],
	#contact-uitab > [role="tablist"],
	#project-uitab > [role="tablist"],
	[id$="-uitab"] > [role="tablist"] {
		background: transparent !important;
		border: none !important;
		padding: 0 !important;
		width: 100% !important;
	}
	joomla-tab > [role="tablist"] > button,
	#mytabs[role="tablist"] > button,
	[id$="-uitab"] > [role="tablist"] > button {
		background: #f8f9fa !important;
		border: 1px solid #dee2e6 !important;
		border-radius: var(--pc-radius-sm) !important;
		margin-bottom: 0.25rem !important;
		padding: 0.75rem 1rem !important;
		width: 100% !important;
		text-align: left !important;
	}
	joomla-tab > [role="tablist"] > button[aria-selected="true"],
	#mytabs[role="tablist"] > button[aria-selected="true"],
	[id$="-uitab"] > [role="tablist"] > button[aria-selected="true"] {
		background: #ffffff !important;
		border: 1px solid #dee2e6 !important;
		border-left: 3px solid #0d6efd !important;
		font-weight: 600 !important;
	}
	[data-bs-theme="dark"] joomla-tab > [role="tablist"] > button,
	[data-bs-theme="dark"] #mytabs[role="tablist"] > button,
	[data-bs-theme="dark"] [id$="-uitab"] > [role="tablist"] > button {
		background: #2d323a !important;
		border-color: #495057 !important;
	}
	[data-bs-theme="dark"] joomla-tab > [role="tablist"] > button[aria-selected="true"],
	[data-bs-theme="dark"] #mytabs[role="tablist"] > button[aria-selected="true"],
	[data-bs-theme="dark"] [id$="-uitab"] > [role="tablist"] > button[aria-selected="true"] {
		background: #363b44 !important;
		border: 1px solid #495057 !important;
		border-left: 3px solid #6ea8fe !important;
	}
	.tab-content,
	joomla-tab > .tab-content {
		background: transparent !important;
		border: none !important;
		width: 100% !important;
	}
}

/* ===== LIST TOOLBAR HELPERS ===== */
.pc-search-container {
	margin: 0;
}
.pc-search-container .js-stools {
	float: right;
	margin: 0;
}
/* Summary container - 50% on desktop, full width on mobile (via media query) */
.pc-summary-container {
	width: 50%;
}

/* Currency field sizing within summary container */
.pc-summary-container .input-group:has(.pc-currency-input) {
	width: auto !important;
	max-width: 200px;
}
.pc-summary-container input.pc-currency-input,
.pc-summary-container input[type="number"] {
	min-width: 100px;
	max-width: 160px !important;
}

/* Button stack container */
.pc-btn-stack {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--pc-side-margin);
	margin: 0 var(--pc-side-margin) var(--pc-section-gap);
}

/* Tab content spacing - simple rules */
joomla-tab-element {
	padding: 0 !important;
}
/* Params form tabs need left margin for form fields */
#paramsForm joomla-tab-element {
	padding-left: 1rem !important;
}
/* Button stacks in tabs: equal space above and below */
joomla-tab-element .pc-btn-stack {
	margin-top: var(--pc-section-gap);
	margin-bottom: var(--pc-section-gap);
}
/* When btn-stack is first child inside tab-content, remove top margin (tab-content has padding-top) */
.pc-tab-content > .pc-btn-stack:first-child {
	margin-top: 0;
}
/* Spacer for tabs WITHOUT buttons - add <div class="pc-tab-gap"></div> at start */
/* Also use for search-only pages - add <div class="pc-tab-gap"></div> after search */
.pc-tab-gap {
	height: var(--pc-section-gap);
}
/* Tab content wrapper - provides consistent margins inside tabs */
.pc-tab-content {
	padding: var(--pc-section-gap) var(--pc-side-margin) 0;
}

/* Tab panels - consistent side padding (covers both Joomla web-component tabs and Bootstrap tabs) */
@media (min-width: 769px) {
	joomla-tab-element,
	.tab-content {
		padding-left: 1.5rem !important;
		padding-right: 1.5rem !important;
		padding-bottom: 1rem !important;
	}
}
@media (max-width: 768px) {
	joomla-tab-element,
	.tab-content {
		padding-left: var(--pc-side-margin) !important;
		padding-right: var(--pc-side-margin) !important;
		padding-bottom: 0.5rem !important;
	}
}

/* Form controls within tabs - additional small margin */
joomla-tab-element .control-group,
.tab-pane .control-group {
	margin-left: var(--pc-side-margin) !important;
	margin-right: var(--pc-side-margin) !important;
}
joomla-tab-element fieldset,
.tab-pane fieldset {
	margin-left: var(--pc-side-margin);
	margin-right: var(--pc-side-margin);
}
/* Tables inside tabs - consistent small margin all around */
joomla-tab-element .table-responsive,
joomla-tab-element > table,
.tab-pane .table-responsive,
.tab-pane > table {
	margin: var(--pc-side-margin);
}
/* Financials tables - edge to edge within tabs */
joomla-tab-element .table-responsive:has(.fin),
.tab-pane .table-responsive:has(.fin) {
	margin-left: 0;
	margin-right: 0;
}
joomla-tab-element .fin,
.tab-pane .fin {
	margin-left: 0;
	margin-right: 0;
	max-width: 100%;
}

/* Financials table column width optimization */
.fin {
	table-layout: auto;
}
/* Ordering column - minimal width */
.fin th:has(a[href*="ordering"]),
.fin td:has(.pc-ordering-input) {
	width: 1%;
	white-space: nowrap;
	text-align: center;
}
.fin .pc-ordering-input {
	width: 60px !important;
	min-width: 50px;
	max-width: 70px;
	padding: 0.25rem 0.35rem;
}
/* ID column - minimal */
.fin th:has(a[href*="a.id"]),
.fin td.text-center:first-child {
	width: 1%;
	white-space: nowrap;
}
/* Date columns - compact */
.fin td.text-center:not(:has(.pc-ordering-input)):not(:has(.pc-icon-btn)) {
	width: 1%;
	white-space: nowrap;
	min-width: 85px;
	max-width: 110px;
}
/* Money columns - compact */
.fin td.money {
	width: 1%;
	white-space: nowrap;
	min-width: 90px;
	max-width: 130px;
}
/* Actions column - minimal */
.fin td:has(.pc-icon-btn) {
	width: 1%;
	white-space: nowrap;
	min-width: auto;
}
/* Title column - allow expansion */
.fin td:has(a.wrap-text) {
	width: auto;
	min-width: 150px;
}
/* Tables outside tabs - no side margin since component area has padding */
.table-responsive {
	margin: 0 0 var(--pc-section-gap) 0;
}

.pc-add-btn-container.pc-add-btn-container {
	margin-top: 0 !important;
	margin-bottom: 0.5rem !important;
}
@media (max-width: 768px) {
	.pc-add-btn-container.pc-add-btn-container {
		margin: 0 0 0.5rem 0 !important;
	}
	.pc-btn-stack {
		flex-direction: column;
		gap: 0.5rem;
	}
	.pc-add-btn-container .btn,
	.pc-btn-stack .btn,
	.pc-btn-stack > a.btn {
		width: 100%;
		text-align: center;
		display: block;
	}
}

/* ===== COLOR PICKER TABLE (Calendar tab) ===== */
.pc-color-table td {
	vertical-align: middle;
	overflow: visible;
	padding: 12px 10px;
}
/* minicolors wrapper: prevent it stretching full width */
.pc-color-table .minicolors {
	width: 160px !important;
	min-width: 160px;
}
/* The text input inside minicolors: ensure hex text isn't hidden behind swatch */
.pc-color-table .minicolors input.form-control {
	width: 160px !important;
	padding-left: 38px !important;
	font-family: monospace;
	font-size: 0.85rem;
}
/* The color swatch: keep it inside the input area */
.pc-color-table .minicolors .minicolors-swatch {
	left: 4px;
}
/* Ensure color picker popup floats above table rows */
.pc-color-table .minicolors-panel {
	z-index: 1050 !important;
}

/* ===== ICON BUTTONS (GLOBAL) ===== */
.pc-icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	margin: 0 0.125rem;
	border-radius: 0.25rem;
	text-decoration: none;
	transition: background-color 0.15s ease, color 0.15s ease;
}

/* Default icon colors */
.pc-icon-edit {
	color: #0d6efd;
}
.pc-icon-delete {
	color: #dc3545;
}
.pc-icon-edit:hover {
	background: #e9ecef;
	color: #0a58ca;
}
.pc-icon-delete:hover {
	background: #f8d7da;
	color: #b02a37;
}

/* Contact list: hide phone/email icons on desktop */
.pc-contact-icons .pc-icon-email,
.pc-contact-icons .pc-icon-phone {
	display: none !important;
}

/* ===== PERFECT MOBILE CARDS (DROP-IN OVERRIDE) ===== */
/* Card theme tokens */
:where(.pc-mobile-cards) {
	--pc-card-radius: 12px;
	--pc-card-border: #dee2e6;
	--pc-card-bg: #ffffff;
	--pc-card-accent-bg: #e9ecef;
	--pc-card-divider: #eef0f2;
	--pc-card-label: #495057;
	--pc-card-value: #212529;
	--pc-card-shadow: 0 1px 3px rgba(0, 0, 0, 0.10);
	--pc-card-shadow-hover: 0 6px 18px rgba(0, 0, 0, 0.14);
}

/* Dark mode tokens */
[data-bs-theme="dark"] :where(.pc-mobile-cards) {
	--pc-card-border: #4a5568;
	--pc-card-bg: #2d3748;
	--pc-card-accent-bg: #151b24;
	--pc-card-divider: #3b485a;
	--pc-card-label: #a0aec0;
	--pc-card-value: #e2e8f0;
	--pc-card-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
	--pc-card-shadow-hover: 0 10px 26px rgba(0, 0, 0, 0.45);
}

@media (max-width: 991.98px), (hover: none) and (pointer: coarse) {
	/* Stop clipping shadows/menus and remove side margins - let cards handle spacing */
	.table-responsive {
		overflow: visible !important;
		border-radius: 0 !important;
		padding: 0;
		margin: 0 !important;
	}

	/* Table acts like list of cards */
	table.pc-mobile-cards {
		display: block !important;
		border: 0 !important;
		background: transparent !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		border-radius: 0 !important;
		overflow: visible !important;
	}

	table.pc-mobile-cards thead {
		display: none !important;
	}
	table.pc-mobile-cards tbody,
	table.pc-mobile-cards tfoot {
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch !important;
		width: 100% !important;
	}

	/* Each tr becomes a card (flex column enables order property) */
	table.pc-mobile-cards tbody tr {
		display: flex !important;
		flex-direction: column !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 0 1rem 0 !important;
		background: var(--pc-card-bg) !important;
		border: 1px solid var(--pc-card-border) !important;
		border-radius: var(--pc-card-radius) !important;
		box-shadow: var(--pc-card-shadow) !important;
		overflow: hidden !important;
		position: relative;
	}

	table.pc-mobile-cards tbody tr[data-href] {
		cursor: pointer;
		transition: transform 0.12s ease, box-shadow 0.12s ease;
	}
	table.pc-mobile-cards tbody tr[data-href]:hover,
	table.pc-mobile-cards tbody tr[data-href]:active {
		transform: translateY(-1px);
		box-shadow: var(--pc-card-shadow-hover) !important;
	}

	/* Chevron for clickable cards (auto hidden if icons row exists) */
	table.pc-mobile-cards tbody tr[data-href]::after {
		content: "\203A";
		position: absolute;
		top: 0.75rem;
		right: 0.85rem;
		font-size: 1.5rem;
		line-height: 1;
		color: #6c757d;
		pointer-events: none;
	}
	[data-bs-theme="dark"] table.pc-mobile-cards tbody tr[data-href]::after {
		color: #a0aec0;
	}
	table.pc-mobile-cards tbody tr:has(td[class*="icons"])::after {
		display: none !important;
	}

	/* td becomes a row within the card - label left, value right */
	table.pc-mobile-cards tbody td {
		display: flex !important;
		justify-content: space-between !important;
		align-items: flex-start !important;
		gap: 0.75rem !important;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
		padding: 0.72rem 0.95rem !important;
		border: 0 !important;
		border-bottom: 1px solid var(--pc-card-divider) !important;
		position: relative !important;
		background: transparent !important;
		color: var(--pc-card-value) !important;
		text-align: right !important;
		word-break: break-word !important;
		overflow-wrap: anywhere !important;
		overflow: visible !important;
		white-space: normal !important;
	}

	table.pc-mobile-cards tbody td:last-child {
		border-bottom: 0 !important;
	}

	table.pc-mobile-cards tbody td::before {
		content: attr(data-label);
		flex: 0 0 auto !important;
		min-width: 0 !important;
		max-width: 40% !important;
		text-align: left !important;
		font-weight: 600;
		color: var(--pc-card-label);
		white-space: normal !important;
		word-break: break-word !important;
		margin-right: 0.5rem !important;
	}
	/* Force value content to the right side (except title cells) */
	table.pc-mobile-cards tbody td > * {
		margin-left: auto !important;
		text-align: right !important;
	}
	/* Financials Title cells - make title a card header (no label, full width) */
	table.pc-mobile-cards tbody td[data-label*="Title"] {
		flex-direction: column !important;
		align-items: flex-start !important;
		background: var(--pc-card-accent-bg) !important;
		padding: 0.85rem 0.95rem !important;
		order: -10 !important;
	}
	table.pc-mobile-cards tbody td[data-label*="Title"]::before {
		display: none !important;
	}
	table.pc-mobile-cards tbody td[data-label*="Title"] > * {
		margin-left: 0 !important;
		margin-right: auto !important;
		text-align: left !important;
		white-space: normal !important;
		word-wrap: break-word !important;
		font-weight: 600 !important;
	}

	table.pc-mobile-cards tbody td:empty {
		display: none !important;
	}

	/* No visited link color change on mobile cards */
	table.pc-mobile-cards a:visited {
		color: inherit !important;
	}

	/* Note: Header styling is controlled by .pc-title class, not :first-child
	   This allows the title cell to be anywhere in DOM order */

	/* Explicit title cells */
	table.pc-mobile-cards tbody td.pc-summary-title {
		justify-content: flex-start !important;
		background: var(--pc-card-accent-bg) !important;
		padding-left: 0.95rem !important;
		font-weight: 700 !important;
		text-align: left !important;
	}
	table.pc-mobile-cards tbody td.pc-summary-title::before {
		display: none !important;
	}
	table.pc-mobile-cards tbody td.pc-summary-title > * {
		text-align: left !important;
		margin-left: 0 !important;
		margin-right: auto !important;
	}

	/* Actions / icons rows */
	table.pc-mobile-cards tbody td[class*="icons"] {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		justify-content: center !important;
		align-items: center !important;
		gap: 0.5rem !important;
		padding: 0.85rem 0.95rem !important;
		padding-left: 0.95rem !important;
		background: var(--pc-card-accent-bg) !important;
		border-bottom: 0 !important;
		text-align: center !important;
	}
	table.pc-mobile-cards tbody td[class*="icons"]::before {
		display: none !important;
	}
	table.pc-mobile-cards tbody td[class*="icons"] a,
	table.pc-mobile-cards tbody td[class*="icons"] .pc-icon-btn {
		display: inline-flex !important;
		flex: 0 0 auto !important;
		align-items: center !important;
		justify-content: center !important;
		width: 44px !important;
		height: 44px !important;
		border-radius: 999px !important;
		text-decoration: none !important;
		line-height: 1 !important;
		padding: 0 !important;
		margin: 0 !important;
		border: 0 !important;
	}

	/* Contact list: show phone/email icons on mobile */
	table.pc-mobile-cards .pc-contact-icons .pc-icon-email,
	table.pc-mobile-cards .pc-contact-icons .pc-icon-phone {
		display: inline-flex !important;
	}

	/* Currency cells on mobile - make wrapper transparent to layout */
	table.pc-mobile-cards td .pc-currency-cell {
		display: contents !important;
	}
	table.pc-mobile-cards td .pc-currency {
		min-width: 0 !important;
		text-align: right !important;
		margin-left: auto !important;
	}

	/* Address list - envelope format on mobile */
	#addressList.pc-mobile-cards tbody tr,
	#addressList.pc-mobile-cards tbody tr:first-child {
		display: block !important;
		padding: 0.75rem 0.95rem !important;
		--bs-table-accent-bg: transparent !important;
		--bs-table-striped-bg: transparent !important;
	}
	#addressList.pc-mobile-cards tbody td {
		display: block !important;
		padding: 0 !important;
		padding-left: 0 !important;
		border-bottom: 0 !important;
		border-radius: 0 !important;
		text-align: left !important;
		line-height: 1.5;
		background: transparent !important;
		--bs-table-accent-bg: transparent !important;
	}
	#addressList.pc-mobile-cards tbody td::before {
		display: none !important;
	}
	#addressList.pc-mobile-cards tbody td > * {
		margin-left: 0 !important;
		text-align: left !important;
	}
	/* Title bold */
	#addressList.pc-mobile-cards tbody td[data-label="Title"],
	#addressList.pc-mobile-cards tbody td[data-label*="Title"] {
		font-weight: 700 !important;
		margin-bottom: 0.15rem !important;
	}
	/* City and ZIP on same line */
	#addressList.pc-mobile-cards tbody td[data-label="City"],
	#addressList.pc-mobile-cards tbody td[data-label*="City"] {
		display: inline !important;
	}
	#addressList.pc-mobile-cards tbody td[data-label="City"]::after,
	#addressList.pc-mobile-cards tbody td[data-label*="City"]::after {
		content: " " !important;
	}
	#addressList.pc-mobile-cards tbody td[data-label="ZIP"],
	#addressList.pc-mobile-cards tbody td[data-label*="ZIP"] {
		display: inline !important;
	}
	/* Actions row */
	#addressList.pc-mobile-cards tbody td[data-label="Actions"],
	#addressList.pc-mobile-cards tbody td[data-label*="Actions"] {
		display: block !important;
		margin-top: 0.5rem !important;
		padding-top: 0.5rem !important;
		border-top: 1px solid var(--pc-card-divider) !important;
	}

	/* Email recipients cell - tags wrap and align right */
	table.pc-mobile-cards tbody td.email-recipients-cell {
		flex-wrap: wrap !important;
		justify-content: flex-end !important;
		align-items: center !important;
		gap: 4px !important;
	}
	table.pc-mobile-cards tbody td.email-recipients-cell .email-recipient-tag {
		white-space: normal !important;
		word-break: break-word !important;
		max-width: 100% !important;
		font-size: 12px !important;
		padding: 3px 10px !important;
		margin-left: auto !important;
	}

	/* Email log list - 50/50 label/value split */
	#emaillogList.pc-mobile-cards tbody td::before {
		flex: 0 0 40% !important;
		max-width: 40% !important;
		white-space: normal !important;
		word-break: break-word !important;
	}
	#emaillogList.pc-mobile-cards tbody td > * {
		flex: 1 1 auto !important;
		max-width: 55% !important;
		word-break: break-word !important;
		text-align: right !important;
	}
	/* Hide chevron on email log cards */
	#emaillogList.pc-mobile-cards tbody tr::after {
		display: none !important;
	}

	/* Financial summary specifics */
	#financialSummary.pc-mobile-cards tbody tr.pc-summary-totals {
		border: 2px solid var(--bs-primary, #0d6efd) !important;
	}
	#financialSummary.pc-mobile-cards tbody tr.pc-summary-totals td.pc-summary-title {
		background: var(--bs-primary, #0d6efd) !important;
		color: #fff !important;
	}

	/* Totals rows in financials tabs - visually distinct */
	table.pc-mobile-cards tbody tr.pc-totals-row {
		border: 2px solid var(--bs-primary, #0d6efd) !important;
		margin-top: 1rem !important;
	}
	table.pc-mobile-cards tbody tr.pc-totals-row td.pc-summary-title {
		background: var(--bs-primary, #0d6efd) !important;
		color: #fff !important;
	}
	table.pc-mobile-cards tbody tr.pc-totals-row td[data-label=""]  {
		display: none !important;
	}

	/* Leads list - Project Name as card title */
	#leadList.pc-mobile-cards tbody tr td[data-label*="Project Name"],
	#leadList.pc-mobile-cards tbody tr td[data-label*="project_name"] {
		order: -1 !important;
		background: var(--pc-card-accent-bg) !important;
		padding: 0.85rem 0.95rem !important;
		padding-left: 0.95rem !important;
		font-weight: 700 !important;
		text-align: left !important;
		justify-content: flex-start !important;
	}
	#leadList.pc-mobile-cards tbody tr td[data-label*="Project Name"]::before,
	#leadList.pc-mobile-cards tbody tr td[data-label*="project_name"]::before {
		display: none !important;
	}
	/* Reset the first-child styling for leads since we're using order */
	#leadList.pc-mobile-cards tbody tr > td:first-child {
		background: transparent !important;
		font-weight: normal !important;
	}

	/* Construction Agreement Payments - Summary container full width on mobile */
	.pc-summary-container {
		width: 100% !important;
		max-width: 100% !important;
	}
	.pc-summary-container .control-group,
	.pc-summary-container .controls {
		width: 100% !important;
	}


	/* Financials CA tab - Title as card header, Ordering at bottom */
	#adminFormCA .pc-mobile-cards tbody tr td[data-label*="Title"] {
		order: -1 !important;
		background: var(--pc-card-accent-bg) !important;
		padding: 0.85rem 0.95rem !important;
		font-weight: 700 !important;
		text-align: left !important;
		justify-content: flex-start !important;
	}
	#adminFormCA .pc-mobile-cards tbody tr td[data-label*="Title"]::before {
		display: none !important;
	}
	/* Ordering column - appears before actions, value right-aligned */
	#adminFormCA .pc-mobile-cards tbody tr td[data-label*="Order"] {
		order: 98 !important;
		justify-content: flex-end !important;
		text-align: right !important;
	}
	/* Ensure Ordering column label is displayed (may be first-child if ID hidden) */
	#adminFormCA .pc-mobile-cards tbody tr td[data-label*="Order"]::before {
		display: block !important;
		content: attr(data-label) !important;
	}
	/* Actions column - appears last */
	#adminFormCA .pc-mobile-cards tbody tr td[class*="icons"] {
		order: 99 !important;
	}
	#adminFormCA .pc-mobile-cards tbody tr > td:first-child {
		background: transparent !important;
		font-weight: normal !important;
	}

	/* Pagination */
	table.pc-mobile-cards tfoot tr,
	table.pc-mobile-cards tfoot td {
		display: block !important;
		width: 100% !important;
		border: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
	}
	table.pc-mobile-cards tfoot td::before {
		display: none !important;
	}
	/* Mobile pagination - wrap and compact */
	table.pc-mobile-cards .pagination,
	tfoot .pagination,
	.pagination {
		display: flex !important;
		justify-content: center;
		flex-wrap: wrap !important;
		gap: 0.25rem 0.35rem;
		padding: 0.5rem 0.25rem;
		margin: 0 auto;
		max-width: 100%;
		width: 100%;
	}
	table.pc-mobile-cards .pagination .page-link,
	tfoot .pagination .page-link,
	.pagination .page-link,
	.pagination a,
	.pagination span {
		padding: 0.35rem 0.5rem;
		font-size: 0.75rem;
		min-width: 28px;
		text-align: center;
		white-space: nowrap;
		border-radius: 4px;
	}
	.pagination .page-item,
	.pagination li {
		margin: 0;
	}

	/* ========================================
	   GENERIC TITLE CELL - Reordered to card header
	   Add .pc-title class to any cell that should appear at top
	   ======================================== */

	/* Generic title cell as card header (reordered to top) */
	table.pc-mobile-cards tbody tr td.pc-title {
		order: -1 !important;
		background: var(--pc-card-accent-bg) !important;
		padding: 0.85rem 0.95rem !important;
		font-weight: 700 !important;
		text-align: left !important;
		justify-content: flex-start !important;
		width: 100% !important;
		white-space: normal !important;
		word-break: normal !important;
		overflow-wrap: normal !important;
	}
	table.pc-mobile-cards tbody tr td.pc-title::before {
		display: none !important;
	}
	table.pc-mobile-cards tbody tr td.pc-title > * {
		text-align: left !important;
		margin-left: 0 !important;
		margin-right: auto !important;
	}

	/* Order column near bottom in lists */
	table.pc-mobile-cards tbody tr td[data-label*="Order"] {
		order: 97 !important;
	}

	/* Icons/buttons always last in card */
	table.pc-mobile-cards tbody tr td[class*="icons"] {
		order: 99 !important;
	}

	/* Text-wrap cells (like Notes) - single column: label on top, full-width content below */
	table.pc-mobile-cards tbody tr td.text-wrap {
		display: block !important;
		padding: 0.72rem 0.95rem !important;
		text-align: left !important;
	}
	table.pc-mobile-cards tbody tr td.text-wrap::before {
		display: block !important;
		position: static !important;
		width: 100% !important;
		text-align: left !important;
		margin-bottom: 0.35rem !important;
	}
}

/* ===== COST CODE MODAL ===== */
.costcode-modal .modal-content {
	background-color: #ffffff !important;
	color: #212529;
	border: 1px solid #dee2e6;
}
.costcode-modal .modal-header {
	border-bottom: 2px solid #0d6efd;
	background: linear-gradient(to bottom, #ffffff, #f8f9fa);
}
.costcode-modal .modal-body,
.costcode-modal .modal-footer {
	background-color: #ffffff;
}
.costcode-modal .modal-footer {
	border-top: 1px solid #dee2e6;
}
.costcode-modal .modal-title {
	font-weight: 600;
	color: #212529;
}
.costcode-modal .control-group {
	margin-bottom: 0.75rem;
}
.costcode-modal .control-label label {
	font-size: 0.875rem;
	margin-bottom: 0.25rem;
	color: #212529;
}
.costcode-modal .form-control,
.costcode-modal .form-select {
	background-color: #ffffff;
	color: #212529;
	border-color: #dee2e6;
}
.costcode-modal label {
	color: #212529;
}

/* Dark overrides */
[data-bs-theme="dark"] .costcode-modal .modal-content {
	background-color: #1e1e1e;
	color: #e9ecef;
	border-color: #495057;
}
[data-bs-theme="dark"] .costcode-modal .modal-header {
	background: linear-gradient(to bottom, #212529, #2b2b2b);
}
[data-bs-theme="dark"] .costcode-modal .modal-title {
	color: #f8f9fa;
}
[data-bs-theme="dark"] .costcode-modal .btn-close {
	filter: invert(1) grayscale(100%) brightness(200%);
}
[data-bs-theme="dark"] .costcode-modal .modal-body,
[data-bs-theme="dark"] .costcode-modal .modal-footer {
	background-color: #1e1e1e;
	border-color: #495057;
}
[data-bs-theme="dark"] .costcode-modal .form-control,
[data-bs-theme="dark"] .costcode-modal .form-select {
	background-color: #2b2b2b;
	color: #e9ecef;
	border-color: #495057;
}
[data-bs-theme="dark"] .costcode-modal .form-control:focus,
[data-bs-theme="dark"] .costcode-modal .form-select:focus {
	background-color: #343434;
	color: #e9ecef;
	border-color: #0d6efd;
}
[data-bs-theme="dark"] .costcode-modal .input-group-text {
	background-color: #343434;
	color: #e9ecef;
	border-color: #495057;
}
[data-bs-theme="dark"] .costcode-modal label {
	color: #e9ecef;
}
[data-bs-theme="dark"] .costcode-modal .alert-danger {
	background-color: #2c1215;
	border-color: #842029;
	color: #ea868f;
}

/* ===== GLOBAL DARK MODE FORM CONTROLS ===== */
[data-bs-theme="dark"] .field-calendar .form-control,
[data-bs-theme="dark"] .field-calendar input {
	background-color: var(--bs-body-bg, #212529) !important;
	color: var(--bs-body-color, #e9ecef) !important;
	border-color: var(--bs-border-color, #495057) !important;
}
[data-bs-theme="dark"] .field-calendar .input-group-text,
[data-bs-theme="dark"] .field-calendar .btn {
	background-color: var(--bs-tertiary-bg, #2b3035) !important;
	color: var(--bs-body-color, #e9ecef) !important;
	border-color: var(--bs-border-color, #495057) !important;
}

/* Datepicker popup */
[data-bs-theme="dark"] .js-calendar,
[data-bs-theme="dark"] .flatpickr-calendar {
	background-color: #212529 !important;
	border-color: #495057 !important;
	color: #e9ecef !important;
}
[data-bs-theme="dark"] .flatpickr-months,
[data-bs-theme="dark"] .flatpickr-weekdays,
[data-bs-theme="dark"] .flatpickr-days {
	background-color: #212529 !important;
}
[data-bs-theme="dark"] .flatpickr-day {
	color: #e9ecef !important;
}
[data-bs-theme="dark"] .flatpickr-day:hover {
	background-color: #495057 !important;
}
[data-bs-theme="dark"] .flatpickr-day.selected {
	background-color: #0d6efd !important;
	border-color: #0d6efd !important;
}
[data-bs-theme="dark"] .flatpickr-current-month,
[data-bs-theme="dark"] .flatpickr-monthDropdown-months,
[data-bs-theme="dark"] .numInputWrapper input {
	background-color: #212529 !important;
	color: #e9ecef !important;
}
[data-bs-theme="dark"] span.flatpickr-weekday {
	color: #adb5bd !important;
}

/* Global form controls dark */
[data-bs-theme="dark"] .front-end-edit .form-control,
[data-bs-theme="dark"] .front-end-edit .form-select,
[data-bs-theme="dark"] #com-projectcentral .form-control,
[data-bs-theme="dark"] #com-projectcentral .form-select {
	background-color: var(--bs-body-bg, #212529);
	color: var(--bs-body-color, #e9ecef);
	border-color: var(--bs-border-color, #495057);
}

/* Datetimepicker inputbox in dark mode */
[data-bs-theme="dark"] .inputbox,
[data-bs-theme="dark"] input.inputbox,
html[data-bs-theme="dark"] .inputbox,
html[data-bs-theme="dark"] input.inputbox {
	background-color: #212529 !important;
	color: #e9ecef !important;
	border-color: #495057 !important;
}
[data-bs-theme="dark"] .input-group .btn-secondary,
html[data-bs-theme="dark"] .input-group .btn-secondary {
	background-color: #2b3035 !important;
	color: #e9ecef !important;
	border-color: #495057 !important;
}

/* ===== MOBILE CURRENCY FIELD ALIGNMENT ===== */
@media (max-width: 767.98px) {
	.front-end-edit .input-group:has(.pc-currency-input),
	.input-group:has(.pc-currency-input) {
		margin-left: auto !important;
		margin-right: 0 !important;
	}

	.front-end-edit .control-group:has(.pc-currency-input) .controls,
	.control-group:has(.pc-currency-input) .controls {
		display: flex !important;
		justify-content: flex-end !important;
	}

	.pc-currency-input,
	input.pc-currency-input {
		text-align: right !important;
		width: auto !important;
		min-width: 120px !important;
		max-width: 180px !important;
	}

	.front-end-edit .input-group:has(.pc-currency-input),
	.input-group:has(.pc-currency-input) {
		width: auto !important;
		max-width: 200px !important;
	}
}

/* ===== CANCELLATION REASON FULL WIDTH ===== */
.cancellation-reason-fullwidth {
	flex: 0 0 100% !important;
	max-width: 100% !important;
	width: 100% !important;
}
.cancellation-reason-fullwidth .controls,
.cancellation-reason-fullwidth .control-wrapper {
	width: 100% !important;
	max-width: 100% !important;
}
.cancellation-reason-fullwidth .tox-tinymce,
.cancellation-reason-fullwidth .joomla-editor-tinymce,
.cancellation-reason-fullwidth iframe {
	width: 100% !important;
}

/* ===== EMAIL LOG VIEW ===== */
.email-container {
	margin: 0 0 20px 0;
	padding: 15px;
	background: var(--bs-body-bg, #fff);
}
html[data-bs-theme="dark"] .email-container {
	background: #1a1d21 !important;
}
.email-title-row {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-bottom: 20px;
	padding-bottom: 12px;
	border-bottom: 3px solid var(--bs-primary, #0d6efd);
}
.email-title {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--bs-emphasis-color, #212529);
	margin: 0;
	padding: 0;
	border: none;
}
.email-close-btn {
	flex-shrink: 0;
	padding: 0.5rem;
	font-size: 1.25rem;
}
html[data-bs-theme="dark"] .email-title {
	color: #f8f9fa !important;
}
html[data-bs-theme="dark"] .email-close-btn {
	filter: invert(1) grayscale(100%) brightness(200%);
}

.email-loading {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 60px 20px;
	min-height: 300px;
	background: var(--bs-body-bg, #fff);
}
.email-loading .spinner-border {
	width: 3rem;
	height: 3rem;
	border-width: 0.3rem;
	color: var(--bs-primary, #0d6efd);
}
.email-loading p {
	margin-top: 1rem;
	color: var(--bs-body-color, #212529);
	font-size: 0.95rem;
}
html[data-bs-theme="dark"] .email-loading {
	background: #1e1e2e !important;
}
html[data-bs-theme="dark"] .email-loading p {
	color: #e0e0e0 !important;
}

.email-subject {
	font-weight: 600;
	color: #212529;
}
html[data-bs-theme="dark"] .email-subject {
	color: #f0f0f0 !important;
}
.email-meta {
	font-size: 0.95rem;
	padding: 16px 20px;
	border-bottom: 1px solid var(--bs-border-color, #dee2e6);
}
.email-meta-row {
	display: flex;
	margin-bottom: 8px;
	align-items: baseline;
	flex-wrap: nowrap;
}
.email-meta-row:last-child {
	margin-bottom: 0;
}
.email-meta-label {
	font-weight: 600;
	min-width: 65px;
	flex-shrink: 0;
	color: #6c757d;
}
html[data-bs-theme="dark"] .email-meta-label {
	color: #adb5bd !important;
}
.email-meta-value {
	flex: 1;
	min-width: 0;
	color: #212529;
}
html[data-bs-theme="dark"] .email-meta-value {
	color: #e0e0e0 !important;
}

.email-meta-row-tags {
	align-items: flex-start;
}
.email-recipients-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
	white-space: normal;
	overflow: visible;
}
.email-recipient-tag {
	display: inline-flex;
	align-items: center;
	padding: 4px 12px;
	background-color: rgb(87, 104, 122);
	color: white;
	border-radius: 16px;
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
}
html[data-bs-theme="dark"] .email-recipient-tag {
	background-color: rgb(107, 124, 142);
}

.email-attachments {
	background: #f8f9fa;
	padding: 12px 20px;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}
html[data-bs-theme="dark"] .email-attachments {
	background: #2a2a3a !important;
}
.email-attachments-icon {
	color: #6c757d;
	font-size: 1.1rem;
}
.email-attachment-link {
	display: inline-block;
	background: #fff;
	border: 1px solid #dee2e6;
	border-radius: 4px;
	padding: 6px 12px;
	font-size: 0.9rem;
	text-decoration: none;
	color: #0d6efd;
}
.email-attachment-link:hover {
	text-decoration: underline;
	background: #f0f0f0;
}
html[data-bs-theme="dark"] .email-attachment-link {
	background: #3a3a4a !important;
	border-color: #555 !important;
	color: #6ea8fe !important;
}
html[data-bs-theme="dark"] .email-attachment-link:hover {
	background: #4a4a5a !important;
}

.email-body {
	padding: 20px;
	min-height: 200px;
	line-height: 1.6;
	color: var(--bs-body-color, #212529);
	font-size: 1rem;
}
.email-body p,
.email-body div,
.email-body span,
.email-body td,
.email-body li,
.email-body a {
	font-size: 1rem !important;
	line-height: 1.6 !important;
}
html[data-bs-theme="dark"] .email-body * {
	color: inherit !important;
	background-color: transparent !important;
}
html[data-bs-theme="dark"] .email-body a,
html[data-bs-theme="dark"] .email-body a:visited {
	color: #6ea8fe !important;
}

/* Email popup mobile styles */
@media (max-width: 768px) {
	.email-container {
		padding: 10px;
	}
	.email-title {
		font-size: 1.25rem;
	}
	.email-meta {
		padding: 12px 15px;
	}
	.email-body {
		padding: 15px;
		font-size: 0.95rem;
	}
	.email-body p,
	.email-body div,
	.email-body span,
	.email-body td,
	.email-body li,
	.email-body a {
		font-size: 0.95rem !important;
	}
	.email-attachment-link {
		width: 100%;
		text-align: center;
	}
}

/* Email form - full width fields */
#emailForm .control-group .controls,
#emailForm .control-group input.form-control,
#emailForm #jform_email_title {
	width: 100% !important;
	max-width: 100% !important;
}

/* Email Log tab typography */
#mytabs-pane-emaillog,
#mytabs-pane-emaillog table,
#mytabs-pane-emaillog .pc-mobile-cards {
	line-height: 1.35;
}
@media (max-width: 768px) {
	#mytabs-pane-emaillog table.pc-mobile-cards td {
	}
	#mytabs-pane-emaillog table.pc-mobile-cards td::before {
		font-size: 0.95rem;
		font-weight: 600;
		opacity: 0.85;
	}
	#mytabs-pane-emaillog .pc-recipient-pills,
	#mytabs-pane-emaillog .pc-email-pill {
		font-size: 1rem;
	}
}

/* Mobile cards - email bubbles styling moved to mobile cards media query */

/* =========================
   Mobile Cards - Kill Bootstrap striped table interference
   ========================= */
@media (max-width: 991.98px) {
  /* Remove Bootstrap striping on data cells only (preserve header/title/icon backgrounds) */
  table.pc-mobile-cards.table-striped > tbody > tr > td:not(:first-child):not(.pc-title):not(.pc-summary-title):not([class*="icons"]) {
    --bs-table-accent-bg: transparent !important;
  }
}

/* ==========================================================================
   PHOTO GALLERY STYLES
   ========================================================================== */

/* Photo Gallery Container */
.pc-photogallery {
	margin: 0 var(--pc-side-margin) !important;
	padding: 1rem;
	background-color: var(--pc-module-bg);
	border: 1px solid var(--pc-module-border);
	border-radius: var(--pc-radius);
	color: var(--pc-module-text);
}

/* Delete buttons - positioned in top-right corner */
.pc-delete-folder,
.pc-delete-image {
	position: absolute !important;
	top: 8px !important;
	right: 8px !important;
	bottom: auto !important;
	z-index: 10;
}

/* Upload Dropzone */
.pc-upload-dropzone {
	border: 2px dashed var(--pc-module-border);
	border-radius: var(--pc-radius);
	padding: 40px 20px;
	text-align: center;
	background: var(--pc-module-bg);
	transition: all 0.3s ease;
	cursor: pointer;
}

[data-bs-theme="light"] .pc-upload-dropzone {
	background: #f8f9fa;
	border-color: #ccc;
}

[data-bs-theme="dark"] .pc-upload-dropzone {
	background: #1a202c;
	border-color: #4a5568;
}

.pc-upload-dropzone:hover,
.pc-upload-dropzone.pc-dropzone-active {
	border-color: #0d6efd;
}

[data-bs-theme="light"] .pc-upload-dropzone:hover,
[data-bs-theme="light"] .pc-upload-dropzone.pc-dropzone-active {
	background: #e7f1ff;
}

[data-bs-theme="dark"] .pc-upload-dropzone:hover,
[data-bs-theme="dark"] .pc-upload-dropzone.pc-dropzone-active {
	background: #1e3a5f;
	border-color: #4dabf7;
}

.pc-dropzone-content i {
	color: var(--pc-module-text);
	opacity: 0.6;
	display: block;
}

.pc-upload-dropzone.pc-dropzone-active .pc-dropzone-content i {
	color: #0d6efd;
	opacity: 1;
}

.pc-dropzone-content h4 {
	margin: 0 0 0.5rem;
	color: var(--pc-module-text);
}

.pc-dropzone-content p {
	margin-bottom: 1rem;
	color: var(--pc-module-text);
	opacity: 0.7;
}

/* Upload Progress */
.pc-upload-progress {
	padding: 1rem;
	background: var(--pc-module-bg);
	border: 1px solid var(--pc-module-border);
	border-radius: var(--pc-radius);
	margin-top: 1rem;
}

.pc-progress-item {
	margin-bottom: 0.75rem;
	padding-bottom: 0.75rem;
	border-bottom: 1px solid var(--pc-module-border);
}

.pc-progress-item:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}

.pc-progress-info {
	display: flex;
	justify-content: space-between;
	margin-bottom: 0.25rem;
	font-size: 0.875rem;
	color: var(--pc-module-text);
}

.pc-progress-name {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 70%;
}

.pc-progress-status {
	font-weight: 500;
}

/* Gallery Grid - layout controlled by inline styles based on component settings */
.pc-gallery-grid {
	margin-top: 1rem;
}

/* Gallery Item - base styles, layout-specific styles set inline */
.pc-gallery-item {
	position: relative;
	border-radius: var(--pc-radius);
	overflow: hidden;
	transition: transform 0.2s, box-shadow 0.2s;
}

[data-bs-theme="light"] .pc-gallery-item {
	background: #ffffff;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

[data-bs-theme="dark"] .pc-gallery-item {
	background: #2d3748;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.pc-gallery-item:hover {
	transform: translateY(-2px);
}

[data-bs-theme="light"] .pc-gallery-item:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

[data-bs-theme="dark"] .pc-gallery-item:hover {
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
}

.pc-gallery-image-wrapper {
	position: relative;
	overflow: hidden;
}

[data-bs-theme="light"] .pc-gallery-image-wrapper {
	background: #f0f0f0;
}

[data-bs-theme="dark"] .pc-gallery-image-wrapper {
	background: #1a202c;
}

.pc-gallery-link {
	display: block;
	width: 100%;
	height: 100%;
}

.pc-gallery-image {
	width: 100%;
	height: auto;
	display: block;
	transition: transform 0.3s;
}

.pc-gallery-item:hover .pc-gallery-image {
	transform: scale(1.05);
}

/* Delete Button */
.pc-gallery-delete {
	position: absolute;
	top: 8px;
	right: 8px;
	opacity: 0;
	transition: opacity 0.2s;
	padding: 0.25rem 0.5rem;
	font-size: 0.75rem;
	border-radius: var(--pc-radius-sm);
	z-index: 10;
}

.pc-gallery-item:hover .pc-gallery-delete {
	opacity: 1;
}

/* Mobile: always show delete button */
@media (max-width: 768px) {
	.pc-gallery-delete {
		opacity: 0.8;
	}
}

/* Caption */
.pc-gallery-caption {
	padding: 0.5rem;
	font-size: 0.8125rem;
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

[data-bs-theme="light"] .pc-gallery-caption {
	background: #ffffff;
	color: #495057;
}

[data-bs-theme="dark"] .pc-gallery-caption {
	background: #2d3748;
	color: #e2e8f0;
}

/* Gallery Header */
.pc-gallery-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 0.5rem;
}

/* Empty State */
.pc-gallery-section .alert-info {
	text-align: center;
	padding: 2rem;
}

.pc-gallery-section .alert-info i {
	font-size: 2rem;
	margin-bottom: 0.5rem;
	display: block;
}

/* Upload Section */
.pc-upload-section {
	margin-bottom: 1.5rem;
}

/* Progress Bar Animations */
.pc-progress-item .progress-bar {
	transition: width 0.3s ease;
}

/* Loading State for Images */
.pc-gallery-image[loading] {
	opacity: 0.5;
}

.pc-gallery-image:not([loading]) {
	opacity: 1;
	transition: opacity 0.3s;
}

/* ===== DASHBOARD STYLES ===== */
.pc-dashboard .card {
	transition: box-shadow 0.2s ease-in-out;
}
.pc-dashboard .card:hover {
	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}
.pc-dashboard .list-group-item-action:hover {
	background-color: #f8f9fa;
}
.pc-dashboard .badge {
	font-weight: 500;
}

/* Summary cards - consistent height */
.pc-dashboard .summary-cards-row .summary-card {
	height: 100%;
	display: flex;
	flex-direction: column;
}
.pc-dashboard .summary-cards-row .summary-card .card-body {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.pc-dashboard .summary-cards-row .summary-card .card-header h6 {
	font-size: 0.95rem;
}
.pc-dashboard .summary-cards-row .summary-card .card-body span {
	font-size: 0.875rem;
}

/* Drag and drop styles */
.pc-dashboard .sortable-card {
	cursor: grab;
}
.pc-dashboard .sortable-card:active {
	cursor: grabbing;
}
.pc-dashboard .sortable-ghost {
	opacity: 0.4;
}
.pc-dashboard .sortable-chosen {
	box-shadow: 0 0.5rem 2rem rgba(0, 0, 0, 0.25);
}
.pc-dashboard .section-drag-handle {
	cursor: grab;
}
.pc-dashboard .section-drag-handle:active {
	cursor: grabbing;
}

/* Summary section drag handle */
.pc-dashboard .summary-section-handle {
	border: 1px dashed var(--bs-border-color, #dee2e6);
	background-color: var(--bs-tertiary-bg, #f8f9fa);
	transition: background-color 0.2s;
}
.pc-dashboard .summary-section-handle:hover {
	background-color: var(--bs-secondary-bg, #e9ecef);
}
.pc-dashboard .summary-section-handle i,
.pc-dashboard .summary-section-handle span {
	color: var(--bs-secondary-color, #6c757d);
}

/* Section card handle (for dragging cards within sections) */
.pc-dashboard .section-card-handle {
	cursor: grab;
}
.pc-dashboard .section-card-handle:active {
	cursor: grabbing;
}

/* Dashboard dark mode */
[data-bs-theme="dark"] .pc-dashboard .list-group-item-action:hover {
	background-color: #2b3035;
}
[data-bs-theme="dark"] .pc-dashboard .card:hover {
	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.4);
}
[data-bs-theme="dark"] .pc-dashboard .sortable-chosen {
	box-shadow: 0 0.5rem 2rem rgba(0, 0, 0, 0.5);
}
/* Dashboard card content - ensure all text is light in dark mode */
[data-bs-theme="dark"] .pc-dashboard .card-body,
[data-bs-theme="dark"] .pc-dashboard .card-body span:not(.badge),
[data-bs-theme="dark"] .pc-dashboard .card-body td,
[data-bs-theme="dark"] .pc-dashboard .card-body th,
[data-bs-theme="dark"] .pc-dashboard .card-footer,
[data-bs-theme="dark"] .pc-dashboard .list-group-item,
[data-bs-theme="dark"] .pc-dashboard .list-group-item span:not(.badge) {
	color: #e2e8f0;
}
[data-bs-theme="dark"] .pc-dashboard .card-body .text-muted,
[data-bs-theme="dark"] .pc-dashboard .list-group-item .text-muted,
[data-bs-theme="dark"] .pc-dashboard .list-group-item small.text-muted {
	color: #a0aec0 !important;
}
[data-bs-theme="dark"] .pc-dashboard .card-body .text-success {
	color: #6ee7b7 !important;
}
[data-bs-theme="dark"] .pc-dashboard .table-primary,
[data-bs-theme="dark"] .pc-dashboard .table-primary th {
	background-color: rgba(13, 110, 253, 0.25);
	color: #e2e8f0;
}
[data-bs-theme="dark"] .pc-dashboard .table-striped > tbody > tr:nth-of-type(odd) > * {
	color: #e2e8f0;
}
[data-bs-theme="dark"] .pc-dashboard .bg-light {
	background-color: #2d3748 !important;
	color: #e2e8f0 !important;
}
/* Dashboard card buttons - improved dark mode contrast */
[data-bs-theme="dark"] .pc-dashboard .card-footer .btn-outline-primary,
[data-bs-theme="dark"] .pc-dashboard .card-header .btn-outline-primary {
	color: #9ec5fe !important;
	border-color: #9ec5fe;
	background-color: rgba(158, 197, 254, 0.12);
}
[data-bs-theme="dark"] .pc-dashboard .card-footer .btn-outline-primary:hover,
[data-bs-theme="dark"] .pc-dashboard .card-header .btn-outline-primary:hover,
[data-bs-theme="dark"] .pc-dashboard .card-footer .btn-outline-primary:focus,
[data-bs-theme="dark"] .pc-dashboard .card-header .btn-outline-primary:focus {
	background-color: #9ec5fe;
	border-color: #9ec5fe;
	color: #000 !important;
}

/* Dashboard badges - force bright colors for dark mode visibility */
[data-bs-theme="dark"] .pc-dashboard .badge.bg-dark {
	background-color: #495057 !important;
	color: #fff !important;
}
[data-bs-theme="dark"] .pc-dashboard .badge.bg-secondary {
	background-color: #6c757d !important;
	color: #fff !important;
}
[data-bs-theme="dark"] .pc-dashboard .badge.bg-primary {
	background-color: #0d6efd !important;
	color: #fff !important;
}
[data-bs-theme="dark"] .pc-dashboard .badge.bg-success {
	background-color: #198754 !important;
	color: #fff !important;
}
[data-bs-theme="dark"] .pc-dashboard .badge.bg-warning {
	background-color: #ffc107 !important;
	color: #000 !important;
}
[data-bs-theme="dark"] .pc-dashboard .badge.bg-danger {
	background-color: #dc3545 !important;
	color: #fff !important;
}
[data-bs-theme="dark"] .pc-dashboard .badge.bg-info {
	background-color: #0dcaf0 !important;
	color: #000 !important;
}
[data-bs-theme="dark"] .pc-dashboard hr {
	border-color: rgba(255, 255, 255, 0.2);
}

/* Dashboard filter info (left side of actions bar) */
.pc-dashboard .dashboard-filter-info {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.5rem;
}
.pc-dashboard .dashboard-filter-info .filter-message {
	color: var(--pc-module-text, #374151);
	font-size: 0.875rem;
}
.pc-dashboard .dashboard-filter-info .filter-message i {
	color: var(--bs-info, #0dcaf0);
}

/* Show all projects button */
.pc-dashboard .dashboard-show-all-btn {
	display: inline-flex;
	align-items: center;
	padding: 0.25rem 0.5rem;
	font-size: 0.8rem;
	font-weight: 500;
	border-radius: var(--pc-radius-sm);
	text-decoration: none;
	transition: all 0.2s ease-in-out;
	background-color: transparent;
	border: 1px solid var(--bs-info, #0dcaf0);
	color: var(--bs-info, #0dcaf0);
}
.pc-dashboard .dashboard-show-all-btn:hover {
	background-color: var(--bs-info, #0dcaf0);
	color: #000;
	text-decoration: none;
}

/* Dashboard filter info - dark mode */
[data-bs-theme="dark"] .pc-dashboard .dashboard-filter-info .filter-message {
	color: var(--pc-module-text-dark, #e2e8f0);
}
[data-bs-theme="dark"] .pc-dashboard .dashboard-filter-info .filter-message i {
	color: var(--bs-info, #6edff6);
}
[data-bs-theme="dark"] .pc-dashboard .dashboard-show-all-btn {
	border-color: #5dd3f3;
	color: #5dd3f3;
	background-color: rgba(93, 211, 243, 0.1);
}
[data-bs-theme="dark"] .pc-dashboard .dashboard-show-all-btn:hover {
	background-color: #5dd3f3;
	color: #000;
}

/* Drag icons - hidden by default */
.pc-dashboard .drag-icon {
	display: none;
	opacity: 0.7;
	font-size: 1rem;
}

/* Show drag icons only in rearrange mode */
.pc-dashboard.rearrange-mode .drag-icon {
	display: inline-block;
}

/* Card drag handle styling - only active in rearrange mode */
.pc-dashboard .card-drag-handle {
	cursor: default;
}
.pc-dashboard.rearrange-mode .card-drag-handle {
	cursor: grab;
}
.pc-dashboard.rearrange-mode .card-drag-handle:active {
	cursor: grabbing;
}

/* Visual feedback during drag */
.pc-dashboard .dashboard-card.sortable-ghost {
	opacity: 0.4;
}
.pc-dashboard .dashboard-card.sortable-chosen {
	opacity: 0.9;
}

/* Rearrange mode visual indicator on cards */
.pc-dashboard.rearrange-mode .dashboard-card .card {
	box-shadow: 0 0 0 2px var(--bs-primary, #0d6efd);
}

/* Dashboard actions bar */
.pc-dashboard .dashboard-actions-bar {
	padding: 0.5rem 0.75rem;
	background-color: var(--pc-module-bg, #e5e7eb);
	border: 1px solid var(--pc-module-border, #d1d5db);
	border-radius: var(--pc-radius);
}

/* Dashboard actions bar - dark mode */
[data-bs-theme="dark"] .pc-dashboard .dashboard-actions-bar {
	background-color: var(--pc-module-bg-dark, #2d3748);
	border-color: var(--pc-module-border-dark, #4a5568);
}

/* Reset layout button */
.pc-dashboard .dashboard-reset-btn {
	display: inline-flex;
	align-items: center;
	padding: 0.25rem 0.5rem;
	font-size: 0.8rem;
	border-radius: var(--pc-radius-sm);
	text-decoration: none;
	transition: all 0.2s ease-in-out;
	background-color: transparent;
	border: 1px solid var(--bs-secondary, #6c757d);
	color: var(--bs-secondary, #6c757d);
}
.pc-dashboard .dashboard-reset-btn:hover {
	background-color: var(--bs-secondary, #6c757d);
	color: #fff;
	text-decoration: none;
}

/* Reset button - dark mode */
[data-bs-theme="dark"] .pc-dashboard .dashboard-reset-btn {
	border-color: #c4ccd4;
	color: #c4ccd4;
	background-color: rgba(196, 204, 212, 0.1);
}
[data-bs-theme="dark"] .pc-dashboard .dashboard-reset-btn:hover {
	background-color: #c4ccd4;
	color: #000;
}

/* Rearrange button */
.pc-dashboard .dashboard-rearrange-btn {
	display: inline-flex;
	align-items: center;
	padding: 0.25rem 0.5rem;
	font-size: 0.8rem;
	border-radius: var(--pc-radius-sm);
	text-decoration: none;
	transition: all 0.2s ease-in-out;
	background-color: transparent;
	border: 1px solid var(--bs-primary, #0d6efd);
	color: var(--bs-primary, #0d6efd);
	cursor: pointer;
}
.pc-dashboard .dashboard-rearrange-btn:hover {
	background-color: var(--bs-primary, #0d6efd);
	color: #fff;
	text-decoration: none;
}
.pc-dashboard .dashboard-rearrange-btn.active {
	background-color: var(--bs-primary, #0d6efd);
	color: #fff;
}

/* Rearrange button - dark mode */
[data-bs-theme="dark"] .pc-dashboard .dashboard-rearrange-btn {
	border-color: #6ea8fe;
	color: #6ea8fe;
	background-color: rgba(110, 168, 254, 0.1);
}
[data-bs-theme="dark"] .pc-dashboard .dashboard-rearrange-btn:hover,
[data-bs-theme="dark"] .pc-dashboard .dashboard-rearrange-btn.active {
	background-color: #6ea8fe;
	color: #000;
}

/* Dashboard actions bar - mobile */
@media (max-width: 768px) {
	.pc-dashboard .dashboard-actions-bar {
		flex-wrap: nowrap;
		gap: 0.5rem;
		padding: 0.4rem 0.5rem;
	}
	.pc-dashboard .dashboard-filter-info {
		flex: 1;
		min-width: 0;
	}
	.pc-dashboard .dashboard-filter-info .filter-message {
		font-size: 0.75rem;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		display: block;
	}
	.pc-dashboard .dashboard-filter-info .filter-message strong {
		display: none;
	}
	.pc-dashboard .dashboard-show-all-btn {
		font-size: 0.7rem;
		white-space: nowrap;
	}
	.pc-dashboard .dashboard-actions {
		flex-shrink: 0;
	}
	.pc-dashboard .dashboard-rearrange-btn,
	.pc-dashboard .dashboard-reset-btn {
		padding: 0.2rem 0.4rem;
		font-size: 0.7rem;
	}
	.pc-dashboard .dashboard-rearrange-btn .rearrange-text,
	.pc-dashboard .dashboard-reset-btn span:not(.rearrange-done-text) {
		display: none;
	}
	.pc-dashboard .dashboard-rearrange-btn i,
	.pc-dashboard .dashboard-reset-btn i {
		margin-right: 0 !important;
	}
	/* Dashboard cards mobile padding */
	.pc-dashboard .dashboard-card .card-body {
		padding: 0.5rem;
	}
	.pc-dashboard .dashboard-card .card-header {
		padding: 0.5rem;
	}
	.pc-dashboard .dashboard-card .table-responsive {
		margin: 0;
	}
}

/* Financial breakdown mobile cards */
.financial-mobile-cards .financial-mobile-item {
	padding: 0.5rem;
	border-bottom: 1px solid var(--bs-border-color);
}
.financial-mobile-cards .financial-mobile-item:last-child {
	border-bottom: none;
}
.financial-mobile-cards .financial-mobile-totals {
	background-color: var(--bs-primary);
	color: var(--bs-white);
	margin-top: 0.5rem;
}
[data-bs-theme="dark"] .financial-mobile-cards .financial-mobile-totals {
	background-color: var(--bs-primary);
}

/* Reusable card components */
.pc-card {
	border-radius: var(--bs-border-radius-lg);
	padding: 1.25rem 1.5rem;
	background: var(--bs-body-bg);
	margin-bottom: 1.5rem;
	border: 1px solid var(--bs-border-color);
	box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}
.pc-card h2 {
	margin: 0;
	font-size: 1.5rem;
	font-weight: 600;
}
.pc-card .pc-label {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.025em;
	color: var(--bs-secondary-color);
	margin-bottom: 0.25rem;
}
.pc-card .pc-value {
	font-size: 1rem;
	font-weight: 600;
}
.pc-detail-hero {
	border-radius: var(--pc-radius);
	padding: 1.25rem 1.5rem;
	background: var(--pc-module-bg);
	margin-bottom: var(--pc-section-gap);
	border: 1px solid var(--pc-module-border);
	box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}
.pc-detail-hero h2 {
	margin: 0;
	font-size: 1.5rem;
	font-weight: 600;
}
.pc-detail-hero .pc-label {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.025em;
	color: var(--pc-module-text);
	margin-bottom: 0.25rem;
}

/* Reusable grid layout for summary items */
.pc-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 0.75rem;
}
.pc-summary-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 0.75rem;
}

/* Reusable pill/badge style for data display */
.pc-pill {
	border-radius: var(--bs-border-radius);
	border: 1px solid var(--bs-border-color);
	padding: 0.75rem 1rem;
	background: var(--bs-secondary-bg);
}
.pc-pill .label,
.pc-pill .pc-label {
	font-size: 0.75rem;
	color: var(--bs-secondary-color);
	text-transform: uppercase;
	letter-spacing: 0.025em;
}
.pc-pill .value,
.pc-pill .pc-value {
	font-size: 1rem;
	font-weight: 600;
}
.pc-summary-pill {
	border-radius: var(--pc-radius);
	border: 1px solid var(--pc-module-border);
	padding: 0.75rem 1rem;
	background: var(--bs-secondary-bg);
}
.pc-summary-pill .label {
	font-size: 0.75rem;
	color: var(--pc-module-text);
	text-transform: uppercase;
	letter-spacing: 0.025em;
}
.pc-summary-pill .value {
	font-size: 1rem;
	font-weight: 600;
}

/* Reusable read-only data card */
.pc-readonly-card {
	border: 1px solid var(--pc-module-border);
	border-radius: var(--pc-radius);
	background: var(--pc-module-bg);
	padding: 1rem;
	margin-bottom: var(--pc-section-gap);
}
.pc-readonly-card .control-group {
	display: grid;
	grid-template-columns: 180px 1fr;
	align-items: flex-start;
	gap: 0.75rem;
	padding: 0.75rem 0;
	margin: 0;
}
.pc-readonly-card .control-group:not(:last-child) {
	border-bottom: 1px solid var(--pc-module-border);
}
.pc-readonly-card .control-label {
	font-weight: 600;
	color: var(--pc-module-text);
	font-size: 0.875rem;
}
.pc-readonly-card .form-control-plaintext {
	padding: 0;
}

/* Section title styling */
.pc-section-title {
	font-size: 0.875rem;
	color: var(--pc-module-text);
	text-transform: uppercase;
	margin-bottom: 0.5rem;
	font-weight: 600;
	letter-spacing: 0.025em;
}

/* Client view containers - tables fill container width */
.pc-client-scopeadjustments .table-responsive,
.pc-client-allowances .table-responsive {
	margin: 0 0 var(--pc-section-gap) 0 !important;
}

/* ===== PROJECTFORM MOBILE IMPROVEMENTS ===== */

/* Modal mobile sizing */
@media (max-width: 768px) {
	#pcAddressModal .modal-dialog,
	.modal-lg {
		margin: 0.5rem;
		max-width: calc(100% - 1rem);
	}
	#pcAddressModal .modal-body {
		padding: 1rem;
	}
	#pcAddressModal .modal-header {
		padding: 0.75rem 1rem;
	}
	#pcAddressModal .modal-footer {
		padding: 0.75rem 1rem;
		flex-wrap: wrap;
		gap: 0.5rem;
	}
	#pcAddressModal .modal-footer .btn {
		flex: 1 1 auto;
		min-width: 100px;
	}
}

/* Agreements list mobile styles */
.agreements-list .list-group-item {
	padding: 0.75rem 1rem;
}
@media (max-width: 768px) {
	.agreements-list {
		margin: 0 var(--pc-side-margin) !important;
	}
	.agreements-list .list-group-item {
		flex-wrap: wrap;
		gap: 0.5rem;
	}
	.agreements-list .list-group-item > span:first-child {
		flex: 1 1 100%;
	}
}

/* Table header consistency - all tables get light header */
table.pc-mobile-cards thead,
.table thead {
	background-color: var(--bs-tertiary-bg, #f8f9fa);
}
[data-bs-theme="dark"] table.pc-mobile-cards thead,
[data-bs-theme="dark"] .table thead {
	background-color: var(--bs-tertiary-bg, #2b3035);
}

/* Table header cells - add table-light class styling */
table.pc-mobile-cards thead th,
.table thead th {
	background-color: inherit;
	border-bottom: 2px solid var(--bs-border-color);
	font-weight: 600;
}

/* =====================================================
   Choices.js / Fancy Select - Dark Mode Styles
   ===================================================== */

/* Dark mode - main container and inner area */
[data-bs-theme="dark"] .choices__inner {
	background-color: var(--bs-body-bg, #212529);
	border-color: var(--bs-border-color, #495057);
	color: var(--bs-body-color, #dee2e6);
}

[data-bs-theme="dark"] .choices__inner:focus,
[data-bs-theme="dark"] .choices.is-focused .choices__inner {
	border-color: var(--bs-primary, #0d6efd);
	box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

/* Dark mode - dropdown list container */
[data-bs-theme="dark"] .choices__list--dropdown,
[data-bs-theme="dark"] .choices__list[aria-expanded] {
	background-color: var(--bs-body-bg, #212529);
	border-color: var(--bs-border-color, #495057);
	color: var(--bs-body-color, #dee2e6);
}

/* Dark mode - dropdown items */
[data-bs-theme="dark"] .choices__list--dropdown .choices__item,
[data-bs-theme="dark"] .choices__list[aria-expanded] .choices__item {
	color: var(--bs-body-color, #dee2e6);
}

/* Dark mode - highlighted/hover items */
[data-bs-theme="dark"] .choices__list--dropdown .choices__item--selectable.is-highlighted,
[data-bs-theme="dark"] .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
	background-color: var(--bs-primary, #0d6efd);
	color: #fff;
}

/* Dark mode - selected items (for multi-select) */
[data-bs-theme="dark"] .choices__list--multiple .choices__item {
	background-color: var(--bs-primary, #0d6efd);
	border-color: var(--bs-primary, #0d6efd);
	color: #fff;
}

/* Dark mode - search input inside dropdown */
[data-bs-theme="dark"] .choices__input {
	background-color: var(--bs-body-bg, #212529);
	color: var(--bs-body-color, #dee2e6);
}

[data-bs-theme="dark"] .choices__input::placeholder {
	color: var(--bs-secondary-color, #adb5bd);
}

/* Dark mode - placeholder text */
[data-bs-theme="dark"] .choices__placeholder {
	color: var(--bs-secondary-color, #adb5bd);
}

/* Dark mode - single select value */
[data-bs-theme="dark"] .choices__list--single .choices__item {
	color: var(--bs-body-color, #dee2e6);
}

/* Dark mode - disabled state */
[data-bs-theme="dark"] .choices[data-type*="select-one"].is-disabled .choices__inner,
[data-bs-theme="dark"] .choices[data-type*="select-multiple"].is-disabled .choices__inner {
	background-color: var(--bs-tertiary-bg, #2b3035);
	color: var(--bs-secondary-color, #adb5bd);
}

/* Dark mode - no results message */
[data-bs-theme="dark"] .choices__list--dropdown .choices__item--disabled,
[data-bs-theme="dark"] .choices__list[aria-expanded] .choices__item--disabled {
	color: var(--bs-secondary-color, #adb5bd);
}