* {
	box-sizing: border-box;
}

a {
	color: inherit;
}

img,
svg {
	display: block;
	max-width: 100%;
}

html[data-theme="light"] {
	--bg-body: #f6f7f9;
	--bg-card: #ffffff;
	--bg-sidebar: #ffffff;
	--bg-hover: #f0f3f6;
	--bg-muted: #f3f5f7;
	--t-base: #20242a;
	--t-muted: #66707c;
	--t-light: #8b95a1;
	--t-inverse: #ffffff;
	--border: #dfe4ea;
	--border-soft: #edf0f3;
	--primary: #2563eb;
	--primary-light: #3b82f6;
	--primary-dark: #1d4ed8;
	--primary-strong: #1d4ed8;
	--primary-soft: #eef4ff;
	--primary-ring: rgba(37, 99, 235, .16);
	--success: #059669;
	--success-soft: #ecfdf5;
	--warning: #d97706;
	--warning-soft: #fffbeb;
	--danger: #dc2626;
	--danger-soft: #fef2f2;
	--info: #0284c7;
	--info-soft: #f0f9ff;
	--purple: #7c3aed;
	--purple-soft: #f5f3ff;
	--pink: #db2777;
	--pink-soft: #fdf2f8;
	--teal: #0d9488;
	--teal-soft: #f0fdfa;
	--orange: #ea580c;
	--orange-soft: #fff7ed;
	--shadow-sm: 0 1px 2px 0 rgba(32, 36, 42, .05);
	--shadow-card: 0 1px 2px 0 rgba(32, 36, 42, .05), 0 10px 24px -20px rgba(32, 36, 42, .28);
	--shadow-lg: 0 18px 38px -22px rgba(32, 36, 42, .28);
	--overlay: rgba(246, 247, 249, .82);
}

:root[data-theme="dark"],
html[data-theme="dark"] {
	--bg-body: #0d1117;
	--bg-card: #161b22;
	--bg-sidebar: #010409;
	--bg-hover: #21262d;
	--bg-muted: #161b22;
	--t-base: #c9d1d9;
	--t-muted: #8b949e;
	--t-light: #6e7681;
	--t-inverse: #0d1117;
	--border: #30363d;
	--border-soft: #21262d;
	--primary: #58a6ff;
	--primary-light: #79c0ff;
	--primary-dark: #388bfd;
	--primary-strong: #79c0ff;
	--primary-soft: #0d274d;
	--primary-ring: rgba(88, 166, 255, .24);
	--success: #3fb950;
	--success-soft: #0f2a16;
	--warning: #d29922;
	--warning-soft: #2e2308;
	--danger: #f85149;
	--danger-soft: #2d1412;
	--info: #58a6ff;
	--info-soft: #0d274d;
	--purple: #a371f7;
	--purple-soft: #21162f;
	--pink: #db61a2;
	--pink-soft: #2b1630;
	--teal: #39c5cf;
	--teal-soft: #102b2f;
	--orange: #db6d28;
	--orange-soft: #2f1d0d;
	--shadow-sm: 0 1px 2px 0 rgba(1, 4, 9, .5);
	--shadow-card: 0 1px 2px 0 rgba(1, 4, 9, .38), 0 10px 30px -22px rgba(1, 4, 9, .85);
	--shadow-lg: 0 18px 40px -22px rgba(1, 4, 9, .9);
	--overlay: rgba(13, 17, 23, .84);
}

.section-panel {
	margin-top: 18px;
}

.subpanel {
	margin: 18px 0;
	padding: 16px;
}

.page-actions-tight {
	margin-bottom: 12px;
}

.upload-template-summary {
	margin-bottom: 18px;
}

.nav-icon-inline {
	display: inline-flex;
	margin-left: 8px;
}

.badge-spaced {
	margin-left: 6px;
}

.btn--danger-strong {
	background: var(--danger) !important;
	box-shadow: 0 1px 2px rgba(239, 68, 68, .18) !important;
	color: #fff !important;
}

.auth-form .input-icon .ico {
	height: 16px;
	left: 14px;
	width: 16px;
}

.auth-form .input-icon .input {
	padding-left: 44px;
}

.compact-section-title {
	align-items: center;
	display: flex;
	justify-content: space-between;
	margin: 12px 0 8px;
}

.compact-section-title h2 {
	font-size: 15px;
	margin: 0;
}

.compact-data-section {
	margin-top: 12px;
}

.compact-data-section .page-actions {
	margin-bottom: 8px;
}

.compact-data-section .data-table th,
.compact-data-section .data-table td {
	padding: 8px 10px;
	vertical-align: top;
}

.nowrap-table .data-table th,
.nowrap-table .data-table td {
	padding: 8px 10px;
	white-space: nowrap;
}

.compact-info-panel .page-actions {
	margin-bottom: 10px;
}

.compact-info-panel .contract-info-grid,
.compact-info-panel .payment-info-grid {
	gap: 8px;
	grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
}

.compact-info-panel .info-item {
	min-height: auto;
	padding: 10px 12px;
}

.compact-info-panel .info-item span {
	font-size: 11px;
	margin-bottom: 2px;
}

.compact-info-panel .info-item strong {
	font-size: 13px;
	line-height: 1.25;
}

.inline-edit-row {
	align-items: end;
	display: grid;
	gap: 10px;
	grid-template-columns: minmax(0, 1fr) auto;
}

.readonly-field-row {
	margin-bottom: 12px;
}

.readonly-field-row label {
	display: block;
}

.readonly-field-row input {
	width: 100%;
}

.inline-edit-row .btn--primary {
	min-height: 42px;
	padding: 9px 14px;
}

.or-edit-row,
.discount-edit-row {
	align-items: end;
	display: grid;
	gap: 10px;
	grid-template-columns: minmax(0, 1fr) auto;
}

.discount-current-row {
	margin-bottom: 12px;
}

.discount-current-row label {
	display: block;
}

.discount-current-row input {
	width: 100%;
}

.or-modal-actions .btn--primary,
.payment-history .payment-or-edit {
	min-height: 34px;
	padding: 8px 12px;
}

