/* Eigene Korrekturen (wird von YOOtheme automatisch nach theme.css geladen) */

/* Desktop-Header auf schmaleren Bildschirmen (z. B. iPad quer): Menü bleibt in einer Zeile neben dem Logo */
@media (min-width: 960px) and (max-width: 1279px) {
	.tm-header .uk-navbar-left { gap: 20px; }
	.tm-header .uk-navbar-right { flex-wrap: nowrap; gap: 16px; }
	.tm-header .uk-navbar-nav { gap: 14px; }
	.tm-header .uk-navbar-nav > li > a { font-size: 15px; white-space: nowrap; }
	.tm-header .uk-logo img { width: 140px; height: auto; }
}

/* Mobiler Header (Handy, iPad hoch): Logo passt in die Leiste */
@media (max-width: 959px) {
	.tm-header-mobile .uk-logo img { width: auto; height: 64px; }
}

/* Startseite Desktop: Livestream/Interpret/Titel und Play-Button 50px höher, Textblock kompakter und besser lesbar */
@media (min-width: 960px) {
	.uk-container > .uk-grid:has(#player_artist) { margin-top: -50px; }
	/* Ausgleich, damit die Hero-Grafik ihre volle Höhe behält und unten nicht abgeschnitten wird */
	.uk-section:has(#player_artist) { padding-bottom: 115px; }
	/* Buttonreihe Musikwunsch / Kick-Tipp / radio.de / Radioplayer: Abstand zwischen den Buttons halbiert */
	.uk-grid:has(a[href="/musik/musikwunsch"]):has([onclick="radioplayer();"]) { justify-content: center; margin-left: 0; column-gap: 14px; }
	/* Buttons 1/5 schmaler: 160px statt 200px (Selektor mit :has(#player_artist), damit er die bestehenden #page-Regeln schlägt) */
	.uk-grid:has(a[href="/musik/musikwunsch"]):has([onclick="radioplayer();"]) > * { flex: none; width: 160px; padding-left: 0; }
	.uk-section:has(#player_artist) .uk-grid:has(a[href="/musik/musikwunsch"]):has([onclick="radioplayer();"]) > * :is(.el-content, a.el-link) { width: 160px !important; padding-left: 10px; padding-right: 10px; box-sizing: border-box; }
	.uk-grid h3.rsp-player-channel { margin-bottom: 0 !important; }
	.uk-grid #player_artist { margin-top: 2px !important; margin-bottom: 0 !important; line-height: 1.1; }
	.uk-grid #player_title { margin-top: 4px !important; line-height: 1.15; }
	.uk-grid h3.rsp-player-channel, .uk-grid #player_artist, .uk-grid #player_title { text-shadow: 0 0 10px rgba(255,255,255,.9), 0 0 2px rgba(255,255,255,.9); }
}

/* Moderatorbild in der Toolbar: flacher oranger Ring mit schmalem Abstand */
.tm-toolbar #mod_img { box-sizing: border-box; padding: 3px; border: 3px solid #fc8800; background: transparent; object-fit: cover; }

/* ===== Mobil-Optimierungen (Handy bis 639px) ===== */
@media (max-width: 639px) {
	/* Blocksatz erzeugt auf schmalen Displays große Lücken -> linksbündig */
	.uk-text-justify { text-align: left !important; hyphens: auto; }

	/* Charts / Schlagerparade: kompaktere Listeneinträge, Titel bekommt den Platz, nichts läuft über */
	.rsp-chart-position-now { display: flex !important; align-items: center; justify-content: center; min-width: 50px !important; max-width: 50px !important; min-height: 50px !important; max-height: 50px !important; margin-right: 0 !important; border-radius: 8px; font-size: 1.6em !important; }
	.rsp-chart-change { min-width: 42px !important; }
	.rsp-chart-position-old { font-size: 1em !important; }
	.rsp-chart-position-week { font-size: .7em !important; white-space: nowrap; }
	.uk-grid > .uk-fourth-column { flex: 1 1 0 !important; min-width: 0 !important; }
	/* Vote-Spalte ist absolut rechts positioniert -> rechts in der Titelspalte Platz dafür lassen */
	.uk-grid:has(.rsp-chart-stream) > .uk-fourth-column { padding-right: 56px; }
	h6.rsp-chart-title { padding-right: 0 !important; font-size: 14px !important; line-height: 1.25; }
	.rsp-chart-artist { padding-right: 0 !important; font-size: 13px !important; }
	.rsp-chart-label { font-size: 11px !important; opacity: .75; }
	h6.rsp-chart-title, .rsp-chart-artist, .rsp-chart-label { overflow-wrap: anywhere; }
	.rsp-chart-stream { width: 38px !important; }
	.rsp-chart-cover { width: 56px !important; height: 56px !important; min-width: 56px !important; }

	/* Titelliste: lange Kanalnamen passen ins Auswahlfeld */
	form[name=titlelist-select] select[name=channel-select], form[name=titlelist-select] select[name=date-select] { font-size: 14px; }

	/* Footer: App-Badges als 2x2-Raster statt vier großer Bilder untereinander */
	.uk-width-1-3\@m:has(> h3 a[href*="schlagerparadies-app"]) { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; align-items: center; justify-items: center; }
	.uk-width-1-3\@m:has(> h3 a[href*="schlagerparadies-app"]) > h3 { grid-column: 1 / -1; margin-bottom: 0; }
	.uk-width-1-3\@m:has(> h3 a[href*="schlagerparadies-app"]) > .uk-margin { margin: 0 !important; }
	.uk-width-1-3\@m:has(> h3 a[href*="schlagerparadies-app"]) img { width: 100%; max-width: 150px; height: auto; }

	/* Newsletter-Formular (Brevo): feste 700px Höhe ließ eine große Lücke */
	iframe[src*="sibforms.com"] { height: 580px; }
}
