/**
 * Citelayer® — Admin Notices (Globaler Scope)
 *
 * Dedizierte CSS-Datei für Compatibility-Notices.
 * Wird auf allen relevanten Admin-Seiten geladen (plugins.php, Citelayer-Seiten).
 * Enthält NUR Notice-Styles — kein Plugin-Settings-CSS.
 *
 * WICHTIG: Diese Styles müssen auf dem Standard-WordPress-Admin funktionieren
 * (weißer/heller Hintergrund). Kein Dark-Theme voraussetzen.
 *
 * Selektoren:
 *   .citelayer-compat-notice       — Blaue Info-Notice (SEO-Plugin erkannt)
 *   .citelayer-override-warning    — Amber Warning (Override aktiv)
 *   .citelayer-multi-plugin-warning — Rote Conflict-Notice (mehrere SEO-Plugins)
 *
 * @since 0.3.2
 */

/* --- Info-Banner (blau) — Detection Notice --- */
.citelayer-compat-notice {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	background: #f0f6fc;
	border: 1px solid #c3daf5;
	border-left: 4px solid #2271b1;
	border-radius: 4px;
	padding: 12px 36px 12px 16px;
	margin: 15px 0;
	position: relative;
	font-size: 13px;
	line-height: 1.6;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
}

/* --- Override Warning (amber) --- */
.citelayer-override-warning {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	background: #fef8ee;
	border: 1px solid #f0d9a8;
	border-left: 4px solid #dba617;
	border-radius: 4px;
	padding: 12px 36px 12px 16px;
	margin: 15px 0;
	position: relative;
	font-size: 13px;
	line-height: 1.6;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
}

/* --- Conflict Banner (rot) — Multiple Plugins --- */
.citelayer-multi-plugin-warning {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	background: #fcf0f1;
	border: 1px solid #f0c4c5;
	border-left: 4px solid #d63638;
	border-radius: 4px;
	padding: 12px 16px;
	margin: 15px 0;
	position: relative;
	font-size: 13px;
	line-height: 1.6;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
}

/* --- Dashicons --- */
.citelayer-compat-notice > .dashicons,
.citelayer-override-warning > .dashicons,
.citelayer-multi-plugin-warning > .dashicons {
	flex-shrink: 0;
	font-size: 20px;
	width: 20px;
	height: 20px;
	margin-top: 2px;
}

.citelayer-compat-notice > .dashicons { color: #2271b1; }
.citelayer-override-warning > .dashicons { color: #b26200; }
.citelayer-multi-plugin-warning > .dashicons { color: #d63638; }

/* --- Content-Container --- */
.citelayer-compat-notice .citelayer-notice-content,
.citelayer-override-warning .citelayer-notice-content,
.citelayer-multi-plugin-warning .citelayer-notice-content {
	flex: 1;
}

.citelayer-compat-notice .citelayer-notice-content p,
.citelayer-override-warning .citelayer-notice-content p,
.citelayer-multi-plugin-warning .citelayer-notice-content p {
	margin: 0 0 6px 0;
	color: #1d2327;
}

.citelayer-compat-notice .citelayer-notice-content p:last-child,
.citelayer-override-warning .citelayer-notice-content p:last-child,
.citelayer-multi-plugin-warning .citelayer-notice-content p:last-child {
	margin-bottom: 0;
}

.citelayer-compat-notice .citelayer-notice-content strong,
.citelayer-override-warning .citelayer-notice-content strong,
.citelayer-multi-plugin-warning .citelayer-notice-content strong {
	color: #1d2327;
	font-weight: 600;
}

/* --- Feature-Liste --- */
.citelayer-notice-list {
	list-style: disc;
	margin: 6px 0 6px 20px;
	padding: 0;
	color: #50575e;
}

.citelayer-notice-list li {
	margin: 3px 0;
	color: #50575e;
}

/* --- Links --- */
.citelayer-compat-notice a {
	color: #2271b1;
	font-weight: 600;
	text-decoration: none;
}

.citelayer-compat-notice a:hover {
	color: #135e96;
	text-decoration: underline;
}

.citelayer-override-warning a {
	color: #b26200;
	font-weight: 600;
	text-decoration: none;
}

.citelayer-override-warning a:hover {
	color: #8a4d00;
	text-decoration: underline;
}

.citelayer-multi-plugin-warning a {
	color: #d63638;
	font-weight: 600;
	text-decoration: none;
}

.citelayer-multi-plugin-warning a:hover {
	color: #a41e1f;
	text-decoration: underline;
}

/* --- Dismiss-Button --- */
.citelayer-compat-notice .notice-dismiss,
.citelayer-override-warning .notice-dismiss,
.citelayer-multi-plugin-warning .notice-dismiss {
	top: 8px;
	right: 8px;
	padding: 8px;
	color: #787c82;
}

.citelayer-compat-notice .notice-dismiss:hover,
.citelayer-override-warning .notice-dismiss:hover,
.citelayer-multi-plugin-warning .notice-dismiss:hover {
	color: #d63638;
}

/* --- Responsive --- */
@media (max-width: 782px) {
	.citelayer-compat-notice,
	.citelayer-override-warning,
	.citelayer-multi-plugin-warning {
		flex-direction: column;
		gap: 8px;
		padding: 12px;
	}
}