/* Custom component styles - Tailwind utilities are loaded via CDN in the HTML head. */
@layer base {
	:root {
		--hardyman-primary: #013475;
		--hardyman-accent: #fec134;
	}

	body {
		font-family: 'Roboto', sans-serif;
		margin: 0;
		padding: 0;
	}
}

@layer components {
	.home-navbar-glass {
		background-color: transparent;
		border-bottom: 0;
		backdrop-filter: blur(0px);
		-webkit-backdrop-filter: blur(0px);
		transition: background-color 220ms ease, backdrop-filter 220ms ease, -webkit-backdrop-filter 220ms ease;
	}

	.home-navbar-glass.is-scrolled {
		background-color: rgba(1, 30, 73, 0.14);
		border-bottom: 0;
		backdrop-filter: blur(7px);
		-webkit-backdrop-filter: blur(7px);
	}

	.contact-cards-grid > article {
		position: relative;
		overflow: hidden;
		align-items: center;
		text-align: center;
		background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
		border-color: rgba(1, 52, 117, 0.16);
		transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease, background 240ms ease;
	}

	.contact-cards-grid > article::before {
		content: '';
		position: absolute;
		inset: 0;
		pointer-events: none;
		background: radial-gradient(150px 90px at 100% 0%, rgba(254, 193, 52, 0.14), rgba(254, 193, 52, 0));
		opacity: 0;
		transition: opacity 240ms ease;
	}

	.contact-cards-grid > article::after {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		height: 3px;
		width: 100%;
		background: linear-gradient(90deg, rgba(254, 193, 52, 0.9) 0%, rgba(1, 52, 117, 0.9) 100%);
		transform: scaleX(0.28);
		transform-origin: left;
		opacity: 0.6;
		transition: transform 240ms ease, opacity 240ms ease;
	}

	.contact-cards-grid > article:hover {
		transform: translateY(-6px);
		border-color: rgba(254, 193, 52, 0.62);
		box-shadow: 0 14px 30px rgba(1, 52, 117, 0.18), 0 0 0 1px rgba(254, 193, 52, 0.2);
	}

	.contact-cards-grid > article:hover::before {
		opacity: 1;
	}

	.contact-cards-grid > article:hover::after {
		transform: scaleX(1);
		opacity: 1;
	}

	.contact-cards-grid > article > div:first-child {
		margin-left: auto;
		margin-right: auto;
		background: rgba(254, 193, 52, 0.2);
		color: #013475;
		transition: transform 220ms ease, box-shadow 220ms ease, background-color 220ms ease;
	}

	.contact-cards-grid > article:hover > div:first-child {
		transform: translateY(-2px) scale(1.05);
		background: rgba(254, 193, 52, 0.28);
		box-shadow: 0 8px 16px rgba(1, 52, 117, 0.18);
	}

	.contact-cards-grid > article a {
		max-width: 100%;
	}

	.btn-radius-3 {
		border-radius: 3px !important;
	}

	.auth-card-premium {
		background: linear-gradient(180deg, #ffffff 0%, #f6faff 100%);
		border: 1px solid rgba(1, 52, 117, 0.1);
		box-shadow: 0 16px 36px rgba(1, 52, 117, 0.14), 0 2px 8px rgba(1, 52, 117, 0.08);
	}

	.auth-form-premium input[type='text'],
	.auth-form-premium input[type='email'],
	.auth-form-premium input[type='password'],
	.auth-form-premium input[type='tel'] {
		background: linear-gradient(180deg, #f8fbff 0%, #f1f7ff 100%);
		border: 1px solid rgba(1, 52, 117, 0.14);
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 2px rgba(1, 52, 117, 0.08);
		transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
	}

	.auth-form-premium input[type='text']:focus,
	.auth-form-premium input[type='email']:focus,
	.auth-form-premium input[type='password']:focus,
	.auth-form-premium input[type='tel']:focus {
		border-color: rgba(254, 193, 52, 0.9);
		box-shadow: 0 0 0 2px rgba(254, 193, 52, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.95);
	}

	.auth-submit-premium {
		background: linear-gradient(180deg, #01479f 0%, #013475 100%);
		box-shadow: 0 10px 20px rgba(1, 52, 117, 0.28);
	}

	.auth-submit-premium:hover:not(:disabled) {
		filter: brightness(1.04);
	}

	.payroll-badge {
		background: linear-gradient(90deg, #f3b62a 0%, #fec134 50%, #f3b62a 100%);
	}

	.ballpen-underline {
		position: relative;
		display: inline-block;
		padding-bottom: 1px;
	}

	.ballpen-underline::after {
		content: '';
		position: absolute;
		left: -1px;
		right: -1px;
		bottom: -1px;
		height: 4px;
		background:
			radial-gradient(circle at 9% 70%, rgba(254, 193, 52, 0.95) 0 1.2px, transparent 1.5px),
			linear-gradient(96deg, rgba(254, 193, 52, 0) 0%, rgba(254, 193, 52, 0.95) 9%, rgba(254, 193, 52, 0.82) 92%, rgba(254, 193, 52, 0) 100%);
		transform: rotate(-1.4deg);
		opacity: 0.9;
	}

	.sa-card {
		position: relative;
		overflow: hidden;
		border: 1px solid rgba(1, 52, 117, 0.16);
		border-radius: 6px;
		background: #ffffff;
		box-shadow: 0 1px 2px rgba(1, 52, 117, 0.1);
	}

	.payroll-shell {
		position: relative;
		padding: 12px 12px 24px;
		background: radial-gradient(140% 100% at 0% 0%, rgba(1, 52, 117, 0.06) 0%, rgba(1, 52, 117, 0) 55%),
			linear-gradient(180deg, rgba(248, 251, 255, 0.94) 0%, rgba(255, 255, 255, 1) 100%);
		border-radius: 16px;
	}

	.payroll-shell .sa-eyebrow {
		letter-spacing: 0.22em;
		font-weight: 700;
		text-transform: uppercase;
		color: rgba(1, 52, 117, 0.7);
	}

	.payroll-card {
		border-radius: 16px;
		border: 1px solid rgba(1, 52, 117, 0.12);
		background: linear-gradient(180deg, #ffffff 0%, #f9fbff 100%);
		box-shadow: 0 18px 32px rgba(1, 52, 117, 0.08), 0 3px 10px rgba(1, 52, 117, 0.06);
	}

	.payroll-hero {
		background: linear-gradient(120deg, rgba(1, 52, 117, 0.08) 0%, rgba(254, 193, 52, 0.08) 55%, rgba(255, 255, 255, 1) 100%);
		border: 1px solid rgba(1, 52, 117, 0.16);
	}

	.payroll-toolbar {
		border-top: 1px solid rgba(1, 52, 117, 0.08);
		border-bottom: 1px solid rgba(1, 52, 117, 0.08);
		background: rgba(1, 52, 117, 0.02);
	}

	.payroll-filter-stack .sa-control {
		background: #ffffff;
		border: 1px solid rgba(1, 52, 117, 0.16);
		box-shadow: 0 1px 2px rgba(1, 52, 117, 0.06);
	}

	.payroll-table thead {
		background: linear-gradient(90deg, #013475 0%, #02439a 55%, #013475 100%);
	}

	.payroll-table th,
	.payroll-summary-table th {
		text-transform: uppercase;
		letter-spacing: 0.08em;
		font-size: 11px;
	}

	.payroll-summary-table {
		border-radius: 12px;
		overflow: hidden;
	}

	.payroll-summary-table tbody tr:hover {
		background: rgba(1, 52, 117, 0.04);
	}

	.payroll-metric-card {
		position: relative;
		border-radius: 14px;
		background: linear-gradient(180deg, #ffffff 0%, #f5f9ff 100%);
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 10px 22px rgba(1, 52, 117, 0.08);
	}

	.payroll-summary .sa-eyebrow {
		color: rgba(1, 52, 117, 0.6);
	}

	.payroll-summary-table .sa-action-btn {
		border-radius: 10px;
		font-size: 11px;
		padding: 6px 10px;
	}

	.payroll-action-row {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		flex-wrap: nowrap;
		white-space: nowrap;
	}

	.payroll-action-row .sa-action-btn {
		min-width: 74px;
		padding: 6px 12px;
		border-radius: 999px;
	}

	.payroll-summary-table .sa-action-btn.bg-brand-blue {
		box-shadow: 0 8px 16px rgba(1, 52, 117, 0.18);
	}

	.payroll-summary-table .sa-action-btn.bg-white {
		background: #f6f8fb;
	}

	.payroll-summary-table td {
		padding-top: 10px;
		padding-bottom: 10px;
		vertical-align: middle;
	}

	.payroll-tabs {
		display: inline-flex;
		gap: 10px;
		padding: 6px;
		border-radius: 999px;
		background: rgba(1, 52, 117, 0.08);
	}

	.payroll-tab {
		border: 1px solid transparent;
		border-radius: 999px;
		padding: 6px 14px;
		font-size: 12px;
		font-weight: 700;
		color: rgba(1, 52, 117, 0.72);
		background: transparent;
		transition: all 0.2s ease;
	}

	.payroll-tab.is-active {
		color: #013475;
		background: #ffffff;
		border-color: rgba(1, 52, 117, 0.18);
		box-shadow: 0 8px 18px rgba(1, 52, 117, 0.12);
	}

	.payroll-tab-count {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 20px;
		height: 20px;
		margin-left: 6px;
		border-radius: 999px;
		background: rgba(254, 193, 52, 0.22);
		color: #7a4b00;
		font-size: 11px;
		font-weight: 700;
	}

	.payroll-summary-table th {
		padding-top: 10px;
		padding-bottom: 10px;
	}

	.payroll-summary-table .sa-cell-name,
	.payroll-summary-table td:first-child {
		line-height: 1.2;
	}

	.payroll-summary-table td:last-child {
		min-width: 220px;
	}

	.payroll-action-row {
		gap: 6px;
	}

	.payroll-action-row .sa-action-btn {
		min-width: 70px;
		padding: 6px 10px;
	}

	.sa-card::before {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		height: 3px;
		width: 100%;
		background: linear-gradient(90deg, rgba(254, 193, 52, 0.9) 0%, rgba(1, 52, 117, 0.42) 60%, rgba(1, 52, 117, 0) 100%);
	}

	.sa-action-btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border: 1px solid rgba(1, 52, 117, 0.22);
		border-radius: 6px;
		box-shadow: none;
		transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
	}

	.sa-action-btn.bg-brand-blue {
		border-color: rgba(184, 130, 7, 0.86);
		background: #013475;
	}

	.sa-action-btn.bg-white {
		border-color: rgba(1, 52, 117, 0.22);
	}

	.sa-action-btn.bg-white:hover {
		border-color: rgba(254, 193, 52, 0.9);
		background: rgba(254, 193, 52, 0.14);
	}

	.sa-action-btn:hover {
		transform: none;
		box-shadow: none;
	}

	.sa-action-btn:focus-visible {
		outline: none;
		box-shadow: 0 0 0 3px rgba(254, 193, 52, 0.35);
	}

	.sa-action-btn:active {
		transform: none;
		box-shadow: none;
	}

	.sa-profile-trigger {
		display: inline-flex;
		align-items: center;
		justify-content: flex-start;
		border: 1px solid rgba(1, 52, 117, 0.2);
		border-radius: 6px;
		background: #ffffff;
		box-shadow: none;
		transition: none;
	}

	.sa-profile-trigger:hover {
		background: #ffffff;
		border-color: rgba(1, 52, 117, 0.2);
	}

	.sa-profile-trigger:focus-visible {
		outline: 1px solid rgba(1, 52, 117, 0.28);
		box-shadow: none;
	}

	.sa-navbar-control {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border: 1px solid rgba(1, 52, 117, 0.24);
		border-radius: 6px;
		background: #ffffff;
		box-shadow: none;
		transition: none;
	}

	.sa-navbar-control:hover {
		background: #ffffff;
		border-color: rgba(1, 52, 117, 0.24);
	}

	.sa-navbar-control:focus-visible {
		outline: 1px solid rgba(1, 52, 117, 0.28);
		box-shadow: none;
	}

	.sa-stat-value {
		font-variant-numeric: tabular-nums;
	}

	.sa-page-shell {
		display: flex;
		flex-direction: column;
		gap: 1.5rem;
	}

	.sa-kpi-grid {
		display: grid;
		gap: 1rem;
	}

	@media (min-width: 640px) {
		.sa-kpi-grid {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
	}

	@media (min-width: 1280px) {
		.sa-kpi-grid {
			grid-template-columns: repeat(4, minmax(0, 1fr));
		}
	}

	.sa-section-head {
		display: flex;
		flex-direction: column;
		gap: 0.2rem;
		border-bottom: 1px solid rgba(1, 52, 117, 0.2);
		padding: 0.75rem 1rem;
	}

	@media (min-width: 640px) {
		.sa-section-head {
			padding-left: 1.25rem;
			padding-right: 1.25rem;
		}
	}

	.sa-eyebrow {
		font-size: 11px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.08em;
		color: #4b5563;
	}

	.sa-section-title {
		font-size: 1.125rem;
		font-weight: 700;
		line-height: 1.35;
		color: #013475;
	}

	.sa-section-head-row {
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: space-between;
		gap: 0.75rem;
	}

	.sa-subnav-compact {
		gap: 0.35rem;
	}

	.sa-subnav-compact .sa-subnav-link {
		padding: 0.3rem 0.6rem;
		font-size: 11px;
		border-radius: 6px;
	}

	.sa-toolbar {
		display: flex;
		flex-wrap: wrap;
		align-items: flex-end;
		justify-content: space-between;
		gap: 0.75rem;
		border-bottom: 1px solid rgba(1, 52, 117, 0.2);
		padding: 0.75rem 1rem;
	}

	@media (min-width: 640px) {
		.sa-toolbar {
			padding-left: 1.25rem;
			padding-right: 1.25rem;
		}
	}

	.sa-filter-stack {
		display: flex;
		flex-wrap: wrap;
		align-items: flex-end;
		gap: 0.5rem;
	}

	.sa-field-label {
		display: block;
		margin-bottom: 0.25rem;
		font-size: 11px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.08em;
		color: #4b5563;
	}

	.sa-control {
		width: 16rem;
		max-width: 100%;
		border-radius: 8px;
		border: 1px solid rgba(1, 52, 117, 0.3);
		background: #ffffff;
		padding: 0.5rem 0.75rem;
		font-size: 0.875rem;
		color: #374151;
		outline: none;
	}

	.sa-control:focus {
		border-color: #013475;
		box-shadow: 0 0 0 3px rgba(254, 193, 52, 0.25);
	}

	.sa-control.sa-control-full {
		width: 100%;
	}

	.sa-count-note {
		font-size: 0.75rem;
		font-weight: 600;
		color: #4b5563;
	}

	.sa-data-table {
		min-width: 100%;
		border-collapse: collapse;
		font-size: 0.875rem;
	}

	.sa-data-table th {
		padding: 0.75rem 1rem;
		text-align: left;
		font-weight: 600;
	}

	.sa-data-table td {
		padding: 0.75rem 1rem;
		vertical-align: middle;
		color: #374151;
	}

	.sa-data-table td.sa-data-strong {
		font-weight: 600;
		color: #013475;
	}

	.sa-payroll-table {
		width: 100%;
		min-width: 1280px;
		table-layout: auto;
	}

	.sa-payroll-table-masterlist {
		min-width: 1760px;
	}

	.sa-payroll-table-attendance {
		min-width: 1320px;
	}

	.sa-payroll-table-approval {
		min-width: 1540px;
	}

	.sa-payroll-table-processing {
		min-width: 1520px;
	}

	.sa-payroll-table th,
	.sa-payroll-table td {
		white-space: nowrap;
		line-height: 1.35;
	}

	.sa-payroll-table tbody tr:hover td {
		background: #f8fbff;
	}

	.sa-payroll-table .sa-cell-name {
		min-width: 11rem;
		white-space: normal;
		font-weight: 600;
		color: #0f2747;
	}

	.sa-payroll-table .sa-cell-email {
		min-width: 16rem;
		font-size: 0.82rem;
		color: #1f2937;
	}

	.sa-payroll-table .sa-cell-code {
		min-width: 8.25rem;
		font-variant-numeric: tabular-nums;
	}

	.sa-payroll-table .sa-cell-credentials {
		min-width: 18rem;
		white-space: normal;
		font-size: 0.81rem;
		line-height: 1.3;
		color: #1f2937;
	}

	.sa-payroll-table .sa-cell-action {
		min-width: 9.25rem;
	}

	.sa-payroll-table-processing thead .sa-processing-group-row th {
		background: rgba(255, 255, 255, 0.08);
		font-size: 0.67rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		padding-top: 0.45rem;
		padding-bottom: 0.45rem;
		border-bottom: 1px solid rgba(255, 255, 255, 0.25);
	}

	.sa-payroll-table-processing .sa-col-divider {
		border-left: 1px solid rgba(1, 52, 117, 0.2);
	}

	.sa-payroll-table-processing tbody td {
		font-size: 0.8rem;
	}

	.sa-payroll-table-processing tbody td[data-field='charge-summary'] {
		max-width: 12rem;
		white-space: normal;
		line-height: 1.25;
	}

	.sa-payroll-table .sa-cell-review {
		min-width: 6rem;
		width: 6rem;
	}

	.sa-credential-stack {
		display: flex;
		flex-direction: column;
		gap: 0.15rem;
		white-space: normal;
	}

	.sa-credential-meta {
		font-size: 0.73rem;
		font-weight: 600;
		color: #4b5563;
	}

	.sa-cell-amount {
		text-align: right;
		font-variant-numeric: tabular-nums;
	}

	.sa-workflow-strip {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 0.75rem;
		padding: 0.6rem 0.75rem;
		border: 1px solid rgba(1, 52, 117, 0.18);
		border-radius: 6px;
		background: #f8fbff;
	}

	.sa-workflow-status {
		display: inline-flex;
		align-items: center;
		gap: 0.5rem;
	}

	.sa-batch-pill {
		padding-left: 0.55rem;
		padding-right: 0.55rem;
	}

	.sa-workflow-steps {
		display: inline-flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 0.4rem;
	}

	.sa-workflow-step {
		display: inline-flex;
		align-items: center;
		border: 1px solid rgba(1, 52, 117, 0.2);
		border-radius: 9999px;
		padding: 0.18rem 0.55rem;
		font-size: 0.72rem;
		font-weight: 700;
		color: #4b5563;
		background: #ffffff;
	}

	.sa-workflow-step.is-current {
		border-color: rgba(1, 52, 117, 0.38);
		color: #013475;
		background: #eef5ff;
	}

	.sa-workflow-step.is-done {
		border-color: rgba(22, 163, 74, 0.35);
		color: #166534;
		background: #dcfce7;
	}

	.sa-user-table th,
	.sa-user-table td {
		padding-top: 0.85rem;
		padding-bottom: 0.85rem;
	}

	.sa-user-row {
		transition: background-color 0.2s ease;
	}

	.sa-user-row:hover {
		background-color: #f8fbff;
	}

	.sa-user-identity {
		display: flex;
		align-items: center;
		gap: 0.65rem;
		min-width: 15rem;
	}

	.sa-user-avatar {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		height: 2rem;
		width: 2rem;
		border-radius: 9999px;
		border: 1px solid rgba(1, 52, 117, 0.22);
		background: #eef5ff;
		font-size: 0.75rem;
		font-weight: 700;
		color: #013475;
		letter-spacing: 0.04em;
	}

	.sa-user-name {
		margin: 0;
		font-size: 0.875rem;
		font-weight: 700;
		color: #0f2747;
	}

	.sa-user-id {
		margin: 0.1rem 0 0;
		font-size: 0.75rem;
		font-weight: 600;
		letter-spacing: 0.02em;
		color: #5b6b80;
	}

	.sa-user-email {
		display: inline-block;
		font-size: 0.82rem;
		font-weight: 600;
		color: #1f2937;
	}

	.sa-role-pill {
		display: inline-flex;
		align-items: center;
		border-radius: 9999px;
		border: 1px solid rgba(1, 52, 117, 0.22);
		background: #f6f9ff;
		padding: 0.2rem 0.65rem;
		font-size: 0.75rem;
		font-weight: 700;
		color: #013475;
	}

	.sa-security-note {
		font-size: 0.69rem;
		font-weight: 700;
		letter-spacing: 0.01em;
		color: #8a4a06;
	}

	.sa-last-login-primary {
		margin: 0;
		font-size: 0.8rem;
		font-weight: 700;
		color: #1f2937;
	}

	.sa-last-login-meta {
		margin: 0.1rem 0 0;
		font-size: 0.72rem;
		font-weight: 600;
		color: #6b7280;
	}

	.sa-user-actions {
		display: inline-flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		gap: 0.45rem;
	}

	.sa-user-actions-dual {
		justify-content: center;
	}

	.sa-user-actions-single {
		justify-content: center;
	}

	.sa-user-actions .sa-user-action-item,
	.sa-user-actions .sa-action-btn-sm {
		width: auto;
	}

	.sa-user-actions .sa-user-action-item .sa-action-btn-sm {
		width: auto;
	}

	.sa-action-btn-sm {
		min-width: 0;
		white-space: nowrap;
	}

	.sa-status-chip {
		width: fit-content !important;
		max-width: max-content;
		white-space: nowrap;
		padding-left: 0.7rem;
		padding-right: 0.7rem;
	}

	.sa-user-table .sa-user-actions .sa-action-btn-sm {
		width: auto !important;
		max-width: max-content;
		padding-left: 0.8rem;
		padding-right: 0.8rem;
	}

	.sa-action-btn-danger {
		border-color: rgba(185, 28, 28, 0.3) !important;
		color: #b91c1c !important;
		background: #fff7f7 !important;
	}

	.sa-action-btn-danger:hover {
		border-color: rgba(185, 28, 28, 0.56) !important;
		background: #feecec !important;
	}

	.sa-action-btn-neutral {
		border-color: rgba(1, 52, 117, 0.24) !important;
		background: #f5f9ff !important;
		color: #013475 !important;
	}

	.sa-action-btn-neutral:hover {
		border-color: rgba(1, 52, 117, 0.45) !important;
		background: #eaf3ff !important;
	}

	.sa-table-empty {
		border-top: 1px solid rgba(1, 52, 117, 0.2);
		background: #f8fbff;
		padding: 0.75rem 1rem;
		font-size: 0.875rem;
		color: #4b5563;
	}

	.sa-approval-modal {
		max-width: 44rem;
		overflow: hidden;
		padding: 0;
	}

	.sa-approval-modal-header {
		border-bottom: 1px solid rgba(1, 52, 117, 0.18);
		padding: 1rem 1.25rem 0.9rem;
		background: #ffffff;
	}

	.sa-approval-modal-title {
		margin-top: 0.2rem;
		font-size: 1.06rem;
		font-weight: 700;
		line-height: 1.35;
		color: #013475;
	}

	.sa-approval-modal-subtitle {
		margin-top: 0.3rem;
		font-size: 0.81rem;
		line-height: 1.45;
		color: #4b5563;
	}

	.sa-approval-modal-body {
		padding: 1rem 1.25rem;
		background: #ffffff;
	}

	.sa-approval-modal-list {
		display: grid;
		gap: 0.6rem;
	}

	.sa-approval-modal-row {
		display: grid;
		grid-template-columns: 8.25rem minmax(0, 1fr);
		gap: 0.75rem;
		align-items: center;
		border: 1px solid rgba(1, 52, 117, 0.16);
		border-radius: 6px;
		padding: 0.62rem 0.72rem;
		background: #f8fbff;
	}

	.sa-approval-modal-row dt {
		margin: 0;
		font-size: 0.76rem;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.06em;
		color: #4b5563;
	}

	.sa-approval-modal-row dd {
		margin: 0;
		font-size: 0.9rem;
		font-weight: 600;
		line-height: 1.45;
		color: #013475;
		word-break: break-word;
	}

	.sa-approval-modal-row-reason {
		align-items: flex-start;
	}

	.sa-approval-modal-footer {
		display: flex;
		justify-content: flex-end;
		gap: 0.5rem;
		border-top: 1px solid rgba(1, 52, 117, 0.18);
		padding: 0.85rem 1.25rem;
		background: #ffffff;
	}

	@media (max-width: 640px) {
		.sa-approval-modal-row {
			grid-template-columns: 1fr;
			gap: 0.25rem;
		}
	}

	@media (min-width: 640px) {
		.sa-table-empty {
			padding-left: 1.25rem;
			padding-right: 1.25rem;
		}
	}

	.sa-badge {
		display: inline-flex;
		align-items: center;
		border-radius: 9999px;
		border: 1px solid rgba(1, 52, 117, 0.25);
		padding: 0.125rem 0.5rem;
		font-size: 0.75rem;
		font-weight: 600;
	}

	.sa-side-actions {
		display: grid;
		gap: 0.75rem;
	}

	.sa-side-actions .sa-action-btn {
		width: 100%;
		justify-content: flex-start;
		padding-left: 1rem;
		padding-right: 1rem;
		padding-top: 0.5rem;
		padding-bottom: 0.5rem;
	}

	.sa-subnav {
		display: flex;
		flex-wrap: wrap;
		gap: 0.5rem;
	}

	.sa-subnav-link {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border: 1px solid rgba(1, 52, 117, 0.24);
		border-radius: 8px;
		background: #ffffff;
		padding: 0.45rem 0.8rem;
		font-size: 12px;
		font-weight: 700;
		letter-spacing: 0.03em;
		color: #013475;
		transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
	}

	.sa-subnav-link:hover {
		border-color: rgba(254, 193, 52, 0.9);
		background: rgba(254, 193, 52, 0.12);
	}

	.sa-subnav-link.is-active {
		border-color: #013475;
		background: #013475;
		color: #ffffff;
	}

	.sa-nav-link {
		position: relative;
		display: flex;
		align-items: center;
		gap: 0.75rem;
		padding: 0.65rem 0.75rem;
		border: 1px solid transparent;
		border-radius: 6px;
		font-size: 0.875rem;
		font-weight: 600;
		line-height: 1.25rem;
		transition: box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
	}

	.sa-nav-link:hover {
		box-shadow: none;
	}

	.sa-nav-link:focus-visible {
		outline: none;
		border-color: rgba(1, 52, 117, 0.45);
		box-shadow: 0 0 0 3px rgba(254, 193, 52, 0.32);
	}

	.sa-nav-link.is-active {
		box-shadow: none;
	}

	.sa-nav-link.is-active .sa-nav-icon {
		color: #8a6305;
	}

	.sa-nav-icon {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		flex-shrink: 0;
	}

	.sa-nav-icon svg {
		display: block;
		height: 20px;
		width: 20px;
	}

	.sa-brand-logo {
		height: 54px;
		width: 54px;
		object-fit: cover;
	}

	.sa-sidebar-tooltip {
		pointer-events: none;
		position: absolute;
		left: calc(100% + 8px);
		top: 50%;
		transform: translate(-6px, -50%);
		opacity: 0;
		white-space: nowrap;
		border-radius: 6px;
		border: 1px solid #013475;
		background-color: #013475;
		padding: 0.35rem 0.6rem;
		font-size: 11px;
		font-weight: 600;
		color: #ffffff;
		transition: opacity 0.15s ease, transform 0.15s ease;
	}

	.sa-theme-premium {
		--sa-white: #ffffff;
		--sa-black: #111827;
		--sa-deep-blue: #013475;
		--sa-yellow: #fec134;
		--sa-glass-card: #ffffff;
		--sa-glass-border: rgba(1, 52, 117, 0.12);
		--sa-glass-sidebar: rgba(1, 20, 50, 0.98);
		--sa-glass-header: rgba(255, 255, 255, 0.98);
		background:
			radial-gradient(900px 420px at 12% -8%, rgba(1, 52, 117, 0.08), transparent 62%),
			radial-gradient(700px 360px at 92% 0%, rgba(254, 193, 52, 0.08), transparent 58%),
			linear-gradient(180deg, #f6f9ff 0%, #eef3f9 100%) !important;
		color: #1e293b !important;
	}

	/* Force glass sidebar/header over any conflicting Tailwind utilities */
	.sa-theme-premium #sa-sidebar,
	.sa-theme-premium #sa-mobile-sidebar {
		background: var(--sa-glass-sidebar) !important;
	}

	.sa-theme-premium #sa-main-wrapper > header {
		background: var(--sa-glass-header) !important;
	}

	.sa-theme-premium .sa-card {
		background: var(--sa-glass-card) !important;
	}

	.sa-theme-premium .border-2 {
		border-width: 1px;
	}

	/* Surface cards */
	.sa-theme-premium .sa-card {
		background: var(--sa-glass-card);
		border: 1px solid var(--sa-glass-border);
		box-shadow: 0 2px 10px rgba(1, 52, 117, 0.08), 0 10px 24px rgba(1, 52, 117, 0.06);
		border-radius: 14px;
	}

	.sa-theme-premium .sa-card::before {
		height: 2px;
		border-radius: 14px 14px 0 0;
		background: linear-gradient(90deg, var(--sa-yellow) 0%, rgba(1, 52, 117, 0.35) 100%);
	}

	/* Sidebar */
	.sa-theme-premium #sa-sidebar,
	.sa-theme-premium #sa-mobile-sidebar {
		background: var(--sa-glass-sidebar);
		border-right: 1px solid rgba(254, 193, 52, 0.12);
		box-shadow: 4px 0 24px rgba(0, 0, 0, 0.25);
	}

	.sa-theme-premium .sa-brand-accent {
		background: linear-gradient(90deg, var(--sa-yellow) 0%, rgba(254, 193, 52, 0.12) 100%);
		opacity: 0.7;
	}

	/* Header */
	.sa-theme-premium #sa-main-wrapper > header {
		background: var(--sa-glass-header);
		border-bottom: 1px solid rgba(1, 52, 117, 0.1);
		box-shadow: 0 1px 6px rgba(1, 52, 117, 0.06);
	}

	/* Table head */
	.sa-theme-premium thead.bg-brand-blue,
	.sa-theme-premium .sa-dashboard-table-head {
		background: #013475;
		box-shadow: inset 0 -2px 0 rgba(254, 193, 52, 0.7);
	}

	/* Text overrides for light background */
	.sa-theme-premium .text-brand-blue {
		color: #013475 !important;
	}

	.sa-theme-premium .text-gray-800 {
		color: #1f2937 !important;
	}

	.sa-theme-premium .text-gray-700 {
		color: #374151 !important;
	}

	.sa-theme-premium .text-gray-600 {
		color: #4b5563 !important;
	}

	.sa-theme-premium .text-gray-500 {
		color: #6b7280 !important;
	}

	/* Table row backgrounds on light */
	.sa-theme-premium .bg-white {
		background: #ffffff !important;
	}

	.sa-theme-premium .bg-gray-50 {
		background: #f9fafb !important;
	}

	.sa-theme-premium .bg-gray-100 {
		background: #f3f4f6 !important;
	}

	.sa-theme-premium table td,
	.sa-theme-premium table th {
		color: #374151;
		border-color: rgba(1, 52, 117, 0.08);
		vertical-align: middle;
	}

	/* Always white text on dark blue table headers */
	.sa-theme-premium thead.bg-brand-blue th,
	.sa-theme-premium thead[class*='bg-brand-blue'] th {
		color: #ffffff !important;
	}

	.sa-theme-premium .sa-data-table td.sa-data-strong,
	.sa-theme-premium .sa-user-name {
		color: #013475 !important;
	}

	.sa-theme-premium .sa-user-id,
	.sa-theme-premium .sa-last-login-meta,
	.sa-theme-premium .sa-credential-meta {
		color: #6b7280 !important;
	}

	.sa-theme-premium .sa-user-email,
	.sa-theme-premium .sa-last-login-primary {
		color: #1f2937 !important;
	}

	.sa-theme-premium .sa-user-avatar {
		background: #eef5ff;
		border-color: rgba(1, 52, 117, 0.25);
		color: #013475;
	}

	.sa-theme-premium .sa-role-pill {
		background: #f0f6ff;
		border-color: rgba(1, 52, 117, 0.22);
		color: #013475;
	}

	/* Nav links */
	.sa-theme-premium .sa-nav-link {
		min-height: 42px;
		align-items: center;
		color: rgba(255, 255, 255, 0.72);
	}

	.sa-theme-premium .sa-nav-link:hover {
		background: rgba(255, 255, 255, 0.08);
		color: rgba(255, 255, 255, 0.96);
	}

	.sa-theme-premium .sa-nav-link.is-active {
		background: rgba(254, 193, 52, 0.18);
		border-color: rgba(254, 193, 52, 0.45);
		color: #fec134 !important;
		box-shadow: inset 0 1px 0 rgba(254, 193, 52, 0.18);
	}

	.sa-theme-premium .sa-nav-link.is-active .sa-nav-label {
		color: #fec134 !important;
	}

	.sa-theme-premium .sa-nav-link.is-active .sa-nav-icon {
		color: #fec134 !important;
	}

	/* Sidebar tooltip */
	.sa-theme-premium .sa-sidebar-tooltip {
		background: rgba(254, 193, 52, 0.95);
		border-color: rgba(254, 193, 52, 0.6);
		color: #011530;
	}

	/* Buttons */
	.sa-theme-premium .sa-action-btn.bg-brand-blue {
		background: linear-gradient(135deg, #01479f 0%, #013475 100%);
		border-color: rgba(254, 193, 52, 0.38);
		color: #ffffff;
		box-shadow: 0 6px 16px rgba(1, 52, 117, 0.25);
	}

	.sa-theme-premium .sa-action-btn.bg-brand-blue:hover {
		background: linear-gradient(135deg, #0155bb 0%, #01479f 100%);
		box-shadow: 0 10px 22px rgba(1, 52, 117, 0.32);
	}

	.sa-theme-premium .sa-action-btn.bg-white {
		background: #ffffff;
		border-color: rgba(1, 52, 117, 0.22);
		color: #013475;
	}

	.sa-theme-premium .sa-action-btn.bg-white:hover {
		background: #f0f5ff;
		border-color: rgba(1, 52, 117, 0.45);
		color: #013475;
	}

	/* Subnav links */
	.sa-theme-premium .sa-subnav-link {
		background: #ffffff;
		border-color: rgba(1, 52, 117, 0.2);
		color: #013475;
	}

	.sa-theme-premium .sa-subnav-link:hover {
		background: #f0f5ff;
		border-color: rgba(1, 52, 117, 0.4);
		color: #013475;
	}

	.sa-theme-premium .sa-subnav-link.is-active {
		background: #013475;
		border-color: #013475;
		color: #ffffff;
	}

	/* Form inputs */
	.sa-theme-premium input,
	.sa-theme-premium select,
	.sa-theme-premium textarea {
		background: #ffffff;
		border: 1px solid rgba(1, 52, 117, 0.2) !important;
		color: #1f2937;
		line-height: 1.35;
	}

	.sa-theme-premium input::placeholder,
	.sa-theme-premium textarea::placeholder {
		color: #9ca3af;
	}

	.sa-theme-premium input:focus,
	.sa-theme-premium select:focus,
	.sa-theme-premium textarea:focus {
		background: #ffffff;
		border-color: #013475 !important;
		box-shadow: 0 0 0 3px rgba(1, 52, 117, 0.12);
		outline: none;
	}

	.sa-theme-premium .sa-control {
		color: #374151;
	}

	.sa-theme-premium select option {
		background: #ffffff;
		color: #1f2937;
	}

	/* Notification dropdown */
	.sa-theme-premium [data-sa-notification-menu] {
		background: #ffffff;
		border: 1px solid rgba(1, 52, 117, 0.14);
		box-shadow: 0 16px 40px rgba(1, 52, 117, 0.14);
	}

	.sa-theme-premium [data-sa-notification-menu] p {
		color: #1f2937;
	}

	/* Badges */
	.sa-theme-premium .sa-badge {
		background: #f0f5ff;
		border-color: rgba(1, 52, 117, 0.2);
		color: #013475;
	}

	/* Semantic status badge overrides for light */
	.sa-theme-premium .bg-red-100 {
		background: #fee2e2 !important;
	}
	.sa-theme-premium .text-red-700 {
		color: #b91c1c !important;
	}
	.sa-theme-premium .bg-green-100 {
		background: #dcfce7 !important;
	}
	.sa-theme-premium .text-green-700 {
		color: #15803d !important;
	}
	.sa-theme-premium .bg-yellow-100 {
		background: #fef9c3 !important;
	}
	.sa-theme-premium .text-yellow-700 {
		color: #a16207 !important;
	}
	.sa-theme-premium .bg-slate-100 {
		background: #f1f5f9 !important;
	}
	.sa-theme-premium .text-slate-700 {
		color: #334155 !important;
	}

	/* Table row border on light */
	.sa-theme-premium tr.border-b {
		border-color: rgba(1, 52, 117, 0.08);
	}

	/* Additional gray text overrides */
	.sa-theme-premium .text-gray-500 {
		color: #6b7280 !important;
	}
	.sa-theme-premium .text-gray-400 {
		color: #9ca3af !important;
	}
	.sa-theme-premium .text-gray-900 {
		color: #111827 !important;
	}
	.sa-theme-premium .text-gray-800 {
		color: #1f2937 !important;
	}

	/* Ensure bg-gray-50 table rows are light */
	.sa-theme-premium .bg-gray-50 {
		background: #f9fafb !important;
	}

	/* Border overrides */
	.sa-theme-premium .border-brand-blue\/20,
	.sa-theme-premium .border-brand-blue\/30 {
		border-color: rgba(1, 52, 117, 0.2) !important;
	}

	/* Section head texts */
	.sa-theme-premium .sa-eyebrow {
		color: #6b7280;
	}

	.sa-theme-premium .sa-section-title {
		color: #013475;
	}

	/* KPI value accent */
	.sa-theme-premium .sa-dashboard-kpi-value {
		color: #013475;
	}

	.sa-theme-premium .sa-dashboard-kpi-value.is-warm {
		color: #dc2626;
	}

	/* Hover rows */
	.sa-theme-premium .sa-user-row:hover,
	.sa-theme-premium .sa-payroll-table tbody tr:hover td {
		background: #eef5ff !important;
	}

	/* Action buttons danger/neutral on light */
	.sa-theme-premium .sa-action-btn-danger {
		background: #fee2e2 !important;
		border-color: rgba(239, 68, 68, 0.4) !important;
		color: #b91c1c !important;
	}

	.sa-theme-premium .sa-action-btn-danger:hover {
		background: #fecaca !important;
		border-color: rgba(239, 68, 68, 0.6) !important;
	}

	.sa-theme-premium .sa-action-btn-neutral {
		background: #f1f5f9 !important;
		border-color: rgba(1, 52, 117, 0.2) !important;
		color: #374151 !important;
	}

	.sa-theme-premium .sa-action-btn-neutral:hover {
		background: #e2e8f0 !important;
		border-color: rgba(1, 52, 117, 0.4) !important;
		color: #013475 !important;
	}

	/* Modal glass */
	.sa-theme-premium .sa-approval-modal-header,
	.sa-theme-premium .sa-approval-modal-body,
	.sa-theme-premium .sa-approval-modal-footer {
		background: #ffffff;
		border-color: rgba(1, 52, 117, 0.1);
	}

	.sa-theme-premium .sa-approval-modal-title {
		color: #013475;
	}

	.sa-theme-premium .sa-approval-modal-subtitle,
	.sa-theme-premium .sa-approval-modal-row dt {
		color: #6b7280;
	}

	.sa-theme-premium .sa-approval-modal-row {
		background: #f8fbff;
		border-color: rgba(1, 52, 117, 0.1);
	}

	.sa-theme-premium .sa-approval-modal-row dd {
		color: #013475;
	}

	/* Toast */
	.sa-toast {
		pointer-events: auto;
		background: rgba(1, 18, 46, 0.95);
		backdrop-filter: blur(16px);
		border: 1px solid rgba(255, 255, 255, 0.1);
		border-left: 3px solid #fec134;
		border-radius: 10px;
		padding: 0.75rem 1rem;
		font-size: 0.875rem;
		font-weight: 500;
		color: rgba(255, 255, 255, 0.9);
		box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
	}

	.sa-toast-success {
		border-left-color: #4ade80;
		border-color: rgba(74, 222, 128, 0.25);
		color: rgba(255, 255, 255, 0.9);
	}

	/* Workflow strip */
	.sa-theme-premium .sa-workflow-strip {
		background: #f8fbff;
		border-color: rgba(1, 52, 117, 0.12);
	}

	.sa-theme-premium .sa-workflow-step {
		background: #ffffff;
		border-color: rgba(1, 52, 117, 0.18);
		color: #4b5563;
	}

	.sa-theme-premium .sa-workflow-step.is-current {
		background: #eef5ff;
		border-color: rgba(1, 52, 117, 0.38);
		color: #013475;
	}

	.sa-theme-premium .sa-workflow-step.is-done {
		background: #dcfce7;
		border-color: rgba(22, 163, 74, 0.35);
		color: #166534;
	}

	/* Table empty state */
	.sa-theme-premium .sa-table-empty {
		background: #f8fbff;
		border-color: rgba(1, 52, 117, 0.1);
		color: #6b7280;
	}

	/* Rounded override (keep subtle rounding) */
	.sa-theme-premium .rounded-lg,
	.sa-theme-premium .rounded-xl,
	.sa-theme-premium .rounded-2xl {
		border-radius: 10px !important;
	}

	.sa-theme-premium .rounded-full,
	.sa-theme-premium .sa-force-circle {
		border-radius: 9999px !important;
	}

	.sa-theme-premium label {
		color: #4b5563;
		line-height: 1.2;
	}

	/* Navbar control glass overrides */
	.sa-theme-premium .sa-navbar-control {
		background: #ffffff;
		border-color: rgba(1, 52, 117, 0.16);
		color: #374151;
		box-shadow: 0 1px 2px rgba(1, 52, 117, 0.08);
	}

	.sa-theme-premium .sa-navbar-control:hover {
		background: #f5f9ff;
		border-color: rgba(1, 52, 117, 0.32);
		color: #013475;
	}

	.sa-theme-premium .sa-navbar-control:focus-visible {
		outline: 1px solid rgba(1, 52, 117, 0.45);
		box-shadow: 0 0 0 2px rgba(1, 52, 117, 0.12);
	}

	/* Profile trigger glass override */
	.sa-theme-premium .sa-profile-trigger {
		background: #ffffff;
		border-color: rgba(1, 52, 117, 0.18);
	}

	.sa-theme-premium .sa-profile-trigger:hover {
		background: #f0f5ff;
		border-color: rgba(1, 52, 117, 0.4);
	}

	/* Profile menu glass */
	.sa-theme-premium .sa-profile-menu {
		background: rgba(255, 255, 255, 0.98);
		backdrop-filter: blur(20px);
		border: 1px solid rgba(1, 52, 117, 0.14);
		box-shadow: 0 16px 40px rgba(1, 52, 117, 0.14);
	}

	.sa-theme-premium .sa-profile-menu::before {
		display: none;
	}

	#sa-sidebar[data-collapsed='true'] .sa-brand-text,
	#sa-sidebar[data-collapsed='true'] .sa-nav-label {
		display: none;
	}

	#sa-sidebar[data-collapsed='true'] .sa-brand-row {
		justify-content: center;
		overflow: visible;
		width: 100%;
	}

	#sa-sidebar[data-collapsed='true'] .sa-brand-logo {
		height: 54px;
		width: 54px;
		display: block;
		margin: 0 auto;
	}

	#sa-sidebar[data-collapsed='true'] > div:first-child {
		margin-bottom: 0.75rem;
	}

	#sa-sidebar[data-collapsed='true'] .sa-brand-accent {
		display: none;
	}

	#sa-sidebar[data-collapsed='true'] {
		padding-left: 0.5rem;
		padding-right: 0.5rem;
	}

	#sa-sidebar[data-collapsed='true'] nav {
		gap: 0.625rem;
	}

	#sa-sidebar[data-collapsed='true'] .sa-nav-link {
		width: 56px;
		min-height: 56px;
		margin-left: auto;
		margin-right: auto;
		padding: 0;
		gap: 0;
		justify-content: center;
	}

	#sa-sidebar[data-collapsed='true'] .sa-nav-link:hover .sa-sidebar-tooltip {
		opacity: 1;
		transform: translate(0, -50%);
	}

	/* ─── Audit Log Table ─────────────────────────────────────────────── */

	.sa-audit-scroll-shell {
		border-radius: 8px;
	}

	.sa-audit-table {
		min-width: 100rem;
		border-collapse: collapse;
		font-size: 0.8rem;
		width: 100%;
	}

	.sa-audit-table th,
	.sa-audit-table td {
		padding: 0.65rem 0.85rem;
		text-align: left;
		vertical-align: middle;
		white-space: nowrap;
	}

	.sa-audit-table th {
		font-size: 0.72rem;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.05em;
	}

	.sa-audit-time {
		font-size: 0.75rem;
		font-variant-numeric: tabular-nums;
		white-space: nowrap;
		color: #4b5563;
	}

	.sa-audit-cell-wrap {
		max-width: 18rem;
		white-space: normal;
		line-height: 1.4;
	}

	.sa-audit-cell-wrap p:first-child {
		color: #1f2937 !important;
	}

	.sa-audit-scroll-note {
		padding: 0.55rem 0.85rem;
		font-size: 0.72rem;
		color: #9ca3af;
		text-align: right;
	}

	/* ─── Audit Value Collapse ────────────────────────────────────────── */

	.sa-audit-value-collapsed {
		max-width: 14rem;
	}

	.sa-audit-value-dropdown {
		font-size: 0.78rem;
	}

	.sa-audit-value-dropdown summary {
		display: flex;
		align-items: center;
		gap: 0.3rem;
		cursor: pointer;
		list-style: none;
		color: #374151;
	}

	.sa-audit-value-dropdown summary::-webkit-details-marker {
		display: none;
	}

	.sa-audit-value-summary {
		max-width: 12rem;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.sa-audit-value-caret {
		font-size: 0.65rem;
		color: #9ca3af;
		flex-shrink: 0;
	}

	.sa-audit-value-preview {
		padding: 0.4rem 0 0;
	}

	.sa-audit-value-open {
		display: inline-flex;
		align-items: center;
		padding: 0.2rem 0.55rem;
		border-radius: 5px;
		border: 1px solid rgba(1, 52, 117, 0.3);
		background: #eef5ff;
		font-size: 0.72rem;
		font-weight: 600;
		color: #013475;
		cursor: pointer;
		transition: background 0.15s ease;
	}

	.sa-audit-value-open:hover {
		background: #dbeafe;
	}

	.sa-audit-old,
	.sa-audit-new {
		display: block;
		max-width: 14rem;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		font-size: 0.78rem;
		color: #374151;
	}

	/* ─── Digital Footprint ───────────────────────────────────────────── */

	.sa-audit-footprint-collapsed {
		display: flex;
		flex-direction: column;
		gap: 0.3rem;
		min-width: 10rem;
	}

	.sa-audit-footprint-signal {
		display: inline-flex;
		align-items: center;
		padding: 0.18rem 0.55rem;
		border-radius: 9999px;
		border: 1px solid rgba(1, 52, 117, 0.18);
		background: #f0f5ff;
		font-size: 0.7rem;
		font-weight: 700;
		white-space: nowrap;
		color: #374151;
	}

	.sa-audit-footprint-signal--ok {
		border-color: rgba(22, 163, 74, 0.35);
		background: #dcfce7;
		color: #166534;
	}

	.sa-audit-footprint-signal--review {
		border-color: rgba(217, 119, 6, 0.35);
		background: #fef3c7;
		color: #92400e;
	}

	.sa-audit-footprint-signal--warn {
		border-color: rgba(239, 68, 68, 0.35);
		background: #fee2e2;
		color: #991b1b;
	}

	.sa-audit-footprint-dropdown {
		font-size: 0.75rem;
	}

	.sa-audit-footprint-dropdown summary {
		display: flex;
		align-items: center;
		gap: 0.25rem;
		cursor: pointer;
		list-style: none;
		color: #6b7280;
	}

	.sa-audit-footprint-dropdown summary::-webkit-details-marker {
		display: none;
	}

	.sa-audit-footprint-summary-label {
		font-size: 0.7rem;
	}

	.sa-audit-footprint-summary-caret {
		font-size: 0.6rem;
		color: #9ca3af;
	}

	.sa-audit-footprint-preview {
		padding: 0.45rem 0 0;
		display: flex;
		flex-direction: column;
		gap: 0.2rem;
	}

	.sa-audit-footprint-preview p {
		font-size: 0.72rem;
		color: #4b5563;
	}

	.sa-audit-footprint-open {
		display: inline-flex;
		margin-top: 0.25rem;
		padding: 0.2rem 0.55rem;
		border-radius: 5px;
		border: 1px solid rgba(1, 52, 117, 0.22);
		background: #f0f5ff;
		font-size: 0.7rem;
		font-weight: 600;
		color: #013475;
		cursor: pointer;
		transition: background 0.15s ease;
	}

	.sa-audit-footprint-open:hover {
		background: #dbeafe;
		color: #013475;
		border-color: rgba(1, 52, 117, 0.4);
	}

	/* ─── Footprint Modal ─────────────────────────────────────────────── */

	.sa-audit-footprint-modal-backdrop,
	.sa-audit-value-modal-backdrop {
		display: none;
		position: fixed;
		inset: 0;
		z-index: 200;
		background: rgba(0, 8, 24, 0.75);
		backdrop-filter: blur(6px);
		-webkit-backdrop-filter: blur(6px);
		align-items: center;
		justify-content: center;
		padding: 1rem;
	}

	.sa-audit-footprint-modal-backdrop.is-open,
	.sa-audit-value-modal-backdrop.is-open {
		display: flex;
	}

	.sa-audit-footprint-modal-panel,
	.sa-audit-value-modal-panel {
		width: 100%;
		max-width: 34rem;
		border-radius: 16px;
		border: 1px solid rgba(1, 52, 117, 0.12);
		background: #ffffff;
		backdrop-filter: blur(24px);
		-webkit-backdrop-filter: blur(24px);
		box-shadow: 0 24px 64px rgba(1, 52, 117, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.9);
		overflow: hidden;
	}

	.sa-audit-footprint-modal-head,
	.sa-audit-value-modal-head {
		display: flex;
		align-items: flex-start;
		justify-content: space-between;
		gap: 0.75rem;
		padding: 1rem 1.25rem 0.85rem;
		border-bottom: 1px solid rgba(1, 52, 117, 0.1);
	}

	.sa-audit-footprint-modal-eyebrow,
	.sa-audit-value-modal-eyebrow {
		font-size: 0.7rem;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.08em;
		color: #6b7280;
	}

	.sa-audit-footprint-modal-title,
	.sa-audit-value-modal-title {
		margin: 0.2rem 0 0;
		font-size: 1rem;
		font-weight: 700;
		color: #013475;
		line-height: 1.3;
	}

	.sa-audit-footprint-modal-close,
	.sa-audit-value-modal-close {
		flex-shrink: 0;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 2rem;
		height: 2rem;
		border-radius: 6px;
		border: 1px solid rgba(1, 52, 117, 0.15);
		background: #f0f5ff;
		font-size: 1.1rem;
		line-height: 1;
		color: #374151;
		cursor: pointer;
		transition: background 0.15s ease, color 0.15s ease;
	}

	.sa-audit-footprint-modal-close:hover,
	.sa-audit-value-modal-close:hover {
		background: rgba(239, 68, 68, 0.18);
		border-color: rgba(239, 68, 68, 0.3);
		color: #fca5a5;
	}

	.sa-audit-footprint-modal-body,
	.sa-audit-value-modal-body {
		padding: 1rem 1.25rem 1.25rem;
		display: flex;
		flex-direction: column;
		gap: 0.85rem;
	}

	.sa-audit-footprint-modal-alert {
		display: flex;
		align-items: center;
		gap: 0.6rem;
		padding: 0.65rem 0.85rem;
		border-radius: 8px;
		border: 1px solid rgba(1, 52, 117, 0.1);
		background: #f8fbff;
	}

	.sa-audit-footprint-modal-alert p {
		font-size: 0.8rem;
		color: #4b5563;
	}

	.sa-audit-footprint-modal-grid {
		display: flex;
		flex-direction: column;
		gap: 0.4rem;
	}

	.sa-audit-footprint-modal-row {
		display: flex;
		justify-content: space-between;
		align-items: baseline;
		gap: 0.5rem;
		padding: 0.5rem 0.75rem;
		border-radius: 7px;
		background: #f8fbff;
		border: 1px solid rgba(1, 52, 117, 0.08);
	}

	.sa-audit-footprint-modal-row span {
		font-size: 0.72rem;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.05em;
		color: #6b7280;
		flex-shrink: 0;
	}

	.sa-audit-footprint-modal-row strong {
		font-size: 0.82rem;
		font-weight: 600;
		color: #013475;
		text-align: right;
		word-break: break-word;
	}

	/* ─── Value Modal ─────────────────────────────────────────────────── */

	.sa-audit-value-modal-context {
		display: flex;
		flex-direction: column;
		gap: 0.3rem;
		padding: 0.6rem 0.85rem;
		border-radius: 8px;
		background: #f8fbff;
		border: 1px solid rgba(1, 52, 117, 0.1);
	}

	.sa-audit-value-modal-context p {
		display: flex;
		justify-content: space-between;
		align-items: baseline;
		gap: 0.5rem;
		font-size: 0.78rem;
	}

	.sa-audit-value-modal-context span {
		font-size: 0.7rem;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.05em;
		color: #6b7280;
	}

	.sa-audit-value-modal-context strong {
		color: #013475;
		text-align: right;
	}

	.sa-audit-value-modal-content {
		display: flex;
		flex-direction: column;
		gap: 0.5rem;
	}

	.sa-audit-value-modal-note {
		font-size: 0.8rem;
		color: #6b7280;
	}

	.sa-audit-value-modal-list {
		display: flex;
		flex-direction: column;
		gap: 0.35rem;
	}

	.sa-audit-value-modal-plain {
		font-size: 0.85rem;
		line-height: 1.6;
		color: #1f2937;
		white-space: pre-wrap;
		word-break: break-word;
		padding: 0.6rem 0.85rem;
		border-radius: 8px;
		background: #f8fbff;
		border: 1px solid rgba(1, 52, 117, 0.1);
	}

	.sa-audit-value-modal-photo-label {
		font-size: 0.75rem;
		font-weight: 600;
		color: #6b7280;
		margin-bottom: 0.4rem;
	}

	.sa-audit-value-modal-photo-image {
		max-width: 100%;
		max-height: 14rem;
		border-radius: 8px;
		border: 1px solid rgba(1, 52, 117, 0.15);
		object-fit: contain;
	}

	/* ─── Modal Overlay ──────────────────────────────────────────────── */

	.sa-modal-overlay-clean {
		background: rgba(0, 8, 24, 0.72);
		backdrop-filter: blur(6px);
		-webkit-backdrop-filter: blur(6px);
	}

	/* ─── Remaining color class overrides ────────────────────────────── */

	/* Emerald / amber badge overrides */
	.sa-theme-premium .bg-emerald-100 {
		background: #d1fae5 !important;
	}
	.sa-theme-premium .text-emerald-700 {
		color: #065f46 !important;
	}
	.sa-theme-premium .bg-amber-100 {
		background: #fef3c7 !important;
	}
	.sa-theme-premium .text-amber-700 {
		color: #b45309 !important;
	}

	/* Capture any leftover brand-blue/15 borders */
	.sa-theme-premium .border-brand-blue\/15 {
		border-color: rgba(1, 52, 117, 0.15) !important;
	}

	/* Light-blue info panels (bg-[#f8fbff]) */
	.sa-theme-premium .bg-\[\#f8fbff\] {
		background: #f8fbff !important;
	}

	/* text-gray-700 catch-all */
	.sa-theme-premium .text-gray-700 {
		color: #374151 !important;
	}

	/* ─── Settings Panel ──────────────────────────────────────────────── */

	.sa-settings-shell {
		padding-bottom: 2rem;
	}

	.sa-settings-card {
		border-radius: 14px;
		border: 1px solid rgba(1, 52, 117, 0.1);
		background: rgba(255, 255, 255, 0.9);
		backdrop-filter: blur(18px);
		-webkit-backdrop-filter: blur(18px);
		box-shadow: 0 4px 20px rgba(1, 52, 117, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.9);
		overflow: hidden;
	}

	.sa-settings-head {
		padding: 1.1rem 1.4rem 0.9rem;
		border-bottom: 1px solid rgba(1, 52, 117, 0.1);
	}

	.sa-settings-kicker {
		font-size: 0.7rem;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.1em;
		color: #6b7280;
	}

	.sa-settings-title {
		margin: 0.2rem 0 0;
		font-size: 1.1rem;
		font-weight: 700;
		color: #013475;
		line-height: 1.25;
	}

	.sa-settings-body {
		padding: 1.5rem 1.6rem;
	}

	.sa-settings-profile-box {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 0.6rem;
		text-align: center;
	}

	.sa-settings-avatar-shell {
		width: 5.5rem;
		height: 5.5rem;
		border-radius: 9999px;
		overflow: hidden;
		border: 2.5px solid rgba(254, 193, 52, 0.45);
		box-shadow: 0 0 0 4px rgba(254, 193, 52, 0.1);
		background: #013475;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	.sa-settings-avatar {
		width: 100%;
		height: 100%;
		border-radius: 9999px;
		object-fit: cover;
		display: block;
	}

	.sa-profile-photo {
		border-radius: 9999px;
		object-fit: cover;
		object-position: center;
	}

	.sa-settings-avatar-fallback {
		width: 100%;
		height: 100%;
		border-radius: 9999px;
		background: #013475;
		font-size: 1.9rem;
		font-weight: 700;
		color: #ffffff;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	.sa-settings-name {
		font-size: 0.95rem;
		font-weight: 700;
		color: #1f2937;
	}

	.sa-settings-meta {
		font-size: 0.78rem;
		color: #6b7280;
		line-height: 1.4;
	}

	.sa-settings-strong {
		color: #1f2937;
	}

	.sa-settings-block {
		padding: 1.25rem 1.4rem;
		border-radius: 10px;
		background: #f8fbff;
		border: 1px solid rgba(1, 52, 117, 0.1);
	}

	.sa-settings-subtitle {
		font-size: 0.88rem;
		font-weight: 700;
		color: #013475;
		margin: 0;
	}

	.sa-settings-form {
		display: flex;
		flex-direction: column;
		gap: 1rem;
	}

	.sa-settings-label {
		display: block;
		font-size: 0.72rem;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.06em;
		color: #4b5563;
		margin-bottom: 0.35rem;
	}

	.sa-settings-input {
		display: block;
		width: 100%;
		border-radius: 8px;
		border: 1px solid rgba(1, 52, 117, 0.2);
		background: #ffffff;
		color: #1f2937;
		padding: 0.7rem 0.875rem;
		font-size: 0.875rem;
		line-height: 1.5;
		min-height: 42px;
		transition: border-color 0.15s ease, background 0.15s ease;
	}

	.sa-settings-input::placeholder {
		color: #9ca3af;
	}

	.sa-settings-input:focus {
		outline: none;
		border-color: #013475;
		background: #ffffff;
		box-shadow: 0 0 0 3px rgba(1, 52, 117, 0.12);
	}

	.sa-settings-note {
		font-size: 0.75rem;
		color: #6b7280;
		line-height: 1.5;
	}

	.sa-settings-alert {
		padding: 0.6rem 0.85rem;
		border-radius: 8px;
		background: #fffbeb;
		border: 1px solid rgba(254, 193, 52, 0.5);
		font-size: 0.8rem;
		color: #92400e;
	}

	.sa-settings-btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border-radius: 9px;
		border: 1px solid rgba(255, 255, 255, 0.14);
		padding: 0.8rem 1.4rem;
		min-height: 44px;
		font-size: 0.875rem;
		font-weight: 700;
		cursor: pointer;
		transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
	}

	.sa-settings-btn-primary {
		background: linear-gradient(135deg, #01479f 0%, #013475 100%) !important;
		border-color: rgba(254, 193, 52, 0.4);
		color: #ffffff !important;
		box-shadow: 0 4px 14px rgba(1, 52, 117, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.1);
	}

	.sa-settings-btn-primary:hover {
		background: linear-gradient(135deg, #0155bb 0%, #01479f 100%) !important;
		box-shadow: 0 6px 20px rgba(1, 52, 117, 0.55);
	}

	/* ─── Sidebar padding-left CSS fallback (before JS runs) ───────── */
	@media (min-width: 768px) {
		.sa-theme-premium #sa-main-wrapper {
			padding-left: 260px;
		}

		.sa-theme-premium #sa-sidebar[data-collapsed='true'] + #sa-main-wrapper {
			padding-left: 92px;
		}
	}

	/* ─── Header text overrides for light mode ──────────────────────── */

	.sa-theme-premium #sa-main-wrapper > header [class*='text-white']:not([class*='bg-']) {
		color: #374151 !important;
	}

	.sa-theme-premium #sa-main-wrapper > header h1 {
		color: #013475 !important;
	}

	.sa-theme-premium #sa-main-wrapper > header p {
		color: #6b7280 !important;
	}

	/* Profile avatar circle — high contrast on light header */
	.sa-theme-premium .sa-force-circle {
		background: #013475 !important;
		border-color: rgba(1, 52, 117, 0.5) !important;
		color: #ffffff !important;
	}

	/* Notification dropdown hover row */
	.sa-theme-premium [data-sa-notification-menu] a:hover {
		background: #f0f6ff !important;
	}

	/* ─── Sidebar dark glass – enforce white text for all roles ─────────── */

	/* Brand name + role label in sidebar */
	.sa-theme-premium #sa-sidebar .sa-brand-text *,
	.sa-theme-premium #sa-mobile-sidebar .sa-brand-text * {
		color: rgba(255, 255, 255, 0.9) !important;
	}

	.sa-theme-premium #sa-sidebar .sa-brand-text p:last-child,
	.sa-theme-premium #sa-mobile-sidebar .sa-brand-text p:last-child {
		color: rgba(255, 255, 255, 0.55) !important;
	}

	/* Mobile sidebar top label ("Employee Portal" etc.) */
	.sa-theme-premium #sa-mobile-sidebar > div:first-child > p {
		color: rgba(255, 255, 255, 0.85) !important;
	}

	/* Mobile sidebar close button */
	.sa-theme-premium #sa-mobile-sidebar > div:first-child > button {
		background: rgba(255, 255, 255, 0.08) !important;
		border-color: rgba(255, 255, 255, 0.15) !important;
		color: rgba(255, 255, 255, 0.75) !important;
	}

	/* Sidebar divider lines */
	.sa-theme-premium #sa-sidebar .border-brand-blue\/20,
	.sa-theme-premium #sa-mobile-sidebar .border-brand-blue\/20 {
		border-color: rgba(255, 255, 255, 0.1) !important;
	}

	/* Non-active nav links — white on dark sidebar */
	.sa-theme-premium #sa-sidebar .sa-nav-link:not(.is-active),
	.sa-theme-premium #sa-mobile-sidebar .sa-nav-link:not(.is-active) {
		background: transparent !important;
		color: rgba(255, 255, 255, 0.72) !important;
	}

	.sa-theme-premium #sa-sidebar .sa-nav-link:hover:not(.is-active),
	.sa-theme-premium #sa-mobile-sidebar .sa-nav-link:hover:not(.is-active) {
		background: rgba(255, 255, 255, 0.08) !important;
		color: rgba(255, 255, 255, 0.95) !important;
	}

	/* ─── Table Pagination ──────────────────────────────────────────── */

	.sa-pagination-hidden {
		display: none !important;
	}

	.sa-table-pagination {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 0.75rem;
		padding: 0.65rem 1rem;
		border: 1px solid rgba(1, 52, 117, 0.12);
		border-top: 0;
		border-radius: 0 0 10px 10px;
		background: rgba(255, 255, 255, 0.85);
		backdrop-filter: blur(12px);
		-webkit-backdrop-filter: blur(12px);
	}

	.sa-table-pagination-meta {
		display: flex;
		align-items: center;
		gap: 0.6rem;
		flex-wrap: wrap;
	}

	.sa-table-pagination-label {
		display: inline-flex;
		align-items: center;
		gap: 0.35rem;
		font-size: 0.78rem;
		font-weight: 600;
		color: #4b5563;
	}

	.sa-table-pagination-select {
		height: 2rem;
		padding: 0 0.5rem;
		border-radius: 6px;
		border: 1px solid rgba(1, 52, 117, 0.22);
		background: #ffffff;
		font-size: 0.78rem;
		font-weight: 600;
		color: #013475;
		cursor: pointer;
		outline: none;
		transition: border-color 0.15s ease, box-shadow 0.15s ease;
	}

	.sa-table-pagination-select:focus {
		border-color: #013475;
		box-shadow: 0 0 0 2px rgba(1, 52, 117, 0.12);
	}

	.sa-table-pagination-summary {
		font-size: 0.78rem;
		font-weight: 500;
		color: #6b7280;
	}

	.sa-table-pagination-controls {
		display: inline-flex;
		align-items: center;
		gap: 0.5rem;
	}

	.sa-table-pagination-btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		height: 2rem;
		padding: 0 0.85rem;
		border-radius: 6px;
		border: 1px solid rgba(1, 52, 117, 0.22);
		background: #ffffff;
		font-size: 0.78rem;
		font-weight: 700;
		color: #013475;
		cursor: pointer;
		transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
		user-select: none;
		-webkit-user-select: none;
	}