.payment-history-actions {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.payment-amount-edit {
	align-items: center;
	display: inline-flex;
	gap: 8px;
}

.payment-amount-edit input {
	height: 34px;
	max-width: 130px;
}

.payment-delete-form {
	display: inline-flex;
}

.discount-edit-row .btn--primary {
	min-height: 42px;
	padding: 9px 14px;
}

.recompute-remaining-row {
	grid-template-columns: minmax(120px, 1fr) minmax(160px, 1fr) auto;
}

.payment-submit-row {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	grid-column: 1 / -1;
	justify-content: flex-end;
}

.payment-submit-row .btn {
	min-height: 42px;
	padding: 9px 14px;
}

.payment-submit-msg {
	color: var(--danger);
	font-size: 12px;
	flex-basis: 100%;
	line-height: 1.35;
	min-height: 16px;
	text-align: right;
}

.payment-waive-penalty {
	align-items: center;
	display: flex;
	gap: 8px;
	margin: 0;
	min-height: 42px;
	white-space: nowrap;
}

.payment-waive-penalty input {
	height: 16px;
	width: 16px;
}

.payment-modal-panel {
	display: flex;
	flex-direction: column;
	max-height: calc(100vh - 48px);
	overflow: hidden;
	width: min(980px, 100%);
}

.payment-modal-panel form {
	display: flex;
	flex: 1;
	flex-direction: column;
	min-height: 0;
	overflow-y: auto;
}

.payment-table-scroll {
	max-height: min(360px, 42vh);
	overflow: auto;
}

.payment-table-scroll .data-table {
	margin-bottom: 0;
}

.payment-table-scroll .data-table thead th {
	position: sticky;
	top: 0;
	z-index: 1;
}

.amount-right-table th:nth-child(n+3),
.amount-right-table td:nth-child(n+3) {
	text-align: right;
}

.payment-breakdown {
	font-size: 12px;
	line-height: 1.35;
	margin-top: 4px;
}

.commission-schedule,
.payment-history,
.compact-schedule {
	margin-top: 12px;
}

.commission-schedule .data-table th,
.commission-schedule .data-table td,
.payment-history .data-table th,
.payment-history .data-table td {
	padding: 8px 10px;
	white-space: nowrap;
}

.commission-schedule .tranche-status {
	display: block;
	font-size: 11px;
	margin-top: 2px;
}

.commission-schedule .tranche-breakdown {
	color: var(--t-muted);
	display: block;
	font-size: 11px;
	line-height: 1.3;
	margin-top: 2px;
}

.compact-schedule .page-actions {
	margin-bottom: 8px;
}

.compact-schedule .data-table th,
.compact-schedule .data-table td {
	padding: 8px 10px;
	vertical-align: top;
}

.compact-schedule .payment-breakdown {
	font-size: 12px;
	line-height: 1.35;
	margin-top: 4px;
}

.contract-compact .page-actions {
	margin-bottom: 10px;
}

.contract-compact .contract-info-grid,
.contract-compact .payment-info-grid {
	gap: 8px;
	grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
}

.contract-compact .info-item {
	min-height: auto;
	padding: 10px 12px;
}

.contract-compact .info-item span {
	font-size: 11px;
	margin-bottom: 2px;
}

.contract-compact .info-item strong {
	font-size: 13px;
	line-height: 1.25;
}

.payment-computation-print {
	margin-top: 14px;
}

.print-document {
	display: none;
}

.payment-computation-header {
	display: none;
	margin-bottom: 14px;
}

.print-subtitle,
.print-note {
	color: #444;
	font-size: 12px;
	line-height: 1.45;
	margin: 4px 0 10px;
}

.print-note {
	margin-top: 12px;
}

.statement-info-table {
	margin-bottom: 12px;
}

.statement-info-table th {
	background: #f3f4f6;
	font-weight: 700;
	text-align: left;
	width: 16%;
}

.statement-info-table td {
	width: 34%;
}

.payment-computation-meta {
	display: grid;
	gap: 4px 12px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin-top: 8px;
}

.payment-computation-meta div {
	border-bottom: 1px solid #ddd;
	font-size: 11px;
	padding: 2px 0;
}

.payment-computation-total td {
	font-weight: 700;
}

.payment-computation-table th:nth-child(n+3),
.payment-computation-table td:nth-child(n+3),
.payment-preview-table th:nth-child(n+3),
.payment-preview-table td:nth-child(n+3) {
	text-align: right;
}

.payment-computation-actions {
	display: flex;
	justify-content: flex-end;
	margin-top: 10px;
}

@media print {
	body * {
		visibility: hidden !important;
	}

	body.print-payment-computation #payment-computation-print,
	body.print-payment-computation #payment-computation-print *,
	body.print-client-ledger #client-ledger-print,
	body.print-client-ledger #client-ledger-print * {
		visibility: visible !important;
	}

	body.print-payment-computation #payment-computation-print,
	body.print-client-ledger #client-ledger-print {
		background: #fff;
		color: #000;
		display: block;
		left: 0;
		padding: 24px;
		position: absolute;
		top: 0;
		width: 100%;
	}

	.payment-modal-panel,
	.payment-modal-panel form,
	.payment-table-scroll {
		max-height: none !important;
		overflow: visible !important;
	}

	body.print-payment-computation #payment-computation-print .payment-computation-header,
	body.print-client-ledger #client-ledger-print .payment-computation-header {
		display: block;
	}

	body.print-payment-computation #payment-computation-print .field-title,
	body.print-client-ledger #client-ledger-print .field-title {
		margin-top: 8px;
	}

	body.print-payment-computation #payment-computation-print .data-table,
	body.print-client-ledger #client-ledger-print .data-table {
		border-collapse: collapse;
		width: 100%;
	}

	body.print-payment-computation #payment-computation-print .data-table th,
	body.print-payment-computation #payment-computation-print .data-table td,
	body.print-client-ledger #client-ledger-print .data-table th,
	body.print-client-ledger #client-ledger-print .data-table td {
		border: 1px solid #222;
		color: #000;
		padding: 6px 8px;
	}

	.no-print {
		display: none !important;
	}
}

.d-sidebar {
	display: flex;
	flex-direction: column;
	max-height: 100vh;
	min-height: 100vh;
	overflow: hidden;
}

.brand {
	flex: 0 0 auto;
}

.brand-text {
	min-width: 0;
}

