.perks-shell .perk-controls-panel {
	background: var(--ca-surface);
	border: 1px solid var(--ca-border);
	border-radius: 0.5rem;
	padding: 1.25rem;
	margin-bottom: 1rem;
}

.perks-intro {
	color: #9ec1ef;
}

.perks-shell .level-control {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}

.perks-shell .level-slider-row {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.perks-shell .level-slider-row .level-bound {
	color: #9ec1ef;
	font-size: 0.85rem;
	min-width: 1.75rem;
	text-align: center;
	user-select: none;
}

.perks-shell .level-slider-row .form-range {
	flex: 1 1 auto;
	margin: 0;
	accent-color: #5b94f0;
}

.perks-shell .nav-tabs {
	border-bottom-color: var(--ca-border);
}

.perks-shell .nav-tabs .nav-link {
	color: var(--ca-text-muted);
	border-color: transparent;
}

.perks-shell .nav-tabs .nav-link.active {
	color: var(--ca-text);
	background: var(--ca-surface);
	border-color: var(--ca-border) var(--ca-border) var(--ca-surface);
}

.perks-shell .perk-tab-panel {
	background: var(--ca-surface);
	border: 1px solid var(--ca-border);
	border-top: 0;
	border-radius: 0 0 0.5rem 0.5rem;
	padding: 1rem;
	max-height: 420px;
	overflow-y: auto;
}

.perks-shell .perk-results-panel {
	background: var(--ca-surface);
	border: 1px solid var(--ca-border);
	border-radius: 0.5rem;
	padding: 1.25rem;
	min-height: 420px;
	color: #c5d8f2;
}

.perks-shell .perk-group-card {
	background: var(--ca-surface-2);
	border: 1px solid var(--ca-border);
	border-radius: 0.375rem;
	margin-bottom: 0.75rem;
}

.perks-shell .perk-group-card .card-header {
	background: rgba(0, 0, 0, 0.15);
	border-bottom: 1px solid var(--ca-border);
	padding: 0.5rem 0.75rem;
}

.perks-shell .perk-group-card .card-body {
	padding: 0.75rem;
}

.perks-shell .form-check-label {
	color: #c5d8f2;
}

.perks-shell .form-check-input:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.perks-shell .perk-tab-panel.perk-sl-full::after,
.perks-shell .perk-tab-panel.perk-ai-full::after {
	content: '';
	pointer-events: none;
}

.perks-shell .form-check-input:disabled + .form-check-label {
	font-style: italic;
	color: var(--ca-text-muted);
}

.perks-shell .perk-cap-note {
	color: #9ec1ef;
	font-size: 0.85rem;
}

.perks-shell .perk-used-badge {
	font-size: 0.9rem;
}

.perks-shell .perk-ai-label {
	font-style: italic;
	color: #5cb85c;
}

.perks-shell .form-check-label.perk-ai-name {
	color: #5cb85c !important;
}

.perks-shell .form-check-input:disabled + .form-check-label.perk-ai-name {
	color: #3d7a3d !important;
}

.perks-shell .perk-action-icon {
	color: #e74c3c;
}

.perks-shell .perk-toolbar .badge {
	cursor: pointer;
	user-select: none;
}

.perks-shell #perkActionResults,
.perks-shell #perkActionResults * {
	color: #c5d8f2;
}

.perks-shell #perkActionResults img {
	width: 24px;
	height: 24px;
}

.perks-shell #perkActionResults a {
	color: #7eb6ff;
}

.perks-shell .dataTables_wrapper,
.perks-shell .dataTables_wrapper label,
.perks-shell .dataTables_info,
.perks-shell .dataTables_length,
.perks-shell .dataTables_filter,
.perks-shell .dataTables_paginate {
	color: #9ec1ef !important;
}

.perks-shell .dataTables_wrapper .form-control,
.perks-shell .dataTables_wrapper .form-select,
.perks-shell .dataTables_filter input,
.perks-shell .dataTables_length select {
	background: var(--ca-input-bg);
	border-color: var(--ca-input-border);
	color: #c5d8f2;
}

.perks-shell table.table,
.perks-shell table.dataTable,
.perks-shell table.dataTable thead th,
.perks-shell table.dataTable tbody td,
.perks-shell #data-table-default th,
.perks-shell #data-table-default td {
	color: #9ec1ef !important;
	border-color: var(--ca-border) !important;
	background-color: transparent !important;
}

.perks-shell table.dataTable thead th {
	color: #b9d2f5 !important;
}

.perks-shell table.dataTable.table-striped > tbody > tr:nth-of-type(odd) > * {
	color: #9ec1ef !important;
	--bs-table-accent-bg: rgba(255, 255, 255, 0.03);
	background-color: rgba(255, 255, 255, 0.03) !important;
}

.perks-shell .dataTables_wrapper .page-link {
	background: var(--ca-surface-2);
	border-color: var(--ca-border);
	color: #9ec1ef;
}

.perks-shell .dataTables_wrapper .page-item.active .page-link {
	background: #3d7ee6;
	border-color: #3d7ee6;
	color: #fff;
}

@media (max-width: 768px) {
	.perks-shell .perk-used-badge {
		font-size: 0.75rem;
		display: block;
		margin-top: 0.5rem;
	}

	.perks-shell .perk-toolbar-actions {
		float: none !important;
		margin-top: 0.75rem;
	}
}