/* =========================================================
   ALIGNMENT POLISH (ALL ROLES)
   ========================================================= */

.sa-theme-premium #sa-main-wrapper > header {
	padding-left: 0.75rem;
	padding-right: 0.75rem;
}

@media (min-width: 640px) {
	.sa-theme-premium #sa-main-wrapper > header {
		padding-left: 1.25rem;
		padding-right: 1.25rem;
	}
}

.sa-theme-premium .sa-header-context,
.sa-theme-premium .sa-header-profile {
	align-items: center;
}

.sa-theme-premium .sa-header-title-block h1 {
	line-height: 1.2;
}

.sa-theme-premium .sa-header-title-block p {
	line-height: 1.35;
}

.sa-theme-premium .sa-header-profile > span {
	line-height: 1.2;
}

.sa-theme-premium .sa-header-profile .sa-navbar-control {
	height: 40px;
	width: 40px;
}

.sa-theme-premium .sa-nav-link {
	min-height: 44px;
}

.sa-theme-premium .sa-nav-icon {
	width: 28px;
	height: 28px;
	justify-content: center;
}

.sa-theme-premium .sa-nav-icon svg {
	width: 20px;
	height: 20px;
}

.sa-theme-premium .sa-nav-label {
	line-height: 1.25;
}

.sa-theme-premium #sa-sidebar[data-collapsed='true'] .sa-nav-link {
	min-height: 56px;
	width: 56px;
}

