.wt-settings #pane-system {
	--wt-pane-accent-rgb: 13, 110, 253;
}

.wachapp-windows-system-card {
	overflow: hidden;
}

.wachapp-windows-system-icon,
.wachapp-windows-system-choice-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	border: 1px solid rgba(var(--bs-primary-rgb), .18);
	background-color: var(--bs-primary-bg-subtle);
	color: var(--bs-primary-text-emphasis);
}

.wachapp-windows-system-icon {
	width: 2.75rem;
	height: 2.75rem;
	font-size: 1.15rem;
	border-radius: .9rem;
}

.wachapp-windows-system-choice-icon {
	width: 2.35rem;
	height: 2.35rem;
	border-radius: .75rem;
}

.wachapp-windows-system-option-list {
	overflow: hidden;
	border: 1px solid var(--bs-border-color);
	border-radius: 1rem;
}

.wachapp-windows-system-option-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1rem;
	background-color: var(--bs-body-bg);
}

.wachapp-windows-system-option-row + .wachapp-windows-system-option-row {
	border-top: 1px solid var(--bs-border-color);
}

.wachapp-windows-system-option-row.is-disabled {
	opacity: .58;
	background-color: var(--bs-tertiary-bg);
}

.wachapp-windows-system-option-row .form-check-input {
	width: 2.7em;
	height: 1.4em;
	margin-top: 0;
}

.wachapp-windows-system-choice {
	display: flex;
	align-items: flex-start;
	gap: .85rem;
	padding: 1rem;
	border: 1px solid var(--bs-border-color);
	border-radius: 1rem;
	background-color: var(--bs-body-bg);
	cursor: pointer;
	transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}

.wachapp-windows-system-choice:hover {
	border-color: rgba(var(--bs-primary-rgb), .5);
	background-color: var(--bs-tertiary-bg);
}

.wt-settings .btn-check:checked + .wachapp-windows-system-choice {
	border-color: rgba(var(--bs-primary-rgb), .75);
	background-color: var(--bs-primary-bg-subtle);
	box-shadow: inset 0 0 0 1px rgba(var(--bs-primary-rgb), .14);
}

.wt-settings .btn-check:focus-visible + .wachapp-windows-system-choice {
	box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), .18);
}

.wachapp-windows-system-information {
	overflow: hidden;
	border: 1px solid var(--bs-border-color);
	border-radius: 1rem;
}

.wachapp-windows-system-information > div {
	display: grid;
	grid-template-columns: minmax(10rem, .7fr) minmax(0, 1.3fr);
	gap: 1rem;
	padding: .85rem 1rem;
	background-color: var(--bs-body-bg);
}

.wachapp-windows-system-information > div + div {
	border-top: 1px solid var(--bs-border-color);
}

.wachapp-windows-system-information span {
	color: var(--bs-secondary-color);
}

.wachapp-windows-system-information strong {
	min-width: 0;
	font-weight: 600;
	text-align: right;
	overflow-wrap: anywhere;
}

@media (max-width: 575.98px) {
	.wachapp-windows-system-option-row {
		align-items: flex-start;
	}

	.wachapp-windows-system-information > div {
		grid-template-columns: 1fr;
		gap: .25rem;
	}

	.wachapp-windows-system-information strong {
		text-align: left;
	}
}

.wachapp-windows-diagnostics-information {
	overflow: hidden;
	border: 1px solid var(--bs-border-color);
	border-radius: 1rem;
}

.wachapp-windows-diagnostics-information > div {
	display: grid;
	grid-template-columns: minmax(10rem, .7fr) minmax(0, 1.3fr);
	gap: 1rem;
	padding: .85rem 1rem;
	background-color: var(--bs-body-bg);
}

.wachapp-windows-diagnostics-information > div + div {
	border-top: 1px solid var(--bs-border-color);
}

.wachapp-windows-diagnostics-information span {
	color: var(--bs-secondary-color);
}

.wachapp-windows-diagnostics-information strong {
	min-width: 0;
	font-weight: 600;
	text-align: right;
	overflow-wrap: anywhere;
}

@media (max-width: 575.98px) {
	.wachapp-windows-diagnostics-information > div {
		grid-template-columns: 1fr;
		gap: .25rem;
	}

	.wachapp-windows-diagnostics-information strong {
		text-align: left;
	}
}


/*
 * Schließverhalten: Der aktive Zustand muss auch bei schwachem Kontrast,
 * Light-Mode und unterschiedlichen WebView2-Farbprofilen sofort erkennbar sein.
 * Deshalb wird der native Radiozustand zusätzlich als explizite UI-Klasse
 * gespiegelt und mit Check-Indikator dargestellt.
 */
.wachapp-windows-system-choice {
	position: relative;
	min-width: 0;
}

.wachapp-windows-system-choice-check {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	margin-left: auto;
	border: 1px solid var(--bs-border-color);
	border-radius: 50%;
	background-color: var(--bs-body-bg);
	color: transparent;
	font-size: 1rem;
	line-height: 1;
	flex: 0 0 auto;
	transition: border-color .15s ease, background-color .15s ease, color .15s ease, transform .15s ease;
}

.wt-settings .btn-check:checked + .wachapp-windows-system-choice,
.wachapp-windows-system-choice.is-selected {
	border-color: var(--bs-primary) !important;
	background-color: rgba(var(--bs-primary-rgb), .12) !important;
	box-shadow: inset 4px 0 0 var(--bs-primary), inset 0 0 0 1px rgba(var(--bs-primary-rgb), .28) !important;
}

.wt-settings .btn-check:checked + .wachapp-windows-system-choice .wachapp-windows-system-choice-icon,
.wachapp-windows-system-choice.is-selected .wachapp-windows-system-choice-icon {
	border-color: rgba(var(--bs-primary-rgb), .55);
	background-color: var(--bs-primary);
	color: #fff;
}

.wt-settings .btn-check:checked + .wachapp-windows-system-choice .wachapp-windows-system-choice-check,
.wachapp-windows-system-choice.is-selected .wachapp-windows-system-choice-check {
	border-color: var(--bs-primary);
	background-color: var(--bs-primary);
	color: #fff;
	transform: scale(1.03);
}

@media (max-width: 575.98px) {
	.wachapp-windows-system-choice {
		gap: .7rem;
	}

	.wachapp-windows-system-choice-check {
		width: 1.8rem;
		height: 1.8rem;
	}
}