.brand-name,
.brand-tag {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.panel,
.modal-panel,
.card-surface {
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 14px;
	box-shadow: var(--shadow-card);
	padding: 22px;
}

.page-actions {
	align-items: flex-start;
	display: flex;
	gap: 16px;
	justify-content: space-between;
	margin-bottom: 18px;
}

.page-actions h1 {
	font-family: Inter Tight, Inter, sans-serif;
	font-size: 24px;
	font-weight: 700;
	letter-spacing: -.024em;
	line-height: 1.15;
	margin: 0 0 6px;
}

.page-actions p {
	color: var(--t-muted);
	margin: 0;
}

.page-actions > .button-link {
	background: var(--primary);
	border-color: var(--primary);
	color: #fff;
}

.page-actions > .button-link:hover {
	background: var(--primary-strong, #0055cc);
	border-color: var(--primary-strong, #0055cc);
	color: #fff;
}

.page-actions > .button-link.secondary {
	background: var(--primary);
	border-color: var(--primary);
	color: #fff;
}

.page-actions > .button-link.secondary:hover {
	background: var(--primary-strong, #0055cc);
	border-color: var(--primary-strong, #0055cc);
	color: #fff;
}

.button-link {
	align-items: center;
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 12px;
	box-shadow: none;
	color: var(--t-base);
	display: inline-flex;
	font-size: 13px;
	font-weight: 600;
	gap: 8px;
	justify-content: center;
	line-height: 1;
	padding: 12px 16px;
	text-decoration: none;
	width: auto;
}

.button-link:hover {
	background: var(--bg-hover);
	border-color: var(--t-light);
	color: var(--t-base);
}

.button-link.secondary {
	color: var(--t-muted);
}

.button-link.secondary:hover {
	color: var(--t-base);
}

.stacked-form > button[type="submit"] {
	align-items: center;
	align-self: flex-start;
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 12px;
	box-shadow: none;
	color: var(--t-base);
	display: inline-flex;
	font: inherit;
	font-weight: 600;
	height: 42px;
	line-height: 1;
	margin-top: 10px;
	padding: 0 14px;
	width: fit-content;
}

.stacked-form > button[type="submit"]:hover {
	background: var(--bg-hover);
	border-color: var(--t-light);
	color: var(--t-base);
}

.stacked-form > button[type="submit"]:focus-visible,
.button-link:focus-visible,
.link-button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.nav-link:focus-visible {
	box-shadow: 0 0 0 3px var(--primary-soft);
	outline: 0;
}

.notice,
.alert {
	border-radius: 10px;
	margin-bottom: 16px;
	padding: 12px 14px;
}

.notice {
	background: var(--success-soft);
	border: 1px solid color-mix(in oklab, var(--success) 24%, transparent);
	color: var(--success);
}

.alert {
	background: var(--danger-soft);
	border: 1px solid color-mix(in oklab, var(--danger) 24%, transparent);
	color: var(--danger);
	display: block;
	line-height: 1.45;
	width: 100%;
}

form label {
	color: var(--t-base);
	display: block;
	font-size: 12.5px;
	font-weight: 600;
	margin: 0 0 14px;
}

input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 8px;
	color: var(--t-base);
	font: inherit;
	font-size: 13px;
	line-height: 1.4;
	padding: 9px 12px;
	transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
	width: 100%;
}

input:not([type="checkbox"]):not([type="radio"])::placeholder,
textarea::placeholder {
	color: var(--t-light);
}

input:not([type="checkbox"]):not([type="radio"]):focus,
select:focus,
textarea:focus {
	border-color: var(--primary);
	box-shadow: 0 0 0 3px var(--primary-soft);
}

textarea {
	min-height: 96px;
	resize: vertical;
}

select {
	appearance: none;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748B' stroke-width='2'><path d='m6 9 6 6 6-6'/></svg>");
	background-position: right 10px center;
	background-repeat: no-repeat;
	padding-right: 34px;
}

html[data-theme="dark"] select,
html[data-theme="dark"] .select {
	background-color: var(--bg-card);
	color: var(--t-base);
	color-scheme: dark;
}

html[data-theme="dark"] select option {
	background: var(--bg-card);
	color: var(--t-base);
}

html[data-theme="dark"] select option:checked {
	background: var(--primary-soft);
	color: var(--primary-light);
}

html[data-theme="dark"] .select2-container--default .select2-selection--single,
html[data-theme="dark"] .select2-container--default .select2-selection--multiple {
	background: var(--bg-card);
	border-color: var(--border);
	color: var(--t-base);
}

html[data-theme="dark"] .select2-container--default.select2-container--focus .select2-selection--single,
html[data-theme="dark"] .select2-container--default.select2-container--focus .select2-selection--multiple,
html[data-theme="dark"] .select2-container--default.select2-container--open .select2-selection--single,
html[data-theme="dark"] .select2-container--default.select2-container--open .select2-selection--multiple {
	border-color: var(--primary);
	box-shadow: 0 0 0 3px var(--primary-soft);
}

html[data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__rendered,
html[data-theme="dark"] .select2-container--default .select2-selection--multiple .select2-selection__choice,
html[data-theme="dark"] .select2-container--default .select2-selection--multiple .select2-selection__rendered {
	color: var(--t-base);
}

html[data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__placeholder,
html[data-theme="dark"] .select2-container--default .select2-search--inline .select2-search__field::placeholder {
	color: var(--t-light);
}

html[data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__arrow b {
	border-color: var(--t-muted) transparent transparent transparent;
}

html[data-theme="dark"] .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
	border-color: transparent transparent var(--t-muted) transparent;
}

html[data-theme="dark"] .select2-dropdown {
	background: var(--bg-card);
	border-color: var(--border);
	box-shadow: var(--shadow-lg);
	color: var(--t-base);
}

html[data-theme="dark"] .select2-container--default .select2-search--dropdown .select2-search__field {
	background: var(--bg-body);
	border-color: var(--border);
	color: var(--t-base);
	outline: 0;
}

html[data-theme="dark"] .select2-container--default .select2-results__option {
	color: var(--t-base);
}

html[data-theme="dark"] .select2-container--default .select2-results__option[aria-selected="true"] {
	background: var(--bg-hover);
	color: var(--primary-light);
}

html[data-theme="dark"] .select2-container--default .select2-results__option--highlighted[aria-selected] {
	background: var(--primary-soft);
	color: var(--primary-light);
}

html[data-theme="dark"] .select2-container--default .select2-results__option[aria-disabled="true"] {
	color: var(--t-light);
}

html[data-theme="dark"] .select2-container--default .select2-selection--multiple .select2-selection__choice {
	background: var(--bg-hover);
	border-color: var(--border);
}

.stacked-form {
	max-width: 980px;
}

.form-grid {
	display: grid;
	gap: 14px 18px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.form-grid > label {
	margin-bottom: 0;
}

.checkbox-row {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin: 12px 0 18px;
}

.checkbox-row label {
	align-items: center;
	display: inline-flex;
	gap: 8px;
	margin: 0;
}

.checkbox-row input {
	margin: 0;
	width: auto;
}

.field-group {
	margin: 18px 0;
}

.field-title {
	font-size: 14px;
	font-weight: 700;
	margin: 0 0 8px;
}

.table-search {
	display: flex;
	justify-content: flex-end;
	margin: 0 0 14px;
}

.table-search input {
	margin: 0;
	max-width: 320px;
}

.datatable-shell {
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
	width: 100%;
}

.datatable-scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	width: 100%;
}

.datatable-scroll::-webkit-scrollbar {
	height: 4px;
}

.datatable-scroll::-webkit-scrollbar-thumb {
	background: var(--border);
	border-radius: 4px;
}

.data-toolbar {
	align-items: center;
	display: flex;
	gap: 16px;
	justify-content: space-between;
}

.data-toolbar-left,
.data-toolbar-right {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	min-width: 0;
}

.datatable-search {
	flex: 1 1 340px;
	align-items: center;
	display: flex;
	gap: 10px;
	max-width: 340px;
	min-width: 220px;
	width: 100%;
}

.datatable-search .input {
	height: 38px;
	width: 100%;
}

.datatable-column-filters {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.datatable-column-filter {
	color: var(--t-muted);
	display: grid;
	font-size: 11px;
	font-weight: 600;
	gap: 4px;
	min-width: 92px;
}

.datatable-column-filter .input {
	height: 38px;
	width: 110px;
}

.datatable-shell[data-datatable-shell^="reports_"] .data-toolbar {
	align-items: flex-end;
	display: grid;
	gap: 12px;
	grid-template-columns: minmax(0, 1fr) auto;
}

.datatable-shell[data-datatable-shell^="reports_"] .data-toolbar-left {
	align-items: flex-end;
	gap: 12px;
}

.datatable-shell[data-datatable-shell^="reports_"] .data-toolbar-right {
	align-items: flex-end;
	justify-content: flex-end;
}

.datatable-shell[data-datatable-shell^="reports_"] .datatable-search {
	flex: 1 1 280px;
	max-width: 320px;
	min-width: 220px;
}

.datatable-shell[data-datatable-shell^="reports_"] .datatable-column-filter {
	min-width: 88px;
}

.datatable-shell[data-datatable-shell^="reports_"] .datatable-column-filter .input {
	width: 96px;
}

.datatable-search-icon {
	align-items: center;
	color: var(--t-light);
	display: inline-flex;
	height: 14px;
	pointer-events: none;
	width: 14px;
	flex: 0 0 auto;
}

.datatable-search-icon svg {
	fill: none;
	height: 14px;
	stroke: currentColor;
	stroke-width: 2;
	width: 14px;
}

.report-filters {
	align-items: flex-end;
	background: var(--bg-muted);
	border: 1px solid var(--border-soft);
	border-radius: 8px;
	display: grid;
	gap: 12px;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
	margin: 0 0 18px;
	padding: 14px;
}

.report-filters label {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	width: 100%;
}

.report-filters .filter-range {
	grid-column: span 2;
	min-width: 0;
	position: relative;
}

.report-filters .filter-compact {
	min-width: 86px;
}

.report-filters input,
.report-filters select {
	height: 38px;
}

.range-picker {
	align-items: stretch;
	display: block;
	position: relative;
	width: 100%;
}

.range-trigger {
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 8px;
	color: var(--t-base);
	cursor: pointer;
	display: block;
	height: 38px;
	overflow: hidden;
	line-height: 36px;
	padding: 0 36px 0 12px;
	position: relative;
	text-align: left;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 100%;
}

.range-trigger:hover,
.range-trigger:focus {
	border-color: var(--primary);
	box-shadow: 0 0 0 3px var(--primary-soft);
}

.range-trigger-icon {
	color: var(--t-light);
	font-size: 12px;
	pointer-events: none;
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
}

.report-filter-actions {
	align-items: center;
	align-self: flex-end;
	display: flex;
	gap: 12px;
	justify-content: flex-end;
	min-width: 0;
}

.report-filters button,
.report-filters .button-link.secondary {
	height: 38px;
	justify-content: center;
	padding: 0 14px;
	width: auto;
}

.report-filter-actions .filter-submit {
	align-items: center;
	background: var(--primary);
	border: 1px solid var(--primary);
	border-radius: 12px;
	box-shadow: none;
	color: #fff;
	cursor: pointer;
	display: inline-flex;
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	height: 38px;
	justify-content: center;
	line-height: 1;
	padding: 0 16px;
	width: auto;
}

.report-filter-actions .filter-submit:hover {
	background: var(--primary-strong, #0055cc);
	border-color: var(--primary-strong, #0055cc);
	color: #fff;
}

.report-filter-actions .button-link.secondary {
	background: var(--bg-card);
	border-color: var(--border);
	color: var(--t-muted);
}

.report-filter-actions .button-link.secondary:hover {
	background: var(--bg-hover);
	border-color: var(--t-light);
	color: var(--t-base);
}

.report-filters .select2-container {
	width: 100% !important;
}

.datatable-size {
	min-width: 132px;
	padding: 7px 30px 7px 10px;
}

.report-range-datepicker {
	background: var(--bg-card);
	border: 1px solid var(--border);
	box-shadow: var(--shadow-lg);
	color: var(--t-base);
	font-family: inherit;
}

.report-range-datepicker .air-datepicker-nav,
.report-range-datepicker .air-datepicker-body,
.report-range-datepicker .air-datepicker--content,
.report-range-datepicker .air-datepicker--buttons {
	border-color: var(--border);
}

.report-range-datepicker .air-datepicker-nav--title,
.report-range-datepicker .air-datepicker-nav--action,
.report-range-datepicker .air-datepicker-body--day-name {
	color: var(--t-muted);
}

.report-range-datepicker .air-datepicker-cell {
	color: var(--t-base);
}

.report-range-datepicker .air-datepicker-cell.-selected-,
.report-range-datepicker .air-datepicker-cell.-current-.-selected- {
	background: var(--primary);
	color: #fff;
}

.report-range-datepicker .air-datepicker-cell.-in-range- {
	background: var(--primary-soft);
	color: var(--t-base);
}

.report-range-datepicker .air-datepicker-cell.-range-from-,
.report-range-datepicker .air-datepicker-cell.-range-to- {
	background: var(--primary);
	color: #fff;
}

.report-range-datepicker .air-datepicker-button {
	color: var(--t-base);
}

.datatable-shell .data-table {
	border-collapse: separate;
	border-spacing: 0;
	min-width: 900px;
	width: 100%;
}

.datatable-shell .data-table thead th {
	background: var(--bg-card);
	border-bottom: 1px solid var(--border);
	color: var(--t-light);
	cursor: pointer;
	padding: 14px 12px;
	position: relative;
	white-space: nowrap;
}

.datatable-shell .data-table thead th.sortable {
	padding-right: 32px;
}

.datatable-shell .data-table thead th.sortable .sort {
	color: var(--t-light);
	display: inline-flex;
	height: 12px;
	margin-left: 6px;
	opacity: .8;
	vertical-align: middle;
	width: 12px;
}

.datatable-shell .data-table thead th.sortable .sort svg {
	fill: none;
	height: 12px;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2;
	width: 12px;
}

.datatable-shell .data-table thead th.is-sorted {
	color: var(--t-base);
}

.datatable-shell .data-table thead th.is-sorted .sort {
	color: var(--primary);
	opacity: 1;
}

.datatable-shell .data-table thead th.is-desc .sort {
	transform: rotate(180deg);
}

.datatable-shell .data-table tbody td {
	background: var(--bg-card);
	border-bottom: 1px solid var(--border-soft);
	padding: 14px 12px;
}

.datatable-shell .data-table tbody tr:hover td {
	background: var(--bg-hover);
}

.data-table tbody tr.schedule-paid td {
	background: var(--success-soft) !important;
}

.data-table tbody tr.schedule-partial td {
	background: var(--warning-soft) !important;
}

.data-table tbody tr.schedule-past-due td {
	background: var(--danger-soft) !important;
}

.data-table tbody tr.schedule-paid:hover td {
	background: color-mix(in oklab, var(--success-soft) 86%, var(--bg-hover)) !important;
}

.data-table tbody tr.schedule-partial:hover td {
	background: color-mix(in oklab, var(--warning-soft) 86%, var(--bg-hover)) !important;
}

.data-table tbody tr.schedule-past-due:hover td {
	background: color-mix(in oklab, var(--danger-soft) 86%, var(--bg-hover)) !important;
}

.datatable-shell .data-table tbody tr.datatable-empty-row td {
	color: var(--t-muted);
	padding: 26px 12px;
	text-align: center;
}

.data-foot {
	align-items: center;
	display: flex;
	gap: 14px;
	justify-content: space-between;
}

.data-foot-info {
	color: var(--t-muted);
	font-size: 12.5px;
}

.data-foot-info strong {
	color: var(--t-base);
}

.pager {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.pager-btn {
	align-items: center;
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 10px;
	color: var(--t-base);
	display: inline-flex;
	height: 34px;
	justify-content: center;
	min-width: 34px;
	padding: 0 10px;
}

.pager-btn:hover:not(:disabled) {
	background: var(--bg-hover);
	border-color: var(--t-light);
}

.pager-btn.is-active {
	background: var(--primary);
	border-color: var(--primary);
	color: #fff;
}

.pager-btn:disabled {
	opacity: .5;
}

.pager-btn svg {
	fill: none;
	height: 14px;
	stroke: currentColor;
	stroke-width: 2;
	width: 14px;
}

.badge {
	align-items: center;
	border-radius: 999px;
	display: inline-flex;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .02em;
	line-height: 1;
	padding: 5px 10px;
}

.badge.primary {
	background: var(--primary-soft);
	color: var(--primary);
}

.badge.success {
	background: var(--success-soft);
	color: var(--success);
}

.badge.warning {
	background: var(--warning-soft);
	color: var(--warning);
}

.badge.danger {
	background: var(--danger-soft);
	color: var(--danger);
}

.badge.info {
	background: var(--info-soft);
	color: var(--info);
}

.badge.purple {
	background: var(--purple-soft);
	color: var(--purple);
}

.badge.dot {
	gap: 6px;
}

.badge.dot:before {
	border-radius: 50%;
	content: "";
	display: inline-block;
	height: 6px;
	width: 6px;
}

.badge.primary.dot:before { background: var(--primary); }
.badge.success.dot:before { background: var(--success); }
.badge.warning.dot:before { background: var(--warning); }
.badge.danger.dot:before { background: var(--danger); }
.badge.info.dot:before { background: var(--info); }
.badge.purple.dot:before { background: var(--purple); }

.row-actions {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: flex-end;
}

.row-actions form {
	margin: 0;
}

.commission-release-toolbar {
	align-items: end;
	display: flex;
	gap: 10px;
	margin: -4px 0 12px;
}

.button-link:disabled,
.button-link[disabled] {
	cursor: not-allowed;
	opacity: .55;
}

.commission-release-count,
.commission-release-msg {
	font-size: 12px;
	font-weight: 600;
}

.commission-release-count {
	color: var(--t-muted);
}

.commission-release-msg {
	color: var(--danger);
}

.empty-state {
	border: 1px dashed var(--border);
	border-radius: 8px;
	color: var(--t-muted);
	font-size: 13px;
	font-weight: 600;
	padding: 24px;
	text-align: center;
}

.tranche-status {
	border-radius: 999px;
	display: inline-flex;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
	padding: 5px 8px;
	white-space: nowrap;
}

.tranche-status.is-due {
	background: rgba(34, 197, 94, .14);
	color: #15803d;
}

.tranche-status.is-pending {
	background: rgba(245, 158, 11, .16);
	color: #92400e;
}

.checkbox-label {
	align-items: center;
	display: flex;
	font-weight: 600;
	gap: 8px;
}

.checkbox-label input {
	margin: 0;
}

.commission-release-modal {
	max-width: 460px;
	overflow: visible;
	width: min(460px, 100%);
}

.air-datepicker {
	z-index: 80;
}

.data-toolbar-right [data-datatable-toolbar-action] {
	height: 36px;
	padding-bottom: 0;
	padding-top: 0;
	white-space: nowrap;
}

.row-actions a,
.link-button {
	align-items: center;
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 10px;
	color: var(--t-base);
	cursor: pointer;
	display: inline-flex;
	font: inherit;
	font-size: 12px;
	font-weight: 600;
	height: 32px;
	justify-content: center;
	line-height: 1;
	min-width: 70px;
	padding: 0 12px;
	width: auto;
}

.row-actions a {
	color: var(--t-base);
	text-decoration: none;
}

.row-actions a:hover {
	background: var(--bg-hover);
	border-color: var(--t-light);
}

.action-menu {
	position: relative;
}

.action-menu > summary {
	list-style: none;
}

.action-menu > summary::-webkit-details-marker {
	display: none;
}

.action-menu-toggle {
	min-width: 90px;
}

.action-menu-panel {
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 12px;
	box-shadow: var(--shadow-lg);
	display: none;
	min-width: 180px;
	padding: 6px;
	position: absolute;
	right: 0;
	top: calc(100% + 8px);
	z-index: 20;
}

.action-menu[open] .action-menu-panel {
	display: grid;
	gap: 4px;
}

.action-menu-panel a,
.action-menu-panel button {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: 8px;
	color: var(--t-base);
	cursor: pointer;
	display: flex;
	font: inherit;
	font-size: 12px;
	font-weight: 600;
	justify-content: flex-start;
	padding: 8px 10px;
	text-align: left;
	width: 100%;
}

.action-menu-panel a:hover,
.action-menu-panel button:hover {
	background: var(--bg-hover);
}

.action-menu-panel .danger {
	color: var(--danger);
}

.action-menu-panel form {
	margin: 0;
}

.link-button:hover {
	background: var(--bg-hover);
	border-color: var(--t-light);
}

.link-button.danger {
	background: rgba(239, 68, 68, 0.08);
	border-color: rgba(239, 68, 68, 0.18);
	color: var(--danger);
}

.link-button.danger:hover {
	background: rgba(239, 68, 68, 0.14);
	border-color: rgba(239, 68, 68, 0.3);
}

.muted {
	color: var(--t-muted);
	margin-left: 8px;
}

.payment-breakdown {
	color: var(--t-muted);
	font-size: 12px;
	line-height: 1.45;
	margin-top: 6px;
}

.contract-info-grid {
	display: grid;
	gap: 12px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.payment-info-grid {
	display: grid;
	gap: 12px;
	grid-template-columns: repeat(5, minmax(0, 1fr));
}

.status-summary-grid {
	display: grid;
	gap: 8px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: 0 0 12px;
}

.status-summary-card {
	align-items: center;
	background: var(--bg-hover);
	border: 1px solid var(--border-soft);
	border-radius: 8px;
	display: flex;
	gap: 10px;
	justify-content: space-between;
	min-width: 0;
	padding: 10px 12px;
}

.status-summary-card > div {
	align-items: center;
	display: flex;
	gap: 8px;
	min-width: 0;
}

.status-summary-card .badge {
	flex: 0 0 auto;
}

.status-summary-card strong {
	display: block;
	font-size: 18px;
	line-height: 1;
}

.status-summary-card em {
	color: var(--t-muted);
	display: block;
	font-size: 12.5px;
	font-style: normal;
	font-weight: 700;
	overflow-wrap: anywhere;
	text-align: right;
}

.contract-summary-grid {
	align-items: stretch;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 10px;
	margin-bottom: 16px;
}

.contract-summary-card {
	align-items: stretch;
	flex-direction: column;
	justify-content: flex-start;
	min-height: 86px;
	padding: 12px;
}

.contract-summary-card > div {
	justify-content: space-between;
	width: 100%;
}

.contract-summary-card .badge {
	max-width: calc(100% - 44px);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.contract-summary-card strong {
	font-size: 22px;
	font-variant-numeric: tabular-nums;
	text-align: right;
}

.contract-summary-card em {
	font-variant-numeric: tabular-nums;
	text-align: left;
	white-space: nowrap;
}

.contract-summary-card--total {
	background: color-mix(in oklab, var(--primary) 8%, var(--bg-hover));
	border-color: color-mix(in oklab, var(--primary) 25%, var(--border-soft));
}

.datatable-shell[data-datatable-shell="contracts"] .data-toolbar {
	align-items: flex-end;
	margin-bottom: 12px;
}

.datatable-shell[data-datatable-shell="contracts"] .data-toolbar-left {
	align-items: flex-end;
	gap: 12px;
	flex: 1 1 auto;
}

.datatable-shell[data-datatable-shell="contracts"] .datatable-column-filters {
	align-items: flex-end;
}

.datatable-shell[data-datatable-shell="contracts"] .datatable-search {
	flex: 0 1 300px;
	max-width: 300px;
}

.datatable-shell[data-datatable-shell="contracts"] .datatable-column-filter .input {
	width: 96px;
}

.dashboard-hero {
	align-items: center;
	background: linear-gradient(135deg, color-mix(in oklab, var(--primary) 12%, var(--bg-card)), var(--bg-card));
	border: 1px solid var(--border);
	border-radius: 12px;
	box-shadow: var(--shadow-card);
	display: flex;
	gap: 12px;
	justify-content: space-between;
	margin-bottom: 12px;
	padding: 16px;
}

.dashboard-hero h1 {
	font-family: Inter Tight, Inter, sans-serif;
	font-size: 24px;
	font-weight: 750;
	line-height: 1.1;
	margin: 4px 0;
}

.dashboard-hero p {
	color: var(--t-muted);
	margin: 0;
}

.dashboard-hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: flex-end;
}

.dashboard-metrics,
.dashboard-analytics,
.dashboard-grid {
	display: grid;
	gap: 12px;
	margin-bottom: 12px;
}

.dashboard-metrics {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

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

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

.dashboard-metric {
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 12px;
	box-shadow: var(--shadow-card);
	color: var(--t-base);
	display: flex;
	flex-direction: column;
	gap: 7px;
	min-height: 112px;
	overflow: hidden;
	padding: 14px;
	position: relative;
	text-decoration: none;
}

.dashboard-metric::before {
	background: var(--metric-color, var(--primary));
	border-radius: 999px;
	content: "";
	height: 4px;
	left: 18px;
	position: absolute;
	right: 18px;
	top: 0;
}

.dashboard-metric--inventory {
	--metric-color: #22c55e;
}

.dashboard-metric--collection {
	--metric-color: #0ea5e9;
}

.dashboard-metric--month {
	--metric-color: #6366f1;
}

.dashboard-metric--commission {
	--metric-color: #f59e0b;
}

.dashboard-metric:hover {
	background: var(--bg-hover);
	border-color: var(--t-light);
	text-decoration: none;
}

.dashboard-metric span {
	color: var(--t-muted);
	font-size: 11.5px;
	font-weight: 750;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.dashboard-metric strong {
	display: block;
	font-size: 20px;
	line-height: 1.15;
	overflow-wrap: anywhere;
}

.dashboard-metric small {
	color: var(--t-muted);
	font-size: 12.5px;
	line-height: 1.35;
	margin-top: auto;
}

.dashboard-panel {
	min-width: 0;
}

.dashboard-panel--wide {
	grid-column: span 2;
}

.dashboard-panel .card-head {
	align-items: flex-start;
	display: flex;
	gap: 10px;
	justify-content: space-between;
	margin-bottom: 10px;
}

.dashboard-panel .button-link {
	flex: 0 0 auto;
	padding: 9px 10px;
}

.collection-insights {
	display: grid;
	gap: 8px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-bottom: 10px;
}

.collection-insights div {
	background: var(--bg-hover);
	border: 1px solid var(--border-soft);
	border-radius: 10px;
	padding: 10px;
}

.collection-insights span {
	color: var(--t-muted);
	display: block;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
}

.collection-insights strong {
	display: block;
	font-size: 14px;
	line-height: 1.25;
	margin-top: 4px;
	overflow-wrap: anywhere;
}

.collection-latest {
	border-top: 1px solid var(--border);
	display: grid;
	gap: 8px;
	padding-top: 10px;
}

.collection-latest-row {
	align-items: center;
	display: grid;
	gap: 10px;
	grid-template-columns: minmax(0, 1fr) auto;
}

.collection-latest-row strong {
	display: block;
	font-size: 13px;
	line-height: 1.25;
}

.collection-latest-row span {
	color: var(--t-muted);
	display: block;
	font-size: 12px;
	margin-top: 2px;
}

.collection-latest-row em {
	color: var(--t-base);
	font-size: 12.5px;
	font-style: normal;
	font-weight: 700;
	white-space: nowrap;
}

.report-page > .page-actions {
	align-items: center;
	border-bottom: 1px solid var(--border-soft);
	margin-bottom: 16px;
	padding-bottom: 16px;
}

.collection-summary-grid {
	align-items: stretch;
	display: grid;
	gap: 12px;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
	margin: 0 0 18px;
}

.collection-summary-card {
	background: var(--bg-hover);
	border: 1px solid var(--border-soft);
	border-radius: 8px;
	display: grid;
	gap: 6px;
	min-height: 92px;
	padding: 14px;
}

.collection-summary-card--total {
	background: color-mix(in oklab, #0ea5e9 8%, var(--bg-hover));
	border-color: color-mix(in oklab, #0ea5e9 24%, var(--border-soft));
}

.collection-summary-card span {
	color: var(--t-muted);
	font-size: 11.5px;
	font-weight: 750;
	text-transform: uppercase;
}

.collection-summary-card strong {
	font-size: 20px;
	font-variant-numeric: tabular-nums;
	line-height: 1.1;
	overflow-wrap: anywhere;
}

.collection-summary-card em {
	color: var(--t-muted);
	font-size: 12.5px;
	font-style: normal;
	font-weight: 650;
}

.report-summary-grid {
	align-items: stretch;
	display: grid;
	gap: 12px;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
	margin: 0 0 18px;
}

.report-summary-card {
	background: var(--bg-hover);
	border: 1px solid var(--border-soft);
	border-radius: 8px;
	display: grid;
	gap: 6px;
	min-height: 92px;
	padding: 14px;
}

.report-summary-card--total {
	background: color-mix(in oklab, var(--primary) 8%, var(--bg-hover));
	border-color: color-mix(in oklab, var(--primary) 24%, var(--border-soft));
}

.report-summary-card span {
	color: var(--t-muted);
	font-size: 11.5px;
	font-weight: 750;
	text-transform: uppercase;
}

.report-summary-card strong {
	font-size: 20px;
	font-variant-numeric: tabular-nums;
	line-height: 1.1;
	overflow-wrap: anywhere;
}

.report-summary-card em {
	color: var(--t-muted);
	font-size: 12.5px;
	font-style: normal;
	font-weight: 650;
}

.report-results-head {
	align-items: end;
	border-bottom: 1px solid var(--border-soft);
	display: flex;
	justify-content: space-between;
	margin: 2px 0 12px;
	padding-bottom: 10px;
}

.report-results-head h2 {
	font-size: 15px;
	line-height: 1.2;
	margin: 0 0 3px;
}

.report-results-head p {
	color: var(--t-muted);
	font-size: 12.5px;
	margin: 0;
}

.collection-report-table th:nth-child(7),
.collection-report-table td.amount-cell {
	font-variant-numeric: tabular-nums;
	text-align: right;
	white-space: nowrap;
}

.collection-report-table tfoot th {
	background: var(--bg-hover);
	border-top: 1px solid var(--border);
	font-weight: 800;
}

.collection-report-table tfoot th:first-child {
	text-align: right;
}

.report-total-table .amount-cell {
	font-variant-numeric: tabular-nums;
	text-align: right;
	white-space: nowrap;
}

.datatable-shell .data-table thead th.amount-cell,
.datatable-shell .data-table tbody td.amount-cell,
.datatable-shell .data-table tfoot th.amount-cell,
.datatable-shell .data-table tfoot td.amount-cell {
	text-align: right;
}

.datatable-shell .data-table thead th.amount-cell.sortable {
	padding-left: 12px;
	padding-right: 32px;
}

.datatable-shell .data-table thead th.amount-cell.sortable .sort {
	margin-left: 4px;
}

.report-total-table tfoot th {
	background: var(--bg-hover);
	border-top: 1px solid var(--border);
	font-weight: 800;
}

.report-total-table tfoot th:first-child {
	text-align: right;
}

.status-mix,
.seller-release-list {
	display: grid;
	gap: 10px;
}

.status-row,
.seller-release-row {
	display: grid;
	gap: 8px;
	grid-template-columns: minmax(0, 1fr) auto;
}

.status-row strong,
.seller-release-row strong {
	display: block;
	font-size: 13px;
	line-height: 1.25;
}

.status-row span,
.seller-release-row span {
	color: var(--t-muted);
	display: block;
	font-size: 12px;
	margin-top: 2px;
}

.status-row em,
.seller-release-row em {
	color: var(--t-muted);
	font-size: 12px;
	font-style: normal;
	font-weight: 700;
	white-space: nowrap;
}

.status-progress,
.seller-release-progress {
	background: var(--bg-hover);
	border-radius: 999px;
	grid-column: 1 / -1;
	height: 8px;
	overflow: hidden;
}

.status-progress span,
.seller-release-progress span {
	background: linear-gradient(90deg, #22c55e, #0ea5e9);
	border-radius: inherit;
	display: block;
	height: 100%;
	min-width: 4px;
	width: var(--progress-width, 0%);
}

.seller-release-progress span {
	background: linear-gradient(90deg, #f59e0b, #ef4444);
}

.dashboard-table-wrap {
	overflow-x: auto;
}

.dashboard-table {
	border-collapse: collapse;
	width: 100%;
}

.dashboard-table th {
	border-bottom: 1px solid var(--border);
	color: var(--t-muted);
	font-size: 11px;
	font-weight: 700;
	padding: 8px 6px;
	text-align: left;
	text-transform: uppercase;
	white-space: nowrap;
}

.dashboard-table td {
	border-bottom: 1px solid var(--border-soft);
	color: var(--t-base);
	font-size: 13px;
	padding: 9px 6px;
	vertical-align: top;
}

.dashboard-table tr:last-child td {
	border-bottom: 0;
}

.dashboard-table td strong,
.dashboard-table td span {
	display: block;
}

.dashboard-table td span {
	color: var(--t-muted);
	font-size: 12px;
	margin-top: 3px;
}

.dashboard-table .text-right {
	text-align: right;
}

.dashboard-table .empty-cell {
	color: var(--t-muted);
	padding: 22px 8px;
	text-align: center;
}

.info-item {
	background: var(--bg-hover);
	border: 1px solid var(--border-soft);
	border-radius: 10px;
	min-height: 86px;
	padding: 14px;
}

.info-item span {
	color: var(--t-muted);
	display: block;
	font-size: 12px;
	font-weight: 700;
	margin-bottom: 8px;
}

.info-item strong {
	display: block;
	font-size: 18px;
	line-height: 1.25;
	overflow-wrap: anywhere;
}

.modal-backdrop {
	align-items: center;
	background: rgba(15, 23, 42, .52);
	display: none;
	inset: 0;
	justify-content: center;
	padding: 24px;
	position: fixed;
	z-index: 50;
}

.modal-backdrop.is-open {
	display: flex;
}

.delete-modal {
	max-width: 420px;
	width: min(420px, 100%);
}

.modal-head h2 {
	font-family: Inter Tight, Inter, sans-serif;
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -.02em;
	line-height: 1.2;
	margin: 0;
}

.delete-modal-text {
	color: var(--t-muted);
	line-height: 1.6;
	margin: 12px 0 0;
}

.modal-actions {
	align-items: center;
	display: flex;
	gap: 10px;
	justify-content: flex-end;
	margin-top: 20px;
}

.nav-section {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	gap: 2px;
	min-height: 0;
	overflow-x: hidden;
	overflow-y: auto;
	padding-right: 2px;
	scrollbar-gutter: stable;
}

.nav-label {
	padding-left: 6px;
}

.nav-link {
	align-items: center;
	border: 1px solid transparent;
	border-radius: 12px;
	color: var(--t-muted);
	display: flex;
	font-size: 13px;
	font-weight: 500;
	gap: 0;
	line-height: 1.2;
	padding: 8px 12px;
	width: 100%;
	text-align: left;
}

.nav-link:hover {
	background: var(--bg-hover);
	color: var(--t-base);
}

.nav-link.is-active,
.nav-item-group.is-open .nav-link {
	background: transparent;
	border-color: var(--border);
	box-shadow: inset 0 0 0 1px var(--border), inset 3px 0 0 var(--primary);
	color: var(--t-base);
}

.nav-icon {
	align-items: center;
	color: var(--t-muted);
	height: 18px;
	display: inline-flex;
	font-size: 14px;
	font-weight: 400;
	justify-content: center;
	flex: 0 0 auto;
	margin-right: 10px;
	width: 18px;
}

.nav-icon i {
	line-height: 1;
}

.nav-link-main {
	align-items: center;
	display: flex;
	flex: 1 1 auto;
	min-width: 0;
}

.nav-text {
	flex: 1 1 auto;
	min-width: 0;
}

.nav-item-group {
	position: relative;
}

.nav-item-group .nav-link .chev {
	flex: 0 0 auto;
	margin-left: auto;
	opacity: .8;
	transition: transform .2s ease, opacity .2s ease;
	width: 14px;
	height: 14px;
}

.nav-item-group.is-open .nav-link .chev {
	opacity: 1;
	transform: rotate(90deg);
}

.nav-item-group .nav-link .chev path {
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2;
}

.nav-submenu {
	margin: 4px 0 0 18px;
	max-height: 0;
	overflow: hidden;
	padding-left: 12px;
	position: relative;
	transition: max-height .28s cubic-bezier(.4, 0, .2, 1);
}

.nav-submenu:before {
	background: var(--border);
	bottom: 8px;
	content: "";
	left: 0;
	position: absolute;
	top: 8px;
	width: 1px;
}

.nav-item-group.is-open .nav-submenu {
	max-height: 420px;
	padding-bottom: 6px;
	padding-top: 2px;
}

.nav-submenu a {
	align-items: center;
	border-radius: 10px;
	color: var(--t-muted);
	display: flex;
	font-size: 12.5px;
	padding: 5px 10px;
	width: 100%;
}

.nav-submenu a:hover {
	background: var(--bg-hover);
	color: var(--t-base);
}

.nav-submenu a.is-active {
	background: transparent;
	box-shadow: inset 3px 0 0 var(--primary);
	color: var(--t-base);
}

.nav-submenu .nav-icon {
	height: 16px;
	width: 16px;
}

.sidebar-footer {
	border-top: 1px solid var(--border-soft);
	flex: 0 0 auto;
	margin-top: auto;
	padding-top: 16px;
}

.sidebar-actions {
	align-items: center;
	display: flex;
	gap: 10px;
	justify-content: space-between;
	margin-bottom: 12px;
}

.sidebar-actions .icon-btn,
.sidebar-actions .btn--ghost {
	flex: 1 1 0;
}

.sidebar-theme-btn {
	background: transparent;
	border: 1px solid var(--border);
	height: 34px;
	width: 34px;
}

.sidebar-logout-btn {
	justify-content: center;
	font-size: 12px;
	height: 34px;
	padding-left: 10px;
	padding-right: 10px;
}

.workspace {
	align-items: center;
	border-radius: 8px;
	display: flex;
	gap: 10px;
	padding: 6px 10px;
	transition: background-color .18s ease;
}

.workspace:hover {
	background: var(--bg-hover);
}

.workspace-avatar {
	background: linear-gradient(135deg, var(--primary), var(--purple));
	border-radius: 50%;
	color: #fff;
	display: grid;
	flex-shrink: 0;
	font-size: 12.5px;
	font-weight: 600;
	height: 32px;
	place-items: center;
	width: 32px;
}

.workspace-text {
	line-height: 1.2;
	min-width: 0;
}

.workspace-name {
	color: var(--t-base);
	font-size: 13px;
	font-weight: 600;
}

.workspace-role {
	color: var(--t-light);
	font-size: 11px;
}

.workspace-chev {
	color: var(--t-light);
	margin-left: auto;
}

.theme-icon {
	fill: none;
	height: 16px;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2;
	width: 16px;
}

.theme-icon-light {
	display: none;
}

html[data-theme="dark"] .theme-icon-dark {
	display: none;
}

html[data-theme="dark"] .theme-icon-light {
	display: block;
}

html[data-theme="light"] .theme-icon-dark {
	display: block;
}

html[data-theme="light"] .theme-icon-light {
	display: none;
}

.btn--ghost {
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 12px;
	box-shadow: none;
	color: var(--t-base);
	display: inline-flex;
	font-weight: 600;
	gap: 8px;
	padding: 12px 16px;
}

.btn--ghost:hover {
	background: var(--bg-hover);
	border-color: var(--t-light);
}

.btn--primary {
	background: #5ea0ff;
	border: 1px solid #5ea0ff;
	border-radius: 12px;
	box-shadow: none;
	color: #fff;
	display: inline-flex;
	font-weight: 600;
	gap: 8px;
	padding: 12px 16px;
}

.btn--primary:hover {
	background: #4b92ff;
	border-color: #4b92ff;
	color: #fff;
}

.btn--icon {
	align-items: center;
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 10px;
	color: var(--t-muted);
	display: inline-flex;
	height: 34px;
	justify-content: center;
	width: 34px;
}

.btn--icon:hover {
	background: var(--bg-hover);
	border-color: var(--t-light);
	color: var(--t-base);
}

.btn--icon svg {
	fill: none;
	height: 14px;
	stroke: currentColor;
	stroke-width: 2;
	width: 14px;
}

.drawer-toggle-fab {
	align-items: center;
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 12px;
	box-shadow: var(--shadow-card);
	color: var(--t-muted);
	display: none;
	height: 42px;
	justify-content: center;
	left: 16px;
	position: fixed;
	top: 16px;
	width: 42px;
	z-index: 40;
}

.drawer-toggle-fab:hover {
	background: var(--bg-hover);
	border-color: var(--t-light);
	color: var(--t-base);
}

.drawer-toggle-fab svg {
	fill: none;
	height: 18px;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2;
	width: 18px;
}

@media (max-width: 900px) {
	.contract-info-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.dashboard-metrics,
	.dashboard-analytics,
	.dashboard-grid,
	.status-summary-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.dashboard-panel--wide {
		grid-column: span 2;
	}
}

@media (max-width: 720px) {
	.shell {
		grid-template-columns: 1fr;
	}

	.d-sidebar {
		bottom: 0;
		left: 0;
		position: fixed;
		top: 0;
		transform: translateX(-102%);
		transition: transform .22s ease;
		width: 280px;
		z-index: 60;
	}

	.drawer-toggle-fab {
		display: inline-flex;
	}

	.drawer-backdrop {
		background: rgba(15, 23, 42, .42);
		inset: 0;
		display: none;
		position: fixed;
		z-index: 55;
	}

	body.has-drawer-open {
		overflow: hidden;
	}

	body.has-drawer-open .d-sidebar {
		transform: translateX(0);
	}

	body.has-drawer-open .drawer-backdrop {
		display: block;
	}

	.main {
		padding-top: 74px;
	}

	.page-actions,
	.row-actions {
		flex-direction: column;
	}

	.page-actions {
		align-items: stretch;
	}

	.dashboard-hero {
		align-items: stretch;
		flex-direction: column;
	}

	.dashboard-hero-actions {
		justify-content: flex-start;
	}

	.form-grid,
	.contract-info-grid,
	.dashboard-metrics,
	.dashboard-analytics,
	.dashboard-grid,
	.status-summary-grid {
		grid-template-columns: 1fr;
	}

	.dashboard-panel--wide {
		grid-column: span 1;
	}

	.collection-insights {
		grid-template-columns: 1fr;
	}

	.table-search {
		justify-content: stretch;
	}

	.table-search input {
		max-width: none;
		width: 100%;
	}

	.data-toolbar {
		align-items: stretch;
		flex-direction: column;
	}

	.datatable-shell {
		gap: 12px;
	}

	.datatable-scroll {
		border: 1px solid var(--border);
		border-radius: 12px;
		background: var(--bg-card);
	}

	.datatable-shell .data-table {
		min-width: 720px;
	}

	.datatable-shell .data-table thead th,
	.datatable-shell .data-table tbody td {
		padding: 10px 10px;
	}

	.datatable-shell .data-table thead th.sortable {
		padding-right: 24px;
	}

	.datatable-shell .data-table thead th.sortable .sort {
		margin-left: 4px;
	}

	.data-toolbar-right {
		justify-content: flex-start;
	}

	.datatable-shell[data-datatable-shell="contracts"] .data-toolbar,
	.datatable-shell[data-datatable-shell="contracts"] .data-toolbar-left,
	.datatable-shell[data-datatable-shell="contracts"] .data-toolbar-right {
		align-items: stretch;
		width: 100%;
	}

	.datatable-shell[data-datatable-shell="contracts"] .datatable-search {
		flex: 1 1 100%;
		max-width: none;
	}

	.datatable-shell[data-datatable-shell="contracts"] .datatable-column-filters {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		width: 100%;
	}

	.datatable-shell[data-datatable-shell="contracts"] .datatable-column-filter,
	.datatable-shell[data-datatable-shell="contracts"] .datatable-column-filter .input {
		width: 100%;
	}

	.report-filter-actions {
		justify-content: flex-start;
		min-width: 0;
		width: 100%;
	}

	.report-results-head {
		align-items: flex-start;
		flex-direction: column;
		gap: 4px;
	}

	.datatable-shell[data-datatable-shell^="reports_"] .data-toolbar {
		grid-template-columns: 1fr;
	}

	.datatable-shell[data-datatable-shell^="reports_"] .data-toolbar-left,
	.datatable-shell[data-datatable-shell^="reports_"] .data-toolbar-right {
		align-items: stretch;
		width: 100%;
	}

	.datatable-shell[data-datatable-shell^="reports_"] .datatable-search {
		flex: 1 1 100%;
		max-width: none;
		min-width: 0;
	}

	.datatable-shell[data-datatable-shell^="reports_"] .datatable-column-filters {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		width: 100%;
	}

	.datatable-shell[data-datatable-shell^="reports_"] .datatable-column-filter,
	.datatable-shell[data-datatable-shell^="reports_"] .datatable-column-filter .input {
		width: 100%;
	}

	body.has-drawer-open .d-sidebar {
		transform: translateX(0);
	}
}

@media (max-width: 480px) {
	.report-filters .filter-range {
		grid-column: span 1;
	}
}

/* Critical app shell overrides. Keep these last so cached/legacy theme CSS cannot win on first paint. */
html[data-theme="light"] body,
html[data-theme="dark"] body {
	background: var(--bg-body) !important;
	color: var(--t-base) !important;
	font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
	margin: 0 !important;
}

body .shell {
	background: var(--bg-body) !important;
	display: grid !important;
	grid-template-columns: 292px minmax(0, 1fr) !important;
	min-height: 100vh !important;
}

body .main {
	display: flex !important;
	flex-direction: column !important;
	min-width: 0 !important;
}

body .content {
	padding: 28px 30px 20px !important;
	width: 100% !important;
}

body .d-sidebar {
	background: var(--bg-sidebar) !important;
	border-right: 1px solid var(--border-soft) !important;
	box-shadow: none !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 18px !important;
	height: 100vh !important;
	max-height: 100vh !important;
	min-height: 100vh !important;
	overflow: hidden !important;
	padding: 22px 16px 18px !important;
	position: sticky !important;
	top: 0 !important;
}

body .panel,
body .modal-panel,
body .card-surface,
body .dashboard-panel {
	background: var(--bg-card) !important;
	border: 1px solid var(--border) !important;
	border-radius: 14px !important;
	box-shadow: var(--shadow-card) !important;
}

body .button-link,
body .btn {
	align-items: center !important;
	border: 1px solid var(--border) !important;
	border-radius: 12px !important;
	display: inline-flex !important;
	font-size: 13px !important;
	font-weight: 650 !important;
	gap: 8px !important;
	justify-content: center !important;
	text-decoration: none !important;
}

body .button-link {
	background: var(--bg-card) !important;
	color: var(--t-base) !important;
	padding: 9px 12px !important;
}

body .button-link.secondary {
	background: var(--bg-card) !important;
	color: var(--t-muted) !important;
}

body .dashboard-hero {
	align-items: center !important;
	background: var(--bg-card) !important;
	border: 1px solid var(--border) !important;
	border-radius: 12px !important;
	box-shadow: var(--shadow-card) !important;
	display: flex !important;
	gap: 12px !important;
	justify-content: space-between !important;
	margin-bottom: 12px !important;
	padding: 16px !important;
}

body .dashboard-metrics,
body .dashboard-analytics,
body .dashboard-grid {
	display: grid !important;
	gap: 12px !important;
	margin-bottom: 12px !important;
}

body .dashboard-metrics {
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

body .dashboard-analytics,
body .dashboard-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body .dashboard-metric {
	background: var(--bg-card) !important;
	border: 1px solid var(--border) !important;
	border-radius: 12px !important;
	box-shadow: var(--shadow-card) !important;
	color: var(--t-base) !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 7px !important;
	min-height: 112px !important;
	overflow: hidden !important;
	padding: 14px !important;
	position: relative !important;
	text-decoration: none !important;
}

body .dashboard-metric::before {
	background: var(--metric-color, var(--primary)) !important;
	border-radius: 999px !important;
	content: "" !important;
	height: 4px !important;
	left: 18px !important;
	position: absolute !important;
	right: 18px !important;
	top: 0 !important;
}

@media (max-width: 1200px) {
	body .shell {
		grid-template-columns: 248px minmax(0, 1fr) !important;
	}

	body .dashboard-metrics,
	body .dashboard-analytics,
	body .dashboard-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 720px) {
	body .shell {
		display: block !important;
	}

	body .content {
		padding: 20px 16px 16px !important;
	}

	body .dashboard-metrics,
	body .dashboard-analytics,
	body .dashboard-grid {
		grid-template-columns: 1fr !important;
	}
}