.sa-theme-premium .sa-control,
.sa-theme-premium input,
.sa-theme-premium select,
.sa-theme-premium textarea {
	min-height: 40px;
}

.sa-theme-premium .sa-action-btn,
.sa-theme-premium .sa-action-btn-sm,
.sa-theme-premium .sa-table-pagination-btn {
	line-height: 1.1;
}

.sa-theme-premium .sa-data-table th,
.sa-theme-premium .sa-data-table td,
.sa-theme-premium .sa-payroll-table th,
.sa-theme-premium .sa-payroll-table td {
	vertical-align: middle;
}

.sa-theme-premium .sa-user-identity {
	align-items: center;
}

.sa-theme-premium .sa-user-actions {
	align-items: center;
}

	.sa-table-pagination-btn:hover:not([disabled]) {
		background: #013475;
		border-color: #013475;
		color: #ffffff;
	}

	.sa-table-pagination-btn[disabled],
	.sa-table-pagination-btn:disabled {
		opacity: 0.38;
		cursor: not-allowed;
		color: #9ca3af;
		border-color: rgba(1, 52, 117, 0.1);
		background: #f9fafb;
	}

	.sa-table-pagination-page {
		font-size: 0.78rem;
		font-weight: 600;
		color: #374151;
		white-space: nowrap;
		padding: 0 0.25rem;
	}
}

