/* =========================================================
   Handball.net Widgets – Gelb/Schwarz Theme
   ========================================================= */

.hnw-widget-wrap.hnw-theme-yellow-black {
	--hnw-yellow: #ffd500;
	--hnw-yellow-dark: #e6c000;
	--hnw-black: #111111;
	--hnw-dark-grey: #1c1c1c;
	--hnw-light-grey: #f7f7f7;
	--hnw-border: #2b2b2b;
	--hnw-radius: 10px;

	margin: 24px 0;
	border-radius: var(--hnw-radius);
	overflow: hidden;
	font-family: inherit;
	background: transparent;
}

/* Titelzeile oberhalb des Widgets */
.hnw-widget-wrap .hnw-widget-title {
	background: var(--hnw-black);
	color: var(--hnw-yellow);
	font-weight: 700;
	font-size: 15px;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	padding: 10px 16px;
	border-bottom: 3px solid var(--hnw-yellow);
	display: flex;
	align-items: center;
}

.hnw-widget-wrap .hnw-widget-title::before {
	content: "";
	display: inline-block;
	width: 10px;
	height: 10px;
	margin-right: 8px;
	background: var(--hnw-yellow);
	border-radius: 50%;
}

/* Innerer Bereich, in den handball.net das eigentliche Widget lädt */
.hnw-widget-wrap .hnw-widget-inner {
	background: transparent;
	padding: 0;
}

.hnw-widget-wrap .hnw-widget-container {
	min-height: 60px;
	background: transparent;
}

/* Kleiner Lade-Platzhalter, solange das externe Skript noch nichts eingefügt hat */
.hnw-widget-wrap .hnw-widget-container:empty::before {
	content: "Lädt Spieldaten von handball.net …";
	display: block;
	padding: 18px 4px;
	color: #777;
	font-size: 13px;
	font-style: italic;
	text-align: center;
}

/* =========================================================
   Best-effort-Styling der von handball.net eingefügten Inhalte.
   Handball.net rendert i. d. R. semantisches HTML (Tabellen, Links,
   Listen). Da sich die genaue Struktur ändern kann, greifen wir
   bewusst breit auf generische Elemente innerhalb des Containers zu.
   ========================================================= */

.hnw-widget-container table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}

.hnw-widget-container thead th,
.hnw-widget-container th {
	background: var(--hnw-black) !important;
	color: var(--hnw-yellow) !important;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 12px;
	letter-spacing: 0.02em;
	padding: 8px 10px !important;
	border: none !important;
}

.hnw-widget-container td {
	padding: 8px 10px !important;
	border-bottom: 1px solid #eee !important;
	color: var(--hnw-black);
}

.hnw-widget-container tbody tr:nth-child(even) {
	background: rgba(0, 0, 0, 0.04);
}

.hnw-widget-container tbody tr:hover {
	background: rgba(255, 213, 0, 0.15);
}

/* Eigenes Team / hervorgehobene Zeile in Tabellen-Widgets */
.hnw-widget-container tr.highlight,
.hnw-widget-container tr[class*="own"],
.hnw-widget-container tr[class*="highlight"] {
	background: var(--hnw-yellow) !important;
	font-weight: 700;
	color: var(--hnw-black) !important;
}

/* Links innerhalb des Widgets (z. B. Team-/Spielnamen) */
.hnw-widget-container a {
	color: var(--hnw-black);
	text-decoration: none;
	border-bottom: 1px solid var(--hnw-yellow);
	transition: color 0.15s ease, border-color 0.15s ease;
}

.hnw-widget-container a:hover {
	color: var(--hnw-yellow-dark);
	border-color: var(--hnw-black);
}

/* Ergebnis-/Score-Badges */
.hnw-widget-container [class*="score"],
.hnw-widget-container [class*="result"] {
	display: inline-block;
	background: var(--hnw-black);
	color: var(--hnw-yellow);
	font-weight: 700;
	border-radius: 4px;
	padding: 2px 8px;
}

/* Live-Kennzeichnung */
.hnw-widget-container [class*="live"] {
	color: #d40000 !important;
	font-weight: 700;
}

/* Responsives Verhalten */
@media (max-width: 480px) {
	.hnw-widget-container table,
	.hnw-widget-container thead,
	.hnw-widget-container tbody,
	.hnw-widget-container th,
	.hnw-widget-container td,
	.hnw-widget-container tr {
		display: block;
	}

	.hnw-widget-container thead {
		display: none;
	}

	.hnw-widget-container tr {
		margin-bottom: 10px;
		border: 1px solid #eee;
		border-radius: 6px;
		overflow: hidden;
	}
}

/* Fehleranzeige (nur für Redakteure/Admins sichtbar) */
.hnw-widget-wrap.hnw-error {
	background: #fff3f3;
	color: #a30000;
	padding: 14px 16px;
	font-size: 14px;
	border: 2px dashed #a30000;
}