/* ListenRadios theme: page chrome and layout. Components (cards, hero, player bar) live in the plugin's player.css. */

html { scroll-padding-top: 16px; }
body { background: #080e1a; color: #f5f8ff; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.wp-site-blocks > * + * { margin-block-start: 0; }
.wp-site-blocks > .lr-chrome { margin: 0; }
::selection { background: rgba(40, 104, 250, .55); color: #fff; }

/* ---------- skip link ---------- */
.lr-skip { position: absolute; left: 12px; top: -80px; z-index: 10000; padding: 12px 16px; border-radius: 8px; background: #2868fa; color: #fff !important; font-weight: 700; text-decoration: none; }
.lr-skip:focus { top: 12px; }

/* ---------- brand ---------- */
.lr-brand { display: inline-flex; align-items: center; flex: none; color: #f5f8ff; text-decoration: none; font: 800 25px/1 Manrope, system-ui, sans-serif; letter-spacing: -1.2px; }
.lr-brand:hover { color: #fff; }
.lr-brand__word span { color: #78a7ff; }
.lr-brand__icon { display: flex; align-items: center; justify-content: center; gap: 3px; width: 34px; height: 34px; margin-right: 11px; border-radius: 9px; background: #2868fa; flex: none; }
.lr-brand__icon i { width: 3px; height: 10px; border-radius: 4px; background: #fff; }
.lr-brand__icon i:nth-child(2) { height: 19px; }
.lr-brand__icon i:nth-child(3) { height: 25px; }
.lr-brand__icon i:nth-child(4) { height: 15px; }
html.lr-is-playing .lr-top .lr-brand__icon i { animation: lr-pulse .9s ease-in-out infinite alternate; transform-origin: center; }
html.lr-is-playing .lr-top .lr-brand__icon i:nth-child(2n) { animation-delay: -.4s; }

/* ---------- header ---------- */
.lr-top { background: #090f1c; border-bottom: 1px solid #1f2c42; }
.lr-top__in { max-width: 1352px; margin: 0 auto; padding: 24px 36px; box-sizing: border-box; display: flex; align-items: center; gap: 60px; }
.lr-nav { display: flex; gap: 30px; }
.lr-nav a { position: relative; font-size: 14px; font-weight: 600; color: #b5c0d4; text-decoration: none; }
.lr-nav a:hover { color: #a9caff; }
.lr-nav a.is-active { color: #fff; }
.lr-nav a.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -29px; height: 3px; border-radius: 3px; background: #2868fa; }
.lr-top__right { margin-left: auto; display: flex; align-items: center; gap: 18px; }
.lr-hsearch { display: flex; align-items: center; border: 1px solid transparent; border-radius: 10px; transition: border-color .15s, background-color .15s; }
.lr-hsearch input { width: 0; padding: 0; border: 0; outline: 0; background: none; color: #fff; font: 14px/1.4 inherit; font-family: inherit; opacity: 0; transition: width .2s ease, padding .2s ease, opacity .15s; }
.lr-hsearch input::placeholder { color: #8da2c1; }
.lr-hsearch.is-open, .lr-hsearch:focus-within { background: #111c2f; border-color: #2a3a55; }
.lr-hsearch.is-open input, .lr-hsearch:focus-within input { width: 220px; padding: 8px 0 8px 14px; opacity: 1; }
.lr-hsearch .lr-ibtn { color: #e4ecfa; }
.lr-mine { display: inline-flex; align-items: center; gap: 9px; font-size: 14px; font-weight: 600; color: #f5f8ff; text-decoration: none; }
.lr-mine:hover { color: #a9caff; }
.lr-mine b { min-width: 22px; padding: 1px 6px; box-sizing: border-box; border-radius: 6px; background: #1a2a45; color: #9cbdff; font-size: 12px; text-align: center; }

/* ---------- main column ---------- */
.lr-main { max-width: 1280px; margin: 0 auto; padding: 43px 36px 70px; box-sizing: border-box; min-height: 60vh; }
.lr-main > *:first-child { margin-block-start: 0; }
.lr-main > .lr-crumbs { margin-block-start: 0; }
.lr-main > .lr-shero, .lr-main > .lr-chero, .lr-main > .lr-intro, .lr-main > .lr-chips, .lr-main > .lr-features, .lr-main > .lr-browse { margin-block-start: 0; }
.lr-main > .lr-chero + .lr-browse, .lr-main > .lr-chero + .lr-sec { margin-block-start: 0; }
.lr-main > .lr-sec, .lr-main > .lr-related { margin-block-start: 44px; }
.lr-main > .lr-details { margin-block-start: 34px; }
.lr-main > .lr-panel { margin-block-start: 16px; }

/* Home intro and search page header. */
.lr-intro { display: flex; justify-content: space-between; align-items: flex-end; gap: 35px; margin-bottom: 28px; }
.lr-intro__text { min-width: 0; }
.lr-intro__title, .lr-intro .wp-block-query-title { margin: 8px 0 13px; font: 800 46px/1.15 Manrope, system-ui, sans-serif; letter-spacing: -1.8px; color: #f5f8ff; }
.lr-intro__lead { margin: 0; max-width: 640px; color: #9baac2; }
.lr-intro .lr-eyebrow { margin: 0; }
.lr-intro--small .wp-block-query-title { margin-top: 0; }

/* Titles for pages, posts and the 404 page. */
.lr-ptitle, .lr-main .wp-block-post-title { margin: 0 0 24px; font: 800 42px/1.15 Manrope, system-ui, sans-serif; letter-spacing: -1.5px; color: #f5f8ff; }
.lr-pagebox { max-width: 860px; }
.lr-404 { max-width: 640px; margin: 30px auto 0; }
.lr-404 .lr-ptitle { margin: 12px 0; font-size: 36px; }

/* ---------- long-form content (station stories, pages) ---------- */
.lr-content { color: #b9c6da; font-size: 16px; line-height: 1.8; overflow-wrap: break-word; }
.lr-content > *:first-child { margin-top: 0; }
.lr-content > *:last-child { margin-bottom: 0; }
.lr-content p { margin: 0 0 1.1em; color: inherit; }
.lr-content h2, .lr-content h3, .lr-content h4 { margin: 1.8em 0 .6em; color: #f5f8ff; font-family: Manrope, system-ui, sans-serif; line-height: 1.3; letter-spacing: -.3px; }
.lr-content h2 { font-size: 21px; }
.lr-content h3 { font-size: 18px; }
.lr-content h4 { font-size: 16px; }
.lr-content h1 { font-size: 24px; margin: 0 0 .6em; }
.lr-content h1 span[style], .lr-content h2 span[style], .lr-content h3 span[style], .lr-content p span[style*="color"], .lr-content strong[style], .lr-content span[style*="color"] { color: inherit !important; }
.lr-content [style*="background"] { background: none !important; }
.lr-content [style*="text-align: center"], .lr-content [style*="text-align:center"] { text-align: left !important; }
.lr-content a { color: #8eb6ff; text-decoration: underline; text-decoration-color: rgba(142, 182, 255, .35); text-underline-offset: 3px; }
.lr-content a:hover { color: #a9caff; text-decoration-color: currentColor; }
.lr-content strong, .lr-content b { color: #e6edf8; }
.lr-content ul, .lr-content ol { padding-left: 1.3em; margin: 0 0 1.1em; }
.lr-content li { margin: .25em 0; }
.lr-content li::marker { color: #6999fa; }
.lr-content img { max-width: 100%; height: auto; border-radius: 10px; }
.lr-content .alignleft, .lr-content .alignright { float: none; display: block; margin: 0 0 1rem; max-width: 220px; }
.lr-content figure { margin: 0 0 1.2em; }
.lr-content figcaption { font-size: 13px; color: #7f91ab; }
.lr-content blockquote { margin: 1.2em 0; padding: 4px 0 4px 18px; border-left: 3px solid #2868fa; color: #c9d5e8; }
.lr-content table { width: 100%; border-collapse: collapse; font-size: 14px; margin: .5rem 0 1.5rem; display: block; overflow-x: auto; }
.lr-content th, .lr-content td { text-align: left; padding: 9px 12px; border-bottom: 1px solid #243149; background: none !important; color: inherit; }
.lr-content th { font-weight: 700; color: #f5f8ff; }
.lr-content iframe { max-width: 100%; border-radius: 10px; }
.lr-content hr { border: 0; border-top: 1px solid #243149; margin: 2em 0; }
.lr-content code { font-size: .9em; padding: 2px 6px; border-radius: 5px; background: #152139; color: #dbe7ff; }
.lr-content input, .lr-content textarea, .lr-content select { font: inherit; color: #f5f8ff; background: #152139; border: 1px solid #30415c; border-radius: 8px; padding: 10px 12px; max-width: 100%; box-sizing: border-box; }
.lr-content input[type="submit"], .lr-content button { background: #2868fa; color: #fff; border: 0; border-radius: 8px; padding: 12px 20px; font-weight: 700; cursor: pointer; }

/* ---------- WordPress blocks used on fallback pages ---------- */
.wp-block-search__inside-wrapper { background: #111c2f; border: 1px solid #2a3a55 !important; border-radius: 10px; padding: 4px; }
.wp-block-search__input { background: none; border: 0; color: #fff; padding: 10px 12px; }
.wp-block-search__button { margin: 0; border-radius: 8px; }
.wp-block-query-pagination, .navigation.pagination, .pagination { margin-top: 30px; }
.navigation.pagination .nav-links, .wp-block-query-pagination { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.page-numbers { display: inline-grid; place-items: center; min-width: 40px; height: 40px; padding: 0 12px; box-sizing: border-box; border-radius: 8px; border: 1px solid #28364e; background: #111a2b; color: #c0cce0; text-decoration: none; font-size: 14px; }
.page-numbers.current { background: #eaf1ff; color: #101b2e; border-color: #eaf1ff; font-weight: 700; }
a.page-numbers:hover { border-color: #7199df; color: #fff; }

/* ---------- footer ---------- */
.lr-foot { background: #03060b; border-top: 1px solid #243149; padding: 36px max(36px, calc((100vw - 1280px) / 2)) 30px; }
.lr-foot__in { display: flex; justify-content: space-between; align-items: flex-start; gap: 35px; }
.lr-foot .lr-brand { font-size: 22px; }
.lr-foot .lr-brand__icon { width: 30px; height: 30px; margin-right: 10px; }
.lr-foot__brand p { margin: 14px 0 0; font-size: 13px; color: #9baac2; }
.lr-foot__links { display: flex; flex-wrap: wrap; gap: 12px 23px; max-width: 420px; font-size: 13px; }
.lr-foot__links a, .lr-foot__countries a { color: #b6c3d8; text-decoration: none; }
.lr-foot__links a:hover, .lr-foot__countries a:hover { color: #fff; }
.lr-foot__note { margin: 0; max-width: 300px; font-size: 12px; line-height: 1.6; color: #7f90a9; }
.lr-foot__countries { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 28px; padding-top: 22px; border-top: 1px solid #172236; font-size: 13px; }
.lr-foot__legal { margin: 20px 0 0; font-size: 12px; color: #6c7d97; }

/* ---------- responsive ---------- */
@media (max-width: 1050px) {
	.lr-top__in { gap: 30px; }
	.lr-nav { gap: 20px; }
	.lr-intro { align-items: flex-start; }
	.lr-hsearch.is-open input, .lr-hsearch:focus-within input { width: 160px; }
	.lr-foot__in { flex-wrap: wrap; }
}
@media (max-width: 760px) {
	.lr-top__in { padding: 18px 16px 0; gap: 0; flex-wrap: wrap; }
	.lr-brand { font-size: 23px; }
	.lr-brand__icon { width: 32px; height: 32px; }
	.lr-top__right { gap: 4px; }
	.lr-mine__label { display: none; }
	.lr-mine { width: 40px; height: 40px; justify-content: center; position: relative; }
	.lr-mine b { position: absolute; right: -2px; top: 0; min-width: 18px; padding: 0 4px; font-size: 10px; line-height: 16px; background: #2868fa; color: #fff; }
	.lr-mine b:empty, .lr-mine b[data-zero] { display: none; }
	.lr-hsearch.is-open, .lr-hsearch:focus-within { position: absolute; left: 12px; right: 12px; top: 14px; z-index: 20; }
	.lr-hsearch.is-open input, .lr-hsearch:focus-within input { width: 100%; flex: 1; }
	.lr-top { position: relative; }
	.lr-nav { order: 3; width: 100%; justify-content: flex-start; gap: 26px; margin-top: 16px; padding: 0 2px 14px; }
	.lr-nav a.is-active::after { bottom: -14px; }
	.lr-main { padding: 26px 16px 50px; }
	.lr-intro { display: block; margin-bottom: 20px; }
	.lr-intro__title, .lr-intro .wp-block-query-title { font-size: 36px; letter-spacing: -1.3px; }
	.lr-intro__lead { font-size: 14px; }
	.lr-intro .lr-search { margin-top: 20px; }
	.lr-ptitle, .lr-main .wp-block-post-title { font-size: 32px; }
	.lr-content { font-size: 15px; }
	.lr-foot { padding: 28px 16px 24px; }
	.lr-foot__in { flex-direction: column; gap: 20px; }
	.lr-foot__note { max-width: none; }
}

/* Videos kept in old posts (YouTube / Dailymotion). */
.lr-content iframe.lr-video, .lr-content iframe[src*="dailymotion.com"] { display: block; width: 100%; max-width: 640px; height: auto; aspect-ratio: 16 / 9; border: 0; border-radius: 10px; background: #0d1727; margin: 0 0 1.2em; }