.print-only {
	display: none;
}

.print-payslip-only {
	display: none;
}

@media print {
	body {
		background: #ffffff;
	}

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

	.print-only {
		display: block !important;
	}

	body.print-payslip .print-payslip-only {
		display: block !important;
	}

	body.print-payslip .sa-page-shell {
		display: none !important;
	}

	#sa-sidebar,
	#sa-mobile-sidebar,
	#sa-mobile-overlay,
	header {
		display: none !important;
	}

	#sa-main-wrapper {
		padding-left: 0 !important;
	}

	table {
		page-break-inside: auto;
	}

	tr {
		page-break-inside: avoid;
		page-break-after: auto;
	}
}

/* ─── Desktop sidebar: unlayered fix (beats ALL @layer rules incl. Tailwind) ── */
/* Tailwind's "hidden" class is @layer utilities — this unlayered block wins.    */
/* JS inline style still wins over this (inline > unlayered CSS), so JS          */
/* can still set paddingLeft to 92px when sidebar collapses.                     */
@media (min-width: 768px) {
	.sa-theme-premium #sa-sidebar {
		display: flex !important;
	}

	.sa-theme-premium #sa-main-wrapper {
		padding-left: 260px;
	}

	.sa-theme-premium #sa-sidebar[data-collapsed='true'] + #sa-main-wrapper {
		padding-left: 92px;
	}
}

/* =========================================================
   PREMIUM CLEAN MODERN (ALL ROLES)
   ========================================================= */

/* Sidebar depth + clarity */
.sa-theme-premium #sa-sidebar {
	background: linear-gradient(180deg, rgba(1, 30, 73, 0.98) 0%, rgba(1, 18, 48, 1) 100%) !important;
	box-shadow: 4px 0 22px rgba(0, 0, 0, 0.28), inset -1px 0 0 rgba(255, 255, 255, 0.06) !important;
	border-right: 1px solid rgba(254, 193, 52, 0.12) !important;
}

/* Brand logo polish */
.sa-theme-premium .sa-brand-logo {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
	border: 1px solid rgba(254, 193, 52, 0.28);
	transition: box-shadow 0.2s ease;
}

.sa-theme-premium .sa-brand-row:hover .sa-brand-logo {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.28);
}

/* Brand accent line */
.sa-theme-premium .sa-brand-accent {
	background: linear-gradient(90deg, var(--sa-yellow) 0%, rgba(254, 193, 52, 0.25) 100%);
	height: 2px;
	border-radius: 2px;
}

/* Navigation links */
.sa-theme-premium .sa-nav-link {
	position: relative;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 12px;
	box-shadow: none;
	padding: 0.7rem 0.9rem;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.sa-theme-premium .sa-nav-link:hover {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.14);
}

.sa-theme-premium .sa-nav-link.is-active {
	background: linear-gradient(120deg, rgba(254, 193, 52, 0.25), rgba(254, 193, 52, 0.08));
	border-color: rgba(254, 193, 52, 0.45);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.sa-theme-premium .sa-nav-link.is-active::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 3px;
	height: 50%;
	background: var(--sa-yellow);
	border-radius: 0 2px 2px 0;
}

/* Premium cards */
.sa-theme-premium .sa-card {
	background: #ffffff !important;
	border: 1px solid rgba(1, 52, 117, 0.1);
	border-radius: 16px;
	box-shadow: 0 4px 14px rgba(1, 52, 117, 0.08), 0 18px 32px rgba(1, 52, 117, 0.06);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.sa-theme-premium .sa-card:hover {
	box-shadow: 0 6px 16px rgba(1, 52, 117, 0.1), 0 22px 36px rgba(1, 52, 117, 0.08);
	border-color: rgba(254, 193, 52, 0.24);
}

.sa-theme-premium .sa-card::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 2px;
	background: linear-gradient(90deg, var(--sa-yellow) 0%, rgba(1, 52, 117, 0.25) 65%, transparent 100%);
	border-radius: 16px 16px 0 0;
}

/* Premium Buttons - Clean Depth */
.sa-theme-premium .sa-action-btn {
	position: relative;
	background: #ffffff;
	border: 1px solid rgba(1, 52, 117, 0.15);
	border-radius: 10px;
	box-shadow: 0 1px 2px rgba(1, 52, 117, 0.08);
	transition: all 0.15s ease;
}

.sa-theme-premium .sa-action-btn:hover {
	background: #fafcff;
	border-color: rgba(1, 52, 117, 0.25);
	box-shadow: 0 2px 6px rgba(1, 52, 117, 0.12);
	transform: translateY(-1px);
}

.sa-theme-premium .sa-action-btn:active {
	transform: translateY(0);
	box-shadow: 0 1px 2px rgba(1, 52, 117, 0.08);
}

/* Premium Blue Button */
.sa-theme-premium .sa-action-btn.bg-brand-blue {
	background: linear-gradient(180deg, #01479f 0%, #013475 100%);
	border: 1px solid rgba(254, 193, 52, 0.25);
	box-shadow: 0 2px 6px rgba(1, 52, 117, 0.25);
}

.sa-theme-premium .sa-action-btn.bg-brand-blue:hover {
	background: linear-gradient(180deg, #0152b3 0%, #01479f 100%);
	box-shadow: 0 3px 10px rgba(1, 52, 117, 0.3);
	transform: translateY(-1px);
}

.sa-theme-premium .sa-action-btn.bg-brand-blue:active {
	transform: translateY(0);
	box-shadow: 0 1px 3px rgba(1, 52, 117, 0.2);
}

/* Clean Logout Button */
.sa-theme-premium #sa-sidebar a[href*='logout'],
.sa-theme-premium #sa-mobile-sidebar a[href*='logout'] {
	background: rgba(254, 193, 52, 0.1);
	border: 1px solid rgba(254, 193, 52, 0.3);
	box-shadow: none;
	transition: all 0.2s ease;
}

.sa-theme-premium #sa-sidebar a[href*='logout']:hover,
.sa-theme-premium #sa-mobile-sidebar a[href*='logout']:hover {
	background: rgba(254, 193, 52, 0.18);
	border-color: rgba(254, 193, 52, 0.4);
	transform: translateY(-1px);
}

/* Clean Header */
.sa-theme-premium #sa-main-wrapper > header {
	background: rgba(255, 255, 255, 0.98) !important;
	box-shadow: 0 1px 3px rgba(1, 52, 117, 0.06), 0 2px 8px rgba(1, 52, 117, 0.04) !important;
	border-bottom: 1px solid rgba(1, 52, 117, 0.06);
	backdrop-filter: blur(12px);
}

.sa-theme-premium #sa-main-wrapper > header::after {
	display: none;
}

/* Clean Navbar Controls */
.sa-theme-premium .sa-navbar-control,
.sa-theme-premium .sa-hamburger-btn {
	background: #ffffff;
	border: 1px solid rgba(1, 52, 117, 0.12);
	box-shadow: 0 1px 2px rgba(1, 52, 117, 0.06);
	transition: all 0.15s ease;
}

.sa-theme-premium .sa-navbar-control:hover,
.sa-theme-premium .sa-hamburger-btn:hover {
	background: #f8fbff;
	border-color: rgba(1, 52, 117, 0.2);
	box-shadow: 0 2px 4px rgba(1, 52, 117, 0.1);
}

/* Clean Profile Photo */
.sa-theme-premium .sa-profile-photo,
.sa-theme-premium .sa-force-circle {
	box-shadow: 0 2px 5px rgba(1, 52, 117, 0.15);
	border: 2px solid rgba(254, 193, 52, 0.3);
}

/* Clean Notification Badge */
.sa-theme-premium [data-sa-notification-toggle] .absolute {
	box-shadow: 0 1px 3px rgba(220, 38, 38, 0.3);
}

/* Clean Notification Dropdown */
.sa-theme-premium [data-sa-notification-menu] {
	background: #ffffff;
	box-shadow: 0 4px 20px rgba(1, 52, 117, 0.12), 0 2px 8px rgba(1, 52, 117, 0.08);
	border: 1px solid rgba(1, 52, 117, 0.08);
}

/* Clean Subnav Links */
.sa-theme-premium .sa-subnav-link {
	background: #ffffff;
	border: 1px solid rgba(1, 52, 117, 0.12);
	box-shadow: 0 1px 2px rgba(1, 52, 117, 0.04);
	transition: all 0.15s ease;
}

.sa-theme-premium .sa-subnav-link:hover {
	background: #f8fbff;
	border-color: rgba(1, 52, 117, 0.2);
	box-shadow: 0 2px 4px rgba(1, 52, 117, 0.08);
}

.sa-theme-premium .sa-subnav-link.is-active {
	background: #013475;
	border-color: #013475;
	box-shadow: 0 2px 6px rgba(1, 52, 117, 0.2);
}

/* Clean Form Inputs */
.sa-theme-premium input,
.sa-theme-premium select,
.sa-theme-premium textarea {
	background: #ffffff;
	border: 1px solid rgba(1, 52, 117, 0.15) !important;
	box-shadow: inset 0 1px 2px rgba(1, 52, 117, 0.04);
	transition: all 0.2s ease;
}

.sa-theme-premium input:focus,
.sa-theme-premium select:focus,
.sa-theme-premium textarea:focus {
	background: #ffffff;
	border-color: #013475 !important;
	box-shadow: 0 0 0 3px rgba(1, 52, 117, 0.08), inset 0 1px 2px rgba(1, 52, 117, 0.04);
	transform: none;
}

/* Clean Table */
.sa-theme-premium .sa-data-table,
.sa-theme-premium .sa-payroll-table {
	box-shadow: 0 1px 3px rgba(1, 52, 117, 0.06), 0 4px 12px rgba(1, 52, 117, 0.04);
	border-radius: 6px;
}

.sa-theme-premium thead.bg-brand-blue,
.sa-theme-premium .sa-dashboard-table-head {
	background: linear-gradient(180deg, #01479f 0%, #013475 100%);
	box-shadow: inset 0 -2px 0 rgba(254, 193, 52, 0.5);
}

.sa-theme-premium .sa-user-row:hover,
.sa-theme-premium .sa-payroll-table tbody tr:hover td {
	background: #f8fbff !important;
}

/* Clean KPI Cards */
.sa-theme-premium .sa-kpi-grid > div,
.sa-theme-premium .sa-kpi-grid > article {
	background: #ffffff;
	border: 1px solid rgba(1, 52, 117, 0.08);
	box-shadow: 0 1px 3px rgba(1, 52, 117, 0.05), 0 4px 10px rgba(1, 52, 117, 0.04);
	transition: all 0.25s ease;
}

.sa-theme-premium .sa-kpi-grid > div:hover,
.sa-theme-premium .sa-kpi-grid > article:hover {
	transform: translateY(-2px);
	box-shadow: 0 2px 6px rgba(1, 52, 117, 0.08), 0 8px 16px rgba(1, 52, 117, 0.06);
	border-color: rgba(254, 193, 52, 0.2);
}

/* Clean Status Chips */
.sa-theme-premium .sa-status-chip {
	background: #f0f5ff;
	border: 1px solid rgba(1, 52, 117, 0.15);
	box-shadow: none;
}

/* Clean User Avatar */
.sa-theme-premium .sa-user-avatar {
	background: #eef5ff;
	border: 1px solid rgba(1, 52, 117, 0.2);
	box-shadow: none;
}

/* Clean Role Pills */
.sa-theme-premium .sa-role-pill {
	background: #f0f6ff;
	border: 1px solid rgba(1, 52, 117, 0.15);
	box-shadow: none;
}

/* Clean Workflow Steps */
.sa-theme-premium .sa-workflow-step {
	background: #ffffff;
	border: 1px solid rgba(1, 52, 117, 0.12);
	box-shadow: 0 1px 2px rgba(1, 52, 117, 0.04);
}

.sa-theme-premium .sa-workflow-step.is-current {
	background: #eef5ff;
	border-color: rgba(1, 52, 117, 0.25);
	box-shadow: 0 1px 3px rgba(1, 52, 117, 0.08);
}

.sa-theme-premium .sa-workflow-step.is-done {
	background: #dcfce7;
	border-color: rgba(22, 163, 74, 0.25);
}

/* Clean Workflow Strip */
.sa-theme-premium .sa-workflow-strip {
	background: #f8fbff;
	border: 1px solid rgba(1, 52, 117, 0.08);
	box-shadow: none;
}

/* Clean Section Headers */
.sa-theme-premium .sa-section-head {
	background: #ffffff;
	border-bottom: 1px solid rgba(1, 52, 117, 0.1);
	box-shadow: none;
}

/* Clean Toolbar */
.sa-theme-premium .sa-toolbar {
	background: #ffffff;
	border-bottom: 1px solid rgba(1, 52, 117, 0.1);
	box-shadow: none;
}

/* Clean Badges */
.sa-theme-premium .sa-badge {
	background: #f0f5ff;
	border: 1px solid rgba(1, 52, 117, 0.15);
	box-shadow: none;
}

/* Clean Mobile Sidebar */
.sa-theme-premium #sa-mobile-sidebar {
	background: linear-gradient(180deg, rgba(1, 30, 73, 0.99) 0%, rgba(1, 20, 50, 0.99) 100%) !important;
	box-shadow: 4px 0 24px rgba(0, 0, 0, 0.3) !important;
}

/* Clean Modal */
.sa-theme-premium .sa-approval-modal {
	background: #ffffff;
	box-shadow: 0 4px 24px rgba(1, 52, 117, 0.15), 0 2px 12px rgba(1, 52, 117, 0.1);
	border: 1px solid rgba(1, 52, 117, 0.08);
}

.sa-theme-premium .sa-approval-modal-header,
.sa-theme-premium .sa-approval-modal-footer {
	background: #ffffff;
	box-shadow: none;
}

.sa-theme-premium .sa-approval-modal-row {
	background: #f8fbff;
	border: 1px solid rgba(1, 52, 117, 0.08);
	box-shadow: none;
}

/* Clean Sidebar Tooltip */
.sa-theme-premium .sa-sidebar-tooltip {
	background: var(--sa-yellow);
	border: none;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
	color: #011530;
	font-weight: 600;
}

/* Clean Action Buttons Small */
.sa-theme-premium .sa-action-btn-sm {
	background: #f5f9ff;
	border: 1px solid rgba(1, 52, 117, 0.15);
	box-shadow: none;
	transition: all 0.15s ease;
}

.sa-theme-premium .sa-action-btn-sm:hover {
	background: #eef5ff;
	border-color: rgba(1, 52, 117, 0.25);
	box-shadow: 0 2px 4px rgba(1, 52, 117, 0.08);
}

/* Clean Danger Button */
.sa-theme-premium .sa-action-btn-danger {
	background: #fee2e2 !important;
	border: 1px solid rgba(239, 68, 68, 0.2) !important;
	box-shadow: none;
}

.sa-theme-premium .sa-action-btn-danger:hover {
	background: #fecaca !important;
	box-shadow: 0 2px 6px rgba(239, 68, 68, 0.1);
}

/* Clean Neutral Button */
.sa-theme-premium .sa-action-btn-neutral {
	background: #f5f9ff !important;
	border: 1px solid rgba(1, 52, 117, 0.15) !important;
	box-shadow: none;
}

.sa-theme-premium .sa-action-btn-neutral:hover {
	background: #eaf3ff !important;
	box-shadow: 0 2px 6px rgba(1, 52, 117, 0.08);
}

/* Clean Batch Pills */
.sa-theme-premium .sa-batch-pill {
	background: #f0f5ff;
	border: 1px solid rgba(1, 52, 117, 0.15);
	box-shadow: none;
}

/* Clean Mobile Overlay */
.sa-theme-premium #sa-mobile-overlay {
	background: rgba(1, 20, 50, 0.5) !important;
}

/* Clean Empty Table State */
.sa-theme-premium .sa-table-empty {
	background: #f8fbff;
	box-shadow: none;
}

/* Clean Security Note */
.sa-theme-premium .sa-security-note {
	background: rgba(254, 193, 52, 0.1);
	border: 1px solid rgba(254, 193, 52, 0.2);
	border-radius: 4px;
	padding: 0.25rem 0.5rem;
	box-shadow: none;
}

/* Clean Filter Stack */
.sa-theme-premium .sa-filter-stack .sa-control {
	background: #ffffff;
	box-shadow: inset 0 1px 2px rgba(1, 52, 117, 0.03);
}

/* Clean Control Full */
.sa-theme-premium .sa-control.sa-control-full {
	background: #ffffff;
	box-shadow: inset 0 1px 2px rgba(1, 52, 117, 0.03);
}

/* Clean Side Actions */
.sa-theme-premium .sa-side-actions .sa-action-btn {
	background: #ffffff;
	box-shadow: 0 1px 2px rgba(1, 52, 117, 0.05);
}

.sa-theme-premium .sa-side-actions .sa-action-btn:hover {
	background: #f8fbff;
	box-shadow: 0 2px 6px rgba(1, 52, 117, 0.08);
}

/* Shared Premium 3D Cards - Unified across all roles */
.sa-theme-premium .sa-card,
.sa-theme-premium section[class*='min-h-screen'] .sa-card {
	background: #ffffff !important;
	border: 1px solid rgba(1, 52, 117, 0.08);
	box-shadow: 0 1px 3px rgba(1, 52, 117, 0.05), 0 4px 12px rgba(1, 52, 117, 0.06);
	transition: all 0.25s ease;
}

.sa-theme-premium .sa-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 2px 6px rgba(1, 52, 117, 0.06), 0 8px 20px rgba(1, 52, 117, 0.08);
	border-color: rgba(254, 193, 52, 0.25);
}

/* Card Top Accent */
.sa-theme-premium .sa-card::before,
.sa-theme-premium section[class*='min-h-screen'] .sa-card::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 2px;
	background: linear-gradient(90deg, var(--sa-yellow) 0%, rgba(1, 52, 117, 0.25) 60%, transparent 100%);
	border-radius: 6px 6px 0 0;
}

/* Unified Buttons - All Roles */
.sa-theme-premium .sa-action-btn,
.sa-theme-premium section[class*='min-h-screen'] .sa-action-btn {
	background: #ffffff;
	border: 1px solid rgba(1, 52, 117, 0.12);
	box-shadow: 0 1px 2px rgba(1, 52, 117, 0.05);
	transition: all 0.15s ease;
}

.sa-theme-premium .sa-action-btn:hover {
	background: #fafcff;
	border-color: rgba(1, 52, 117, 0.2);
	box-shadow: 0 2px 6px rgba(1, 52, 117, 0.08);
	transform: translateY(-1px);
}

/* Unified Blue Button */
.sa-theme-premium .sa-action-btn.bg-brand-blue,
.sa-theme-premium section[class*='min-h-screen'] .sa-action-btn.bg-brand-blue {
	background: linear-gradient(180deg, #01479f 0%, #013475 100%);
	border: 1px solid rgba(254, 193, 52, 0.25);
	box-shadow: 0 2px 6px rgba(1, 52, 117, 0.2);
	color: #ffffff;
}

.sa-theme-premium .sa-action-btn.bg-brand-blue:hover {
	background: linear-gradient(180deg, #0152b3 0%, #01479f 100%);
	box-shadow: 0 3px 10px rgba(1, 52, 117, 0.25);
	transform: translateY(-1px);
}

/* Navbar Controls - Unified */
.sa-theme-premium .sa-navbar-control,
.sa-theme-premium .sa-hamburger-btn,
.sa-theme-premium section[class*='min-h-screen'] .sa-navbar-control {
	background: #ffffff;
	border: 1px solid rgba(1, 52, 117, 0.1);
	box-shadow: 0 1px 2px rgba(1, 52, 117, 0.04);
	transition: all 0.15s ease;
}

.sa-theme-premium .sa-navbar-control:hover,
.sa-theme-premium .sa-hamburger-btn:hover {
	background: #f8fbff;
	border-color: rgba(1, 52, 117, 0.18);
	box-shadow: 0 2px 5px rgba(1, 52, 117, 0.08);
}

/* Profile Photos - Unified */
.sa-theme-premium .sa-profile-photo,
.sa-theme-premium .sa-force-circle,
.sa-theme-premium section[class*='min-h-screen'] .sa-profile-photo {
	box-shadow: 0 2px 5px rgba(1, 52, 117, 0.12);
	border: 2px solid rgba(254, 193, 52, 0.3);
}

/* Form Inputs - Unified */
.sa-theme-premium input,
.sa-theme-premium select,
.sa-theme-premium textarea,
.sa-theme-premium section[class*='min-h-screen'] input {
	background: #ffffff;
	border: 1px solid rgba(1, 52, 117, 0.12) !important;
	box-shadow: inset 0 1px 2px rgba(1, 52, 117, 0.03);
	transition: all 0.2s ease;
}

.sa-theme-premium input:focus,
.sa-theme-premium select:focus,
.sa-theme-premium textarea:focus {
	border-color: #013475 !important;
	box-shadow: 0 0 0 3px rgba(1, 52, 117, 0.06), inset 0 1px 2px rgba(1, 52, 117, 0.03);
}

/* Tables - Unified */
.sa-theme-premium .sa-data-table,
.sa-theme-premium .sa-payroll-table {
	box-shadow: 0 1px 3px rgba(1, 52, 117, 0.04), 0 4px 12px rgba(1, 52, 117, 0.03);
	border-radius: 6px;
}

.sa-theme-premium thead.bg-brand-blue,
.sa-theme-premium .sa-dashboard-table-head {
	background: linear-gradient(180deg, #01479f 0%, #013475 100%);
	box-shadow: inset 0 -2px 0 rgba(254, 193, 52, 0.5);
}

/* KPI Cards - Unified */
.sa-theme-premium .sa-kpi-grid > div,
.sa-theme-premium .sa-kpi-grid > article {
	background: #ffffff;
	border: 1px solid rgba(1, 52, 117, 0.06);
	box-shadow: 0 1px 3px rgba(1, 52, 117, 0.04), 0 4px 10px rgba(1, 52, 117, 0.03);
	transition: all 0.25s ease;
}

.sa-theme-premium .sa-kpi-grid > div:hover,
.sa-theme-premium .sa-kpi-grid > article:hover {
	transform: translateY(-2px);
	box-shadow: 0 2px 6px rgba(1, 52, 117, 0.06), 0 8px 16px rgba(1, 52, 117, 0.05);
	border-color: rgba(254, 193, 52, 0.2);
}

/* Status Elements - Unified */
.sa-theme-premium .sa-status-chip,
.sa-theme-premium .sa-badge,
.sa-theme-premium .sa-role-pill,
.sa-theme-premium .sa-batch-pill {
	background: #f0f5ff;
	border: 1px solid rgba(1, 52, 117, 0.12);
	box-shadow: none;
}

.sa-theme-premium .sa-user-avatar {
	background: #eef5ff;
	border: 1px solid rgba(1, 52, 117, 0.15);
	box-shadow: none;
}

/* Workflow Elements - Unified */
.sa-theme-premium .sa-workflow-step {
	background: #ffffff;
	border: 1px solid rgba(1, 52, 117, 0.1);
	box-shadow: 0 1px 2px rgba(1, 52, 117, 0.03);
}

.sa-theme-premium .sa-workflow-step.is-current {
	background: #eef5ff;
	border-color: rgba(1, 52, 117, 0.2);
	box-shadow: 0 1px 3px rgba(1, 52, 117, 0.05);
}

.sa-theme-premium .sa-workflow-strip {
	background: #f8fbff;
	border: 1px solid rgba(1, 52, 117, 0.06);
}

/* Section Headers - Unified */
.sa-theme-premium .sa-section-head,
.sa-theme-premium .sa-toolbar {
	background: #ffffff;
	border-bottom: 1px solid rgba(1, 52, 117, 0.08);
}

/* Modals - Unified */
.sa-theme-premium .sa-approval-modal {
	background: #ffffff;
	box-shadow: 0 4px 24px rgba(1, 52, 117, 0.12), 0 2px 12px rgba(1, 52, 117, 0.08);
	border: 1px solid rgba(1, 52, 117, 0.06);
}

.sa-theme-premium .sa-approval-modal-header,
.sa-theme-premium .sa-approval-modal-footer,
.sa-theme-premium .sa-approval-modal-row {
	background: #ffffff;
	border-color: rgba(1, 52, 117, 0.06);
}

.sa-theme-premium .sa-approval-modal-row {
	background: #f8fbff;
}

/* Notification Badge - Unified */
.sa-theme-premium [data-sa-notification-toggle] .absolute {
	box-shadow: 0 1px 3px rgba(220, 38, 38, 0.25);
}

/* Toast Host - Unified */
.sa-theme-premium #sa-toast-host > div {
	background: #ffffff;
	box-shadow: 0 4px 16px rgba(1, 52, 117, 0.1), 0 2px 8px rgba(1, 52, 117, 0.06);
	border: 1px solid rgba(1, 52, 117, 0.06);
}

/* =========================================================
   CLEAN PREMIUM STYLES - Visual Only (No Layout Changes)
   ========================================================= */

/* Sidebar gradient backgrounds only */
.sa-theme-premium #sa-sidebar,
.sa-theme-premium #sa-mobile-sidebar {
	background: linear-gradient(170deg, rgba(1, 35, 85, 0.98) 0%, rgba(1, 20, 50, 0.99) 100%) !important;
}

/* Nav link glow effects only */
.sa-theme-premium .sa-nav-link.is-active {
	background: linear-gradient(90deg, rgba(254, 193, 52, 0.15) 0%, rgba(254, 193, 52, 0.05) 100%) !important;
	box-shadow: 0 0 20px rgba(254, 193, 52, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

.sa-theme-premium .sa-nav-link.is-active .sa-nav-icon {
	filter: drop-shadow(0 0 4px rgba(254, 193, 52, 0.5));
}

/* Card gradient backgrounds and shadows only */
.sa-theme-premium .sa-card {
	background: linear-gradient(135deg, #ffffff 0%, #fafcff 100%) !important;
	box-shadow: 0 4px 12px rgba(1, 52, 117, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

.sa-theme-premium .sa-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--sa-yellow) 0%, rgba(1, 52, 117, 0.4) 50%, transparent 100%);
	opacity: 0.8;
}

/* Button gradients and shadows only */
.sa-theme-premium .sa-action-btn {
	background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
	box-shadow: 0 2px 4px rgba(1, 52, 117, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.sa-theme-premium .sa-action-btn.bg-brand-blue {
	background: linear-gradient(135deg, #0155bb 0%, #013475 50%, #01479f 100%) !important;
	box-shadow: 0 4px 15px rgba(1, 52, 117, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.15) !important;
}

/* Header glass effect */
.sa-theme-premium #sa-main-wrapper > header {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.95) 0%, rgba(250, 252, 255, 0.98) 100%) !important;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
}

/* Navbar control gradients */
.sa-theme-premium .sa-navbar-control,
.sa-theme-premium .sa-hamburger-btn {
	background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
	box-shadow: 0 1px 3px rgba(1, 52, 117, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

/* Profile photo ring glow */
.sa-theme-premium .sa-profile-photo,
.sa-theme-premium .sa-force-circle {
	box-shadow: 0 4px 10px rgba(1, 52, 117, 0.15), 0 0 0 3px rgba(254, 193, 52, 0.3) !important;
}

/* Subnav gradients */
.sa-theme-premium .sa-subnav-link {
	background: linear-gradient(180deg, #ffffff 0%, #fafcff 100%);
	box-shadow: 0 1px 3px rgba(1, 52, 117, 0.04), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.sa-theme-premium .sa-subnav-link.is-active {
	background: linear-gradient(135deg, #01479f 0%, #013475 100%) !important;
	box-shadow: 0 4px 15px rgba(1, 52, 117, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}

/* Input focus glow */
.sa-theme-premium input:focus,
.sa-theme-premium select:focus,
.sa-theme-premium textarea:focus {
	box-shadow: 0 0 0 3px rgba(1, 52, 117, 0.1), inset 0 1px 2px rgba(1, 52, 117, 0.03) !important;
	border-color: #01479f !important;
}

/* KPI card gradients */
.sa-theme-premium .sa-kpi-grid > div,
.sa-theme-premium .sa-kpi-grid > article {
	background: linear-gradient(145deg, #ffffff 0%, #f8fbff 100%);
	box-shadow: 0 4px 12px rgba(1, 52, 117, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.sa-theme-premium .sa-kpi-grid > div::before,
.sa-theme-premium .sa-kpi-grid > article::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--sa-yellow) 0%, rgba(1, 52, 117, 0.5) 60%, transparent 100%);
	opacity: 0.8;
}

/* Status element gradients */
.sa-theme-premium .sa-status-chip,
.sa-theme-premium .sa-badge,
.sa-theme-premium .sa-role-pill {
	background: linear-gradient(180deg, #f0f5ff 0%, #e8f0ff 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 1px 2px rgba(1, 52, 117, 0.04);
}

/* User avatar gradients */
.sa-theme-premium .sa-user-avatar {
	background: linear-gradient(145deg, #eef5ff 0%, #e0edff 100%);
	box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.8), 0 2px 4px rgba(1, 52, 117, 0.05);
}

/* Workflow step gradients */
.sa-theme-premium .sa-workflow-step {
	background: linear-gradient(180deg, #ffffff 0%, #fafcff 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 3px rgba(1, 52, 117, 0.03);
}

.sa-theme-premium .sa-workflow-step.is-current {
	background: linear-gradient(180deg, #eef5ff 0%, #e0edff 100%) !important;
	box-shadow: 0 0 15px rgba(1, 52, 117, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

.sa-theme-premium .sa-workflow-step.is-done {
	background: linear-gradient(180deg, #dcfce7 0%, #c8f7d6 100%) !important;
	box-shadow: 0 0 10px rgba(22, 163, 74, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

/* Workflow strip gradient */
.sa-theme-premium .sa-workflow-strip {
	background: linear-gradient(180deg, #f8fbff 0%, #f0f7ff 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 3px rgba(1, 52, 117, 0.03);
}

/* Section header gradients */
.sa-theme-premium .sa-section-head,
.sa-theme-premium .sa-toolbar {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.95) 0%, rgba(250, 252, 255, 0.98) 100%);
	box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.8);
}

/* Modal gradients */
.sa-theme-premium .sa-approval-modal {
	background: linear-gradient(180deg, #ffffff 0%, #fafcff 100%);
	box-shadow: 0 20px 50px rgba(1, 52, 117, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.sa-theme-premium .sa-approval-modal-header {
	background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
	box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.8);
}

.sa-theme-premium .sa-approval-modal-row {
	background: linear-gradient(180deg, #f8fbff 0%, #f0f7ff 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

/* Notification dropdown glass */
.sa-theme-premium [data-sa-notification-menu] {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(250, 252, 255, 0.99) 100%);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	box-shadow: 0 20px 50px rgba(1, 52, 117, 0.12);
}

/* Notification badge glow pulse */
.sa-theme-premium [data-sa-notification-toggle] .absolute {
	animation: premium-glow-pulse 2s ease-in-out infinite;
}

@keyframes premium-glow-pulse {
	0%, 100% { box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.8), 0 2px 8px rgba(220, 38, 38, 0.4); }
	50% { box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.8), 0 4px 15px rgba(220, 38, 38, 0.6), 0 0 20px rgba(220, 38, 38, 0.3); }
}

/* Table header gradients */
.sa-theme-premium thead.bg-brand-blue,
.sa-theme-premium .sa-dashboard-table-head {
	background: linear-gradient(180deg, #0155bb 0%, #013475 100%);
	box-shadow: inset 0 -2px 0 rgba(254, 193, 52, 0.5);
}

/* Table row hover */
.sa-theme-premium .sa-data-table tbody tr:hover,
.sa-theme-premium .sa-payroll-table tbody tr:hover {
	background: linear-gradient(90deg, #f8fbff 0%, #f0f7ff 100%) !important;
}

/* Pagination glass */
.sa-theme-premium .sa-table-pagination {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(250, 252, 255, 0.95) 100%);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}

.sa-theme-premium .sa-table-pagination-btn {
	background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
	box-shadow: 0 1px 3px rgba(1, 52, 117, 0.04), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

/* Brand logo glow */
.sa-theme-premium .sa-brand-logo {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25), 0 0 0 2px rgba(254, 193, 52, 0.2);
}

.sa-theme-premium .sa-brand-accent {
	background: linear-gradient(90deg, var(--sa-yellow) 0%, rgba(254, 193, 52, 0.3) 50%, transparent 100%);
	box-shadow: 0 2px 8px rgba(254, 193, 52, 0.2);
}

/* Sidebar tooltip glass */
.sa-theme-premium .sa-sidebar-tooltip {
	background: linear-gradient(180deg, rgba(254, 193, 52, 0.95) 0%, rgba(254, 193, 52, 0.9) 100%);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* Settings card glass */
.sa-theme-premium .sa-settings-card {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.95) 0%, rgba(250, 252, 255, 0.98) 100%);
	backdrop-filter: blur(18px);
	-webkit-backdrop-filter: blur(18px);
	box-shadow: 0 4px 20px rgba(1, 52, 117, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.sa-theme-premium .sa-settings-avatar-shell {
	background: linear-gradient(145deg, #013475 0%, #01479f 100%);
	box-shadow: 0 4px 12px rgba(1, 52, 117, 0.3), 0 0 0 4px rgba(254, 193, 52, 0.15), inset 0 2px 4px rgba(255, 255, 255, 0.1);
}

/* Settings button gradients */
.sa-theme-premium .sa-settings-btn-primary {
	background: linear-gradient(135deg, #0177f0 0%, #01479f 50%, #0166d9 100%) !important;
	box-shadow: 0 4px 15px rgba(1, 52, 117, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}

/* Action buttons small */
.sa-theme-premium .sa-action-btn-sm {
	background: linear-gradient(180deg, #f8fbff 0%, #f0f7ff 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 3px rgba(1, 52, 117, 0.03);
}

/* Danger button gradients */
.sa-theme-premium .sa-action-btn-danger {
	background: linear-gradient(180deg, #fee2e2 0%, #fecaca 100%) !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 1px 3px rgba(239, 68, 68, 0.05) !important;
}

/* Neutral button gradients */
.sa-theme-premium .sa-action-btn-neutral {
	background: linear-gradient(180deg, #f8fbff 0%, #f0f7ff 100%) !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 3px rgba(1, 52, 117, 0.04) !important;
}

/* Batch pill gradients */
.sa-theme-premium .sa-batch-pill {
	background: linear-gradient(180deg, #f0f5ff 0%, #e8f0ff 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 1px 2px rgba(1, 52, 117, 0.03);
}

/* Security note gradient */
.sa-theme-premium .sa-security-note {
	background: linear-gradient(180deg, rgba(254, 193, 52, 0.12) 0%, rgba(254, 193, 52, 0.08) 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 3px rgba(254, 193, 52, 0.05);
}

/* Empty state gradient */
.sa-theme-premium .sa-table-empty {
	background: linear-gradient(180deg, #f8fbff 0%, #f0f7ff 100%);
}

/* Filter control gradients */
.sa-theme-premium .sa-filter-stack .sa-control,
.sa-theme-premium .sa-control.sa-control-full {
	background: linear-gradient(180deg, #ffffff 0%, #fafcff 100%);
	box-shadow: inset 0 1px 3px rgba(1, 52, 117, 0.03), 0 1px 2px rgba(1, 52, 117, 0.02);
}

/* Side action gradients */
.sa-theme-premium .sa-side-actions .sa-action-btn {
	background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 3px rgba(1, 52, 117, 0.04);
}

/* Mobile overlay blur */
.sa-theme-premium #sa-mobile-overlay {
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

/* Mobile sidebar gradient */
.sa-theme-premium #sa-mobile-sidebar {
	background: linear-gradient(170deg, rgba(1, 35, 85, 0.99) 0%, rgba(1, 20, 50, 0.98) 100%) !important;
}

/* Logout button gradient */
.sa-theme-premium #sa-sidebar a[href*='logout'],
.sa-theme-premium #sa-mobile-sidebar a[href*='logout'] {
	background: linear-gradient(180deg, rgba(254, 193, 52, 0.15) 0%, rgba(254, 193, 52, 0.08) 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Toast glass effect */
.sa-theme-premium .sa-toast {
	background: linear-gradient(180deg, rgba(1, 30, 73, 0.98) 0%, rgba(1, 20, 50, 0.99) 100%);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(254, 193, 52, 0.1);
}

/* Scrollbar styling */
.sa-theme-premium ::-webkit-scrollbar-thumb {
	background: linear-gradient(180deg, rgba(1, 52, 117, 0.3) 0%, rgba(1, 52, 117, 0.4) 100%);
}

.sa-theme-premium ::-webkit-scrollbar-thumb:hover {
	background: linear-gradient(180deg, rgba(1, 52, 117, 0.4) 0%, rgba(254, 193, 52, 0.4) 100%);
}

/* Focus rings */
.sa-theme-premium *:focus-visible {
	outline: 2px solid rgba(254, 193, 52, 0.5);
}

/* Text selection */
.sa-theme-premium ::selection {
	background: rgba(254, 193, 52, 0.3);
	color: #013475;
}

/* Audit table row hover */
.sa-theme-premium .sa-audit-table tbody tr:hover {
	background: linear-gradient(90deg, rgba(248, 251, 255, 0.9) 0%, rgba(240, 247, 255, 0.95) 100%) !important;
}

/* Modal panel gradients */
.sa-theme-premium .sa-audit-value-modal-panel,
.sa-theme-premium .sa-audit-footprint-modal-panel {
	background: linear-gradient(180deg, #ffffff 0%, #fafcff 100%);
	box-shadow: 0 30px 60px rgba(1, 52, 117, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

/* Loading shimmer */
.sa-theme-premium .sa-action-btn.loading::after,
.sa-theme-premium .sa-settings-btn.loading::after {
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
	animation: shimmer 1.5s infinite;
}

@keyframes shimmer {
	0% { left: -100%; }
	100% { left: 200%; }
}

/* Nav icon glow */
.sa-theme-premium .sa-nav-link.is-active .sa-nav-icon svg {
	filter: drop-shadow(0 0 6px rgba(254, 193, 52, 0.6));
}

/* =========================================================
   PREMIUM EXECUTIVE OVERRIDE (FINAL)
   ========================================================= */

.sa-theme-premium {
	background:
		radial-gradient(900px 420px at 12% -8%, rgba(1, 52, 117, 0.1), transparent 62%),
		radial-gradient(700px 360px at 92% 0%, rgba(254, 193, 52, 0.12), transparent 58%),
		linear-gradient(180deg, #f6f9ff 0%, #eef3f9 100%) !important;
}

.sa-theme-premium #sa-main-wrapper > header {
	background: #ffffff !important;
	border-bottom: 1px solid rgba(1, 52, 117, 0.08) !important;
	box-shadow: 0 6px 18px rgba(1, 52, 117, 0.08) !important;
}

.sa-theme-premium #sa-main-wrapper > main {
	background: rgba(255, 255, 255, 0.96);
	border: 1px solid rgba(1, 52, 117, 0.08);
	border-radius: 18px;
	box-shadow: 0 18px 36px rgba(1, 52, 117, 0.12);
	margin: 14px;
	padding: 1.25rem !important;
	overflow-x: auto;
}

@media (max-width: 640px) {
	.sa-theme-premium #sa-main-wrapper > main {
		margin: 10px;
		border-radius: 14px;
		padding: 1rem !important;
	}
}

.sa-theme-premium .sa-header-profile {
	background: rgba(255, 255, 255, 0.95);
	border: 1px solid rgba(1, 52, 117, 0.12);
	border-radius: 999px;
	padding: 0.3rem 0.5rem;
	box-shadow: 0 8px 18px rgba(1, 52, 117, 0.08);
}

.sa-theme-premium .sa-nav-link {
	border-radius: 12px !important;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
}

.sa-theme-premium .sa-nav-link:hover {
	background: rgba(255, 255, 255, 0.1);
	border-color: rgba(255, 255, 255, 0.16);
}

.sa-theme-premium .sa-nav-link.is-active {
	background: linear-gradient(120deg, rgba(254, 193, 52, 0.28), rgba(254, 193, 52, 0.1)) !important;
	border-color: rgba(254, 193, 52, 0.5) !important;
	box-shadow: 0 8px 18px rgba(254, 193, 52, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}

.sa-theme-premium .sa-card {
	border-radius: 16px !important;
	border: 1px solid rgba(1, 52, 117, 0.12) !important;
	box-shadow: 0 10px 24px rgba(1, 52, 117, 0.1), 0 2px 6px rgba(1, 52, 117, 0.06) !important;
}

.sa-theme-premium .sa-card::before {
	height: 3px !important;
	border-radius: 16px 16px 0 0 !important;
}

.sa-theme-premium .sa-action-btn {
	border-radius: 10px !important;
	border: 1px solid rgba(1, 52, 117, 0.14) !important;
	box-shadow: 0 2px 6px rgba(1, 52, 117, 0.08) !important;
}

.sa-theme-premium .sa-action-btn.bg-brand-blue {
	box-shadow: 0 10px 22px rgba(1, 52, 117, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}

.sa-theme-premium input,
.sa-theme-premium select,
.sa-theme-premium textarea {
	background: #f9fbff !important;
	border: 1px solid rgba(1, 52, 117, 0.14) !important;
}

.sa-theme-premium [data-sa-notification-toggle] .absolute {
	animation: none !important;
}

/* Modern polish - keep palette */
.sa-theme-premium {
	--sa-radius-lg: 18px;
	--sa-radius-md: 12px;
	--sa-radius-sm: 10px;
	--sa-ease-standard: cubic-bezier(0.2, 0.8, 0.2, 1);
}

.sa-theme-premium .sa-card,
.sa-theme-premium .sa-approval-modal,
.sa-theme-premium .sa-profile-menu,
.sa-theme-premium [data-sa-notification-menu],
.sa-theme-premium .sa-audit-value-modal-panel,
.sa-theme-premium .sa-audit-footprint-modal-panel {
	border-radius: var(--sa-radius-lg) !important;
}

.sa-theme-premium .sa-nav-link {
	border-radius: var(--sa-radius-md) !important;
	transition: background-color 180ms var(--sa-ease-standard), border-color 180ms var(--sa-ease-standard), box-shadow 180ms var(--sa-ease-standard), transform 180ms var(--sa-ease-standard);
}

.sa-theme-premium .sa-action-btn,
.sa-theme-premium .sa-action-btn-sm,
.sa-theme-premium .sa-control,
.sa-theme-premium input,
.sa-theme-premium select,
.sa-theme-premium textarea,
.sa-theme-premium .sa-table-pagination-btn,
.sa-theme-premium .sa-navbar-control,
.sa-theme-premium .sa-profile-trigger {
	border-radius: var(--sa-radius-sm) !important;
	transition: box-shadow 180ms var(--sa-ease-standard), border-color 180ms var(--sa-ease-standard), transform 180ms var(--sa-ease-standard), background-color 180ms var(--sa-ease-standard);
}

.sa-theme-premium .sa-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 18px 34px rgba(1, 52, 117, 0.14) !important;
}

.sa-theme-premium .sa-action-btn:hover,
.sa-theme-premium .sa-action-btn-sm:hover {
	transform: translateY(-1px);
	box-shadow: 0 10px 20px rgba(1, 52, 117, 0.12) !important;
}

.sa-theme-premium .sa-action-btn:active,
.sa-theme-premium .sa-action-btn-sm:active {
	transform: translateY(0);
}

.sa-theme-premium .sa-header-title-block h1,
.sa-theme-premium .sa-section-title {
	letter-spacing: -0.01em;
}

.sa-theme-premium .sa-nav-label,
.sa-theme-premium .sa-header-profile span {
	letter-spacing: 0.01em;
}

/* =========================================================
   CLEAN MODERN GLOBAL OVERRIDE (ALL ROLES)
   ========================================================= */

.sa-theme-premium {
	--sa-surface: #ffffff;
	--sa-surface-soft: #f8fbff;
	--sa-surface-muted: #f2f6ff;
	--sa-border: rgba(1, 52, 117, 0.12);
	--sa-border-strong: rgba(1, 52, 117, 0.2);
	--sa-shadow-1: 0 1px 2px rgba(1, 52, 117, 0.06);
	--sa-shadow-2: 0 10px 24px rgba(1, 52, 117, 0.12);
	--sa-shadow-3: 0 18px 36px rgba(1, 52, 117, 0.16);
}

.sa-theme-premium #sa-main-wrapper > header {
	background: var(--sa-surface) !important;
	border-bottom: 1px solid var(--sa-border) !important;
	box-shadow: var(--sa-shadow-1) !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

.sa-theme-premium #sa-main-wrapper > main {
	background: var(--sa-surface) !important;
	border: 1px solid var(--sa-border) !important;
	box-shadow: var(--sa-shadow-2) !important;
}

.sa-theme-premium #sa-sidebar,
.sa-theme-premium #sa-mobile-sidebar {
	box-shadow: 2px 0 18px rgba(0, 0, 0, 0.22) !important;
	border-right: 1px solid rgba(254, 193, 52, 0.12) !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

.sa-theme-premium .sa-card,
.sa-theme-premium .sa-approval-modal,
.sa-theme-premium .sa-profile-menu,
.sa-theme-premium [data-sa-notification-menu],
.sa-theme-premium .sa-audit-value-modal-panel,
.sa-theme-premium .sa-audit-footprint-modal-panel,
.sa-theme-premium .sa-settings-card {
	background: var(--sa-surface) !important;
	border: 1px solid var(--sa-border) !important;
	box-shadow: var(--sa-shadow-2) !important;
}

.sa-theme-premium .sa-card::before {
	height: 2px !important;
	background: linear-gradient(90deg, var(--sa-yellow) 0%, rgba(1, 52, 117, 0.25) 70%, transparent 100%) !important;
}

.sa-theme-premium .sa-nav-link {
	background: rgba(255, 255, 255, 0.04) !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: none !important;
}

.sa-theme-premium .sa-nav-link:hover {
	background: rgba(255, 255, 255, 0.1) !important;
	border-color: rgba(255, 255, 255, 0.16) !important;
}

.sa-theme-premium .sa-nav-link.is-active {
	background: linear-gradient(120deg, rgba(254, 193, 52, 0.26), rgba(254, 193, 52, 0.08)) !important;
	border-color: rgba(254, 193, 52, 0.5) !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}

.sa-theme-premium .sa-action-btn,
.sa-theme-premium .sa-action-btn-sm,
.sa-theme-premium .sa-table-pagination-btn,
.sa-theme-premium .sa-navbar-control,
.sa-theme-premium .sa-profile-trigger {
	background: #ffffff !important;
	border: 1px solid var(--sa-border) !important;
	box-shadow: var(--sa-shadow-1) !important;
}

.sa-theme-premium .sa-action-btn.bg-brand-blue {
	background: #013475 !important;
	border-color: rgba(254, 193, 52, 0.4) !important;
	color: #ffffff !important;
	box-shadow: 0 8px 18px rgba(1, 52, 117, 0.25) !important;
}

.sa-theme-premium .sa-action-btn.bg-brand-blue:hover {
	background: #01479f !important;
	box-shadow: 0 12px 22px rgba(1, 52, 117, 0.3) !important;
}

.sa-theme-premium .sa-action-btn.bg-white {
	background: #ffffff !important;
	border-color: var(--sa-border-strong) !important;
}

.sa-theme-premium .sa-control,
.sa-theme-premium input,
.sa-theme-premium select,
.sa-theme-premium textarea {
	background: #ffffff !important;
	border: 1px solid var(--sa-border) !important;
	box-shadow: inset 0 1px 2px rgba(1, 52, 117, 0.04) !important;
}

.sa-theme-premium input:focus,
.sa-theme-premium select:focus,
.sa-theme-premium textarea:focus {
	border-color: #013475 !important;
	box-shadow: 0 0 0 3px rgba(254, 193, 52, 0.22) !important;
}

.sa-theme-premium .sa-data-table,
.sa-theme-premium .sa-payroll-table {
	background: #ffffff !important;
	border: 1px solid var(--sa-border) !important;
	border-radius: var(--sa-radius-lg) !important;
	box-shadow: var(--sa-shadow-1) !important;
}

.sa-theme-premium thead.bg-brand-blue,
.sa-theme-premium .sa-dashboard-table-head {
	background: #013475 !important;
	box-shadow: inset 0 -2px 0 rgba(254, 193, 52, 0.55) !important;
}

.sa-theme-premium .sa-data-table tbody tr:hover,
.sa-theme-premium .sa-payroll-table tbody tr:hover {
	background: var(--sa-surface-soft) !important;
}

.sa-theme-premium .sa-table-pagination {
	background: #ffffff !important;
	border: 1px solid var(--sa-border) !important;
	box-shadow: var(--sa-shadow-1) !important;
}

.sa-theme-premium .sa-subnav-link,
.sa-theme-premium .sa-status-chip,
.sa-theme-premium .sa-badge,
.sa-theme-premium .sa-role-pill,
.sa-theme-premium .sa-user-avatar {
	background: var(--sa-surface-soft) !important;
	border: 1px solid var(--sa-border) !important;
	box-shadow: none !important;
}

.sa-theme-premium .sa-toolbar,
.sa-theme-premium .sa-section-head {
	background: var(--sa-surface) !important;
	border-bottom: 1px solid var(--sa-border) !important;
	box-shadow: none !important;
}

.sa-theme-premium [data-sa-notification-toggle] .absolute {
	animation: none !important;
}

.sa-theme-premium *:focus-visible {
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(254, 193, 52, 0.25) !important;
}

/* Tailwind utility normalization for role pages */
.sa-theme-premium .btn-radius-3 {
	border-radius: var(--sa-radius-sm) !important;
}

.sa-theme-premium :where(
	.rounded,
	.rounded-sm,
	.rounded-md,
	.rounded-lg,
	.rounded-xl,
	.rounded-2xl,
	.rounded-\[6px\],
	.rounded-\[8px\],
	.rounded-\[10px\],
	.rounded-\[12px\],
	.rounded-\[14px\],
	.rounded-\[16px\],
	.rounded-\[18px\]
) {
	border-radius: var(--sa-radius-sm) !important;
}

.sa-theme-premium :where(.rounded-full, .rounded-\[999px\]) {
	border-radius: 999px !important;
}

.sa-theme-premium :where(.shadow, .shadow-sm, .shadow-md, .shadow-lg, .shadow-xl, .shadow-2xl) {
	box-shadow: var(--sa-shadow-1) !important;
}

.sa-theme-premium :where(
	.border-brand-blue\/10,
	.border-brand-blue\/20,
	.border-brand-blue\/25,
	.border-brand-blue\/30,
	.border-brand-blue\/40,
	.border-brand-blue\/50
) {
	border-color: var(--sa-border) !important;
}

.sa-theme-premium :where(.bg-white) {
	background: var(--sa-surface) !important;
}

.sa-theme-premium :where(.bg-gray-50, .bg-gray-100) {
	background: var(--sa-surface-soft) !important;
}

.sa-theme-premium :where(.bg-\[\#f8fbff\], .bg-\[\#f0f7ff\], .bg-\[\#f0f4f8\]) {
	background: var(--sa-surface-soft) !important;
}
