PageSourceSearch

https://katolikusradio.hu/musoraink

html katolikusradio.hu collected 2026-10-01 11:43:15 UTC 413,359 bytes, 5,500 lines download raw bytes

1  <html lang="hu">
2
3  <head>
4    <link rel="stylesheet"
5      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
6    <meta charset="UTF-8">
7    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
8    <title>Műsoraink | Magyar Katolikus Rádió</title>
9    <link rel="icon" type="image/png" href="/img/favicon.png">
10
11    
11<script src="https://cdn.tailwindcss.com"></script>
11
12    
12<script>
13      window.FontAwesomeConfig = {
14        autoReplaceSvg: 'nest'
15      };
16    </script>
16
17    <style>
18      /* 1. Alpine.js ugrálásgátló (ez kötelező az x-cloak működéséhez!) */
19      [x-cloak] {
20        display: none !important;
21      }
22
23      /* 2. Oldal elrejtése az indulás pillanatában */
24      html {
25        visibility: hidden;
26        opacity: 0;
27      }
28
29      /* 3. Finom áttűnés, amikor minden betöltött */
30      html.ready {
31        visibility: visible;
32        opacity: 1;
33        transition: opacity 0.3s ease-in;
34      }
35    </style>
36
37    
37<script>
38      // Amikor a böngésző/Turbo végzett az aktuális oldal DOM-cseréjével,
39      // megjelenítjük az oldalt. iOS Safari alatt a DOMContentLoaded nem fut le
40      // Turbo navigációnál vagy bfcache visszaállításnál, ezért minden releváns
41      // lifecycle eseményre idempotensen rátesszük a ready osztályt.
42      (function() {
43        function markDocumentReady() {
44          document.documentElement.classList.add('ready');
45        }
46
47        if (document.readyState === 'loading') {
48          document.addEventListener('DOMContentLoaded', markDocumentReady, { once: true });
49        } else {
50          markDocumentReady();
51        }
52        window.addEventListener('pageshow', markDocumentReady);
53        document.addEventListener('turbo:load', markDocumentReady);
54        document.addEventListener('turbo:render', markDocumentReady);
55      })();
56    </script>
56
57    
57<script
58      src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/js/all.min.js"
59      crossorigin="anonymous" referrerpolicy="no-referrer"></script>
59
60    <link rel="preconnect" href="https://fonts.googleapis.com">
61    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
62    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
63    
63<script type="module" src="https://cdn.jsdelivr.net/npm/@hotwired/[email protected]/dist/turbo.es2017-esm.js"></script>
63
64    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.min.css">
vendor: 68 bytes, lines 64-66
64
65
66    <script src="https://www.google.com/recaptcha/api.js?render=
666Lcu2I8sAAAAADr7sn9X5zMdJMIEcGYmRQVn3TTn
vendor: 19 bytes, lines 66-68
66"></script>
67
68    
68<link
69      href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;700&amp;display=swap"
70      rel="stylesheet">
71    
71<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/cdn.min.js"></script>
71
72    <style>
73      body {
74        font-family: 'DM Sans', sans-serif;
75      }
76
77      .page-content-gutter-compact {
78        padding-left: max(1rem, env(safe-area-inset-left, 0px)) !important;
79        padding-right: max(1rem, env(safe-area-inset-right, 0px)) !important;
80      }
81
82      .page-content-gutter-regular {
83        padding-left: max(1rem, env(safe-area-inset-left, 0px)) !important;
84        padding-right: max(1rem, env(safe-area-inset-right, 0px)) !important;
85      }
86
87      .page-content-gutter-roomy {
88        padding-left: max(1.5rem, env(safe-area-inset-left, 0px)) !important;
89        padding-right: max(1.5rem, env(safe-area-inset-right, 0px)) !important;
90      }
91
92      @media (min-width: 768px) {
93        .page-content-gutter-regular {
94          padding-left: max(2rem, env(safe-area-inset-left, 0px)) !important;
95          padding-right: max(2rem, env(safe-area-inset-right, 0px)) !important;
96        }
97      }
98
99      .input-icon-shell {
100        position: relative;
101      }
102
103      .input-inline-safe {
104        padding-left: max(1rem, env(safe-area-inset-left, 0px)) !important;
105        padding-right: max(1rem, env(safe-area-inset-right, 0px)) !important;
106      }
107
108      .input-inline-safe-relaxed {
109        padding-left: max(1rem, env(safe-area-inset-left, 0px)) !important;
110        padding-right: max(1rem, env(safe-area-inset-right, 0px)) !important;
111      }
112
113      @media (min-width: 640px) {
114        .input-inline-safe-relaxed {
115          padding-left: max(1.5rem, env(safe-area-inset-left, 0px)) !important;
116          padding-right: max(1.5rem, env(safe-area-inset-right, 0px)) !important;
117        }
118      }
119
120      .input-inline-safe-leading {
121        padding-left: max(3rem, calc(env(safe-area-inset-left, 0px) + 3rem)) !important;
122        padding-right: max(1rem, env(safe-area-inset-right, 0px)) !important;
123      }
124
125      .input-inline-safe-leading-trailing {
126        padding-left: max(3rem, calc(env(safe-area-inset-left, 0px) + 3rem)) !important;
127        padding-right: max(3rem, calc(env(safe-area-inset-right, 0px) + 3rem)) !important;
128      }
129
130      .input-icon-leading {
131        position: absolute !important;
132        top: 0 !important;
133        bottom: 0 !important;
134        display: flex !important;
135        align-items: center !important;
136        left: env(safe-area-inset-left, 0px) !important;
137        padding-left: 1rem !important;
138      }
139
140      .input-icon-trailing {
141        position: absolute !important;
142        top: 0 !important;
143        bottom: 0 !important;
144        display: flex !important;
145        align-items: center !important;
146        right: env(safe-area-inset-right, 0px) !important;
147        padding-right: 1rem !important;
148      }
149    </style>
150    
150<script>
151      tailwind.config = {
152        theme: {
153          extend: {
154            colors: {
155              'brand-green': '#98ca3c',
156              'brand-grey': '#F5F5F5',
157              'brand-dark': '#1A1A1A'
158            },
159            fontFamily: {
160              'din': ['DM Sans', 'sans-serif']
161            }
162          }
163        }
164      }
165    </script>
165
166
167
168    <style>
169      [x-cloak] {
170        display: none !important;
171      }
172    </style>
173  </head>
174
175  <body class="bg-white text-brand-dark font-din">
176
177    
178<header id="header"
179    x-data="{ 
180        mobileMenuOpen: false, 
181        searchOpen: false, 
182        scrolled: false,
183        handleScroll() {
184            const y = window.pageYOffset;
185            if (!this.scrolled && y > 40) {
186                this.scrolled = true;
187            } else if (this.scrolled && y < 10) {
188                this.scrolled = false;
189            }
190        }
191    }"
192    @scroll.window="handleScroll()"
193    class="bg-white border-b border-gray-200 sticky top-0 z-50 shadow-sm relative transition-all duration-300">
194
195    <div class="max-w-[1440px] mx-auto px-4 md:px-6 lg:px-8 flex items-center justify-between transition-all duration-300"
196        :class="scrolled ? 'py-2' : 'py-4'">
197
198        <div class="flex items-center shrink-0 mr-4">
199            <a href="/" class="flex items-center">
200                <div class="relative shrink-0 transition-all duration-300 z-50 rounded-full bg-white"
201                    :class="scrolled
202                        ? 'w-10 h-10 md:w-[50px] md:h-[50px] lg:w-[60px] lg:h-[60px] p-0 shadow-none'
203                        : 'w-14 h-14 -mb-4 md:w-[90px] md:h-[90px] md:-mb-8 lg:w-[150px] lg:h-[150px] lg:-mb-[75px] lg:p-1.5 lg:shadow-xl'">
204                    <img src="/img/logo.png"
205                        alt="Magyar Katolikus Rádió Logo"
206                        class="w-full h-full object-cover rounded-full">
207                </div>
208                <div class="ml-3 hidden sm:block relative z-10 transition-all duration-300"
209                    :class="scrolled ? '' : 'lg:-mt-2'">
210                    <div class="font-bold text-brand-dark leading-tight transition-all duration-300"
211                        :class="scrolled ? 'text-sm md:text-base lg:text-lg' : 'text-base md:text-lg lg:text-xl'">Magyar Katolikus Rádió</div>
212                    <div class="text-gray-600 transition-all duration-300"
213                        :class="scrolled ? 'text-[9px] md:text-[10px] lg:text-xs' : 'text-[10px] md:text-xs lg:text-sm'">Örömhír mindenkinek!</div>
214                </div>
215            </a>
216        </div>
217
218        <nav class="hidden lg:flex items-center space-x-4 xl:space-x-8 h-full relative z-10">
219            <a href="/" class="text-sm xl:text-base font-bold transition-colors py-4 text-brand-dark hover:text-brand-green">Kezdőlap</a>
220
221                        <div class="relative group h-full flex items-center" x-data="{ open: false }" @mouseenter="open = true" @mouseleave="open = false" @click.outside="open = false">
222                <button type="button" @click="open = !open" class="text-sm xl:text-base font-bold transition-colors flex items-center gap-1.5 focus:outline-none py-4 text-brand-green">
223                    <span>Műsorok</span>
224                    <span class="transition-transform duration-200 inline-flex items-center" :style="open ? 'transform: rotate(180deg);' : 'transform: rotate(0deg);'">
225                        <i class="fa-solid fa-chevron-down text-[10px] xl:text-xs"></i>
226                    </span>
227                </button>
228                <div x-show="open" x-transition.opacity.duration.200ms class="absolute top-[100%] left-0 w-56 pt-1 z-50" style="display: none;" x-cloak>
229                    <div class="bg-white border border-gray-100 rounded-xl shadow-lg py-2 overflow-hidden">
230                        <a href="/musoraink" class="block px-4 py-2.5 text-sm font-bold text-brand-green bg-brand-green/5">MŰSORÚJSÁG és archívum</a>
231                        <a href="/musorabc" class="block px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">Műsoraink ABC-sorrendben</a>
232                        <a href="/musorkategoriak" class="block px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">Műsoraink kategóriák szerint</a>
233                        <a href="/musorcsoportok" class="block px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">Tematikus műsorcsoportok</a>
234                        <a href="/podcastok" class="block px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">Podcastok</a>
235                    </div>
236                </div>
237            </div>
238
239                        <div class="relative group h-full flex items-center" x-data="{ open: false }" @mouseenter="open = true" @mouseleave="open = false" @click.outside="open = false">
240                <button type="button" @click="open = !open" class="text-sm xl:text-base font-bold transition-colors flex items-center gap-1.5 focus:outline-none py-4 text-brand-dark group-hover:text-brand-green">
241                    <span>Lelkiség</span>
242                    <span class="transition-transform duration-200 inline-flex items-center" :style="open ? 'transform: rotate(180deg);' : 'transform: rotate(0deg);'">
243                        <i class="fa-solid fa-chevron-down text-[10px] xl:text-xs"></i>
244                    </span>
245                </button>
246                <div x-show="open" x-transition.opacity.duration.200ms class="absolute top-[100%] left-0 w-56 pt-1 z-50" style="display: none;" x-cloak>
247                    <div class="bg-white border border-gray-100 rounded-xl shadow-lg py-2 overflow-hidden">
248                        <a href="/igenaptar" class="block px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">Igenaptár</a>
249                        <a href="/szentek" class="block px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">Szentek Katalógusa</a>
250                    </div>
251                </div>
252            </div>
253
254                        <div class="relative group h-full flex items-center" x-data="{ open: false }" @mouseenter="open = true" @mouseleave="open = false" @click.outside="open = false">
255                <button type="button" @click="open = !open" class="text-sm xl:text-base font-bold transition-colors flex items-center gap-1.5 focus:outline-none py-4 text-brand-dark group-hover:text-brand-green">
256                    <span>Tartalmak</span>
257                    <span class="transition-transform duration-200 inline-flex items-center" :style="open ? 'transform: rotate(180deg);' : 'transform: rotate(0deg);'">
258                        <i class="fa-solid fa-chevron-down text-[10px] xl:text-xs"></i>
259                    </span>
260                </button>
261
262                <div x-show="open" x-transition.opacity.duration.200ms class="absolute top-[100%] left-0 w-56 pt-1 z-50" style="display: none;" x-cloak>
263                    <div class="bg-white border border-gray-100 rounded-xl shadow-lg py-2 overflow-hidden">
264                        <a href="/hireink" class="block px-4 py-2.5 text-sm border-b border-gray-50 font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">Hírek</a>
265                        <a href="/videoink" class="block px-4 py-2.5 text-sm border-b border-gray-50 font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">Videók</a>
266
267                                                                                                                    <a href="/oldal/letoltheto-anyagok" class="block px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">
268                                    Letölthető anyagok                                </a>
269                                                                                            <a href="/oldal/studioberles" class="block px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">
270                                    Stúdióbérlés                                </a>
271                                                                        </div>
272                </div>
273            </div>
274
275                        <div class="relative group h-full flex items-center" x-data="{ open: false }" @mouseenter="open = true" @mouseleave="open = false" @click.outside="open = false">
276                <button type="button" @click="open = !open" class="text-sm xl:text-base font-bold transition-colors flex items-center gap-1.5 focus:outline-none py-4 text-brand-dark group-hover:text-brand-green">
277                    <span>Rádió</span>
278                    <span class="transition-transform duration-200 inline-flex items-center" :style="open ? 'transform: rotate(180deg);' : 'transform: rotate(0deg);'">
279                        <i class="fa-solid fa-chevron-down text-[10px] xl:text-xs"></i>
280                    </span>
281                </button>
282
283                <div x-show="open" x-transition.opacity.duration.200ms class="absolute top-[100%] right-0 lg:left-0 lg:right-auto w-48 pt-1 z-50" style="display: none;" x-cloak>
284                    <div class="bg-white border border-gray-100 rounded-xl shadow-lg py-2 overflow-hidden">
285                        <a href="/rolunk" class="block px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">Rólunk</a>
286                        <a href="/bemutatkozunk" class="block px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">Kapcsolat</a>
287                        <a href="/rolunk#frequencies" class="block px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">Vételkörzetek</a>
288                        <a href="/munkatarsaink" class="block px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">Munkatársaink</a>
289                        <a href="/tamogatas" class="block px-4 py-2.5 text-sm font-medium text-gray-700 hover:bg-brand-green/10 hover:text-brand-green">Támogatás</a>
290                    </div>
291                </div>
292            </div>
293        </nav>
294
295        <div class="flex items-center space-x-2 xl:space-x-3 shrink-0 ml-4 z-10">
296            <button type="button" @click="searchOpen = true; $nextTick(() => $refs.searchInput.focus())" class="w-10 h-10 flex items-center justify-center text-gray-600 hover:text-brand-green transition-colors rounded-full hover:bg-gray-100 relative z-50">
297                <i class="fa-solid fa-search text-lg pointer-events-none"></i>
298            </button>
299
300            <a href="/#newsletter-section" class="hidden md:flex">
301                <button type="button" class="flex items-center justify-center bg-brand-green hover:bg-[#85c000] text-white font-medium rounded-lg transition-colors md:w-10 md:h-10 xl:w-auto xl:px-4 xl:py-2.5 shadow-sm">
302                    <i class="fa-solid fa-envelope pointer-events-none"></i>
303                    <span class="hidden xl:inline ml-2 text-sm pointer-events-none">Hírlevél</span>
304                </button>
305            </a>
306
307            <a href="/app" rel="noopener noreferrer" class="hidden md:flex items-center justify-center bg-brand-dark hover:bg-gray-800 text-white font-medium rounded-lg transition-colors md:w-10 md:h-10 xl:w-auto xl:px-4 xl:py-2.5 shadow-sm">
308                <i class="fa-solid fa-mobile-screen pointer-events-none"></i>
309                <span class="hidden xl:inline ml-2 text-sm pointer-events-none">App</span>
310            </a>
311
312            <a href="https://bolt.katolikusradio.hu/" target="_blank" rel="noopener noreferrer" class="hidden md:flex items-center justify-center bg-brand-dark hover:bg-gray-800 text-white font-medium rounded-lg transition-colors md:w-10 md:h-10 xl:w-auto xl:px-4 xl:py-2.5 shadow-sm">
313                <i class="fa-solid fa-shopping-cart pointer-events-none"></i>
314                <span class="hidden xl:inline ml-2 text-sm pointer-events-none">Bolt</span>
315            </a>
316
317            <button type="button" @click="mobileMenuOpen = !mobileMenuOpen"
318                class="block lg:hidden w-10 h-10 flex items-center justify-center text-brand-dark focus:outline-none rounded-full hover:bg-gray-100 ml-2 relative z-50 cursor-pointer">
319                <svg x-show="!mobileMenuOpen" xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 pointer-events-none" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
320                    <path stroke-linecap="round" stroke-linejoin="round" d="M4 6h16M4 12h16M4 18h16" />
321                </svg>
322                <svg x-show="mobileMenuOpen" style="display: none;" x-cloak xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 pointer-events-none" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
323                    <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
324                </svg>
325            </button>
326        </div>
327    </div>
328
329    <div x-show="mobileMenuOpen"
330        x-transition:enter="transition ease-out duration-200"
331        x-transition:enter-start="opacity-0 -translate-y-4"
332        x-transition:enter-end="opacity-100 translate-y-0"
333        x-transition:leave="transition ease-in duration-150"
334        x-transition:leave-start="opacity-100 translate-y-0"
335        x-transition:leave-end="opacity-0 -translate-y-4"
336        class="block lg:hidden bg-white border-t border-gray-100 absolute w-full shadow-2xl z-40 left-0 top-full"
337        style="display: none;" x-cloak>
338
339        <nav class="flex flex-col p-4 space-y-1 max-h-[85vh] overflow-y-auto relative z-40">
340            <a href="/" class="text-lg py-3 border-b border-gray-50 px-2 font-bold text-brand-dark hover:text-brand-green">Kezdőlap</a>
341
342            <div class="py-2 border-b border-gray-50" x-data="{ open: true }">
343                <button type="button" @click="open = !open" class="flex items-center justify-between w-full text-lg py-1 px-2 focus:outline-none font-bold text-brand-green">
344                    <span class="pointer-events-none">Műsorok</span>
345                    <span class="transition-transform duration-200 inline-flex items-center justify-center pointer-events-none" :style="open ? 'transform: rotate(180deg);' : 'transform: rotate(0deg);'">
346                        <i class="fa-solid fa-chevron-down text-sm"></i>
347                    </span>
348                </button>
349                <div x-show="open" class="pl-6 py-2 space-y-2" >
350                    <a href="/musoraink" class="block text-base py-1 font-bold text-brand-green">MŰSORÚJSÁG és archívum</a>
351                    <a href="/musorabc" class="block text-base py-1 font-medium text-gray-600 hover:text-brand-green">Műsoraink ABC-sorrendben</a>
352                    <a href="/musorkategoriak" class="block text-base py-1 font-medium text-gray-600 hover:text-brand-green">Műsoraink (Kategóriák szerint)</a>
353                    <a href="/musorcsoportok" class="block text-base py-1 font-medium text-gray-600 hover:text-brand-green">Tematikus műsorcsoportok</a>
354                    <a href="/podcastok" class="block text-base py-1 font-medium text-gray-600 hover:text-brand-green">Podcastok</a>
355                </div>
356            </div>
357
358            <div class="py-2 border-b border-gray-50" x-data="{ open: false }">
359                <button type="button" @click="open = !open" class="flex items-center justify-between w-full text-lg py-1 px-2 focus:outline-none font-bold text-brand-dark hover:text-brand-green">
360                    <span class="pointer-events-none">Lelkiség</span>
361                    <span class="transition-transform duration-200 inline-flex items-center justify-center pointer-events-none" :style="open ? 'transform: rotate(180deg);' : 'transform: rotate(0deg);'">
362                        <i class="fa-solid fa-chevron-down text-sm"></i>
363                    </span>
364                </button>
365                <div x-show="open" class="pl-6 py-2 space-y-2" style="display: none;">
366                    <a href="/igenaptar" class="block text-base py-1 font-medium text-gray-600 hover:text-brand-green">Igenaptár</a>
367                    <a href="/szentek" class="block text-base py-1 font-medium text-gray-600 hover:text-brand-green">Szentek Katalógusa</a>
368                </div>
369            </div>
370
371            <div class="py-2 border-b border-gray-50" x-data="{ open: false }">
372                <button type="button" @click="open = !open" class="flex items-center justify-between w-full text-lg py-1 px-2 focus:outline-none font-bold text-brand-dark hover:text-brand-green">
373                    <span class="pointer-events-none">Tartalmak</span>
374                    <span class="transition-transform duration-200 inline-flex items-center justify-center pointer-events-none" :style="open ? 'transform: rotate(180deg);' : 'transform: rotate(0deg);'">
375                        <i class="fa-solid fa-chevron-down text-sm"></i>
376                    </span>
377                </button>
378                <div x-show="open" class="pl-6 py-2 space-y-2" style="display: none;">
379                    <a href="/hireink" class="block text-base py-1 mb-1 font-medium text-gray-600 hover:text-brand-green">Hírek</a>
380                    <a href="/videoink" class="block text-base py-1 mb-1 font-medium text-gray-600 hover:text-brand-green">Videók</a>
381					
382                                                                                                    <a href="/oldal/letoltheto-anyagok" class="block text-base py-1 font-medium text-gray-600 hover:text-brand-green">
383                                Letölthető anyagok                            </a>
384                                                                                <a href="/oldal/studioberles" class="block text-base py-1 font-medium text-gray-600 hover:text-brand-green">
385                                Stúdióbérlés                            </a>
386                                                            </div>
387            </div>
388
389            <div class="py-2 border-b border-gray-50" x-data="{ open: false }">
390                <button type="button" @click="open = !open" class="flex items-center justify-between w-full text-lg py-1 px-2 focus:outline-none font-bold text-brand-dark hover:text-brand-green">
391                    <span class="pointer-events-none">Rádió</span>
392                    <span class="transition-transform duration-200 inline-flex items-center justify-center pointer-events-none" :style="open ? 'transform: rotate(180deg);' : 'transform: rotate(0deg);'">
393                        <i class="fa-solid fa-chevron-down text-sm"></i>
394                    </span>
395                </button>
396                <div x-show="open" class="pl-6 py-2 space-y-2" style="display: none;">
397                    <a href="/rolunk" class="block text-base py-1 font-medium text-gray-600 hover:text-brand-green">Rólunk</a>
398                    <a href="/bemutatkozunk" class="block text-base py-1 font-medium text-gray-600 hover:text-brand-green">Kapcsolat</a>
399                    <a href="/rolunk#frequencies" class="block text-base py-1 font-medium text-gray-600 hover:text-brand-green">Vételkörzetek</a>
400                    <a href="/munkatarsaink" class="block text-base py-1 font-medium text-gray-600 hover:text-brand-green">Munkatársaink</a>
401                    <a href="/tamogatas" class="block text-base py-1 font-medium text-gray-600 hover:text-brand-green">Támogatás</a>
402                </div>
403            </div>
404
405            <div class="flex flex-col gap-3 pt-6 md:hidden px-2 pb-4">
406                <a href="/#newsletter-section" class="flex items-center justify-center space-x-2 bg-brand-green text-white font-bold py-3 rounded-lg w-full shadow-sm">
407                    <i class="fa-solid fa-envelope"></i><span>Hírlevél</span>
408                </a>
409                <a href="/app" rel="noopener noreferrer" class="flex items-center justify-center space-x-2 bg-brand-dark text-white font-bold py-3 rounded-lg w-full shadow-sm">
410                    <i class="fa-solid fa-mobile-screen"></i><span>App Letöltése</span>
411                </a>
412                <a href="https://bolt.katolikusradio.hu/" target="_blank" rel="noopener noreferrer" class="flex items-center justify-center space-x-2 bg-brand-dark text-white font-bold py-3 rounded-lg w-full shadow-sm">
413                    <i class="fa-solid fa-shopping-cart"></i><span>Webshop</span>
414                </a>
415            </div>
416        </nav>
417    </div>
418
419    <div x-show="searchOpen"
420        style="display: none;"
421        x-cloak
422        @keydown.window.escape="searchOpen = false"
423        class="fixed inset-0 z-[100] flex items-start justify-center pt-16 md:pt-24 page-content-gutter-compact bg-gray-900/60 backdrop-blur-sm">
424
425        <div class="absolute inset-0 cursor-pointer" @click="searchOpen = false"></div>
426
427        <div x-show="searchOpen"
428            x-transition:enter="transition ease-out duration-300 transform"
429            x-transition:enter-start="opacity-0 -translate-y-12 scale-95"
430            x-transition:enter-end="opacity-100 translate-y-0 scale-100"
431            x-transition:leave="transition ease-in duration-200 transform"
432            x-transition:leave-start="opacity-100 translate-y-0 scale-100"
433            x-transition:leave-end="opacity-0 -translate-y-12 scale-95"
434            class="relative w-full max-w-3xl bg-white rounded-2xl shadow-2xl overflow-hidden ring-4 ring-white/20"
435            @click.stop>
436
437            <form action="/kereses" method="GET" class="flex items-center relative w-full">
438                <div class="pl-6 text-brand-green hidden sm:block">
439                    <i class="fa-solid fa-search text-2xl"></i>
440                </div>
441
442                <input type="text"
443                    name="kulcsszo"
444                    x-ref="searchInput"
445                    placeholder="Mit keres? (pl. Húsvét...)"
446                    class="w-full py-5 sm:py-6 px-4 sm:px-6 text-lg sm:text-xl md:text-2xl text-brand-dark bg-transparent border-none focus:ring-0 outline-none placeholder-gray-400 input-inline-safe-relaxed"
447                    autocomplete="off"
448                    required>
449
450                <button type="submit" class="bg-brand-green hover:bg-[#85c000] text-white font-bold py-2.5 px-4 sm:py-3 sm:px-6 rounded-xl transition-colors shrink-0 mr-2 sm:mr-4 shadow-sm text-sm sm:text-base flex items-center gap-2">
451                    <span class="hidden sm:inline">Keresés</span>
452                    <i class="fa-solid fa-arrow-right sm:hidden"></i>
453                </button>
454
455                <button type="button" @click="searchOpen = false" class="pr-4 sm:pr-6 pl-2 sm:pl-4 text-gray-400 hover:text-red-500 transition-colors focus:outline-none border-l border-gray-100 h-10 sm:h-12 flex items-center justify-center shrink-0">
456                    <i class="fa-solid fa-times text-xl sm:text-2xl"></i>
457                </button>
458            </form>
459        </div>
460    </div>
461</header>
462
463
464    
465<style>
466    [x-cloak] {
467        display: none !important;
468    }
469
470    .grid-accordion {
471        display: grid;
472        grid-template-rows: 0fr;
473        transition: grid-template-rows 0.3s ease-in-out;
474    }
475
476    .grid-accordion.is-open {
477        grid-template-rows: 1fr;
478    }
479
480    .grid-accordion-inner {
481        min-height: 0;
482        /* EZ A KULCS: Enélkül nem csukódik össze 0 pixelre! */
483        overflow: hidden;
484    }
485
486    /*
487     * iOS WebKit alatt az első hideg betöltéskor a CDN-es Tailwind/arbitrary
488     * color utility-k néha csak később állnak elő; ilyenkor a fehér szöveg
489     * fehér háttéren látszólag eltüntette a műsorsáv fejléceket és az időpontokat.
490     * Ezek a kritikus műsorújság-stílusok ezért natív CSS fallbacket kapnak,
491     * hogy első rendernél, Turbo cache-ből és későbbi refresh után is látszódjanak.
492     */
493    .musor-slot-header {
494        background-color: #70a300;
495        color: #fff;
496        display: flex;
497        align-items: center;
498        justify-content: space-between;
499        width: 100%;
500        padding: 0.75rem 1.25rem;
501        border-radius: 0.75rem;
502        margin-bottom: 0.5rem;
503        font-weight: 700;
504        font-size: 1.125rem;
505        line-height: 1.75rem;
506        text-align: left;
507    }
508
509    .musor-slot-header:hover {
510        background-color: #6a9900;
511    }
512
513    .musor-slot-header--current {
514        background-color: #2563eb;
515        color: #fff;
516    }
517
518    .musor-slot-header--current:hover {
519        background-color: #1d4ed8;
520    }
521
522    .musor-slot-range {
523        display: none;
524        align-items: center;
525        justify-content: center;
526        color: #fff;
527        line-height: 1.25;
528        white-space: nowrap;
529        width: 7rem;
530        text-align: center;
531    }
532
533    @media (min-width: 640px) {
534        .musor-slot-range {
535            display: inline-flex;
536        }
537    }
538
539    .musor-episode-time {
540        display: inline-flex;
541        align-items: center;
542        justify-content: center;
543        color: #fff;
544        line-height: 1.25;
545        white-space: nowrap;
546        background-color: #5c8500;
547        min-width: 50px;
548        padding: 0.125rem 0.5rem;
549        border-radius: 0.125rem;
550        font-weight: 700;
551        font-size: 0.875rem;
552    }
553
554    .musor-episode-time--current {
555        background-color: #2563eb;
556    }
557</style>
558
559<script>
560    function registerMusorainkAlpineComponents() {
561        if (!window.Alpine || window.__mkrMusorainkAlpineRegistered) {
562            return;
563        }
564
565        window.__mkrMusorainkAlpineRegistered = true;
566
567        Alpine.data('datePicker', (initialDate) => ({
568            open: false,
569            month: '',
570            year: '',
571            no_of_days: [],
572            blankdays: [],
573            monthNames: ['Január', 'Február', 'Március', 'Április', 'Május', 'Június', 'Július', 'Augusztus', 'Szeptember', 'Október', 'November', 'December'],
574            selectedDate: initialDate,
575
576            initDate() {
577                let parts = this.selectedDate.split('-');
578                let date = new Date(parts[0], parts[1] - 1, parts[2]);
579
580                this.month = date.getMonth();
581                this.year = date.getFullYear();
582                this.getNoOfDays();
583            },
584
585            toggle() {
586                this.open = !this.open;
587            },
588
589            formatDisplayDate() {
590                let parts = this.selectedDate.split('-');
591                let d = new Date(parts[0], parts[1] - 1, parts[2]);
592                return d.getFullYear() + '. ' + (d.getMonth() + 1).toString().padStart(2, '0') + '. ' + d.getDate().toString().padStart(2, '0') + '.';
593            },
594
595            isToday(date) {
596                const today = new Date();
597                const d = new Date(this.year, this.month, date);
598                return today.toDateString() === d.toDateString();
599            },
600
601            isSelected(date) {
602                const d = new Date(this.year, this.month, date);
603                let parts = this.selectedDate.split('-');
604                const s = new Date(parts[0], parts[1] - 1, parts[2]);
605                return d.toDateString() === s.toDateString();
606            },
607
608            selectDate(date) {
609                let selected = new Date(this.year, this.month, date);
610                let formatted = selected.getFullYear() + '-' + (selected.getMonth() + 1).toString().padStart(2, '0') + '-' + selected.getDate().toString().padStart(2, '0');
611
612                if (window.Turbo) {
613                    window.Turbo.visit('?datum=' + formatted);
614                } else {
615                    window.location.href = '?datum=' + formatted;
616                }
617            },
618
619            getNoOfDays() {
620                let daysInMonth = new Date(this.year, this.month + 1, 0).getDate();
621                let dayOfWeek = new Date(this.year, this.month).getDay();
622                let blankdaysArray = [];
623                let startDay = dayOfWeek === 0 ? 6 : dayOfWeek - 1;
624
625                for (let i = 1; i <= startDay; i++) {
626                    blankdaysArray.push(i);
627                }
628                let daysArray = [];
629                for (let i = 1; i <= daysInMonth; i++) {
630                    daysArray.push(i);
631                }
632
633                this.blankdays = blankdaysArray;
634                this.no_of_days = daysArray;
635            },
636
637            prevMonth() {
638                if (this.month === 0) {
639                    this.month = 11;
640                    this.year--;
641                } else {
642                    this.month--;
643                }
644                this.getNoOfDays();
645            },
646
647            nextMonth() {
648                if (this.month === 11) {
649                    this.month = 0;
650                    this.year++;
651                } else {
652                    this.month++;
653                }
654                this.getNoOfDays();
655            }
656        }));
657
658        Alpine.data('adasGalleryManager', (imageArray) => ({
659            images: imageArray,
660            lightboxOpen: false,
661            currentImageIndex: 0,
662
663            openLightbox(index) {
664                if (this.images.length === 0) return;
665                this.currentImageIndex = index;
666                this.lightboxOpen = true;
667                document.body.style.overflow = 'hidden';
668            },
669
670            closeLightbox() {
671                this.lightboxOpen = false;
672                document.body.style.overflow = 'auto';
673            },
674
675            prevImage() {
676                if (this.images.length <= 1) return;
677                if (this.currentImageIndex > 0) {
678                    this.currentImageIndex--;
679                } else {
680                    this.currentImageIndex = this.images.length - 1;
681                }
682            },
683
684            nextImage() {
685                if (this.images.length <= 1) return;
686                if (this.currentImageIndex < this.images.length - 1) {
687                    this.currentImageIndex++;
688                } else {
689                    this.currentImageIndex = 0;
690                }
691            }
692        }));
693    }
694
695    if (window.Alpine) {
696        registerMusorainkAlpineComponents();
697    }
698
699    document.addEventListener('alpine:init', registerMusorainkAlpineComponents);
700
701    document.addEventListener('turbo:before-cache', () => {
702        document.body.style.overflow = 'auto';
703    }, {
704        once: true
705    });
706</script>
706
707
708<div class="max-w-4xl mx-auto px-4 py-8 md:py-12">
709
710    <div class="flex flex-col md:flex-row justify-between items-start md:items-center mb-10 gap-6">
711        <div>
712            <h1 class="text-3xl md:text-4xl font-bold text-brand-dark tracking-tight">Műsorújság</h1>
713            <p class="text-gray-500 mt-2">Hallgasd vissza kedvenc műsoraidat</p>
714        </div>
715
716        <div x-data="datePicker('2026-10-01')" x-init="initDate()" class="relative w-full md:w-auto" x-cloak>
717            <div class="flex items-center justify-between w-full bg-brand-grey rounded-xl p-1 shadow-sm border border-gray-100">
718
719                <a href="?datum=2026-09-30" class="w-10 h-10 flex items-center justify-center text-gray-500 hover:text-brand-dark hover:bg-white rounded-lg transition-all shrink-0" title="Előző nap" data-turbo-action="advance">
720                    <i class="fa-solid fa-chevron-left text-sm"></i>
721                </a>
722
723                <button
724                    @click="toggle()"
725                    type="button"
726                    class="px-4 py-2 flex-1 flex items-center justify-center gap-2 font-bold text-brand-dark hover:bg-white rounded-lg transition-all min-w-[140px]">
727                    <i class="fa-regular fa-calendar text-brand-green"></i>
728                    <span x-text="formatDisplayDate()"></span>
729                </button>
730
731                <a href="?datum=2026-10-02" class="w-10 h-10 flex items-center justify-center text-gray-500 hover:text-brand-dark hover:bg-white rounded-lg transition-all shrink-0" title="Következő nap" data-turbo-action="advance">
732                    <i class="fa-solid fa-chevron-right text-sm"></i>
733                </a>
734            </div>
735
736            <div
737                x-show="open"
738                @click.outside="open = false"
739                x-transition:enter="transition ease-out duration-200"
740                x-transition:enter-start="opacity-0 translate-y-2"
741                x-transition:enter-end="opacity-100 translate-y-0"
742                class="absolute top-full mt-2 left-0 right-0 md:left-1/2 md:-translate-x-1/2 z-[100] bg-white shadow-2xl rounded-2xl p-4 border border-gray-100 min-w-[280px]"
743                x-cloak>
744                <div class="flex items-center justify-between mb-4">
745                    <button type="button" @click="prevMonth()" class="p-2 hover:bg-gray-100 rounded-lg"><i class="fa-solid fa-chevron-left text-xs"></i></button>
746                    <div class="font-bold text-brand-dark" x-text="monthNames[month] + ' ' + year"></div>
747                    <button type="button" @click="nextMonth()" class="p-2 hover:bg-gray-100 rounded-lg"><i class="fa-solid fa-chevron-right text-xs"></i></button>
748                </div>
749
750                <div class="grid grid-cols-7 gap-1 text-center mb-2">
751                    <template x-for="day in ['H', 'K', 'Sze', 'Cs', 'P', 'Szo', 'V']">
752                        <div class="text-[10px] font-bold text-gray-400 uppercase" x-text="day"></div>
753                    </template>
754                </div>
755
756                <div class="grid grid-cols-7 gap-1">
757                    <template x-for="blankday in blankdays">
758                        <div class="p-2"></div>
759                    </template>
760                    <template x-for="(date, dateIndex) in no_of_days" :key="dateIndex">
761                        <button
762                            type="button"
763                            @click="selectDate(date)"
764                            class="p-2 text-sm rounded-lg transition-all"
765                            :class="{
766                        'bg-brand-green text-white font-bold shadow-md': isSelected(date),
767                        'hover:bg-brand-grey text-gray-700': !isSelected(date),
768                        'text-brand-green font-bold': isToday(date) && !isSelected(date)
769                    }"
770                            x-text="date"></button>
771                    </template>
772                </div>
773            </div>
774        </div>
775    </div>
776
777            <div class="space-y-6">
778            
779                <section x-data="{ open: false }"
780                    >
781
782                    <button @click="open = !open" type="button"
783                        class="musor-slot-header bg-[#70a300] w-full text-white px-5 py-3 rounded-xl shadow-sm font-bold text-lg mb-2 hover:bg-opacity-90 transition-all focus:outline-none">
784                        <span class="flex items-center gap-2 text-left">
785                            <i class="fa-solid fa-clock opacity-80 text-sm"></i>
786                            Olvasólámpa                                                    </span>
787                        <div class="flex items-center gap-4 shrink-0">
788                            <span class="musor-slot-range text-sm font-medium bg-white/20 py-1 rounded-lg backdrop-blur-sm hidden sm:inline-flex w-28 text-center">
789                                0:00 - 5:00                            </span>
790
791                            <span class="inline-flex transition-transform duration-300 " :class="{ 'rotate-180': open }">
792                                <i class="fa-solid fa-chevron-down"></i>
793                            </span>
794                        </div>
795                    </button>
796
797                    <div class="grid-accordion" :class="{ 'is-open': open }">
798                        <div class="grid-accordion-inner">
799                            <div class="flex flex-col gap-4 pl-3 md:pl-8 border-l-2 border-gray-100 ml-2 md:ml-4 pb-4 pt-2">
800
801                                                                    
802                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
803
804                                        <div class="shrink-0 mt-0.5">
805                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
806                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
807                                                0:00                                            </div>
808                                        </div>
809
810                                        <div class="flex-1 min-w-0">
811
812                                            <!-- Kategória teljesen külön sorban, a cím felett -->
813                                                                                            <div class="mb-1">
814                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
815                                                        <i class="fa-solid fa-folder-open opacity-70"></i> vallási műsorok                                                    </span>
816                                                </div>
817                                            
818                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
819                                            <div class="flex items-start gap-2 mb-1.5">
820                                                                                                    <button type="button"
821                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_00.mp3', '\&quot;Isten, hazánkért térdelünk elődbe ...\&quot;', false, 0, true); }"
822                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
823                                                        title="Visszahallgatom az adást">
824                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
825                                                    </button>
826                                                
827                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
828                                                    <a href="/musoraink/adas/724240" class="hover:underline">
829                                                        &quot;Isten, hazánkért térdelünk elődbe ...&quot;                                                    </a>
830
831													
832
833                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
834                                                                                                    </h3>
835                                            </div>
836
837                                            
838                                                                                            <a href="/musoraink/adas/724240" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
839                                                    » bővebben...
840                                                </a>
841                                            
842                                        </div>
843
844                                        
845                                    </div>
846                                                                    
847                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
848
849                                        <div class="shrink-0 mt-0.5">
850                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
851                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
851shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
852                                                0:05                                            </div>
853                                        </div>
854
855                                        <div class="flex-1 min-w-0">
856
857                                            <!-- Kategória teljesen külön sorban, a cím felett -->
858                                                                                            <div class="mb-1">
859                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
860                                                        <i class="fa-solid fa-folder-open opacity-70"></i> vallási műsorok                                                    </span>
861                                                </div>
862                                            
863                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
864                                            <div class="flex items-start gap-2 mb-1.5">
865                                                                                                    <button type="button"
866                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_00.mp3', 'Benső végtelen', false, 300, true); }"
867                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
868                                                        title="Visszahallgatom az adást">
869                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
870                                                    </button>
871                                                
872                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
873                                                    <a href="/musoraink/adas/henri-morice-jezus-krisztus-szemelyisege-cimu-kotetbol-kekesi-eniko-olvas-fel-86-12-ism-724241" class="hover:underline">
874                                                        Benső végtelen                                                    </a>
875
876													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
877                                                            (ism.)
878                                                        </div>
879                                                    
880
881                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
882                                                                                                    </h3>
883                                            </div>
884
885                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
886                                                    Henri Morice: Jézus Krisztus személyisége című kötetből Kékesi Enikő olvas fel.  (86/12.)                                                </div>
887                                            
888                                                                                            <a href="/musoraink/adas/henri-morice-jezus-krisztus-szemelyisege-cimu-kotetbol-kekesi-eniko-olvas-fel-86-12-ism-724241" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
889                                                    » bővebben...
890                                                </a>
891                                            
892                                        </div>
893
894                                        
895                                    </div>
896                                                                    
897                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
898
899                                        <div class="shrink-0 mt-0.5">
900                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
901                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
901shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
902                                                0:15                                            </div>
903                                        </div>
904
905                                        <div class="flex-1 min-w-0">
906
907                                            <!-- Kategória teljesen külön sorban, a cím felett -->
908                                                                                            <div class="mb-1">
909                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
910                                                        <i class="fa-solid fa-folder-open opacity-70"></i> irodalmi és versműsorok                                                    </span>
911                                                </div>
912                                            
913                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
914                                            <div class="flex items-start gap-2 mb-1.5">
915                                                                                                    <button type="button"
916                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_00.mp3', 'Miért szeretem?', false, 900, true); }"
917                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
918                                                        title="Visszahallgatom az adást">
919                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
920                                                    </button>
921                                                
922                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
923                                                    <a href="/musoraink/adas/petri-gyorgy-elegia-ism-724242" class="hover:underline">
924                                                        Miért szeretem?                                                    </a>
925
926													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
927                                                            (ism.)
928                                                        </div>
929                                                    
930
931                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
932                                                                                                    </h3>
933                                            </div>
934
935                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
936                                                    vallomások irodalomról, művekről, szerzőkről
937Petri György: Elégia
938Szerkesztő: Mihályi Anikó                                                </div>
939                                            
940                                                                                            <a href="/musoraink/adas/petri-gyorgy-elegia-ism-724242" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
941                                                    » bővebben...
942                                                </a>
943                                            
944                                        </div>
945
946                                        
947                                    </div>
948                                                                    
949                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
950
951                                        <div class="shrink-0 mt-0.5">
952                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
953                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
953shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
954                                                0:30                                            </div>
955                                        </div>
956
957                                        <div class="flex-1 min-w-0">
958
959                                            <!-- Kategória teljesen külön sorban, a cím felett -->
960                                                                                            <div class="mb-1">
961                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
962                                                        <i class="fa-solid fa-folder-open opacity-70"></i> zenei műsorok                                                    </span>
963                                                </div>
964                                            
965                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
966                                            <div class="flex items-start gap-2 mb-1.5">
967                                                                                                    <button type="button"
968                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_00.mp3', 'Hangárium', false, 1800, true); }"
969                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
970                                                        title="Visszahallgatom az adást">
971                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
972                                                    </button>
973                                                
974                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
975                                                    <a href="/musoraink/adas/a-cziffra-fesztival-2026-2027-es-evadarol-balazs-janos-zongoramuvesszel-beszelgetunk-ism-724243" class="hover:underline">
976                                                        Hangárium                                                    </a>
977
978													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
979                                                            (ism.)
980                                                        </div>
981                                                    
982
983                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
984                                                                                                    </h3>
985                                            </div>
986
987                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
988                                                    A Cziffra Fesztivál 2026/2027-es évadáról Balázs János zongoraművésszel beszélgetünk
989Szerkesztő: Csuth Judit                                                </div>
990                                            
991                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
992                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
993                                                </button>
994
995                                                <div x-show="detailsOpen"
996                                                    x-transition:enter="transition ease-out duration-200"
997                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
998                                                    x-transition:enter-end="opacity-100 translate-y-0"
999                                                    x-cloak
1000                                                    class="mt-3 pt-3 border-t border-gray-100">
1001
1002                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
1003                                                            Daniil Trifonov és Vadym Kholodenko budapesti koncertje, Balázs János Liszt-maratonja, Hommage à Cziffra koncert a New York-i Carnegie Hallban, hangverseny a Royal Philharmonic Orchestraval a londoni Cadogan Hallban, valamint a Beethoven- és Kálmán Imre-évfordulókhoz kapcsolódó nagyszabású produkciók is szerepelnek a Cziffra Fesztivál 2026/2027-es évadában. A hazai és nemzetközi zenei élet kiválóságai váltják egymást Budapesten és számos magyarországi városban, bemutatkoznak fiatal tehetségek, miközben Cziffra György öröksége elevenedik meg itthon és a világ legjelentősebb zenei központjaiban.
1004Balázs János művészeti koncepciójának középpontjában a klasszikus zene mellett a tehetséggondozás, az improvizáció, a műfajok és művészeti ágak találkozása áll. A fesztivál díjakkal, mesterkurzusokkal és fellépési lehetőségekkel segíti a fiatal művészeket, miközben olyan programokat hoz létre, amelyek a zenét az irodalommal, a képzőművészettel és a tudománnyal kapcsolják össze – Cziffra György nyitott, szabad és kísérletező szellemiségét folytatva.
1005A képen Balázs János. ( Fotó: Cziffra Fesztivál)                                                        </div>
1006                                                    
1007                                                    
1008                                                </div>
1009                                            
1010                                        </div>
1011
1012                                                                                    <div class="shrink-0 w-24 h-20 md:w-32 md:h-24 ml-2 md:ml-4">
1013                                                <a href="/musoraink/adas/a-cziffra-fesztival-2026-2027-es-evadarol-balazs-janos-zongoramuvesszel-beszelgetunk-ism-724243" class="block w-full h-full rounded-lg overflow-hidden shadow-sm hover:shadow-md transition-shadow">
1014                                                    <img src="https://www.katolikusradio.hu/kepek/musorok/724243/kicsi/Nagy_Liszt_maraton_foto___4500x3000.jpg"
1015                                                        alt="Műsor kép"
1016                                                        class="w-full h-full object-cover hover:opacity-90 transition-opacity">
1017                                                </a>
1018                                            </div>
1019                                        
1020                                    </div>
1021                                                                    
1022                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1023
1024                                        <div class="shrink-0 mt-0.5">
1025                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1026                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
1026shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1027                                                1:00                                            </div>
1028                                        </div>
1029
1030                                        <div class="flex-1 min-w-0">
1031
1032                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1033                                                                                            <div class="mb-1">
1034                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1035                                                        <i class="fa-solid fa-folder-open opacity-70"></i> szolgáltató és életviteli műsorok                                                    </span>
1036                                                </div>
1037                                            
1038                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1039                                            <div class="flex items-start gap-2 mb-1.5">
1040                                                                                                    <button type="button"
1041                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_01.mp3', 'Házunk táján', false, 0, true); }"
1042                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1043                                                        title="Visszahallgatom az adást">
1044                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1045                                                    </button>
1046                                                
1047                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1048                                                    <a href="/musoraink/adas/ezerarcu-szerelem-vendegunk-eszterhai-katalin-irono-es-ferje-alkototarsa-lajtai-gyorgy-operator-ism-724244" class="hover:underline">
1049                                                        Házunk táján                                                    </a>
1050
1051													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
1052                                                            (ism.)
1053                                                        </div>
1054                                                    
1055
1056                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1057                                                                                                    </h3>
1058                                            </div>
1059
1060                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
1061                                                    Ezerarcú szerelem. Vendégünk: Eszterhai Katalin írónő és férje, alkotótársa Lajtai György operatőr.
1062Szerkesztő: Szabó Csilla                                                </div>
1063                                            
1064                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
1065                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
1066                                                </button>
1067
1068                                                <div x-show="detailsOpen"
1069                                                    x-transition:enter="transition ease-out duration-200"
1070                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
1071                                                    x-transition:enter-end="opacity-100 translate-y-0"
1072                                                    x-cloak
1073                                                    class="mt-3 pt-3 border-t border-gray-100">
1074
1075                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
1076                                                            A szív történeteiből írt gyűjteményt Eszterhai Katalin gazdagítva a világirodalom tágas tájairól hozott idézetekkel. Lajtai György pedig természetfotóival teremti meg a teret, hogy megérkezhessünk nyitott szívvel a szavakhoz. A szerelem életbentartásának fortélyairól beszélgetünk a házaspÃ
1076¡rral, a munkáról, amit érdemes végezni, hogy legfontosabb kapcsolatunkat élővé, tartóssá és erőssé tegyük.                                                        </div>
1077                                                    
1078                                                    
1079                                                </div>
1080                                            
1081                                        </div>
1082
1083                                                                                    <div class="shrink-0 w-24 h-20 md:w-32 md:h-24 ml-2 md:ml-4">
1084                                                <a href="/musoraink/adas/ezerarcu-szerelem-vendegunk-eszterhai-katalin-irono-es-ferje-alkototarsa-lajtai-gyorgy-operator-ism-724244" class="block w-full h-full rounded-lg overflow-hidden shadow-sm hover:shadow-md transition-shadow">
1085                                                    <img src="https://www.katolikusradio.hu/kepek/musorok/724244/kicsi/20260930_102152_Eszterhai_Lajtai_Szab__.jpg"
1086                                                        alt="Műsor kép"
1087                                                        class="w-full h-full object-cover hover:opacity-90 transition-opacity">
1088                                                </a>
1089                                            </div>
1090                                        
1091                                    </div>
1092                                                                    
1093                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1094
1095                                        <div class="shrink-0 mt-0.5">
1096                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1097                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1098                                                2:00                                            </div>
1099                                        </div>
1100
1101                                        <div class="flex-1 min-w-0">
1102
1103                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1104                                                                                            <div class="mb-1">
1105                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1106                                                        <i class="fa-solid fa-folder-open opacity-70"></i> egyéb kulturális műsorok                                                    </span>
1107                                                </div>
1108                                            
1109                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1110                                            <div class="flex items-start gap-2 mb-1.5">
1111                                                                                                    <button type="button"
1112                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_02.mp3', 'Akvarell', false, 0, true); }"
1113                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1114                                                        title="Visszahallgatom az adást">
1115                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1116                                                    </button>
1117                                                
1118                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1119                                                    <a href="/musoraink/adas/ablak-zsiraf-50-kiadas-zubreczki-david-h
1119ogyan-nezzunk-varost-pulszky-csalad-levelezese-1867-191-ism-724245" class="hover:underline">
1120                                                        Akvarell                                                    </a>
1121
1122													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
1123                                                            (ism.)
1124                                                        </div>
1125                                                    
1126
1127                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1128                                                                                                    </h3>
1129                                            </div>
1130
1131                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
1132                                                    kulturális paletta
1133Ablak-Zsiráf 50. kiadás
1134Zubreczki Dávid: Hogyan nézzünk várost?
1135A Pulszky család levelezése 1867–191
1136Szerkesztő: Fazekas Gyöngyvér                                                </div>
1137                                            
1138                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
1139                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
1140                                                </button>
1141
1142                                                <div x-show="detailsOpen"
1143                                                    x-transition:enter="transition ease-out duration-200"
1144                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
1145                                                    x-transition:enter-end="opacity-100 translate-y-0"
1146                                                    x-cloak
1147                                                    class="mt-3 pt-3 border-t border-gray-100">
1148
1149                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
1150                                                            Az Ablak-Zsiráf című képes gyermeklexikon első kiadása 1971-ben jelent meg, Mérei Ferenc és V. Binét Ágnes szerkesztésében. A legfrissebb, 50. kiadás a jelenkor szókincsének figyelembevételével készült, a szócikkek mellett pedig az illusztrációk is korhűbb formában jelennek meg a kiadványban, mely ezúttal is a Móra Kiadó gondozásában látott napvilágot. A felújított változatot Török Ágnes és Farkas Judit szerkesztette. A megújulás előzményeiről és a kötet változásairól Török Ágnessel Tóth Zsófia beszélget.
1151Izgalmasan rendhagyó építészeti könyvvel jelentkezett Zubreczki Dávid. A címe: „Hogyan nézzünk várost? – Utcai felfedezők kézikönyve”. A könyvben bevallottan nem szerepelnek konkrét épületismertetők és képek, és valójában pontos városnézési módszertant sem ismertet. Erről is beszélget a szerzővel Fazekas Gyöngyvér.
1152A Magyar Nemzeti Múzeum és az Országos Széchényi Könyvtár közösen adta ki A Pulszky család levelezése 1867–1911 című kötetét. Viskolcz Noémit, a Miskolci Egyetem Történettudományi Intézet egyetemi tanárát, a kötet egyik szerkesztőjét és Szentesi Edit művészettörténész-esztétát Fazekas Gyöngyvér kérdezte a könyvbemutató után.                                                        </div>
1153                                                    
1154                                                    
1155                                                </div>
1156                                            
1157                                        </div>
1158
1159                                        
1160                                    </div>
1161                                                                    
1162                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1163
1164                                        <div class="shrink-0 mt-0.5">
1165                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1166                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
1166shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1167                                                3:00                                            </div>
1168                                        </div>
1169
1170                                        <div class="flex-1 min-w-0">
1171
1172                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1173                                                                                            <div class="mb-1">
1174                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1175                                                        <i class="fa-solid fa-folder-open opacity-70"></i> portré- és riportműsorok                                                    </span>
1176                                                </div>
1177                                            
1178                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1179                                            <div class="flex items-start gap-2 mb-1.5">
1180                                                                                                    <button type="button"
1181                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_03.mp3', 'Embernek maradni', false, 0, true); }"
1182                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1183                                                        title="Visszahallgatom az adást">
1184                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1185                                                    </button>
1186                                                
1187                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1188                                                    <a href="/musoraink/adas/orvoskent-elet-es-halal-hataran-vendegunk-dr-csapody-marcell-aneszteziologus-intenziv-t-foorvos-ism-724246" class="hover:underline">
1189                                                        Embernek maradni                                                    </a>
1190
1191													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
1192                                                            (ism.)
1193                                                        </div>
1194                                                    
1195
1196                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1197                                                                                                    </h3>
1198                                            </div>
1199
1200                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
1201                                                    Orvosként élet és halál határán
1202Vendégünk dr. Csapody Marcell, aneszteziológus, intenzív t. főorvos
1203Szerkesztő: Müller Márk                                                </div>
1204                                            
1205                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
1206                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
1207                                                </button>
1208
1209                                                <div x-show="detailsOpen"
1210                                                    x-transition:enter="transition ease-out duration-200"
1211                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
1212                                                    x-transition:enter-end="opacity-100 translate-y-0"
1213                                                    x-cloak
1214                                                    class="mt-3 pt-3 border-t border-gray-100">
1215
1216                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
1217                                                            Hogyan formálja át egy orvos gondolkodását a legkiszolgáltatottabb emberekkel való találkozás, 
1217és miként maradhatunk igazán emberek a mai felgyorsult világban? Dr. Csapody Marcell aneszteziológus és intenzív terápiás főorvos életútján keresztül az élet, a szenvedés és a hit legmélyebb kérdései tárulnak fel a hallgatóság előtt. A nagy családból hozott közösségi szemlélet, a gimnáziumi önkéntesség, valamint a korai betegszállítói és segédápolói munkatapasztalat mind alapjaiban határozták meg az emberi létezés törékenységéhez és a gyógyításhoz való alázatos viszonyulását. 
1218Milyen szerepet játszhat a kétség és az Istennel való küzdelem a személyes hit megélésében? A beszélgetésben a főorvos őszintén vall a saját gyötrődéseiről és a családi örökség hatásairól, miközben a 2023-as törökországi földrengés megrázó helyszínén szerzett élményein keresztül mutatja be, hogyan születhet meg a legmélyebb válságokból a gondviselésbe vetett rendíthetetlen meggyőződés. 
1219Vajon miért kerüli a modern ember a szenvedést, és miért elengedhetetlen az ellenpólusok megtapasztalása a szépség és az empátia valódi megéléséhez? Pályafutása során a váratlan orvosi kihívásokra – legyen szó a COVID-intenzív részleg megszervezéséről vagy a gyermekkórházi osztályvezetés komplex feladatairól – a cselekvő felelősségvállalás és a betegek iránti mély jelenlét volt a válasza. 
1220Ez a gondolatébresztő beszélgetés azt a végső üzenetet kínálja minden érdeklődő számára, hogy az irgalom, az alázat, a természetben megélt csend és az imádság révén a mindennapokban is megőrizhetjük emberségünket.
1221Fotó: MKR / Polcz Péter                                                        </div>
1222                                                    
1223                                                    
1224                                                </div>
1225                                            
1226                                        </div>
1227
1228                                                                                    <div class="shrink-0 w-24 h-20 md:w-32 md:h-24 ml-2 md:ml-4">
1229                                                <a href="/musoraink/adas/orvoskent-elet-es-halal-hataran-vendegunk-dr-csapody-marcell-aneszteziologus-intenziv-t-foorvos-ism-724246" class="block w-full h-full rounded-lg overflow-hidden shadow-sm hover:shadow-md transition-shadow">
1230                                                    <img src="https://www.katolikusradio.hu/kepek/musorok/724246/kicsi/20260921_174205_Csapody_Mu__ller.jpg"
1231                                                        alt="Műsor kép"
1232                                                        class="w-full h-full object-cover hover:opacity-90 transition-opacity">
1233                                                </a>
1234                                            </div>
1235                                        
1236                                    </div>
1237                                                                    
1238                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1239
1240                                        <div class="shrink-0 mt-0.5">
1241                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1242                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1243                                                4:00                                            </div>
1244                                        </div>
1245
1246                                        <div class="flex-1 min-w-0">
1247
1248                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1249                                                                                            <div class="mb-1">
1250                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1251                                                        <i class="fa-solid fa-folder-open opacity-70"></i> egyéb műsorok                                                    </span>
1252                                                </div>
1253                                            
1254                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1255                                            <div class="flex items-start gap-2 mb-1.5">
1256                                                                                                    <button type="button"
1257                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_04.mp3', 'Vendég-oldal', false, 0, true); }"
1258                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1259                                                        title="Visszahallgatom az adást">
1260                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1261                                                    </button>
1262                                                
1263                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1264                                                    <a href="/musoraink/adas/szilvasvaradi-es-szomolyai-e
1264semenyekrol-szolunk-ism-724247" class="hover:underline">
1265                                                        Vendég-oldal                                                    </a>
1266
1267													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
1268                                                            (ism.)
1269                                                        </div>
1270                                                    
1271
1272                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1273                                                                                                    </h3>
1274                                            </div>
1275
1276                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
1277                                                    válogatás a Szent István Rádió műsorából
1278Szilvásváradi és Szomolyai eseményekről szólunk                                                </div>
1279                                            
1280                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
1281                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
1282                                                </button>
1283
1284                                                <div x-show="detailsOpen"
1285                                                    x-transition:enter="transition ease-out duration-200"
1286                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
1287                                                    x-transition:enter-end="opacity-100 translate-y-0"
1288                                                    x-cloak
1289                                                    class="mt-3 pt-3 border-t border-gray-100">
1290
1291                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
1292                                                            Ma Szilvásváradi és Szomolyai eseményekről szólunk. Ajánlónkban Bajzát Józsefet hallják Szomolyáról.
1293Szerkesztő: Pap Péter
1294Zenei szerkesztő: Turi Sarolta
1295Műsorvezető: Molnár András                                                        </div>
1296                                                    
1297                                                    
1298                                                </div>
1299                                            
1300                                        </div>
1301
1302                                        
1303                                    </div>
1304                                
1305                            </div>
1306                        </div>
1307                    </div>
1308                </section>
1309
1310            
1311                <section x-data="{ open: true }"
1312                    >
1313
1314                    <button @click="open = !open" type="button"
1315                        class="musor-slot-header bg-[#70a300] w-full text-white px-5 py-3 rounded-xl shadow-sm font-bold text-lg mb-2 hover:bg-opacity-90 transition-all focus:outline-none">
1316                        <span class="flex items-center gap-2 text-left">
1317                            <i class="fa-solid fa-clock opacity-80 text-sm"></i>
1318                            Ébredj, ember!                                                    </span>
1319                        <div class="flex items-center gap-4 shrink-0">
1320                            <span class="musor-slot-range text-sm font-medium bg-white/20 py-1 rounded-lg backdrop-blur-sm hidden sm:inline-flex w-28 text-center">
1321                                5:00 - 7:00                            </span>
1322
1323                            <span class="inline-flex transition-transform duration-300 rotate-180" :class="{ 'rotate-180': open }">
1324                                <i class="fa-solid fa-chevron-down"></i>
1325                            </span>
1326                        </div>
1327                    </button>
1328
1329                    <div class="grid-accordion is-open" :class="{ 'is-open': open }">
1330                        <div class="grid-accordion-inner">
1331                            <div class="flex flex-col gap-4 pl-3 md:pl-8 border-l-2 border-gray-100 ml-2 md:ml-4 pb-4 pt-2">
1332
1333                                                                    
1334                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1335
1336                                        <div class="shrink-0 mt-0.5">
1337                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1338                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1339                                                5:00                                            </div>
1340                                        </div>
1341
1342                                        <div class="flex-1 min-w-0">
1343
1344                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1345                                                                                            <div class="mb-1">
1346                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1347                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
1348                                                </div>
1349                                            
1350                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1351                                            <div class="flex items-start gap-2 mb-1.5">
1352                                                                                                    <button type="button"
1353                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_05.mp3', 'Körkép', false, 0, true); }"
1354                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1355                                                        title="Visszahallgatom az adást">
1356                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1357                                                    </button>
1358                                                
1359                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1360                                                    <a href="/musoraink/adas/724248" class="hover:underline">
1361                                                        Körkép                                                    </a>
1362
1363													
1364
1365                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1366                                                                                                    </h3>
1367                                            </div>
1368
1369                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
1370                                                    orosházi és debreceni összeállítás                                                </div>
1371                                            
1372                                                                                            <a href="/musoraink/adas/724248" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
1373                                                    » bővebben...
1374                                                </a>
1375                                            
1376                                        </div>
1377
1378                                        
1379                                    </div>
1380                                                                    
1381                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1382
1383                                        <div class="shrink-0 mt-0.5">
1384                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1385                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
1385shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1386                                                5:30                                            </div>
1387                                        </div>
1388
1389                                        <div class="flex-1 min-w-0">
1390
1391                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1392                                                                                            <div class="mb-1">
1393                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1394                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
1395                                                </div>
1396                                            
1397                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1398                                            <div class="flex items-start gap-2 mb-1.5">
1399                                                                                                    <button type="button"
1400                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_05.mp3', 'Hírek', false, 1800, true); }"
1401                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1402                                                        title="Visszahallgatom az adást">
1403                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1404                                                    </button>
1405                                                
1406                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1407                                                    <a href="/musoraink/adas/724249" class="hover:underline">
1408                                                        Hírek                                                    </a>
1409
1410													
1411
1412                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1413                                                                                                    </h3>
1414                                            </div>
1415
1416                                            
1417                                                                                            <a href="/musoraink/adas/724249" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
1418                                                    » bővebben...
1419                                                </a>
1420                                            
1421                                        </div>
1422
1423                                        
1424                                    </div>
1425                                                                    
1426                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1427
1428                                        <div class="shrink-0 mt-0.5">
1429                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1430                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1431                                                5:34                                            </div>
1432                                        </div>
1433
1434                                        <div class="flex-1 min-w-0">
1435
1436                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1437                                                                                            <div class="mb-1">
1438                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1439                                                        <i class="fa-solid fa-folder-open opacity-70"></i> vallási műsorok                                                    </span>
1440                                                </div>
1441                                            
1442                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1443                                            <div class="flex items-start gap-2 mb-1.5">
1444                                                                                                    <button type="button"
1445                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_05.mp3', 'Napi evangélium', false, 2040, true); }"
1446                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1447                                                        title="Visszahallgatom az adást">
1448                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1449                                                    </button>
1450                                                
1451                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1452                                                    <a href="/musoraink/adas/napi-evangelium-paros-ev-evkozi-ido-26-het-csutortok-lk-10-1-12" class="hover:underline">
1453                                                        Napi evangélium                                                    </a>
1454
1455													
1456
1457                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1458                                                                                                    </h3>
1459                                            </div>
1460
1461                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
1462                                                    páros év, évközi idő 26. hét, csütörtök
1463** Lk 10,1-12 **
1464Felolvassa: Varga László                                                </div>
1465                                            
1466                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
1467                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
1468                                                </button>
1469
1470                                                <div x-show="detailsOpen"
1471                                                    x-transition:enter="transition ease-out duration-200"
1472                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
1473                                                    x-transition:enter-end="opacity-100 translate-y-0"
1474                                                    x-cloak
1475                                                    class="mt-3 pt-3 border-t border-gray-100">
1476
1477                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
1478                                                            Ezek után az Úr kiválasztott más hetvenkettőt, és elküldte őket kettesével maga előtt minden városba és helységbe, ahova menni készült. Azt mondta nekik: ,,Az aratnivaló sok, de a munkás kevés. Kérjétek azért az aratás Urát, küldjön munkásokat az aratásába. Menjetek! Íme, úgy küldelek titeket, mint bárányokat a farkasok közé. Ne vigyetek erszényt, se tarisznyát, se sarut, és az úton senkit se köszöntsetek. Ha valamelyik házba bementek, először ezt mondjátok: ,,Békesség e háznak!'' Ha a békesség fia lakik ott, rászáll a ti békességtek; ha pedig nem, visszaszáll rátok. Maradjatok ugyanabban a házban, egyétek és igyátok, amijük van, mert méltó a munkás a maga bérére. Ne járjatok házról-házra. Ha valamelyik városba betértek, és ott befogadnak titeket, egyétek, amit elétek tesznek. Gyógyítsátok meg az ott lévő betegeket, és mondjátok nekik: ,,Elközelgett hozzátok az Isten országa.'' Ha pedig egy városba betértek, és nem fogadnak be titeket, menjetek ki az utcára, és mondjátok: ,,Még a port is lerázzuk nektek, amely a ti városotokban lábainkra tapadt; tudjátok meg azonban, hogy elközelgett az Isten országa.'' Mondom nektek: Szodomának könnyebb lesz a sorsa azon a napon, mint annak a városnak.
1479Olvasmányok, ünnepek a liturgikus naptárban.                                                        </div>
1480                                                    
1481                                                    
1482                                                </div>
1483                                            
1484                                        </div>
1485
1486                                        
1487                                    </div>
1488                                                                    
1489                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1490
1491                                        <div class="shrink-0 mt-0.5">
1492                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1493                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
1493shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1494                                                5:40                                            </div>
1495                                        </div>
1496
1497                                        <div class="flex-1 min-w-0">
1498
1499                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1500                                                                                            <div class="mb-1">
1501                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1502                                                        <i class="fa-solid fa-folder-open opacity-70"></i> vallási műsorok                                                    </span>
1503                                                </div>
1504                                            
1505                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1506                                            <div class="flex items-start gap-2 mb-1.5">
1507                                                                                                    <button type="button"
1508                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_05.mp3', 'A Vatikáni Rádió magyar műsora', false, 2400, true); }"
1509                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1510                                                        title="Visszahallgatom az adást">
1511                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1512                                                    </button>
1513                                                
1514                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1515                                                    <a href="/musoraink/adas/724251" class="hover:underline">
1516                                                        A Vatikáni Rádió magyar műsora                                                    </a>
1517
1518													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
1519                                                            (ism.)
1520                                                        </div>
1521                                                    
1522
1523                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1524                                                                                                    </h3>
1525                                            </div>
1526
1527                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
1528                                                    (a tegnap esti adás ismétlése)                                                </div>
1529                                            
1530                                                                                            <a href="/musoraink/adas/724251" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
1531                                                    » bővebben...
1532                                                </a>
1533                                            
1534                                        </div>
1535
1536                                        
1537                                    </div>
1538                                                                    
1539                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1540
1541                                        <div class="shrink-0 mt-0.5">
1542                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1543                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
1543shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1544                                                6:00                                            </div>
1545                                        </div>
1546
1547                                        <div class="flex-1 min-w-0">
1548
1549                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1550                                                                                            <div class="mb-1">
1551                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1552                                                        <i class="fa-solid fa-folder-open opacity-70"></i> egyéb műsorok                                                    </span>
1553                                                </div>
1554                                            
1555                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1556                                            <div class="flex items-start gap-2 mb-1.5">
1557                                                                                                    <button type="button"
1558                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_06.mp3', 'Harangszó', false, 0, true); }"
1559                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1560                                                        title="Visszahallgatom az adást">
1561                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1562                                                    </button>
1563                                                
1564                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1565                                                    <a href="/musoraink/adas/724252" class="hover:underline">
1566                                                        Harangszó                                                    </a>
1567
1568													
1569
1570                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1571                                                                                                    </h3>
1572                                            </div>
1573
1574                                            
1575                                                                                            <a href="/musoraink/adas/724252" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
1576                                                    » bővebben...
1577                                                </a>
1578                                            
1579                                        </div>
1580
1581                                        
1582                                    </div>
1583                                                                    
1584                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1585
1586                                        <div class="shrink-0 mt-0.5">
1587                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1588                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1589                                                6:01                                            </div>
1590                                        </div>
1591
1592                                        <div class="flex-1 min-w-0">
1593
1594                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1595                                                                                            <div class="mb-1">
1596                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1597                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
1598                                                </div>
1599                                            
1600                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1601                                            <div class="flex items-start gap-2 mb-1.5">
1602                                                                                                    <button type="button"
1603                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_06.mp3', 'Hírek', false, 60, true); }"
1604                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1605                                                        title="Visszahallgatom az adást">
1606                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1607                                                    </button>
1608                                                
1609                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1610                                                    <a href="/musoraink/adas/724253" class="hover:underline">
1611                                                        Hírek                                                    </a>
1612
1613													
1614
1615                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1616                                                                                                    </h3>
1617                                            </div>
1618
1619                                            
1620                                                                                            <a href="/musoraink/adas/724253" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
1621                                                    » bővebben...
1622                                                </a>
1623                                            
1624                                        </div>
1625
1626                                        
1627                                    </div>
1628                                                                    
1629                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1630
1631                                        <div class="shrink-0 mt-0.5">
1632                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1633                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1634                                                6:15                                            </div>
1635                                        </div>
1636
1637                                        <div class="flex-1 min-w-0">
1638
1639                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1640                                                                                            <div class="mb-1">
1641                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1642                                                        <i class="fa-solid fa-folder-open opacity-70"></i> vallási műsorok                                                    </span>
1643                                                </div>
1644                                            
1645                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1646                                            <div class="flex items-start gap-2 mb-1.5">
1647                                                                                                    <button type="button"
1648                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_06.mp3', 'Benső végtelen', false, 900, true); }"
1649                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1650                                                        title="Visszahallgatom az adást">
1651                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1652                                                    </button>
1653                                                
1654                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1655                                                    <a href="/musoraink/adas/henri-morice-jezus-krisztus-szemelyisege-cimu-kotetbol-kekesi-eniko-olvas-fel-86-13-724254" class="hover:underline">
1656                                                        Benső végtelen                                                    </a>
1657
1658													
1659
1660                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1661                                                                                                    </h3>
1662                                            </div>
1663
1664                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
1665                                                    Henri Morice: Jézus Krisztus személyisége című kötetből Kékesi Enikő olvas fel.  (86/13.)                                                </div>
1666                                            
1667                                                                                            <a href="/musoraink/adas/henri-morice-jezus-krisztus-szemelyisege-cimu-kotetbol-kekesi-eniko-olvas-fel-86-13-724254" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
1668                                                    » bővebben...
1669                                                </a>
1670                                            
1671                                        </div>
1672
1673                                        
1674                                    </div>
1675                                                                    
1676                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1677
1678                                        <div class="shrink-0 mt-0.5">
1679                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1680                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
1680shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1681                                                6:30                                            </div>
1682                                        </div>
1683
1684                                        <div class="flex-1 min-w-0">
1685
1686                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1687                                                                                            <div class="mb-1">
1688                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1689                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
1690                                                </div>
1691                                            
1692                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1693                                            <div class="flex items-start gap-2 mb-1.5">
1694                                                                                                    <button type="button"
1695                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_06.mp3', 'Hírtükör', false, 1801, true); }"
1696                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1697                                                        title="Visszahallgatom az adást">
1698                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1699                                                    </button>
1700                                                
1701                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1702                                                    <a href="/musoraink/adas/724255" class="hover:underline">
1703                                                        Hírtükör                                                    </a>
1704
1705													
1706
1707                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1708                                                                                                    </h3>
1709                                            </div>
1710
1711                                            
1712                                                                                            <a href="/musoraink/adas/724255" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
1713                                                    » bővebben...
1714                                                </a>
1715                                            
1716                                        </div>
1717
1718                                        
1719                                    </div>
1720                                                                    
1721                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1722
1723                                        <div class="shrink-0 mt-0.5">
1724                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1725                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1726                                                6:50                                            </div>
1727                                        </div>
1728
1729                                        <div class="flex-1 min-w-0">
1730
1731                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1732                                                                                            <div class="mb-1">
1733                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1734                                                        <i class="fa-solid fa-folder-open opacity-70"></i> ismeretterjesztő műsorok                                                    </span>
1735                                                </div>
1736                                            
1737                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1738                                            <div class="flex items-start gap-2 mb-1.5">
1739                                                                                                    <button type="button"
1740                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_06.mp3', 'Múltidéző', false, 3000, true); }"
1741                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1742                                                        title="Visszahallgatom az adást">
1743                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1744                                                    </button>
1745                                                
1746                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1747                                                    <a href="/musoraink/adas/724256" class="hover:underline">
1748                                                        Múltidéző                                                    </a>
1749
1750													
1751
1752                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1753                                                                                                    </h3>
1754                                            </div>
1755
1756                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
1757                                                    Szerkesztő: Iványi Balázs                                                </div>
1758                                            
1759                                                                                            <a href="/musoraink/adas/724256" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
1760                                                    » bővebben...
1761                                                </a>
1762                                            
1763                                        </div>
1764
1765                                        
1766                                    </div>
1767                                                                    
1768                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1769
1770                                        <div class="shrink-0 mt-0.5">
1771                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1772                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1773                                                6:52                                            </div>
1774                                        </div>
1775
1776                                        <div class="flex-1 min-w-0">
1777
1778                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1779                                                                                            <div class="mb-1">
1780                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1781                                                        <i class="fa-solid fa-folder-open opacity-70"></i> vallási műsorok                                                    </span>
1782                                                </div>
1783                                            
1784                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1785                                            <div class="flex items-start gap-2 mb-1.5">
1786                                                                                                    <button type="button"
1787                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_06.mp3', 'Reggeli ima', false, 3120, true); }"
1788                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1789                                                        title="Visszahallgatom az adást">
1790                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1791                                                    </button>
1792                                                
1793                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1794                                                    <a href="/musoraink/adas/724257" class="hover:underline">
1795                                                        Reggeli ima                                                    </a>
1796
1797													
1798
1799                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1800                                                                                                    </h3>
1801                                            </div>
1802
1803                                            
1804                                                                                            <a href="/musoraink/adas/724257" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
1805                                                    » bővebben...
1806                                                </a>
1807                                            
1808                                        </div>
1809
1810                                        
1811                                    </div>
1812                                
1813                            </div>
1814                        </div>
1815                    </div>
1816                </section>
1817
1818            
1819                <section x-data="{ open: true }"
1820                    >
1821
1822                    <button @click="open = !open" type="button"
1823                        class="musor-slot-header bg-[#70a300] w-full text-white px-5 py-3 rounded-xl shadow-sm font-bold text-lg mb-2 hover:bg-opacity-90 transition-all focus:outline-none">
1824                        <span class="flex items-center gap-2 text-left">
1825                            <i class="fa-solid fa-clock opacity-80 text-sm"></i>
1826                            Zenés napköszöntő                                                    </span>
1827                        <div class="flex items-center gap-4 shrink-0">
1828                            <span class="musor-slot-range text-sm font-medium bg-white/20 py-1 rounded-lg backdrop-blur-sm hidden sm:inline-flex w-28 text-center">
1829                                7:00 - 9:00                            </span>
1830
1831                            <span class="inline-flex transition-transform duration-300 rotate-180" :class="{ 'rotate-180': open }">
1832                                <i class="fa-solid fa-chevron-down"></i>
1833                            </span>
1834                        </div>
1835                    </button>
1836
1837                    <div class="grid-accordion is-open" :class="{ 'is-open': open }">
1838                        <div class="grid-accordion-inner">
1839                            <div class="flex flex-col gap-4 pl-3 md:pl-8 border-l-2 border-gray-100 ml-2 md:ml-4 pb-4 pt-2">
1840
1841                                                                    
1842                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1843
1844                                        <div class="shrink-0 mt-0.5">
1845                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1846                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
1846shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1847                                                7:00                                            </div>
1848                                        </div>
1849
1850                                        <div class="flex-1 min-w-0">
1851
1852                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1853                                                                                            <div class="mb-1">
1854                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1855                                                        <i class="fa-solid fa-folder-open opacity-70"></i> vallási műsorok                                                    </span>
1856                                                </div>
1857                                            
1858                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1859                                            <div class="flex items-start gap-2 mb-1.5">
1860                                                                                                    <button type="button"
1861                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_07.mp3', 'Szentmise', false, 0, true); }"
1862                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1863                                                        title="Visszahallgatom az adást">
1864                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1865                                                    </button>
1866                                                
1867                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1868                                                    <a href="/musoraink/adas/724258" class="hover:underline">
1869                                                        Szentmise                                                    </a>
1870
1871													
1872
1873                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1874                                                                                                    </h3>
1875                                            </div>
1876
1877                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
1878                                                    közvetítés Budapestről, a városmajori Jézus Szíve plébániatemplomból                                                </div>
1879                                            
1880                                                                                            <a href="/musoraink/adas/724258" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
1881                                                    » bővebben...
1882                                                </a>
1883                                            
1884                                        </div>
1885
1886                                        
1887                                    </div>
1888                                                                    
1889                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1890
1891                                        <div class="shrink-0 mt-0.5">
1892                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1893                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1894                                                7:30                                            </div>
1895                                        </div>
1896
1897                                        <div class="flex-1 min-w-0">
1898
1899                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1900                                                                                            <div class="mb-1">
1901                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1902                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
1903                                                </div>
1904                                            
1905                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1906                                            <div class="flex items-start gap-2 mb-1.5">
1907                                                                                                    <button type="button"
1908                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_07.mp3', 'Hírek', false, 1800, true); }"
1909                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1910                                                        title="Visszahallgatom az adást">
1911                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1912                                                    </button>
1913                                                
1914                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1915                                                    <a href="/musoraink/adas/724259" class="hover:underline">
1916                                                        Hírek                                                    </a>
1917
1918													
1919
1920                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1921                                                                                                    </h3>
1922                                            </div>
1923
1924                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
1925                                                    közlekedés, lapszemle, műsorajánló                                                </div>
1926                                            
1927                                                                                            <a href="/musoraink/adas/724259" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
1928                                                    » bővebben...
1929                                                </a>
1930                                            
1931                                        </div>
1932
1933                                        
1934                                    </div>
1935                                                                    
1936                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1937
1938                                        <div class="shrink-0 mt-0.5">
1939                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1940                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1941                                                8:00                                            </div>
1942                                        </div>
1943
1944                                        <div class="flex-1 min-w-0">
1945
1946                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1947                                                                                            <div class="mb-1">
1948                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1949                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
1950                                                </div>
1951                                            
1952                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1953                                            <div class="flex items-start gap-2 mb-1.5">
1954                                                                                                    <button type="button"
1955                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_08.mp3', 'Hírek', false, 0, true); }"
1956                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
1957                                                        title="Visszahallgatom az adást">
1958                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
1959                                                    </button>
1960                                                
1961                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
1962                                                    <a href="/musoraink/adas/724260" class="hover:underline">
1963                                                        Hírek                                                    </a>
1964
1965													
1966
1967                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
1968                                                                                                    </h3>
1969                                            </div>
1970
1971                                            
1972                                                                                            <a href="/musoraink/adas/724260" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
1973                                                    » bővebben...
1974                                                </a>
1975                                            
1976                                        </div>
1977
1978                                        
1979                                    </div>
1980                                                                    
1981                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
1982
1983                                        <div class="shrink-0 mt-0.5">
1984                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
1985                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
1986                                                8:08                                            </div>
1987                                        </div>
1988
1989                                        <div class="flex-1 min-w-0">
1990
1991                                            <!-- Kategória teljesen külön sorban, a cím felett -->
1992                                                                                            <div class="mb-1">
1993                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
1994                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
1995                                                </div>
1996                                            
1997                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
1998                                            <div class="flex items-start gap-2 mb-1.5">
1999                                                                                                    <button type="button"
2000                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_08.mp3', 'Reggeli riport', false, 480, true); }"
2001                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2002                                                        title="Visszahallgatom az adást">
2003                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2004                                                    </button>
2005                                                
2006                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2007                                                    <a href="/musoraink/adas/papp-kontha-nellivel-az-eotvos10-rendezvenyszervezojevel-beszelgetunk-724261" class="hover:underline">
2008                                                        Reggeli riport                                                    </a>
2009
2010													
2011
2012                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2013                                                                                                    </h3>
2014                                            </div>
2015
2016                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
2017                                                    Papp-Kontha Nellivel, az Eötvös10 rendezvényszervezőjével beszélgetünk.
2018Szerkesztő: Balázs Zsanett                                                </div>
2019                                            
2020                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
2021                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
2022                                                </button>
2023
2024                                                <div x-show="detailsOpen"
2025                                                    x-transition:enter="transition ease-out duration-200"
2026                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
2027                                                    x-transition:enter-end="opacity-100 translate-y-0"
2028                                                    x-cloak
2029                                                    class="mt-3 pt-3 border-t border-gray-100">
2030
2031                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
2032                                                            Egy művelődési ház akkor igazán élő, ha a programok nemcsak kikapcsolódást kínálnak, hanem közösségeket is teremtenek. Az Eötvös10-ben a gyerekprogramoktól a kulturális rendezvényeken át a közösségi eseményekig sokféle lehetőség várja a látogatókat. De hogyan áll össze mindez a kulisszák mögött, és mi kell ahhoz, hogy egy program valóban megszólítsa a közönséget?
2033A programokról bővebben az  Eötvös10 honlapján   tájékozódhatnak az érdeklődők.                                                        </div>
2034                                                    
2035                                                    
2036                                                </div>
2037                                            
2038                                        </div>
2039
2040                                        
2041                                    </div>
2042                                                                    
2043                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2044
2045                                        <div class="shrink-0 mt-0.5">
2046                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2047                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
2047shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2048                                                8:22                                            </div>
2049                                        </div>
2050
2051                                        <div class="flex-1 min-w-0">
2052
2053                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2054                                                                                            <div class="mb-1">
2055                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2056                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
2057                                                </div>
2058                                            
2059                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2060                                            <div class="flex items-start gap-2 mb-1.5">
2061                                                                                                    <button type="button"
2062                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_08.mp3', 'Műsorajánló', false, 1320, true); }"
2063                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2064                                                        title="Visszahallgatom az adást">
2065                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2066                                                    </button>
2067                                                
2068                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2069                                                    <a href="/musoraink/adas/724262" class="hover:underline">
2070                                                        Műsorajánló                                                    </a>
2071
2072													
2073
2074                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2075                                                                                                    </h3>
2076                                            </div>
2077
2078                                            
2079                                                                                            <a href="/musoraink/adas/724262" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2080                                                    » bővebben...
2081                                                </a>
2082                                            
2083                                        </div>
2084
2085                                        
2086                                    </div>
2087                                                                    
2088                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2089
2090                                        <div class="shrink-0 mt-0.5">
2091                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2092                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2093                                                8:30                                            </div>
2094                                        </div>
2095
2096                                        <div class="flex-1 min-w-0">
2097
2098                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2099                                                                                            <div class="mb-1">
2100                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2101                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
2102                                                </div>
2103                                            
2104                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2105                                            <div class="flex items-start gap-2 mb-1.5">
2106                                                                                                    <button type="button"
2107                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_08.mp3', 'Hírek', false, 1800, true); }"
2108                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2109                                                        title="Visszahallgatom az adást">
2110                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2111                                                    </button>
2112                                                
2113                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2114                                                    <a href="/musoraink/adas/724263" class="hover:underline">
2115                                                        Hírek                                                    </a>
2116
2117													
2118
2119                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2120                                                                                                    </h3>
2121                                            </div>
2122
2123                                            
2124                                                                                            <a href="/musoraink/adas/724263" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2125                                                    » bővebben...
2126                                                </a>
2127                                            
2128                                        </div>
2129
2130                                        
2131                                    </div>
2132                                                                    
2133                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2134
2135                                        <div class="shrink-0 mt-0.5">
2136                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2137                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2138                                                8:37                                            </div>
2139                                        </div>
2140
2141                                        <div class="flex-1 min-w-0">
2142
2143                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2144                                                                                            <div class="mb-1">
2145                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2146                                                        <i class="fa-solid fa-folder-open opacity-70"></i> egyéb műsorok                                                    </span>
2147                                                </div>
2148                                            
2149                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2150                                            <div class="flex items-start gap-2 mb-1.5">
2151                                                                                                    <button type="button"
2152                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_08.mp3', 'M
2152űsorajánló', false, 2220, true); }"
2153                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2154                                                        title="Visszahallgatom az adást">
2155                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2156                                                    </button>
2157                                                
2158                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2159                                                    <a href="/musoraink/adas/724264" class="hover:underline">
2160                                                        Műsorajánló                                                    </a>
2161
2162													
2163
2164                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2165                                                                                                    </h3>
2166                                            </div>
2167
2168                                            
2169                                                                                            <a href="/musoraink/adas/724264" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2170                                                    » bővebben...
2171                                                </a>
2172                                            
2173                                        </div>
2174
2175                                        
2176                                    </div>
2177                                                                    
2178                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2179
2180                                        <div class="shrink-0 mt-0.5">
2181                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2182                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2183                                                8:45                                            </div>
2184                                        </div>
2185
2186                                        <div class="flex-1 min-w-0">
2187
2188                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2189                                                                                            <div class="mb-1">
2190                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2191                                                        <i class="fa-solid fa-folder-open opacity-70"></i> szolgáltató és életviteli műsorok                                                    </span>
2192                                                </div>
2193                                            
2194                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2195                                            <div class="flex items-start gap-2 mb-1.5">
2196                                                                                                    <button type="button"
2197                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_08.mp3', 'Venite', false, 2700, true); }"
2198                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2199                                                        title="Visszahallgatom az adást">
2200                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2201                                                    </button>
2202                                                
2203                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2204                                                    <a href="/musoraink/adas/724265" class="hover:underline">
2205                                                        Venite                                                    </a>
2206
2207													
2208
2209                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2210                                                                                                    </h3>
2211                                            </div>
2212
2213                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
2214                                                    egyházi programajánló 
2215Szerkesztő: Hámori Kinga                                                </div>
2216                                            
2217                                                                                            <a href="/musoraink/adas/724265" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2218                                                    » bővebben...
2219                                                </a>
2220                                            
2221                                        </div>
2222
2223                                        
2224                                    </div>
2225                                
2226                            </div>
2227                        </div>
2228                    </div>
2229                </section>
2230
2231            
2232                <section x-data="{ open: true }"
2233                    >
2234
2235                    <button @click="open = !open" type="button"
2236                        class="musor-slot-header bg-[#70a300] w-full text-white px-5 py-3 rounded-xl shadow-sm font-bold text-lg mb-2 hover:bg-opacity-90 transition-all focus:outline-none">
2237                        <span class="flex items-center gap-2 text-left">
2238                            <i class="fa-solid fa-clock opacity-80 text-sm"></i>
2239                            Életre-való                                                    </span>
2240                        <div class="flex items-center gap-4 shrink-0">
2241                            <span class="musor-slot-range text-sm font-medium bg-white/20 py-1 rounded-lg backdrop-blur-sm hidden sm:inline-flex w-28 text-center">
2242                                9:00 - 11:00                            </span>
2243
2244                            <span class="inline-flex transition-transform duration-300 rotate-180" :class="{ 'rotate-180': open }">
2245                                <i class="fa-solid fa-chevron-down"></i>
2246                            </span>
2247                        </div>
2248                    </button>
2249
2250                    <div class="grid-accordion is-open" :class="{ 'is-open': open }">
2251                        <div class="grid-accordion-inner">
2252                            <div class="flex flex-col gap-4 pl-3 md:pl-8 border-l-2 border-gray-100 ml-2 md:ml-4 pb-4 pt-2">
2253
2254                                                                    
2255                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2256
2257                                        <div class="shrink-0 mt-0.5">
2258                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2259                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2260                                                9:00                                            </div>
2261                                        </div>
2262
2263                                        <div class="flex-1 min-w-0">
2264
2265                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2266                                                                                            <div class="mb-1">
2267                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2268                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
2269                                                </div>
2270                                            
2271                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2272                                            <div class="flex items-start gap-2 mb-1.5">
2273                                                                                                    <button type="button"
2274                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_09.mp3', 'Hírek', false, 0, true); }"
2275                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2276                                                        title="Visszahallgatom az adást">
2277                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2278                                                    </button>
2279                                                
2280                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2281                                                    <a href="/musoraink/adas/724266" class="hover:underline">
2282                                                        Hírek                                                    </a>
2283
2284													
2285
2286                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2287                                                                                                    </h3>
2288                                            </div>
2289
2290                                            
2291                                                                                            <a href="/musoraink/adas/724266" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2292                                                    » bővebben...
2293                                                </a>
2294                                            
2295                                        </div>
2296
2297                                        
2298                                    </div>
2299                                                                    
2300                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2301
2302                                        <div class="shrink-0 mt-0.5">
2303                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2304                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
2304shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2305                                                9:04                                            </div>
2306                                        </div>
2307
2308                                        <div class="flex-1 min-w-0">
2309
2310                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2311                                                                                            <div class="mb-1">
2312                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2313                                                        <i class="fa-solid fa-folder-open opacity-70"></i> szolgáltató és életviteli műsorok                                                    </span>
2314                                                </div>
2315                                            
2316                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2317                                            <div class="flex items-start gap-2 mb-1.5">
2318                                                                                                    <button type="button"
2319                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_09.mp3', 'Házunk táján', false, 240, true); }"
2320                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2321                                                        title="Visszahallgatom az adást">
2322                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2323                                                    </button>
2324                                                
2325                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2326                                                    <a href="/musoraink/adas/sportlabor-segit-sportvalasztasban-abban-hogy-milyen-egeszsegi-allapotu-testet-hogy-mozgassunk-724267" class="hover:underline">
2327                                                        Házunk táján                                                    </a>
2328
2329													
2330
2331                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2332                                                                                                    </h3>
2333                                            </div>
2334
2335                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
2336                                                    Sportlabor. Segít a sportválasztásban, abban, hogy milyen egészségi állapotú testet, hogy mozgassunk
2337Szerkesztő: Szabó Csilla                                                </div>
2338                                            
2339                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
2340                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
2341                                                </button>
2342
2343                                                <div x-show="detailsOpen"
2344                                                    x-transition:enter="transition ease-out duration-200"
2345                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
2346                                                    x-transition:enter-end="opacity-100 translate-y-0"
2347                                                    x-cloak
2348                                                    class="mt-3 pt-3 border-t border-gray-100">
2349
2350                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
2351                                                            Vendégeink: Prof. Dr. Lacza Zsombor, a Magyar Testnevelési és Sporttudományi Egyetem Sportmedicina és Sportélettani Kutatóközpont igazgatója, ortopéd 
2351szakorvos, kutató, az MTA doktora és Dr. Irmai István, egyetemi docens, világbajnoki bronzérmes kajakos. A Mozdulnék! Sportlaborban a sport- és rendezvény csapat szakmai vezetője                                                        </div>
2352                                                    
2353                                                    
2354                                                </div>
2355                                            
2356                                        </div>
2357
2358                                                                                    <div class="shrink-0 w-24 h-20 md:w-32 md:h-24 ml-2 md:ml-4">
2359                                                <a href="/musoraink/adas/sportlabor-segit-sportvalasztasban-abban-hogy-milyen-egeszsegi-allapotu-testet-hogy-mozgassunk-724267" class="block w-full h-full rounded-lg overflow-hidden shadow-sm hover:shadow-md transition-shadow">
2360                                                    <img src="https://www.katolikusradio.hu/kepek/musorok/724267/kicsi/20261001_100249_Lacza_Irmai_Szab__.jpg"
2361                                                        alt="Műsor kép"
2362                                                        class="w-full h-full object-cover hover:opacity-90 transition-opacity">
2363                                                </a>
2364                                            </div>
2365                                        
2366                                    </div>
2367                                                                    
2368                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2369
2370                                        <div class="shrink-0 mt-0.5">
2371                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2372                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2373                                                10:00                                            </div>
2374                                        </div>
2375
2376                                        <div class="flex-1 min-w-0">
2377
2378                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2379                                                                                            <div class="mb-1">
2380                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2381                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
2382                                                </div>
2383                                            
2384                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2385                                            <div class="flex items-start gap-2 mb-1.5">
2386                                                                                                    <button type="button"
2387                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_10.mp3', 'Hírek', false, 0, true); }"
2388                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2389                                                        title="Visszahallgatom az adást">
2390                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2391                                                    </button>
2392                                                
2393                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2394                                                    <a href="/musoraink/adas/724268" class="hover:underline">
2395                                                        Hírek                                                    </a>
2396
2397													
2398
2399                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2400                                                                                                    </h3>
2401                                            </div>
2402
2403                                            
2404                                                                                            <a href="/musoraink/adas/724268" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2405                                                    » bővebben...
2406                                                </a>
2407                                            
2408                                        </div>
2409
2410                                        
2411                                    </div>
2412                                                                    
2413                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2414
2415                                        <div class="shrink-0 mt-0.5">
2416                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2417                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
2417shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2418                                                10:08                                            </div>
2419                                        </div>
2420
2421                                        <div class="flex-1 min-w-0">
2422
2423                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2424                                                                                            <div class="mb-1">
2425                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2426                                                        <i class="fa-solid fa-folder-open opacity-70"></i> egyéb műsorok                                                    </span>
2427                                                </div>
2428                                            
2429                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2430                                            <div class="flex items-start gap-2 mb-1.5">
2431                                                                                                    <button type="button"
2432                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_10.mp3', 'Tény-kérdés', false, 480, true); }"
2433                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2434                                                        title="Visszahallgatom az adást">
2435                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2436                                                    </button>
2437                                                
2438                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2439                                                    <a href="/musoraink/adas/szombaton-lesz-nagymarosi-ifjusagi-talalkozo-vendegunk-hadi-rita-sajtofelelos-724269" class="hover:underline">
2440                                                        Tény-kérdés                                                    </a>
2441
2442													
2443
2444                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2445                                                                                                    </h3>
2446                                            </div>
2447
2448                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
2449                                                    Szombaton lesz a Nagymarosi ifjúsági találkozó. 
2450Vendégünk: Hadi Rita sajtófelelős
2451Riporter: Hámori Kinga                                                </div>
2452                                            
2453                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
2454                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
2455                                                </button>
2456
2457                                                <div x-show="detailsOpen"
2458                                                    x-transition:enter="transition ease-out duration-200"
2459                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
2460                                                    x-transition:enter-end="opacity-100 translate-y-0"
2461                                                    x-cloak
2462                                                    class="mt-3 pt-3 border-t border-gray-100">
2463
2464                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
2465                                                            „Taníts teljes hittel járni, jelenlétedben élni.”
2466Jelen. Lét. – Jelen vagy?  mottóval hirdették meg az idei őszi Nagymarosi Ifjúsági Találkozót.
2467A részletes program megtalálható a  találkozó honlapján.  
2468A 2026-os őszi nagymarosi levél  ide kattintva   elolvasható.                                                        </div>
2469                                                    
2470                                                    
2471                                                </div>
2472                                            
2473                                        </div>
2474
2475                                        
2476                                    </div>
2477                                                                    
2478                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2479
2480                                        <div class="shrink-0 mt-0.5">
2481                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2482                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
2482shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2483                                                10:22                                            </div>
2484                                        </div>
2485
2486                                        <div class="flex-1 min-w-0">
2487
2488                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2489                                                                                            <div class="mb-1">
2490                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2491                                                        <i class="fa-solid fa-folder-open opacity-70"></i> egyéb közéleti műsorok                                                    </span>
2492                                                </div>
2493                                            
2494                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2495                                            <div class="flex items-start gap-2 mb-1.5">
2496                                                                                                    <button type="button"
2497                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_10.mp3', 'Műsorajánló', false, 1320, true); }"
2498                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2499                                                        title="Visszahallgatom az adást">
2500                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2501                                                    </button>
2502                                                
2503                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2504                                                    <a href="/musoraink/adas/724270" class="hover:underline">
2505                                                        Műsorajánló                                                    </a>
2506
2507													
2508
2509                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2510                                                                                                    </h3>
2511                                            </div>
2512
2513                                            
2514                                                                                            <a href="/musoraink/adas/724270" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2515                                                    » bővebben...
2516                                                </a>
2517                                            
2518                                        </div>
2519
2520                                        
2521                                    </div>
2522                                                                    
2523                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2524
2525                                        <div class="shrink-0 mt-0.5">
2526                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2527                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2528                                                10:30                                            </div>
2529                                        </div>
2530
2531                                        <div class="flex-1 min-w-0">
2532
2533                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2534                                                                                            <div class="mb-1">
2535                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2536                                                        <i class="fa-solid fa-folder-open opacity-70"></i> gyermek- és ifjúsági műsorok                                                    </span>
2537                                                </div>
2538                                            
2539                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2540                                            <div class="flex items-start gap-2 mb-1.5">
2541                                                                                                    <button type="button"
2542                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_10.mp3', 'Varázsdoboz', false, 1800, true); }"
2543                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2544                                                        title="Visszahallgatom az adást">
2545                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2546                                                    </button>
2547                                                
2548                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2549                                                    <a href="/musoraink/adas/aranyhaju-szasz-nepmese-felolvassa-ruttkay-laura-724271" class="hover:underline">
2550                                                        Varázsdoboz                                                    </a>
2551
2552													
2553
2554                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2555                                                                                                    </h3>
2556                                            </div>
2557
2558                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
2559                                                    mesés irodalom
2560Aranyhajú
2561szász népmese
2562Felolvassa: Ruttkay Laura
2563Szerkesztő: Varga Andrea                                                </div>
2564                                            
2565                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
2566                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
2567                                                </button>
2568
2569                                                <div x-show="detailsOpen"
2570                                                    x-transition:enter="transition ease-out duration-200"
2571                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
2572                                                    x-transition:enter-end="opacity-100 translate-y-0"
2573                                                    x-cloak
2574                                                    class="mt-3 pt-3 border-t border-gray-100">
2575
2576                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
2577                                                            Hangmérnök: Gera Csilla
2578Zenei szerkesztő: Peresztegi Attila
2579Rendezte: Gerbei Anita                                                        </div>
2580                                                    
2581                                                    
2582                                                </div>
2583                                            
2584                                        </div>
2585
2586                                        
2587                                    </div>
2588                                
2589                            </div>
2590                        </div>
2591                    </div>
2592                </section>
2593
2594            
2595                <section x-data="{ open: true }"
2596                    >
2597
2598                    <button @click="open = !open" type="button"
2599                        class="musor-slot-header bg-[#70a300] w-full text-white px-5 py-3 rounded-xl shadow-sm font-bold text-lg mb-2 hover:bg-opacity-90 transition-all focus:outline-none">
2600                        <span class="flex items-center gap-2 text-left">
2601                            <i class="fa-solid fa-clock opacity-80 text-sm"></i>
2602                            Zenit                                                    </span>
2603                        <div class="flex items-center gap-4 shrink-0">
2604                            <span class="musor-slot-range text-sm font-medium bg-white/20 py-1 rounded-lg backdrop-blur-sm hidden sm:inline-flex w-28 text-center">
2605                                11:00 - 13:00                            </span>
2606
2607                            <span class="inline-flex transition-transform duration-300 rotate-180" :class="{ 'rotate-180': open }">
2608                                <i class="fa-solid fa-chevron-down"></i>
2609                            </span>
2610                        </div>
2611                    </button>
2612
2613                    <div class="grid-accordion is-open" :class="{ 'is-open': open }">
2614                        <div class="grid-accordion-inner">
2615                            <div class="flex flex-col gap-4 pl-3 md:pl-8 border-l-2 border-gray-100 ml-2 md:ml-4 pb-4 pt-2">
2616
2617                                                                    
2618                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2619
2620                                        <div class="shrink-0 mt-0.5">
2621                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2622                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2623                                                11:00                                            </div>
2624                                        </div>
2625
2626                                        <div class="flex-1 min-w-0">
2627
2628                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2629                                                                                            <div class="mb-1">
2630                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2631                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
2632                                                </div>
2633                                            
2634                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2635                                            <div class="flex items-start gap-2 mb-1.5">
2636                                                                                                    <button type="button"
2637                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_11.mp3', 'Hírek', false, 0, true); }"
2638                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2639                                                        title="Visszahallgatom az adást">
2640                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2641                                                    </button>
2642                                                
2643                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2644                                                    <a href="/musoraink/adas/724272" class="hover:underline">
2645                                                        Hírek                                                    </a>
2646
2647													
2648
2649                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2650                                                                                                    </h3>
2651                                            </div>
2652
2653                                            
2654                                                                                            <a href="/musoraink/adas/724272" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2655                                                    » bővebben...
2656                                                </a>
2657                                            
2658                                        </div>
2659
2660                                        
2661                                    </div>
2662                                                                    
2663                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2664
2665                                        <div class="shrink-0 mt-0.5">
2666                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2667                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
2667shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2668                                                11:04                                            </div>
2669                                        </div>
2670
2671                                        <div class="flex-1 min-w-0">
2672
2673                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2674                                                                                            <div class="mb-1">
2675                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2676                                                        <i class="fa-solid fa-folder-open opacity-70"></i> zenei műsorok                                                    </span>
2677                                                </div>
2678                                            
2679                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2680                                            <div class="flex items-start gap-2 mb-1.5">
2681                                                                                                    <button type="button"
2682                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_11.mp3', 'Hangoló', false, 240, true); }"
2683                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2684                                                        title="Visszahallgatom az adást">
2685                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2686                                                    </button>
2687                                                
2688                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2689                                                    <a href="/musoraink/adas/724273" class="hover:underline">
2690                                                        Hangoló                                                    </a>
2691
2692													
2693
2694                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2695                                                                                                    </h3>
2696                                            </div>
2697
2698                                            
2699                                                                                            <a href="/musoraink/adas/724273" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2700                                                    » bővebben...
2701                                                </a>
2702                                            
2703                                        </div>
2704
2705                                        
2706                                    </div>
2707                                                                    
2708                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2709
2710                                        <div class="shrink-0 mt-0.5">
2711                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2712                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2713                                                12:00                                            </div>
2714                                        </div>
2715
2716                                        <div class="flex-1 min-w-0">
2717
2718                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2719                                                                                            <div class="mb-1">
2720                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2721                                                        <i class="fa-solid fa-folder-open opacity-70"></i> egyéb műsorok                                                    </span>
2722                                                </div>
2723                                            
2724                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2725                                            <div class="flex items-start gap-2 mb-1.5">
2726                                                                                                    <button type="button"
2727                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_12.mp3', 'Harangszó', false, 0, true); }"
2728                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2729                                                        title="Visszahallgatom az adást">
2730                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2731                                                    </button>
2732                                                
2733                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2734                                                    <a href="/musoraink/adas/724274" class="hover:underline">
2735                                                        Harangszó                                                    </a>
2736
2737													
2738
2739                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2740                                                                                                    </h3>
2741                                            </div>
2742
2743                                            
2744                                                                                            <a href="/musoraink/adas/724274" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2745                                                    » bővebben...
2746                                                </a>
2747                                            
2748                                        </div>
2749
2750                                        
2751                                    </div>
2752                                                                    
2753                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2754
2755                                        <div class="shrink-0 mt-0.5">
2756                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2757                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2758                                                12:01                                            </div>
2759                                        </div>
2760
2761                                        <div class="flex-1 min-w-0">
2762
2763                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2764                                                                                            <div class="mb-1">
2765                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2766                                                        <i class="fa-solid fa-folder-open opacity-70"></i> vallási műsorok                                                    </span>
2767                                                </div>
2768                                            
2769                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2770                                            <div class="flex items-start gap-2 mb-1.5">
2771                                                                                                    <button type="button"
2772                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_12.mp3', 'Úrangyala-imádság', false, 60, true); }"
2773                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2774                                                        title="Visszahallgatom az adást">
2775                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2776                                                    </button>
2777                                                
2778                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2779                                                    <a href="/musoraink/adas/724275" class="hover:underline">
2780                                                        Úrangyala-imádság                                                    </a>
2781
2782													
2783
2784                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2785                                                                                                    </h3>
2786                                            </div>
2787
2788                                            
2789                                                                                            <a href="/musoraink/adas/724275" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2790                                                    » bővebben...
2791                                                </a>
2792                                            
2793                                        </div>
2794
2795                                        
2796                                    </div>
2797                                                                    
2798                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2799
2800                                        <div class="shrink-0 mt-0.5">
2801                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2802                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
2802shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2803                                                12:04                                            </div>
2804                                        </div>
2805
2806                                        <div class="flex-1 min-w-0">
2807
2808                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2809                                                                                            <div class="mb-1">
2810                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2811                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
2812                                                </div>
2813                                            
2814                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2815                                            <div class="flex items-start gap-2 mb-1.5">
2816                                                                                                    <button type="button"
2817                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_12.mp3', 'Hírek', false, 240, true); }"
2818                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2819                                                        title="Visszahallgatom az adást">
2820                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2821                                                    </button>
2822                                                
2823                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2824                                                    <a href="/musoraink/adas/724276" class="hover:underline">
2825                                                        Hírek                                                    </a>
2826
2827													
2828
2829                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2830                                                                                                    </h3>
2831                                            </div>
2832
2833                                            
2834                                                                                            <a href="/musoraink/adas/724276" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2835                                                    » bővebben...
2836                                                </a>
2837                                            
2838                                        </div>
2839
2840                                        
2841                                    </div>
2842                                                                    
2843                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2844
2845                                        <div class="shrink-0 mt-0.5">
2846                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2847                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2848                                                12:08                                            </div>
2849                                        </div>
2850
2851                                        <div class="flex-1 min-w-0">
2852
2853                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2854                                                                                            <div class="mb-1">
2855                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2856                                                        <i class="fa-solid fa-folder-open opacity-70"></i> vallási műsorok                                                    </span>
2857                                                </div>
2858                                            
2859                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2860                                            <div class="flex items-start gap-2 mb-1.5">
2861                                                                                                    <button type="button"
2862                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_12.mp3', 'Napi evangélium', false, 480, true); }"
2863                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2864                                                        title="Visszahallgatom az adást">
2865                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2866                                                    </button>
2867                                                
2868                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2869                                                    <a href="/musoraink/adas/724277" class="hover:underline">
2870                                                        Napi evangélium                                                    </a>
2871
2872													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
2873                                                            (ism.)
2874                                                        </div>
2875                                                    
2876
2877                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2878                                                                                                    </h3>
2879                                            </div>
2880
2881                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
2882                                                    páros év, évközi idő 26. hét, csütörtök
2883** Lk 10,1-12 **
2884Felolvassa: Varga László                                                </div>
2885                                            
2886                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
2887                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
2888                                                </button>
2889
2890                                                <div x-show="detailsOpen"
2891                                                    x-transition:enter="transition ease-out duration-200"
2892                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
2893                                                    x-transition:enter-end="opacity-100 translate-y-0"
2894                                                    x-cloak
2895                                                    class="mt-3 pt-3 border-t border-gray-100">
2896
2897                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
2898                                                            Ezek után az Úr kiválasztott más hetvenkettőt, és elküldte őket kettesével maga előtt minden városba és helységbe, ahova menni készült. Azt mondta nekik: ,,Az aratnivaló sok, de a munkás kevés. Kérjétek azért az aratás Urát, küldjön munkásokat az aratásába. Menjetek! Íme, úgy küldelek titeket, mint bárányokat a farkasok közé. Ne vigyetek erszényt, se tarisznyát, se sarut, és az úton senkit se köszöntsetek. Ha valamelyik házba bementek, először ezt mondjátok: ,,Békesség e háznak!'' Ha a békesség fia lakik ott, rászáll a ti békességtek; ha pedig nem, visszaszáll rátok. Maradjatok ugyanabban a házban, egyétek és igyátok, amijük van, mert méltó a munkás a maga bérére. Ne járjatok házról-házra. Ha valamelyik városba betértek, és ott befogadnak titeket, egyétek, amit elétek tesznek. Gyógyítsátok meg az ott lévő betegeket, és mondjátok nekik: ,,Elközelgett hozzátok az Isten országa.'' Ha pedig egy városba betértek, és nem fogadnak be titeket, menjetek ki az utcára, és mondjátok: ,,Még a port is lerázzuk nektek, amely a ti városotokban lábainkra tapadt; tudjátok meg azonban, hogy elközelgett az Isten országa.'' Mondom nektek: Szodomának könnyebb lesz a sorsa azon a napon, mint annak a városnak.
2899Olvasmányok, ünnepek a liturgikus naptárban.                                                        </div>
2900                                                    
2901                                                    
2902                                                </div>
2903                                            
2904                                        </div>
2905
2906                                        
2907                                    </div>
2908                                                                    
2909                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2910
2911                                        <div class="shrink-0 mt-0.5">
2912                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2913                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
2913shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2914                                                12:10                                            </div>
2915                                        </div>
2916
2917                                        <div class="flex-1 min-w-0">
2918
2919                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2920                                                                                            <div class="mb-1">
2921                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2922                                                        <i class="fa-solid fa-folder-open opacity-70"></i> vallási műsorok                                                    </span>
2923                                                </div>
2924                                            
2925                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2926                                            <div class="flex items-start gap-2 mb-1.5">
2927                                                                                                    <button type="button"
2928                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_12.mp3', 'A Vatikáni Rádió magyar műsora', false, 600, true); }"
2929                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2930                                                        title="Visszahallgatom az adást">
2931                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2932                                                    </button>
2933                                                
2934                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2935                                                    <a href="/musoraink/adas/724278" class="hover:underline">
2936                                                        A Vatikáni Rádió magyar műsora                                                    </a>
2937
2938													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
2939                                                            (ism.)
2940                                                        </div>
2941                                                    
2942
2943                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2944                                                                                                    </h3>
2945                                            </div>
2946
2947                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
2948                                                    (a tegnap esti adás ismétlése)                                                </div>
2949                                            
2950                                                                                            <a href="/musoraink/adas/724278" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2951                                                    » bővebben...
2952                                                </a>
2953                                            
2954                                        </div>
2955
2956                                        
2957                                    </div>
2958                                                                    
2959                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
2960
2961                                        <div class="shrink-0 mt-0.5">
2962                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
2963                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
2963shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
2964                                                12:30                                            </div>
2965                                        </div>
2966
2967                                        <div class="flex-1 min-w-0">
2968
2969                                            <!-- Kategória teljesen külön sorban, a cím felett -->
2970                                                                                            <div class="mb-1">
2971                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
2972                                                        <i class="fa-solid fa-folder-open opacity-70"></i> zenei műsorok                                                    </span>
2973                                                </div>
2974                                            
2975                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
2976                                            <div class="flex items-start gap-2 mb-1.5">
2977                                                                                                    <button type="button"
2978                                                        onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://www.katolikusradio.hu/archivum/2026/10/01/2026-10-01_12.mp3', 'Guzsalyas', false, 1800, true); }"
2979                                                        class="text-[#5c8500] hover:text-[#7ba800] transition-colors mt-[2px] shrink-0"
2980                                                        title="Visszahallgatom az adást">
2981                                                        <i class="fa-solid fa-circle-play text-[18px]"></i>
2982                                                    </button>
2983                                                
2984                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
2985                                                    <a href="/musoraink/adas/724279" class="hover:underline">
2986                                                        Guzsalyas                                                    </a>
2987
2988													
2989
2990                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
2991                                                                                                    </h3>
2992                                            </div>
2993
2994                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
2995                                                    népzenei műsor                                                </div>
2996                                            
2997                                                                                            <a href="/musoraink/adas/724279" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
2998                                                    » bővebben...
2999                                                </a>
3000                                            
3001                                        </div>
3002
3003                                        
3004                                    </div>
3005                                
3006                            </div>
3007                        </div>
3008                    </div>
3009                </section>
3010
3011            
3012                <section x-data="{ open: true }"
3013                                        id="current-timeslot"
3014                    x-init="setTimeout(() => { 
3015                        const headerOffset = 100;
3016                        const elementPosition = $el.getBoundingClientRect().top;
3017                        const offsetPosition = elementPosition + window.scrollY - headerOffset;
3018                        window.scrollTo({ top: offsetPosition, behavior: 'smooth' });
3019                    }, 400)"
3020                    >
3021
3022                    <button @click="open = !open" type="button"
3023                        class="musor-slot-header musor-slot-header--current bg-blue-600 ring-4 ring-blue-200 w-full text-white px-5 py-3 rounded-xl shadow-sm font-bold text-lg mb-2 hover:bg-opacity-90 transition-all focus:outline-none">
3024                        <span class="flex items-center gap-2 text-left">
3025                            <i class="fa-solid fa-clock opacity-80 text-sm"></i>
3026                            Kapcsolatban                                                            <span class="ml-2 text-xs bg-white text-blue-600 px-2 py-1 rounded-md uppercase tracking-wider shadow-sm animate-pulse">Most szól</span>
3027                                                    </span>
3028                        <div class="flex items-center gap-4 shrink-0">
3029                            <span class="musor-slot-range text-sm font-medium bg-white/20 py-1 rounded-lg backdrop-blur-sm hidden sm:inline-flex w-28 text-center">
3030                                13:00 - 15:00                            </span>
3031
3032                            <span class="inline-flex transition-transform duration-300 rotate-180" :class="{ 'rotate-180': open }">
3033                                <i class="fa-solid fa-chevron-down"></i>
3034                            </span>
3035                        </div>
3036                    </button>
3037
3038                    <div class="grid-accordion is-open" :class="{ 'is-open': open }">
3039                        <div class="grid-accordion-inner">
3040                            <div class="flex flex-col gap-4 pl-3 md:pl-8 border-l-2 border-gray-100 ml-2 md:ml-4 pb-4 pt-2">
3041
3042                                                                    
3043                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3044
3045                                        <div class="shrink-0 mt-0.5">
3046                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3047                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3048                                                13:00                                            </div>
3049                                        </div>
3050
3051                                        <div class="flex-1 min-w-0">
3052
3053                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3054                                                                                            <div class="mb-1">
3055                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3056                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
3057                                                </div>
3058                                            
3059                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3060                                            <div class="flex items-start gap-2 mb-1.5">
3061                                                
3062                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3063                                                    <a href="/musoraink/adas/724280" class="hover:underline">
3064                                                        Hírek                                                    </a>
3065
3066													
3067
3068                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3069                                                                                                    </h3>
3070                                            </div>
3071
3072                                            
3073                                                                                            <a href="/musoraink/adas/724280" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
3074                                                    » bővebben...
3075                                                </a>
3076                                            
3077                                        </div>
3078
3079                                        
3080                                    </div>
3081                                                                    
3082                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3083
3084                                        <div class="shrink-0 mt-0.5">
3085                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3086                                            <div class="musor-episode-time musor-episode-time--current bg-blue-600 text-white font-bold text-sm px-2 py-0.5 
3086shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3087                                                13:04                                            </div>
3088                                        </div>
3089
3090                                        <div class="flex-1 min-w-0">
3091
3092                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3093                                                                                            <div class="mb-1">
3094                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3095                                                        <i class="fa-solid fa-folder-open opacity-70"></i> egyéb műsorok                                                    </span>
3096                                                </div>
3097                                            
3098                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3099                                            <div class="flex items-start gap-2 mb-1.5">
3100                                                
3101                                                <h3 class="text-[17px] md:text-[18px] font-bold text-blue-600 leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3102                                                    <a href="/musoraink/adas/nagy-eged-hegyi-szent-kereszt-kapolna-szihalmi-maria-szobor-zsodi-viktor-piarista-tartomanyfonok-724281" class="hover:underline">
3103                                                        Vendég-oldal                                                    </a>
3104
3105													
3106
3107                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3108                                                                                                            <span class="bg-blue-100 text-blue-700 text-[10px] px-2 py-0.5 rounded-sm uppercase tracking-wider animate-pulse border border-blue-200 shadow-sm">
3109                                                            most szól
3110                                                        </span>
3111                                                                                                    </h3>
3112                                            </div>
3113
3114                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
3115                                                    válogatás a Szent István Rádió műsorából
3116 Nagy-eged hegyi Szent Kereszt kápolna
3117Szihalmi Mária szobor
3118Zsódi Viktor piarista tartományfőnök                                                </div>
3119                                            
3120                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
3121                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
3122                                                </button>
3123
3124                                                <div x-show="detailsOpen"
3125                                                    x-transition:enter="transition ease-out duration-200"
3126                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
3127                                                    x-transition:enter-end="opacity-100 translate-y-0"
3128                                                    x-cloak
3129                                                    class="mt-3 pt-3 border-t border-gray-100">
3130
3131                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
3132                                                            A Krisztuskereszt az erdőn című műsorunkban elsőként a Nagy-eged hegyi Szent Kereszt kápolna idei második ásatására látogatunk el,  majd egy szihalmi Mária szobor és a helyi földváron álló feszület megújulásáról hallanak.
3133Szerkesztő: Tikovits Ernő
3134Szerzetesek félórája című műsorunkban Zsódi Viktor piarista tartományfőnök beszél a katolikus nevelés távlatairól.
3135Szerkesztő: Pap Ildikó
3136Zenei szerkesztő: Dudás Anna
3137Műsor vezető: Tikovits Ernő                                                        </div>
3138                                                    
3139                                                    
3140                                                </div>
3141                                            
3142                                        </div>
3143
3144                                        
3145                                    </div>
3146                                                                    
3147                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3148
3149                                        <div class="shrink-0 mt-0.5">
3150                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3151                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
3151shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3152                                                14:00                                            </div>
3153                                        </div>
3154
3155                                        <div class="flex-1 min-w-0">
3156
3157                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3158                                                                                            <div class="mb-1">
3159                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3160                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
3161                                                </div>
3162                                            
3163                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3164                                            <div class="flex items-start gap-2 mb-1.5">
3165                                                
3166                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3167                                                    <a href="/musoraink/adas/724282" class="hover:underline">
3168                                                        Hírek                                                    </a>
3169
3170													
3171
3172                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3173                                                                                                    </h3>
3174                                            </div>
3175
3176                                            
3177                                                                                            <a href="/musoraink/adas/724282" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
3178                                                    » bővebben...
3179                                                </a>
3180                                            
3181                                        </div>
3182
3183                                        
3184                                    </div>
3185                                                                    
3186                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3187
3188                                        <div class="shrink-0 mt-0.5">
3189                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3190                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3191                                                14:04                                            </div>
3192                                        </div>
3193
3194                                        <div class="flex-1 min-w-0">
3195
3196                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3197                                                                                            <div class="mb-1">
3198                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3199                                                        <i class="fa-solid fa-folder-open opacity-70"></i> zenei műsorok                                                    </span>
3200                                                </div>
3201                                            
3202                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3203                                            <div class="flex items-start gap-2 mb-1.5">
3204                                                
3205                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3206                                                    <a href="/musoraink/adas/mai-vendeg-dr-kovacs-laszlo-producer-bemutatjuk-magyar-filharmoniai-tarsasag-koncertalbumat-724283" class="hover:underline">
3207                                                        Hangárium                                                    </a>
3208
3209													
3210
3211                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3212                                                                                                    </h3>
3213                                            </div>
3214
3215                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
3216                                                    a könnyűzene kiválóságai
3217Mai vendég Dr. Kovács László producer.  Bemutatjuk a Magyar Filharmóniai Társaság  koncertalbumát.
3218Szerkesztő: Balogh Tibor                                                </div>
3219                                            
3220                                                                                            <a href="/musoraink/adas/mai-vendeg-dr-kovacs-laszlo-producer-bemutatjuk-magyar-filharmoniai-tarsasag-koncertalbumat-724283" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
3221                                                    » bővebben...
3222                                                </a>
3223                                            
3224                                        </div>
3225
3226                                        
3227                                    </div>
3228                                                                    
3229                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3230
3231                                        <div class="shrink-0 mt-0.5">
3232                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3233                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
3233shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3234                                                14:30                                            </div>
3235                                        </div>
3236
3237                                        <div class="flex-1 min-w-0">
3238
3239                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3240                                                                                            <div class="mb-1">
3241                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3242                                                        <i class="fa-solid fa-folder-open opacity-70"></i> irodalmi és versműsorok                                                    </span>
3243                                                </div>
3244                                            
3245                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3246                                            <div class="flex items-start gap-2 mb-1.5">
3247                                                
3248                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3249                                                    <a href="/musoraink/adas/wittinger-laszlo-tiszta-szivuek-kiteljesedes-felolvassa-schnell-adam-18-11-724284" class="hover:underline">
3250                                                        Rádiós regénytár                                                    </a>
3251
3252													
3253
3254                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3255                                                                                                    </h3>
3256                                            </div>
3257
3258                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
3259                                                    Wittinger László: Tiszta szívűek - A kiteljesedés 
3260Felolvassa: Schnell Ádám  (18/11.)
3261Szerkesztő: Varga Andrea                                                </div>
3262                                            
3263                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
3264                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
3265                                                </button>
3266
3267                                                <div x-show="detailsOpen"
3268                                                    x-transition:enter="transition ease-out duration-200"
3269                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
3270                                                    x-transition:enter-end="opacity-100 translate-y-0"
3271                                                    x-cloak
3272                                                    class="mt-3 pt-3 border-t border-gray-100">
3273
3274                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
3275                                                            Hangmester: Liszkai Károly 
3276Zenei szerkesztő: Máry Szabó Eszter 
3277Dramaturg-rendező: Sárospataki Zsuzsanna                                                        </div>
3278                                                    
3279                                                    
3280                                                </div>
3281                                            
3282                                        </div>
3283
3284                                        
3285                                    </div>
3286                                
3287                            </div>
3288                        </div>
3289                    </div>
3290                </section>
3291
3292            
3293                <section x-data="{ open: true }"
3294                    >
3295
3296                    <button @click="open = !open" type="button"
3297                        class="musor-slot-header bg-[#70a300] w-full text-white px-5 py-3 rounded-xl shadow-sm font-bold text-lg mb-2 hover:bg-opacity-90 transition-all focus:outline-none">
3298                        <span class="flex items-center gap-2 text-left">
3299                            <i class="fa-solid fa-clock opacity-80 text-sm"></i>
3300                            Szalon                                                    </span>
3301                        <div class="flex items-center gap-4 shrink-0">
3302                            <span class="musor-slot-range text-sm font-medium bg-white/20 py-1 rounded-lg backdrop-blur-sm hidden sm:inline-flex w-28 text-center">
3303                                15:00 - 17:00                            </span>
3304
3305                            <span class="inline-flex transition-transform duration-300 rotate-180" :class="{ 'rotate-180': open }">
3306                                <i class="fa-solid fa-chevron-down"></i>
3307                            </span>
3308                        </div>
3309                    </button>
3310
3311                    <div class="grid-accordion is-open" :class="{ 'is-open': open }">
3312                        <div class="grid-accordion-inner">
3313                            <div class="flex flex-col gap-4 pl-3 md:pl-8 border-l-2 border-gray-100 ml-2 md:ml-4 pb-4 pt-2">
3314
3315                                                                    
3316                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3317
3318                                        <div class="shrink-0 mt-0.5">
3319                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3320                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3321                                                15:00                                            </div>
3322                                        </div>
3323
3324                                        <div class="flex-1 min-w-0">
3325
3326                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3327                                                                                            <div class="mb-1">
3328                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3329                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
3330                                                </div>
3331                                            
3332                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3333                                            <div class="flex items-start gap-2 mb-1.5">
3334                                                
3335                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3336                                                    <a href="/musoraink/adas/724285" class="hover:underline">
3337                                                        Hírek                                                    </a>
3338
3339													
3340
3341                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3342                                                                                                    </h3>
3343                                            </div>
3344
3345                                            
3346                                                                                            <a href="/musoraink/adas/724285" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
3347                                                    » bővebben...
3348                                                </a>
3349                                            
3350                                        </div>
3351
3352                                        
3353                                    </div>
3354                                                                    
3355                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3356
3357                                        <div class="shrink-0 mt-0.5">
3358                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3359                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
3359shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3360                                                15:04                                            </div>
3361                                        </div>
3362
3363                                        <div class="flex-1 min-w-0">
3364
3365                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3366                                                                                            <div class="mb-1">
3367                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3368                                                        <i class="fa-solid fa-folder-open opacity-70"></i> egyéb kulturális műsorok                                                    </span>
3369                                                </div>
3370                                            
3371                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3372                                            <div class="flex items-start gap-2 mb-1.5">
3373                                                
3374                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3375                                                    <a href="/musoraink/adas/bernarda-alba-debrecenben-magdafeszt-csokonaiban-eletunk-zeneje-kilencven-fok-es-muvesztelep100-724286" class="hover:underline">
3376                                                        Akvarell                                                    </a>
3377
3378													
3379
3380                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3381                                                                                                    </h3>
3382                                            </div>
3383
3384                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
3385                                                    kulturális paletta
3386Bernarda Alba Debrecenben
3387MagdaFeszt a Csokonaiban
3388Életünk zenéje, kilencven fok és művésztelep100
3389Szerkesztő: Nagy György András                                                </div>
3390                                            
3391                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
3392                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
3393                                                </button>
3394
3395                                                <div x-show="detailsOpen"
3396                                                    x-transition:enter="transition ease-out duration-200"
3397                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
3398                                                    x-transition:enter-end="opacity-100 translate-y-0"
3399                                                    x-cloak
3400                                                    class="mt-3 pt-3 border-t border-gray-100">
3401
3402                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
3403                                                            Kilenc nő egy fedél alatt. Frederico García Lorca drámájának szintén főszereplője maga a helyszín, a címadó „Bernarda Alba háza”. Ez a valóságban is áll egy andalúziai faluban, szomszédja annak az épületnek, ahol maga a költő is lakott és ahol a művét ihlető élményeket megtapasztalta. Mennyi esély van a kitörésre a bezártságból? A darab most a szeptember közepi premier után Debrecenben, a Csokonai Színházban látható. Keresztes Attila rendezővel Nagy György András beszélgetett.
3404Ha Szabó Magda, akkor Debrecen – és ha ősz, akkor MagdaFeszt. A programsorozat eseményei már javában zajlanak a hajdú-bihari megyeszékhelyen. A részletekről először a főszervező Csokonai Színház igazgatóját, Vadász Dánielt hallják; majd helyettese Bocskor-Salló Lóránt arról beszél, hogy számos ingyenes – de regisztrációhoz kötött – program is várja az érdeklődőket. Juhász Anna irodalmár szavaiból pedig kiderül, hogy az írónőről elnevezett díj idén hazatér. A felvételeket a megnyitón készítette Mikos Ákos. 
3405Varázskert, Szlovén Filmnapok, A Fővárosi Nagycirkusz zenekarának koncertje, Cservenka Edit kiállítása, bemutatók a Centrál Színházban, a Magyar Festészet Napja - október eleji, de évszaktól valójában független programokat Zsoldos Szilvia gyűjtésében!                                                        </div>
3406                                                    
3407                                                    
3408                                                </div>
3409                                            
3410                                        </div>
3411
3412                                                                                    <div class="shrink-0 w-24 h-20 md:w-32 md:h-24 ml-2 md:ml-4">
3413                                                <a href="/musoraink/adas/bernarda-alba-debrecenben-magdafeszt-csokonaiban-eletunk-zeneje-kilencven-fok-es-muvesztelep100-724286" class="block w-full h-full rounded-lg overflow-hidden shadow-sm hover:shadow-md transition-shadow">
3414                                                    <img src="https://www.katolikusradio.hu/kepek/musorok/724286/kicsi/csokonai_bernarda_alba_plak__t_nagyobb.jpg"
3415                                                        alt="Műsor kép"
3416                                                        class="w-full h-full object-cover hover:opacity-90 transition-opacity">
3417                                                </a>
3418                                            </div>
3419                                        
3420                                    </div>
3421                                                                    
3422                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3423
3424                                        <div class="shrink-0 mt-0.5">
3425                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3426                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3427                                                15:50                                            </div>
3428                                        </div>
3429
3430                                        <div class="flex-1 min-w-0">
3431
3432                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3433                                                                                            <div class="mb-1">
3434                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3435                                                        <i class="fa-solid fa-folder-open opacity-70"></i> egyéb közéleti műsorok                                                    </span>
3436                                                </div>
3437                                            
3438                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3439                                            <div class="flex items-start gap-2 mb-1.5">
3440                                                
3441                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3442                                                    <a href="/musoraink/adas/724287" class="hover:underline">
3443                                                        Műsorajánló                                                    </a>
3444
3445													
3446
3447                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3448                                                                                                    </h3>
3449                                            </div>
3450
3451                                            
3452                                                                                            <a href="/musoraink/adas/724287" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
3453                                                    » bővebben...
3454                                                </a>
3455                                            
3456                                        </div>
3457
3458                                        
3459                                    </div>
3460                                                                    
3461                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3462
3463                                        <div class="shrink-0 mt-0.5">
3464                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3465                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
3465shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3466                                                16:00                                            </div>
3467                                        </div>
3468
3469                                        <div class="flex-1 min-w-0">
3470
3471                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3472                                                                                            <div class="mb-1">
3473                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3474                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
3475                                                </div>
3476                                            
3477                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3478                                            <div class="flex items-start gap-2 mb-1.5">
3479                                                
3480                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3481                                                    <a href="/musoraink/adas/724288" class="hover:underline">
3482                                                        Hírek                                                    </a>
3483
3484													
3485
3486                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3487                                                                                                    </h3>
3488                                            </div>
3489
3490                                            
3491                                                                                            <a href="/musoraink/adas/724288" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
3492                                                    » bővebben...
3493                                                </a>
3494                                            
3495                                        </div>
3496
3497                                        
3498                                    </div>
3499                                                                    
3500                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3501
3502                                        <div class="shrink-0 mt-0.5">
3503                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3504                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3505                                                16:04                                            </div>
3506                                        </div>
3507
3508                                        <div class="flex-1 min-w-0">
3509
3510                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3511                                                                                            <div class="mb-1">
3512                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3513                                                        <i class="fa-solid fa-folder-open opacity-70"></i> irodalmi és versműsorok                                                    </span>
3514                                                </div>
3515                                            
3516                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3517                                            <div class="flex items-start gap-2 mb-1.5">
3518                                                
3519                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3520                                                    <a href="/musoraink/adas/724289" class="hover:underline">
3521                                                        Legkedvesebb könyveim                                                    </a>
3522
3523													
3524
3525                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3526                                                                                                    </h3>
3527                                            </div>
3528
3529                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
3530                                                    Szerkesztő: Fazekas Gyöngyvér                                                </div>
3531                                            
3532                                                                                            <a href="/musoraink/adas/724289" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
3533                                                    » bővebben...
3534                                                </a>
3535                                            
3536                                        </div>
3537
3538                                        
3539                                    </div>
3540                                                                    
3541                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3542
3543                                        <div class="shrink-0 mt-0.5">
3544                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3545                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
3545shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3546                                                16:30                                            </div>
3547                                        </div>
3548
3549                                        <div class="flex-1 min-w-0">
3550
3551                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3552                                                                                            <div class="mb-1">
3553                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3554                                                        <i class="fa-solid fa-folder-open opacity-70"></i> zenei műsorok                                                    </span>
3555                                                </div>
3556                                            
3557                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3558                                            <div class="flex items-start gap-2 mb-1.5">
3559                                                
3560                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3561                                                    <a href="/musoraink/adas/a-zene-vilagnapjan-solti-nemzetkozi-karmesterverseny-debreceni-kodaly-filharmonikusok-724290" class="hover:underline">
3562                                                        Dallamív                                                    </a>
3563
3564													
3565
3566                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3567                                                                                                    </h3>
3568                                            </div>
3569
3570                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
3571                                                    Zenekari műhely
3572A Zene Világnapján
3573Solti Nemzetközi Karmesterverseny - Debreceni Kodály Filharmonikusok
3574Szerkesztő-műsorvezető: Magyar Kornél                                                </div>
3575                                            
3576                                                                                            <a href="/musoraink/adas/a-zene-vilagnapjan-solti-nemzetkozi-karmesterverseny-debreceni-kodaly-filharmonikusok-724290" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
3577                                                    » bővebben...
3578                                                </a>
3579                                            
3580                                        </div>
3581
3582                                        
3583                                    </div>
3584                                
3585                            </div>
3586                        </div>
3587                    </div>
3588                </section>
3589
3590            
3591                <section x-data="{ open: true }"
3592                    >
3593
3594                    <button @click="open = !open" type="button"
3595                        class="musor-slot-header bg-[#70a300] w-full text-white px-5 py-3 rounded-xl shadow-sm font-bold text-lg mb-2 hover:bg-opacity-90 transition-all focus:outline-none">
3596                        <span class="flex items-center gap-2 text-left">
3597                            <i class="fa-solid fa-clock opacity-80 text-sm"></i>
3598                            Délutáni találkozás                                                    </span>
3599                        <div class="flex items-center gap-4 shrink-0">
3600                            <span class="musor-slot-range text-sm font-medium bg-white/20 py-1 rounded-lg backdrop-blur-sm hidden sm:inline-flex w-28 text-center">
3601                                17:00 - 19:00                            </span>
3602
3603                            <span class="inline-flex transition-transform duration-300 rotate-180" :class="{ 'rotate-180': open }">
3604                                <i class="fa-solid fa-chevron-down"></i>
3605                            </span>
3606                        </div>
3607                    </button>
3608
3609                    <div class="grid-accordion is-open" :class="{ 'is-open': open }">
3610                        <div class="grid-accordion-inner">
3611                            <div class="flex flex-col gap-4 pl-3 md:pl-8 border-l-2 border-gray-100 ml-2 md:ml-4 pb-4 pt-2">
3612
3613                                                                    
3614                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3615
3616                                        <div class="shrink-0 mt-0.5">
3617                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3618                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3619                                                17:00                                            </div>
3620                                        </div>
3621
3622                                        <div class="flex-1 min-w-0">
3623
3624                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3625                                                                                            <div class="mb-1">
3626                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3627                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
3628                                                </div>
3629                                            
3630                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3631                                            <div class="flex items-start gap-2 mb-1.5">
3632                                                
3633                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3634                                                    <a href="/musoraink/adas/724291" class="hover:underline">
3635                                                        Hírek                                                    </a>
3636
3637													
3638
3639                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3640                                                                                                    </h3>
3641                                            </div>
3642
3643                                            
3644                                                                                            <a href="/musoraink/adas/724291" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
3645                                                    » bővebben...
3646                                                </a>
3647                                            
3648                                        </div>
3649
3650                                        
3651                                    </div>
3652                                                                    
3653                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3654
3655                                        <div class="shrink-0 mt-0.5">
3656                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3657                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3658                                                17:04                                            </div>
3659                                        </div>
3660
3661                                        <div class="flex-1 min-w-0">
3662
3663                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3664                                                                                            <div class="mb-1">
3665                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3666                                                        <i class="fa-solid fa-folder-open opacity-70"></i> portré- és riportműsorok                                                    </span>
3667                                                </div>
3668                                            
3669                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3670                                            <div class="flex items-start gap-2 mb-1.5">
3671                                                
3672                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3673                                                    <a href="/musoraink/adas/turner-ferenc-monori-plebanos-elete-megprobaltatasai-724292" class="hover:underline">
3674                                                        Arcok és sorsok                                                    </a>
3675
3676													
3677
3678                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3679                                                                                                    </h3>
3680                                            </div>
3681
3682                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
3683                                                    fejezetek a Magyar Katolikus Egyház életéből
3684Turner Ferenc monori plébános élete, megpróbáltatásai
3685Szerkesztő: Soós Viktor                                                </div>
3686                                            
3687                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
3688                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
3689                                                </button>
3690
3691                                                <div x-show="detailsOpen"
3692                                                    x-transition:enter="transition ease-out duration-200"
3693                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
3694                                                    x-transition:enter-end="opacity-100 translate-y-0"
3695                                                    x-cloak
3696                                                    class="mt-3 pt-3 border-t border-gray-100">
3697
3698                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
3699                                                            Turner Ferenc a kommunista diktatúra áldozata.  Sztálin halálának évében 1953.április 4-én hunyt el 48 évesen, 25 évvel a pappá szentelésének időszakában. Mit lehet tudni a haláláról és a halála körülményeiről? Vendégünk Török Ádám történész.                                                        </div>
3700                                                    
3701                                                    
3702                                                </div>
3703                                            
3704                                        </div>
3705
3706                                        
3707                                    </div>
3708                                                                    
3709                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3710
3711                                        <div class="shrink-0 mt-0.5">
3712                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3713                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
3713shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3714                                                17:30                                            </div>
3715                                        </div>
3716
3717                                        <div class="flex-1 min-w-0">
3718
3719                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3720                                                                                            <div class="mb-1">
3721                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3722                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
3723                                                </div>
3724                                            
3725                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3726                                            <div class="flex items-start gap-2 mb-1.5">
3727                                                
3728                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3729                                                    <a href="/musoraink/adas/egy-masik-franciaorszag-xiv-leo-papa-apostoli-utja-franciaorszagban-724293" class="hover:underline">
3730                                                        Kerengő                                                    </a>
3731
3732													
3733
3734                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3735                                                                                                    </h3>
3736                                            </div>
3737
3738                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
3739                                                    külpolitikai beszélgetések
3740Egy másik Franciaország
3741XIV. Leó pápa apostoli útja Franciaországban
3742Szerkesztő: Pozsgai Nóra                                                </div>
3743                                            
3744                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
3745                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
3746                                                </button>
3747
3748                                                <div x-show="detailsOpen"
3749                                                    x-transition:enter="transition ease-out duration-200"
3750                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
3751                                                    x-transition:enter-end="opacity-100 translate-y-0"
3752                                                    x-cloak
3753                                                    class="mt-3 pt-3 border-t border-gray-100">
3754
3755                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
3756                                                            Szentatya számos nagyon fontos témát érintett. Többször határozottan felszólalt a békéért, az élet védelmében az eutanázia ellen, szót emelt a vallásszabadságért, hangsúlyozta a katolikus nevelés létjogosultságát és fontosságát, és emlékeztetett Franciaország keresztény gyökereire – mindezt egy olyan országban, amely mintha erről igyekezne megfeledkezni, ahol nemrég megszavazták az eutanázia törvényt, és ahol szorul a hurok a katolikus iskolák körül. A fiataloknak azt mondta: „Ti vagytok Franciaország szentjei!” -- A katolikus egyházfő látogatását hatalmas lelkesedés kísérte, százezrek akarták látni, hallani a pápát, a tömeg ujjongva de békésen ünnepelt -- és sok francia ébredő reménnyel várja most Franciaország megújulását.
3757XIV. Leó pápa franciaországi útjának legfontosabb mozzanatairól, tanulságairól beszélgetünk. 
3758Vendégünk Fejérdy Gergely, a Pázmány Péter Katolikus Egyetem tanára és a Magyar Külügyi Intézet vezető kutatója.                                                        </div>
3759                                                    
3760                                                    
3761                                                </div>
3762                                            
3763                                        </div>
3764
3765                                                                                    <div class="shrink-0 w-24 h-20 md:w-32 md:h-24 ml-2 md:ml-4">
3766                                                <a href="/musoraink/adas/egy-masik-franciaorszag-xiv-leo-papa-apostoli-utja-franciaorszagban-724293" class="block w-full h-full rounded-lg overflow-hidden shadow-sm hover:shadow-md transition-shadow">
3767                                                    <img src="https://www.katolikusradio.hu/kepek/musorok/724293/kicsi/Le___pp_bab__k_jpeg.jpg"
3768                                                        alt="Műsor kép"
3769                                                        class="w-full h-full object-cover hover:opacity-90 transition-opacity">
3770                                                </a>
3771                                            </div>
3772                                        
3773                                    </div>
3774                                                                    
3775                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3776
3777                                        <div class="shrink-0 mt-0.5">
3778                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3779                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
3779shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3780                                                18:00                                            </div>
3781                                        </div>
3782
3783                                        <div class="flex-1 min-w-0">
3784
3785                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3786                                                                                            <div class="mb-1">
3787                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3788                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
3789                                                </div>
3790                                            
3791                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3792                                            <div class="flex items-start gap-2 mb-1.5">
3793                                                
3794                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3795                                                    <a href="/musoraink/adas/724294" class="hover:underline">
3796                                                        Hírek                                                    </a>
3797
3798													
3799
3800                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3801                                                                                                    </h3>
3802                                            </div>
3803
3804                                            
3805                                                                                            <a href="/musoraink/adas/724294" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
3806                                                    » bővebben...
3807                                                </a>
3808                                            
3809                                        </div>
3810
3811                                        
3812                                    </div>
3813                                                                    
3814                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3815
3816                                        <div class="shrink-0 mt-0.5">
3817                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3818                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3819                                                18:04                                            </div>
3820                                        </div>
3821
3822                                        <div class="flex-1 min-w-0">
3823
3824                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3825                                                                                            <div class="mb-1">
3826                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3827                                                        <i class="fa-solid fa-folder-open opacity-70"></i> portré- és riportműsorok                                                    </span>
3828                                                </div>
3829                                            
3830                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3831                                            <div class="flex items-start gap-2 mb-1.5">
3832                                                
3833                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3834                                                    <a href="/musoraink/adas/amokfuto-idok-fazekas-istvan-szindarabja-jozsef-attila-szinhazban-724295" class="hover:underline">
3835                                                        Magyar csillagok                                                    </a>
3836
3837													
3838
3839                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3840                                                                                                    </h3>
3841                                            </div>
3842
3843                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
3844                                                    Ámokfutó idők - Fazekas István színdarabja a József Attila Színházban
3845Szerkesztő: Kövesdy Zsuzsa                                                </div>
3846                                            
3847                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
3848                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
3849                                                </button>
3850
3851                                                <div x-show="detailsOpen"
3852                                                    x-transition:enter="transition ease-out duration-200"
3853                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
3854                                                    x-transition:enter-end="opacity-100 translate-y-0"
3855                                                    x-cloak
3856                                                    class="mt-3 pt-3 border-t border-gray-100">
3857
3858                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
3859                                                            Fazekas István "Ámokfutó idők" c. történelmi drámája a hortobágyi internálások megrendítő, szÍnpadon eddig m
3859ég soha fel nem dolgozott történetét tárja elénk . Az 1952 nyarán játszódó kamaradráma a magyar Gulág világába vezet. A kitelepítések embertelen mechanizmusai között két sors találkozásán keresztül vizsgálja az erkölcsi döntés lehetőségét. A darabot a fiatal, kiváló rendező Molnár Kristóf érzékeny és egyszerre hatalmas erejű rendezése teszi felejthetetlen élménnyé. Ugyanez mondható el a szereplők mindegyikéről. Újréti László hiteles, elegáns Herczeg Ferencéről, Nagy Enikő tyukodi parasztasszonyáról, a holt fiút alakító, föld fölött lebegő Remzső Sándor (eh.) és a többi ifjú kiváló egyetemista hallgató színinövendékről, akik a vérbeli ávós figurákat elevenítik meg. A rendszerváltás sok csalódásának egyike volt, hogy Magyarországon elmaradt a várva várt felelősségrevonás, a magyar Nürnbergi per és a mai napig nem nyíltak meg az akták a megfigyelt érintettek számára. Ezért fontos, hogy ébren tartsuk az emlékezetet, hogy gyermekeink és unokáink se feledjék soha a kommunista terror borzalmas világát, melyet Fazekas István csodálatos alkotása mélyen a szívünkbe éget.                                                        </div>
3860                                                    
3861                                                    
3862                                                </div>
3863                                            
3864                                        </div>
3865
3866                                        
3867                                    </div>
3868                                                                    
3869                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3870
3871                                        <div class="shrink-0 mt-0.5">
3872                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3873                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3874                                                18:30                                            </div>
3875                                        </div>
3876
3877                                        <div class="flex-1 min-w-0">
3878
3879                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3880                                                                                            <div class="mb-1">
3881                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3882                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
3883                                                </div>
3884                                            
3885                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3886                                            <div class="flex items-start gap-2 mb-1.5">
3887                                                
3888                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3889                                                    <a href="/musoraink/adas/724296" class="hover:underline">
3890                                                        Hírtükör                                                    </a>
3891
3892													
3893
3894                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3895                                                                                                    </h3>
3896                                            </div>
3897
3898                                            
3899                                                                                            <a href="/musoraink/adas/724296" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
3900                                                    » bővebben...
3901                                                </a>
3902                                            
3903                                        </div>
3904
3905                                        
3906                                    </div>
3907                                                                    
3908                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3909
3910                                        <div class="shrink-0 mt-0.5">
3911                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3912                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
3912shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3913                                                18:50                                            </div>
3914                                        </div>
3915
3916                                        <div class="flex-1 min-w-0">
3917
3918                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3919                                                                                            <div class="mb-1">
3920                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3921                                                        <i class="fa-solid fa-folder-open opacity-70"></i> ismeretterjesztő műsorok                                                    </span>
3922                                                </div>
3923                                            
3924                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3925                                            <div class="flex items-start gap-2 mb-1.5">
3926                                                
3927                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
3928                                                    <a href="/musoraink/adas/724297" class="hover:underline">
3929                                                        Múltidéző                                                    </a>
3930
3931													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
3932                                                            (ism.)
3933                                                        </div>
3934                                                    
3935
3936                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
3937                                                                                                    </h3>
3938                                            </div>
3939
3940                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
3941                                                    Szerkesztő: Iványi Balázs                                                </div>
3942                                            
3943                                                                                            <a href="/musoraink/adas/724297" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
3944                                                    » bővebben...
3945                                                </a>
3946                                            
3947                                        </div>
3948
3949                                        
3950                                    </div>
3951                                
3952                            </div>
3953                        </div>
3954                    </div>
3955                </section>
3956
3957            
3958                <section x-data="{ open: true }"
3959                    >
3960
3961                    <button @click="open = !open" type="button"
3962                        class="musor-slot-header bg-[#70a300] w-full text-white px-5 py-3 rounded-xl shadow-sm font-bold text-lg mb-2 hover:bg-opacity-90 transition-all focus:outline-none">
3963                        <span class="flex items-center gap-2 text-left">
3964                            <i class="fa-solid fa-clock opacity-80 text-sm"></i>
3965                            Alkonyórán                                                    </span>
3966                        <div class="flex items-center gap-4 shrink-0">
3967                            <span class="musor-slot-range text-sm font-medium bg-white/20 py-1 rounded-lg backdrop-blur-sm hidden sm:inline-flex w-28 text-center">
3968                                19:00 - 21:00                            </span>
3969
3970                            <span class="inline-flex transition-transform duration-300 rotate-180" :class="{ 'rotate-180': open }">
3971                                <i class="fa-solid fa-chevron-down"></i>
3972                            </span>
3973                        </div>
3974                    </button>
3975
3976                    <div class="grid-accordion is-open" :class="{ 'is-open': open }">
3977                        <div class="grid-accordion-inner">
3978                            <div class="flex flex-col gap-4 pl-3 md:pl-8 border-l-2 border-gray-100 ml-2 md:ml-4 pb-4 pt-2">
3979
3980                                                                    
3981                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
3982
3983                                        <div class="shrink-0 mt-0.5">
3984                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
3985                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
3986                                                19:00                                            </div>
3987                                        </div>
3988
3989                                        <div class="flex-1 min-w-0">
3990
3991                                            <!-- Kategória teljesen külön sorban, a cím felett -->
3992                                                                                            <div class="mb-1">
3993                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
3994                                                        <i class="fa-solid fa-folder-open opacity-70"></i> egyéb műsorok                                                    </span>
3995                                                </div>
3996                                            
3997                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
3998                                            <div class="flex items-start gap-2 mb-1.5">
3999                                                
4000                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4001                                                    <a href="/musoraink/adas/724298" class="hover:underline">
4002                                                        Harangszó                                                    </a>
4003
4004													
4005
4006                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4007                                                                                                    </h3>
4008                                            </div>
4009
4010                                            
4011                                                                                            <a href="/musoraink/adas/724298" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
4012                                                    » bővebben...
4013                                                </a>
4014                                            
4015                                        </div>
4016
4017                                        
4018                                    </div>
4019                                                                    
4020                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4021
4022                                        <div class="shrink-0 mt-0.5">
4023                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4024                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4025                                                19:01                                            </div>
4026                                        </div>
4027
4028                                        <div class="flex-1 min-w-0">
4029
4030                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4031                                                                                            <div class="mb-1">
4032                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4033                                                        <i class="fa-solid fa-folder-open opacity-70"></i> vallási műsorok                                                    </span>
4034                                                </div>
4035                                            
4036                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4037                                            <div class="flex items-start gap-2 mb-1.5">
4038                                                
4039                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4040                                                    <a href="/musoraink/adas/724299" class="hover:underline">
4041                                                        Rózsafüzér-imádság                                                    </a>
4042
4043													
4044
4045                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4046                                                                                                    </h3>
4047                                            </div>
4048
4049                                            
4050                                                                                            <a href="/musoraink/adas/724299" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
4051                                                    » bővebben...
4052                                                </a>
4053                                            
4054                                        </div>
4055
4056                                        
4057                                    </div>
4058                                                                    
4059                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4060
4061                                        <div class="shrink-0 mt-0.5">
4062                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4063                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4064                                                19:32                                            </div>
4065                                        </div>
4066
4067                                        <div class="flex-1 min-w-0">
4068
4069                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4070                                                                                            <div class="mb-1">
4071                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4072                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
4073                                                </div>
4074                                            
4075                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4076                                            <div class="flex items-start gap-2 mb-1.5">
4077                                                
4078                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4079                                                    <a href="/musoraink/adas/724300" class="hover:underline">
4080                                                        Hírek                                                    </a>
4081
4082													
4083
4084                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4085                                                                                                    </h3>
4086                                            </div>
4087
4088                                            
4089                                                                                            <a href="/musoraink/adas/724300" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
4090                                                    » bővebben...
4091                                                </a>
4092                                            
4093                                        </div>
4094
4095                                        
4096                                    </div>
4097                                                                    
4098                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4099
4100                                        <div class="shrink-0 mt-0.5">
4101                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4102                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
4102shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4103                                                19:35                                            </div>
4104                                        </div>
4105
4106                                        <div class="flex-1 min-w-0">
4107
4108                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4109                                                                                            <div class="mb-1">
4110                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4111                                                        <i class="fa-solid fa-folder-open opacity-70"></i> gyermek- és ifjúsági műsorok                                                    </span>
4112                                                </div>
4113                                            
4114                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4115                                            <div class="flex items-start gap-2 mb-1.5">
4116                                                
4117                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4118                                                    <a href="/musoraink/adas/aranyhaju-szasz-nepmese-felolvassa-ruttkay-laura-ism-724301" class="hover:underline">
4119                                                        Varázsdoboz                                                    </a>
4120
4121													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
4122                                                            (ism.)
4123                                                        </div>
4124                                                    
4125
4126                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4127                                                                                                    </h3>
4128                                            </div>
4129
4130                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
4131                                                    mesés irodalom
4132Aranyhajú
4133szász népmese
4134Felolvassa: Ruttkay Laura
4135Szerkesztő: Varga Andrea                                                </div>
4136                                            
4137                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
4138                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
4139                                                </button>
4140
4141                                                <div x-show="detailsOpen"
4142                                                    x-transition:enter="transition ease-out duration-200"
4143                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
4144                                                    x-transition:enter-end="opacity-100 translate-y-0"
4145                                                    x-cloak
4146                                                    class="mt-3 pt-3 border-t border-gray-100">
4147
4148                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
4149                                                            Hangmérnök: Gera Csilla
4150Zenei szerkesztő: Peresztegi Attila
4151Rendezte: Gerbei Anita                                                        </div>
4152                                                    
4153                                                    
4154                                                </div>
4155                                            
4156                                        </div>
4157
4158                                        
4159                                    </div>
4160                                                                    
4161                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4162
4163                                        <div class="shrink-0 mt-0.5">
4164                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4165                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
4165shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4166                                                20:00                                            </div>
4167                                        </div>
4168
4169                                        <div class="flex-1 min-w-0">
4170
4171                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4172                                                                                            <div class="mb-1">
4173                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4174                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
4175                                                </div>
4176                                            
4177                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4178                                            <div class="flex items-start gap-2 mb-1.5">
4179                                                
4180                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4181                                                    <a href="/musoraink/adas/724302" class="hover:underline">
4182                                                        Hírek                                                    </a>
4183
4184													
4185
4186                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4187                                                                                                    </h3>
4188                                            </div>
4189
4190                                            
4191                                                                                            <a href="/musoraink/adas/724302" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
4192                                                    » bővebben...
4193                                                </a>
4194                                            
4195                                        </div>
4196
4197                                        
4198                                    </div>
4199                                                                    
4200                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4201
4202                                        <div class="shrink-0 mt-0.5">
4203                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4204                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4205                                                20:04                                            </div>
4206                                        </div>
4207
4208                                        <div class="flex-1 min-w-0">
4209
4210                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4211                                                                                            <div class="mb-1">
4212                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4213                                                        <i class="fa-solid fa-folder-open opacity-70"></i> irodalmi és versműsorok                                                    </span>
4214                                                </div>
4215                                            
4216                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4217                                            <div class="flex items-start gap-2 mb-1.5">
4218                                                
4219                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4220                                                    <a href="/musoraink/adas/724303" class="hover:underline">
4221                                                        Miért szeretem?                                                    </a>
4222
4223													
4224
4225                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4226                                                                                                    </h3>
4227                                            </div>
4228
4229                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
4230                                                    vallomások irodalomról, művekről, szerzőkről
4231Szerkesztő: Fazekas Gyöngyvér                                                </div>
4232                                            
4233                                                                                            <a href="/musoraink/adas/724303" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
4234                                                    » bővebben...
4235                                                </a>
4236                                            
4237                                        </div>
4238
4239                                        
4240                                    </div>
4241                                                                    
4242                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4243
4244                                        <div class="shrink-0 mt-0.5">
4245                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4246                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
4246shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4247                                                20:30                                            </div>
4248                                        </div>
4249
4250                                        <div class="flex-1 min-w-0">
4251
4252                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4253                                                                                            <div class="mb-1">
4254                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4255                                                        <i class="fa-solid fa-folder-open opacity-70"></i> zenei műsorok                                                    </span>
4256                                                </div>
4257                                            
4258                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4259                                            <div class="flex items-start gap-2 mb-1.5">
4260                                                
4261                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4262                                                    <a href="/musoraink/adas/724304" class="hover:underline">
4263                                                        Hangoló                                                    </a>
4264
4265													
4266
4267                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4268                                                                                                    </h3>
4269                                            </div>
4270
4271                                            
4272                                                                                            <a href="/musoraink/adas/724304" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
4273                                                    » bővebben...
4274                                                </a>
4275                                            
4276                                        </div>
4277
4278                                        
4279                                    </div>
4280                                
4281                            </div>
4282                        </div>
4283                    </div>
4284                </section>
4285
4286            
4287                <section x-data="{ open: true }"
4288                    >
4289
4290                    <button @click="open = !open" type="button"
4291                        class="musor-slot-header bg-[#70a300] w-full text-white px-5 py-3 rounded-xl shadow-sm font-bold text-lg mb-2 hover:bg-opacity-90 transition-all focus:outline-none">
4292                        <span class="flex items-center gap-2 text-left">
4293                            <i class="fa-solid fa-clock opacity-80 text-sm"></i>
4294                            Velünk vannak                                                    </span>
4295                        <div class="flex items-center gap-4 shrink-0">
4296                            <span class="musor-slot-range text-sm font-medium bg-white/20 py-1 rounded-lg backdrop-blur-sm hidden sm:inline-flex w-28 text-center">
4297                                21:00 - 23:00                            </span>
4298
4299                            <span class="inline-flex transition-transform duration-300 rotate-180" :class="{ 'rotate-180': open }">
4300                                <i class="fa-solid fa-chevron-down"></i>
4301                            </span>
4302                        </div>
4303                    </button>
4304
4305                    <div class="grid-accordion is-open" :class="{ 'is-open': open }">
4306                        <div class="grid-accordion-inner">
4307                            <div class="flex flex-col gap-4 pl-3 md:pl-8 border-l-2 border-gray-100 ml-2 md:ml-4 pb-4 pt-2">
4308
4309                                                                    
4310                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4311
4312                                        <div class="shrink-0 mt-0.5">
4313                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4314                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
4314shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4315                                                21:00                                            </div>
4316                                        </div>
4317
4318                                        <div class="flex-1 min-w-0">
4319
4320                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4321                                                                                            <div class="mb-1">
4322                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4323                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
4324                                                </div>
4325                                            
4326                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4327                                            <div class="flex items-start gap-2 mb-1.5">
4328                                                
4329                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4330                                                    <a href="/musoraink/adas/724305" class="hover:underline">
4331                                                        Hírek                                                    </a>
4332
4333													
4334
4335                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4336                                                                                                    </h3>
4337                                            </div>
4338
4339                                            
4340                                                                                            <a href="/musoraink/adas/724305" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
4341                                                    » bővebben...
4342                                                </a>
4343                                            
4344                                        </div>
4345
4346                                        
4347                                    </div>
4348                                                                    
4349                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4350
4351                                        <div class="shrink-0 mt-0.5">
4352                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4353                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4354                                                21:04                                            </div>
4355                                        </div>
4356
4357                                        <div class="flex-1 min-w-0">
4358
4359                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4360                                                                                            <div class="mb-1">
4361                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4362                                                        <i class="fa-solid fa-folder-open opacity-70"></i> vallási műsorok                                                    </span>
4363                                                </div>
4364                                            
4365                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4366                                            <div class="flex items-start gap-2 mb-1.5">
4367                                                
4368                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4369                                                    <a href="/musoraink/adas/724306" class="hover:underline">
4370                                                        Napi evangélium                                                    </a>
4371
4372													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
4373                                                            (ism.)
4374                                                        </div>
4375                                                    
4376
4377                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4378                                                                                                    </h3>
4379                                            </div>
4380
4381                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
4382                                                    páros év, évközi idő 26. hét, 
4382csütörtök
4383** Lk 10,1-12 **
4384Felolvassa: Varga László                                                </div>
4385                                            
4386                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
4387                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
4388                                                </button>
4389
4390                                                <div x-show="detailsOpen"
4391                                                    x-transition:enter="transition ease-out duration-200"
4392                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
4393                                                    x-transition:enter-end="opacity-100 translate-y-0"
4394                                                    x-cloak
4395                                                    class="mt-3 pt-3 border-t border-gray-100">
4396
4397                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
4398                                                            Ezek után az Úr kiválasztott más hetvenkettőt, és elküldte őket kettesével maga előtt minden városba és helységbe, ahova menni készült. Azt mondta nekik: ,,Az aratnivaló sok, de a munkás kevés. Kérjétek azért az aratás Urát, küldjön munkásokat az aratásába. Menjetek! Íme, úgy küldelek titeket, mint bárányokat a farkasok közé. Ne vigyetek erszényt, se tarisznyát, se sarut, és az úton senkit se köszöntsetek. Ha valamelyik házba bementek, először ezt mondjátok: ,,Békesség e háznak!'' Ha a békesség fia lakik ott, rászáll a ti békességtek; ha pedig nem, visszaszáll rátok. Maradjatok ugyanabban a házban, egyétek és igyátok, amijük van, mert méltó a munkás a maga bérére. Ne járjatok házról-házra. Ha valamelyik városba betértek, és ott befogadnak titeket, egyétek, amit elétek tesznek. Gyógyítsátok meg az ott lévő betegeket, és mondjátok nekik: ,,Elközelgett hozzátok az Isten országa.'' Ha pedig egy városba betértek, és nem fogadnak be titeket, menjetek ki az utcára, és mondjátok: ,,Még a port is lerázzuk nektek, amely a ti városotokban lábainkra tapadt; tudjátok meg azonban, hogy elközelgett az Isten országa.'' Mondom nektek: Szodomának könnyebb lesz a sorsa azon a napon, mint annak a városnak.
4399Olvasmányok, ünnepek a liturgikus naptárban.                                                        </div>
4400                                                    
4401                                                    
4402                                                </div>
4403                                            
4404                                        </div>
4405
4406                                        
4407                                    </div>
4408                                                                    
4409                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4410
4411                                        <div class="shrink-0 mt-0.5">
4412                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4413                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4414                                                21:08                                            </div>
4415                                        </div>
4416
4417                                        <div class="flex-1 min-w-0">
4418
4419                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4420                                                                                            <div class="mb-1">
4421                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4422                                                        <i class="fa-solid fa-folder-open opacity-70"></i> vallási műsorok                                                    </span>
4423                                                </div>
4424                                            
4425                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4426                                            <div class="flex items-start gap-2 mb-1.5">
4427                                                
4428                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4429                                                    <a href="/musoraink/adas/724307" class="hover:underline">
4430                                                        A Vatikáni Rádió magyar műsora                                                    </a>
4431
4432													
4433
4434                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4435                                                                                                    </h3>
4436                                            </div>
4437
4438                                            
4439                                                                                            <a href="/musoraink/adas/724307" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
4440                                                    » bővebben...
4441                                                </a>
4442                                            
4443                                        </div>
4444
4445                                        
4446                                    </div>
4447                                                                    
4448                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4449
4450                                        <div class="shrink-0 mt-0.5">
4451                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4452                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4453                                                21:30                                            </div>
4454                                        </div>
4455
4456                                        <div class="flex-1 min-w-0">
4457
4458                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4459                                                                                            <div class="mb-1">
4460                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4461                                                        <i class="fa-solid fa-folder-open opacity-70"></i> irodalmi és versműsorok                                                    </span>
4462                                                </div>
4463                                            
4464                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4465                                            <div class="flex items-start gap-2 mb-1.5">
4466                                                
4467                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4468                                                    <a href="/musoraink/adas/wittinger-laszlo-tiszta-szivuek-kiteljesedes-felolvassa-schnell-adam-18-11-ism-724308" class="hover:underline">
4469                                                        Rádiós regénytár                                                    </a>
4470
4471													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
4472                                                            (ism.)
4473                                                        </div>
4474                                                    
4475
4476                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4477                                                                                                    </h3>
4478                                            </div>
4479
4480                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
4481                                                    Wittinger László: Tiszta szívűek - A kiteljesedés 
4482Felolvassa: Schnell Ádám  (18/11.)
4483Szerkesztő: Varga Andrea                                                </div>
4484                                            
4485                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
4486                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
4487                                                </button>
4488
4489                                                <div x-show="detailsOpen"
4490                                                    x-transition:enter="transition ease-out duration-200"
4491                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
4492                                                    x-transition:enter-end="opacity-100 translate-y-0"
4493                                                    x-cloak
4494                                                    class="mt-3 pt-3 border-t border-gray-100">
4495
4496                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
4497                                                            Hangmester: Liszkai Károly 
4498Zenei szerkesztő: Máry Szabó Eszter 
4499Dramaturg-rendező: Sárospataki Zsuzsanna                                                        </div>
4500                                                    
4501                                                    
4502                                                </div>
4503                                            
4504                                        </div>
4505
4506                                        
4507                                    </div>
4508                                                                    
4509                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4510
4511                                        <div class="shrink-0 mt-0.5">
4512                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4513                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
4513shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4514                                                22:00                                            </div>
4515                                        </div>
4516
4517                                        <div class="flex-1 min-w-0">
4518
4519                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4520                                                                                            <div class="mb-1">
4521                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4522                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
4523                                                </div>
4524                                            
4525                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4526                                            <div class="flex items-start gap-2 mb-1.5">
4527                                                
4528                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4529                                                    <a href="/musoraink/adas/724309" class="hover:underline">
4530                                                        Hírek                                                    </a>
4531
4532													
4533
4534                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4535                                                                                                    </h3>
4536                                            </div>
4537
4538                                            
4539                                                                                            <a href="/musoraink/adas/724309" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
4540                                                    » bővebben...
4541                                                </a>
4542                                            
4543                                        </div>
4544
4545                                        
4546                                    </div>
4547                                                                    
4548                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4549
4550                                        <div class="shrink-0 mt-0.5">
4551                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4552                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4553                                                22:04                                            </div>
4554                                        </div>
4555
4556                                        <div class="flex-1 min-w-0">
4557
4558                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4559                                                                                            <div class="mb-1">
4560                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4561                                                        <i class="fa-solid fa-folder-open opacity-70"></i> portré- és riportműsorok                                                    </span>
4562                                                </div>
4563                                            
4564                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4565                                            <div class="flex items-start gap-2 mb-1.5">
4566                                                
4567                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4568                                                    <a href="/musoraink/adas/turner-ferenc-monori-plebanos-elete-megprobaltatasai-ism-724310" class="hover:underline">
4569                                                        Arcok és sorsok                                                    </a>
4570
4571													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
4572                                                            (ism.)
4573                                                        </div>
4574                                                    
4575
4576                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4577                                                                                                    </h3>
4578                                            </div>
4579
4580                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
4581                                                    fejezetek a Magyar Katolikus Egyház életéből
4582Turner Ferenc monori plébános élete, megpróbáltatásai
4583Szerkesztő: Soós Viktor                                                </div>
4584                                            
4585                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
4586                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
4587                                                </button>
4588
4589                                                <div x-show="detailsOpen"
4590                                                    x-transition:enter="transition ease-out duration-200"
4591                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
4592                                                    x-transition:enter-end="opacity-100 translate-y-0"
4593                                                    x-cloak
4594                                                    class="mt-3 pt-3 border-t border-gray-100">
4595
4596                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
4597                                                            Turner Ferenc a kommunista diktatúra áldozata.  Sztálin halálának évében 1953.április 4-én hunyt el 48 évesen, 25 évvel a pappá szentelésének időszakában. Mit lehet tudni a haláláról és a halála körülményeiről? Vendégünk Török Ádám történész.                                                        </div>
4598                                                    
4599                                                    
4600                                                </div>
4601                                            
4602                                        </div>
4603
4604                                        
4605                                    </div>
4606                                                                    
4607                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4608
4609                                        <div class="shrink-0 mt-0.5">
4610                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4611                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
4611shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4612                                                22:30                                            </div>
4613                                        </div>
4614
4615                                        <div class="flex-1 min-w-0">
4616
4617                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4618                                                                                            <div class="mb-1">
4619                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4620                                                        <i class="fa-solid fa-folder-open opacity-70"></i> aktuális és hírműsorok                                                    </span>
4621                                                </div>
4622                                            
4623                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4624                                            <div class="flex items-start gap-2 mb-1.5">
4625                                                
4626                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4627                                                    <a href="/musoraink/adas/egy-masik-franciaorszag-xiv-leo-papa-apostoli-utja-franciaorszagban-ism-724311" class="hover:underline">
4628                                                        Kerengő                                                    </a>
4629
4630													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
4631                                                            (ism.)
4632                                                        </div>
4633                                                    
4634
4635                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4636                                                                                                    </h3>
4637                                            </div>
4638
4639                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
4640                                                    külpolitikai beszélgetések
4641Egy másik Franciaország
4642XIV. Leó pápa apostoli útja Franciaországban
4643Szerkesztő: Pozsgai Nóra                                                </div>
4644                                            
4645                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
4646                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
4647                                                </button>
4648
4649                                                <div x-show="detailsOpen"
4650                                                    x-transition:enter="transition ease-out duration-200"
4651                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
4652                                                    x-transition:enter-end="opacity-100 translate-y-0"
4653                                                    x-cloak
4654                                                    class="mt-3 pt-3 border-t border-gray-100">
4655
4656                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
4657                                                            Szentatya számos nagyon fontos témát érintett. Többször határozottan felszólalt a békéért, az élet védelmében az eutanázia ellen, szót emelt a vallásszabadságért, hangsúlyozta a katolikus nevelés létjogosultságát és fontosságát, és emlékeztetett Franciaország keresztény gyökereire – mindezt egy olyan országban, amely mintha erről igyekezne megfeledkezni, ahol nemrég megszavazták az eutanázia törv
4657ényt, és ahol szorul a hurok a katolikus iskolák körül. A fiataloknak azt mondta: „Ti vagytok Franciaország szentjei!” -- A katolikus egyházfő látogatását hatalmas lelkesedés kísérte, százezrek akarták látni, hallani a pápát, a tömeg ujjongva de békésen ünnepelt -- és sok francia ébredő reménnyel várja most Franciaország megújulását.
4658XIV. Leó pápa franciaországi útjának legfontosabb mozzanatairól, tanulságairól beszélgetünk. 
4659Vendégünk Fejérdy Gergely, a Pázmány Péter Katolikus Egyetem tanára és a Magyar Külügyi Intézet vezető kutatója.                                                        </div>
4660                                                    
4661                                                    
4662                                                </div>
4663                                            
4664                                        </div>
4665
4666                                                                                    <div class="shrink-0 w-24 h-20 md:w-32 md:h-24 ml-2 md:ml-4">
4667                                                <a href="/musoraink/adas/egy-masik-franciaorszag-xiv-leo-papa-apostoli-utja-franciaorszagban-ism-724311" class="block w-full h-full rounded-lg overflow-hidden shadow-sm hover:shadow-md transition-shadow">
4668                                                    <img src="https://www.katolikusradio.hu/kepek/musorok/724311/kicsi/Le___pp_bab__k_jpeg.jpg"
4669                                                        alt="Műsor kép"
4670                                                        class="w-full h-full object-cover hover:opacity-90 transition-opacity">
4671                                                </a>
4672                                            </div>
4673                                        
4674                                    </div>
4675                                
4676                            </div>
4677                        </div>
4678                    </div>
4679                </section>
4680
4681            
4682                <section x-data="{ open: true }"
4683                    >
4684
4685                    <button @click="open = !open" type="button"
4686                        class="musor-slot-header bg-[#70a300] w-full text-white px-5 py-3 rounded-xl shadow-sm font-bold text-lg mb-2 hover:bg-opacity-90 transition-all focus:outline-none">
4687                        <span class="flex items-center gap-2 text-left">
4688                            <i class="fa-solid fa-clock opacity-80 text-sm"></i>
4689                            Olvasólámpa                                                    </span>
4690                        <div class="flex items-center gap-4 shrink-0">
4691                            <span class="musor-slot-range text-sm font-medium bg-white/20 py-1 rounded-lg backdrop-blur-sm hidden sm:inline-flex w-28 text-center">
4692                                23:00 - 0:00                            </span>
4693
4694                            <span class="inline-flex transition-transform duration-300 rotate-180" :class="{ 'rotate-180': open }">
4695                                <i class="fa-solid fa-chevron-down"></i>
4696                            </span>
4697                        </div>
4698                    </button>
4699
4700                    <div class="grid-accordion is-open" :class="{ 'is-open': open }">
4701                        <div class="grid-accordion-inner">
4702                            <div class="flex flex-col gap-4 pl-3 md:pl-8 border-l-2 border-gray-100 ml-2 md:ml-4 pb-4 pt-2">
4703
4704                                                                    
4705                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4706
4707                                        <div class="shrink-0 mt-0.5">
4708                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4709                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4710                                                23:00                                            </div>
4711                                        </div>
4712
4713                                        <div class="flex-1 min-w-0">
4714
4715                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4716                                                                                            <div class="mb-1">
4717                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4718                                                        <i class="fa-solid fa-folder-open opacity-70"></i> portré- és riportműsorok                                                    </span>
4719                                                </div>
4720                                            
4721                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4722                                            <div class="flex items-start gap-2 mb-1.5">
4723                                                
4724                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4725                                                    <a href="/musoraink/adas/amokfuto-idok-fazekas-istvan-szindarabja-jozsef-attila-szinhazban-ism-724312" class="hover:underline">
4726                                                        Magyar csillagok                                                    </a>
4727
4728													                                                        <div class="text-gray-400 text-[14px] whitespace-pre-line mb-4">
4729                                                            (ism.)
4730                                                        </div>
4731                                                    
4732
4733                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4734                                                                                                    </h3>
4735                                            </div>
4736
4737                                                                                            <div class="text-[#333] text-[14px] md:text-[15px] leading-snug whitespace-pre-line mb-2">
4738                                                    Ámokfutó idők - Fazekas István színdarabja a József Attila Színházban
4739Szerkesztő: Kövesdy Zsuzsa                                                </div>
4740                                            
4741                                                                                            <button @click="detailsOpen = !detailsOpen" type="button" class="text-[#5c8500] text-[14px] hover:underline focus:outline-none">
4742                                                    » <span x-text="detailsOpen ? 'kevesebb...' : 'bővebben...'"></span>
4743                                                </button>
4744
4745                                                <div x-show="detailsOpen"
4746                                                    x-transition:enter="transition ease-out duration-200"
4747                                                    x-transition:enter-start="opacity-0 translate-y-[-5px]"
4748                                                    x-transition:enter-end="opacity-100 translate-y-0"
4749                                                    x-cloak
4750                                                    class="mt-3 pt-3 border-t border-gray-100">
4751
4752                                                                                                            <div class="text-gray-600 text-[14px] whitespace-pre-line mb-4">
4753                                                            Fazekas István "Ámokfutó idők" c. történelmi drámája a hortobágyi internálások megrendítő, szÍnpadon eddig még soha fel nem dolgozott történetét tárja elénk . Az 1952 nyarán játszódó kamaradráma a magyar Gulág világába vezet. A kitelepítések embertelen mechanizmusai között két sors találkozásán keresztül vizsgálja az erkölcsi döntés lehetőségét. A darabot a fiatal, kiváló rendező Molnár Kristóf érzékeny és egyszerre hatalmas erejű rendezése teszi felejthetetlen élménnyé. Ugyanez mondható el a szereplők mindegyikéről. Újréti László hiteles, elegáns Herczeg Ferencéről, Nagy Enikő tyukodi parasztasszonyáról, a holt fiút alakító, föld fölött lebegő Remzső Sándor (eh.) és a többi ifjú kiváló egyetemista hallgató színinövendékről, akik a vérbeli ávós figurákat elevenítik meg. A rendszerváltás sok csalódásának egyike volt, hogy Magyarországon elmaradt a várva várt felelősségrevonás, a magyar Nürnbergi per és a mai napig nem nyíltak meg az akták a megfigyelt érintettek számára. Ezért fontos, hogy ébren tartsuk az emlékezetet, hogy gyermekeink és unokáink se feledjék soha a kommunista terror borzalmas világát, melyet Fazekas István csodálatos alkotása mélyen a szívünkbe éget.                                                        </div>
4754                                                    
4755                                                    
4756                                                </div>
4757                                            
4758                                        </div>
4759
4760                                        
4761                                    </div>
4762                                                                    
4763                                    <div x-data="{ detailsOpen: false }" class="bg-white border-b border-gray-100 py-4 flex items-start gap-4">
4764
4765                                        <div class="shrink-0 mt-0.5">
4766                                            <!-- Az időpont háttere kékre vált, ha épp most szól -->
4767                                            <div class="musor-episode-time bg-[#5c8500] text-white font-bold text-sm px-2 py-0.5 
4767shadow-sm text-center min-w-[50px] transition-colors rounded-sm">
4768                                                23:30                                            </div>
4769                                        </div>
4770
4771                                        <div class="flex-1 min-w-0">
4772
4773                                            <!-- Kategória teljesen külön sorban, a cím felett -->
4774                                                                                            <div class="mb-1">
4775                                                    <span class="text-[10px] md:text-[11px] text-gray-400 font-bold uppercase tracking-wider flex items-center gap-1.5">
4776                                                        <i class="fa-solid fa-folder-open opacity-70"></i> zenei műsorok                                                    </span>
4777                                                </div>
4778                                            
4779                                            <!-- Lejátszógomb és a Műsor címe egy sorban -->
4780                                            <div class="flex items-start gap-2 mb-1.5">
4781                                                
4782                                                <h3 class="text-[17px] md:text-[18px] font-bold text-[#5c8500] leading-tight flex flex-wrap items-center gap-x-2 gap-y-1">
4783                                                    <a href="/musoraink/adas/724313" class="hover:underline">
4784                                                        Hangoló                                                    </a>
4785
4786													
4787
4788                                                    <!-- ÚJ: Most szól badge az épp futó adás címe mellett -->
4789                                                                                                    </h3>
4790                                            </div>
4791
4792                                            
4793                                                                                            <a href="/musoraink/adas/724313" class="text-[#5c8500] text-[14px] hover:underline block mt-1">
4794                                                    » bővebben...
4795                                                </a>
4796                                            
4797                                        </div>
4798
4799                                        
4800                                    </div>
4801                                
4802                            </div>
4803                        </div>
4804                    </div>
4805                </section>
4806
4807                    </div>
4808    
4809            <div class="flex justify-center mt-10 border-t border-gray-100 pt-10">
4810            <div x-data="datePicker('2026-10-01')" x-init="initDate()" class="relative w-full md:w-auto" x-cloak>
4811                <div class="flex items-center justify-between w-full bg-brand-grey rounded-xl p-1 shadow-sm border border-gray-100">
4812
4813                    <a href="?datum=2026-09-30" class="w-10 h-10 flex items-center justify-center text-gray-500 hover:text-brand-dark hover:bg-white rounded-lg transition-all shrink-0" title="Előző nap" data-turbo-action="advance">
4814                        <i class="fa-solid fa-chevron-left text-sm"></i>
4815                    </a>
4816
4817                    <button
4818                        @click="toggle()"
4819                        type="button"
4820                        class="px-4 py-2 flex-1 flex items-center justify-center gap-2 font-bold text-brand-dark hover:bg-white rounded-lg transition-all min-w-[140px]">
4821                        <i class="fa-regular fa-calendar text-brand-green"></i>
4822                        <span x-text="formatDisplayDate()"></span>
4823                    </button>
4824
4825                    <a href="?datum=2026-10-02" class="w-10 h-10 flex items-center justify-center text-gray-500 hover:text-brand-dark hover:bg-white rounded-lg transition-all shrink-0" title="Következő nap" data-turbo-action="advance">
4826                        <i class="fa-solid fa-chevron-right text-sm"></i>
4827                    </a>
4828                </div>
4829
4830                <div
4831                    x-show="open"
4832                    @click.outside="open = false"
4833                    x-transition:enter="transition ease-out duration-200"
4834                    x-transition:enter-start="opacity-0 translate-y-2"
4835                    x-transition:enter-end="opacity-100 translate-y-0"
4836                    class="absolute bottom-full mb-2 left-0 right-0 md:left-1/2 md:-translate-x-1/2 z-[100] bg-white shadow-2xl rounded-2xl p-4 border border-gray-100 min-w-[280px]"
4837                    x-cloak>
4838                    <div class="flex items-center justify-between mb-4">
4839                        <button type="button" @click="prevMonth()" class="p-2 hover:bg-gray-100 rounded-lg"><i class="fa-solid fa-chevron-left text-xs"></i></button>
4840                        <div class="font-bold text-brand-dark" x-text="monthNames[month] + ' ' + year"></div>
4841                        <button type="button" @click="nextMonth()" class="p-2 hover:bg-gray-100 rounded-lg"><i class="fa-solid fa-chevron-right text-xs"></i></button>
4842                    </div>
4843
4844                    <div class="grid grid-cols-7 gap-1 text-center mb-2">
4845                        <template x-for="day in ['H', 'K', 'Sze', 'Cs', 'P', 'Szo', 'V']">
4846                            <div class="text-[10px] font-bold text-gray-400 uppercase" x-text="day"></div>
4847                        </template>
4848                    </div>
4849
4850                    <div class="grid grid-cols-7 gap-1">
4851                        <template x-for="blankday in blankdays">
4852                            <div class="p-2"></div>
4853                        </template>
4854                        <template x-for="(date, dateIndex) in no_of_days" :key="dateIndex">
4855                            <button
4856                                type="button"
4857                                @click="selectDate(date)"
4858                                class="p-2 text-sm rounded-lg transition-all"
4859                                :class="{
4860                                    'bg-brand-green text-white font-bold shadow-md': isSelected(date),
4861                                    'hover:bg-brand-grey text-gray-700': !isSelected(date),
4862                                    'text-brand-green font-bold': isToday(date) && !isSelected(date)
4863                                }"
4864                                x-text="date"></button>
4865                        </template>
4866                    </div>
4867                </div>
4868            </div>
4869        </div>
4870    
4871</div>
4872
4873<script>
4874    document.addEventListener('turbo:before-cache', () => {
4875        document.body.style.overflow = 'auto';
4876    }, {
4877        once: true
4878    });
4879
4880    window.adasGalleryManager = function(imageArray) {
4881        return {
4882            images: imageArray,
4883            lightboxOpen: false,
4884            currentImageIndex: 0,
4885
4886            openLightbox(index) {
4887                if (this.images.length === 0) return;
4888                this.currentImageIndex = index;
4889                this.lightboxOpen = true;
4890                document.body.style.overflow = 'hidden';
4891            },
4892
4893            closeLightbox() {
4894                this.lightboxOpen = false;
4895                document.body.style.overflow = 'auto';
4896            },
4897
4898            prevImage() {
4899                if (this.images.length <= 1) return;
4900                if (this.currentImageIndex > 0) {
4901                    this.currentImageIndex--;
4902                } else {
4903                    this.currentImageIndex = this.images.length - 1;
4904                }
4905            },
4906
4907            nextImage() {
4908                if (this.images.length <= 1) return;
4909                if (this.currentImageIndex < this.images.length - 1) {
4910                    this.currentImageIndex++;
4911                } else {
4912                    this.currentImageIndex = 0;
4913                }
4914            }
4915        }
4916    }
4917</script>
4917 <!-- Az oldal tartalma -->
4918
4919
4920
4921    <footer id="footer" class="bg-brand-dark text-white py-12 lg:py-16">
4922  <div class="max-w-[1440px] mx-auto px-4 md:px-8">
4923    <div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-5 gap-10 lg:gap-12 mb-12">
4924
4925      <div class="md:col-span-3 lg:col-span-2 space-y-6">
4926        <div class="flex items-center justify-center md:justify-start">
4927          <div class="w-14 h-14 lg:w-16 lg:h-16 rounded-full flex items-center justify-center overflow-hidden">
4928            <img src="/img/logo.png"
4929              alt="Magyar Katolikus Rádió" class="w-full h-full object-cover">
4930          </div>
4931          <div class="ml-4 text-left">
4932            <div class="text-lg lg:text-xl font-bold">Magyar Katolikus Rádió</div>
4933            <div class="text-sm text-gray-400">Örömhír mindenkinek!</div>
4934          </div>
4935        </div>
4936        <p class="text-gray-400 leading-relaxed text-sm lg:text-base text-center md:text-left max-w-md mx-auto md:mx-0">
4937          A Magyar Katolikus Rádió küldetése, hogy hiteles információkkal, értékközvetítő műsorokkal és lelki táplálékkal szolgálja hallgatóit. Minden nap, 24 órában.
4938        </p>
4939        <div class="flex items-center justify-center md:justify-start space-x-4">
4940          <a href="https://www.facebook.com/katradio/?locale=hu_HU" target="_blank" class="w-10 h-10 lg:w-12 lg:h-12 bg-white/10 hover:bg-brand-green rounded-full flex items-center justify-center transition-all hover:-translate-y-1"><i class="fa-brands fa-facebook-f"></i></a>
4941          <a href="https://www.youtube.com/channel/UCgJyAWToXM6aHVic0CtIt4w" target="_blank" class="w-10 h-10 lg:w-12 lg:h-12 bg-white/10 hover:bg-brand-green rounded-full flex items-center justify-center transition-all hover:-translate-y-1"><i class="fa-brands fa-youtube"></i></a>
4942          <a href="https://www.instagram.com/katolikusradio/" target="_blank" class="w-10 h-10 lg:w-12 lg:h-12 bg-white/10 hover:bg-brand-green rounded-full flex items-center justify-center transition-all hover:-translate-y-1"><i class="fa-brands fa-instagram"></i></a>
4943          <a href="https://play.google.com/store/apps/details?id=hu.arteries.katolikusradio&hl=hu" target="_blank" class="w-10 h-10 lg:w-12 lg:h-12 bg-white/10 hover:bg-brand-green rounded-full flex items-center justify-center transition-all hover:-translate-y-1"><i class="fa-brands fa-google-play"></i></a>
4944          <a href="https://apps.apple.com/hu/app/magyar-katolikus-r%C3%A1di%C3%B3/id1474931701?l=hu" target="_blank" class="w-10 h-10 lg:w-12 lg:h-12 bg-white/10 hover:bg-brand-green rounded-full flex items-center justify-center transition-all hover:-translate-y-1"><i class="fa-brands fa-apple"></i></a>
4945          <a href="https://bolt.katolikusradio.hu/" target="_blank" class="w-10 h-10 lg:w-12 lg:h-12 bg-white/10 hover:bg-brand-green rounded-full flex items-center justify-center transition-all hover:-translate-y-1"><i class="fa-solid fa-shopping-cart"></i></a>
4946        </div>
4947      </div>
4948
4949      
4950      <div class="text-center md:text-left">
4951        <h4 class="text-lg font-bold mb-4 lg:mb-6 border-b border-white/10 pb-2 md:border-0 md:pb-0">Műsorok</h4>
4952        <ul class="space-y-2 lg:space-y-3">
4953            <li><a onclick="if(window.RadioPlayer) { window.RadioPlayer.setStream('https://katolikusradio.hu:8001/live_hi.mp3', 'Élő Adás', true, 0, true); window.RadioPlayer.expand(); }"  class="text-gray-400 hover:text-brand-green transition-colors text-sm lg:text-base cursor-pointer">Élő adás</a></li>
4954          <li><a href="/musoraink" class="text-gray-400 hover:text-brand-green transition-colors text-sm lg:text-base">Műsorújság és archívum</a></li>
4955          <li><a href="/podcastok" class="text-gray-400 hover:text-brand-green transition-colors text-sm lg:text-base">Podcastok</a></li>
4956        </ul>
4957      </div>
4958
4959      <div class="text-center md:text-left">
4960        <h4 class="text-lg font-bold mb-4 lg:mb-6 border-b border-white/10 pb-2 md:border-0 md:pb-0">Tartalom</h4>
4961        <ul class="space-y-2 lg:space-y-3">
4962          <li><a href="/hireink" class="text-gray-400 hover:text-brand-green transition-colors text-sm lg:text-base">Hírek</a></li>
4963          <li><a href="/videoink" class="text-gray-400 hover:text-brand-green transition-colors text-sm lg:text-base">Videók</a></li>
4964          <li><a href="/igenaptar" class="text-gray-400 hover:text-brand-green transition-colors text-sm lg:text-base">Igenaptár</a></li>
4965        </ul>
4966      </div>
4967
4968      <div class="text-center md:text-left">
4969        <h4 class="text-lg font-bold mb-4 lg:mb-6 border-b border-white/10 pb-2 md:border-0 md:pb-0">Információ</h4>
4970        <ul class="space-y-2 lg:space-y-3">
4971          <li><a href="/rolunk" class="text-gray-400 hover:text-brand-green transition-colors text-sm lg:text-base">Rólunk</a></li>
4972          <li><a href="/bemutatkozunk" class="text-gray-400 hover:text-brand-green transition-colors text-sm lg:text-base">Kapcsolat</a></li>
4973          <li><a href="/tamogatas" class="text-gray-400 hover:text-brand-green transition-colors text-sm lg:text-base">Támogatás</a></li>
4974          <li><a href="/adatkezelesi-tajekoztato" class="text-gray-400 hover:text-brand-green transition-colors text-sm lg:text-base">Adatkezelési tájékoztató</a></li>
4975          <li><a href="/impresszum" class="text-gray-400 hover:text-brand-green transition-colors text-sm lg:text-base">Impresszum</a></li>
4976        </ul>
4977      </div>
4978    </div>
4979
4980    <div class="border-t border-white/10 pt-10">
4981      <div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-5 ga
4981p-10 lg:gap-12 mb-12">
4982
4983        <div class="md:col-span-3 lg:col-span-2 space-y-6">
4984          <h4 class="text-lg font-bold mb-4">Kapcsolat</h4>
4985          <div class="space-y-3 text-gray-400 max-w-xs mx-auto md:mx-0">
4986            <div class="flex items-start justify-center md:justify-start">
4987              <i class="fa-solid fa-location-dot mt-1 mr-3 text-brand-green"></i>
4988              <span class="text-sm">1062 Budapest, Délibáb u. 15.-17.</span>
4989            </div>
4990            <div class="flex items-center justify-center md:justify-start">
4991              <i class="fa-solid fa-phone mr-3 text-brand-green"></i>
4992              <span class="text-sm">(+36 1) 255-3333</span>
4993            </div>
4994            <div class="flex items-center justify-center md:justify-start">
4995              <i class="fa-solid fa-envelope mr-3 text-brand-green"></i>
4996              <span class="text-sm">[email protected]</span>
4997            </div>
4998          </div>
4999        </div>
5000
5001        <div class="md:col-span-3 lg:col-span-2 space-y-6">
5002          <h4 class="text-lg font-bold mb-4">Támogatók</h4>
5003          <div class="space-y-3 text-gray-400 max-w-md mx-auto md:mx-0">
5004            <div class="flex items-start justify-center md:justify-start">
5005              <span class="text-sm">A médiaszolgáltatási tevékenységet és a műszaki fejlesztést a Médiatanács a Médiatanács Támogatási Program keretében támogatja.</span>
5006            </div>
5007          </div>
5008        </div>
5009
5010		<div class="text-center md:text-left">
5011			<div class="flex flex-col gap-4 max-w-[150px] w-full">
5012			  <img src="/img/nmhh_logo-150px.jpg" alt="NMHH logó" class="w-full h-auto object-contain rounded shadow-sm">
5013			  <img src="/img/nka_logo-150px.jpg" alt="NKA logó" class="w-full h-auto object-contain rounded shadow-sm">
5014			</div>
5015
5016		</div>
5017      </div>
5018
5019      <div class="flex flex-col md:flex-row items-center justify-between pt-8 border-t border-white/5 gap-4 text-center md:text-left">
5020        <p class="text-gray-500 text-xs lg:text-sm">
5021          © 2026 Magyar Katolikus Rádió Zrt. Minden jog fenntartva.
5022        </p>
5023        <p class="text-gray-500 text-xs lg:text-sm">
5024          Készítette: <a href="https://novanow.hu" class="text-brand-green hover:underline">NovaNow</a>
5025        </p>
5026      </div>
5027    </div>
5028  </div>
5029</footer>    <style>
5030  /* Alap padding az élő adáshoz (vagy becsukott állapothoz) */
5031  body {
5032    padding-bottom: 72px;
5033    transition: padding-bottom 0.3s ease;
5034  }
5035
5036  /* Becsukva mindegy mi megy, kicsi a padding */
5037  body.player-minimized {
5038    padding-bottom: 16px !important;
5039  }
5040
5041  /* Archív adásnál nagyobbnak kell lennie a paddingnak mobilon, mert két soros a lejátszó */
5042  @media (max-width: 767px) {
5043    body.player-archive {
5044      padding-bottom: 110px;
5045    }
5046  }
5047
5048  input[type="range"] {
5049    accent-color: #85c000;
5050    cursor: pointer;
5051  }
5052
5053  input[type="range"]:disabled {
5054    cursor: not-allowed;
5055    accent-color: #6c757d;
5056  }
5057
5058  .radio-pulse {
5059    position: relative;
5060    display: flex;
5061    align-items: center;
5062    justify-content: center; /* JAVÍTVA: justify-center -> justify-content */
5063  }
5064
5065  .radio-pulse.is-playing::before {
5066    content: "";
5067    position: absolute;
5068    overflow: hidden;
5069    top: 50%;
5070    left: 50%;
5071    width: 100%;
5072    height: 100%;
5073    margin-top: -50%;
5074    margin-left: -50%;
5075    border-radius: 9999px;
5076    background-color: #85c000;
5077    opacity: 0.5;
5078    animation: pulse-wave 2.5s infinite ease-out;
5079    z-index: -1;
5080    pointer-events: none;
5081  }
5082
5083  @keyframes pulse-wave {
5084    0% { transform: scale(1); opacity: 0.5; }
5085    100% { transform: scale(2.4); opacity: 0; }
5086  }
5087</style>
5088
5089<div id="radio-player-global" data-turbo-permanent x-data="radioPlayer" x-init="init()" x-cloak>
5090  <section
5091    id="quick-listen-bar"
5092    class="fixed bottom-0 left-0 right-0 z-[99999] bg-gray-900/95 backdrop-blur border-t border-white/10 flex flex-col justify-center transition-all duration-300"
5093    :class="{ 'h-[72px]': isLiveStream || minimized, 'h-[110px] md:h-[72px]': !isLiveStream && !minimized }"
5094    x-show="!minimized"
5095    x-transition.opacity>
5096    
5097    <div class="max-w-[1440px] w-full mx-auto px-4 md:px-6">
5098      <div class="flex items-center justify-between gap-2 md:gap-4 h-[56px] md:h-auto md:py-2">
5099
5100        <div class="flex items-center gap-3 md:gap-4 min-w-[50%] md:min-w-[200px]">
5101          <button
5102            type="button"
5103            class="w-10 h-10 bg-[#85c000] hover:bg-[#96d100] rounded-full flex items-center justify-center transition-colors shrink-0"
5104            @click="toggle()"
5105            :aria-label="playing ? 'Szünet' : 'Lejátszás'">
5106            <i class="fa-solid fa-play text-white ml-1" x-show="!playing" x-cloak></i>
5107            <i class="fa-solid fa-pause text-white" x-show="playing" x-cloak></i>
5108          </button>
5109
5110          <div class="min-w-0 flex-1">
5111            <div class="text-white font-semibold text-sm leading-tight truncate" x-text="displayTitle"></div>
5112            <div class="text-gray-400 text-xs leading-tight truncate" x-text="sourceLabel"></div>
5113          </div>
5114        </div>
5115
5116        <div class="hidden md:flex flex-1 items-center justify-center gap-3 px-4" x-show="!isLiveStream" x-cloak>
5117          <span class="text-xs text-gray-400 font-mono w-12 text-right" x-text="formatTime(currentTime)"></span>
5118          <input
5119            type="range"
5120            min="0"
5121            :max="duration > 0 ? duration : 100"
5122            step="1"
5123            class="flex-1 max-w-[400px] h-1.5 bg-gray-600 rounded-lg appearance-none"
5124            x-model="currentTime"
5125            @input="seek()" />
5126          <span class="text-xs text-gray-400 font-mono w-12" x-text="formatTime(duration)"></span>
5127        </div>
5128        
5129        <div class="hidden md:block flex-1" x-show="isLiveStream" x-cloak></div>
5130
5131        <div class="flex items-center gap-2 md:gap-3 min-w-[80px] md:min-w-[180px] justify-end">
5132          
5133          <div class="hidden md:flex items-center gap-2 w-28">
5134            <i class="fa-solid fa-volume-high text-gray-400 text-sm"></i>
5135            <input
5136              type="range" min="0" max="1" step="0.01"
5137              class="w-full h-1.5 bg-gray-600 rounded-lg appearance-none"
5138              x-model.number="volume"
5139              @input="applyVolume()"
5140              aria-label="Hangerő" />
5141          </div>
5142
5143          <button
5144            type="button"
5145            class="w-9 h-9 rounded-md hover:bg-white/10 text-gray-400 flex items-center justify-center transition-colors ml-1"
5146            @click="minimize()"
5147            aria-label="Becsukás"
5148            title="Becsukás">
5149            <i class="fa-solid fa-chevron-down"></i>
5150          </button>
5151        </div>
5152
5153      </div>
5154
5155      <div class="flex md:hidden items-center justify-between gap-3 pb-3 px-1" x-show="!isLiveStream" x-cloak>
5156        <span class="text-xs text-gray-400 font-mono w-10 text-left shrink-0" x-text="formatTime(currentTime)"></span>
5157        <input
5158            type="range"
5159            min="0"
5160            :max="duration > 0 ? duration : 100"
5161            step="1"
5162            class="flex-1 h-1.5 bg-gray-600 rounded-lg appearance-none w-full"
5163            x-model="currentTime"
5164            @input="seek()" />
5165        <span class="text-xs text-gray-400 font-mono w-10 text-right shrink-0" x-text="formatTime(duration)"></span>
5166      </div>
5167
5168    </div>
5169
5170    <audio x-ref="audio" preload="none"></audio>
5171  </section>
5172
5173  <button
5174    type="button"
5175    x-show="minimized"
5176    @click="expand()"
5177    :class="{ 'radio-pulse is-playing': playing, 'radio-pulse': !playing }"
5178    style="
5179    position: fixed !important;
5180    bottom: 32px !important;
5181    right: 32px !important;
5182    width: 64px !important;
5183    height: 64px !important;
5184    border-radius: 9999px !important;
5185    background-color: #85c000 !important;
5186    color: white !important;
5187    display: flex !important;
5188    align-items: center !important;
5189    justify-content: center !important;
5190    z-index: 999999 !important;
5191    border: none !important;
5192    box-shadow: 0 10px 25px rgba(0,0,0,0.3) !important;
5193    cursor: pointer !important;
5194  "
5195    x-transition:enter="transition ease-out duration-300"
5196    x-transition:enter-start="opacity-0 scale-50 translate-x-10"
5197    x-transition:enter-end="opacity-100 scale-100 translate-x-0">
5198    <i class="fa-solid fa-radio text-2xl"></i>
5199  </button>
5200
5201  
5201<script>
5202    document.addEventListener('alpine:init', () => {
5203      Alpine.data('radioPlayer', () => ({
5204        defaultUrl: 'https://katolikusradio.hu:8001/live_hi.mp3',
5205        defaultTitle: 'Élő adás',
5206
5207        streamUrl: null,
5208        programTitle: null,
5209        isLiveStream: true,
5210
5211        playing: false,
5212        minimized: sessionStorage.getItem('radioMinimized') === 'true', 
5213        volume: 0.7,
5214
5215        currentTime: 0,
5216        duration: 0,
5217        targetStartTime: 0,
5218
5219        get displayTitle() {
5220          return (this.programTitle && this.programTitle.trim()) ? this.programTitle : this.defaultTitle;
5221        },
5222        get sourceLabel() {
5223          return 'Magyar Katolikus Rádió';
5224        },
5225
5226        persistPlaybackState(isPlaying) {
5227          sessionStorage.setItem('radioWasPlaying', isPlaying ? 'true' : 'false');
5228        },
5229
5230        syncPlaybackState(isPlaying = !this.$refs.audio.paused) {
5231          this.playing = !!isPlaying;
5232          this.persistPlaybackState(this.playing);
5233        },
5234
5235        syncProgressState() {
5236          const audio = this.$refs.audio;
5237          if (!this.isLiveStream) {
5238            this.currentTime = audio.currentTime;
5239          }
5240        },
5241
5242        syncMetadataState() {
5243          const audio = this.$refs.audio;
5244          this.duration = audio.duration === Infinity ? 0 : audio.duration;
5245
5246          if (this.targetStartTime > 0) {
5247            audio.currentTime = this.targetStartTime;
5248            this.targetStartTime = 0;
5249          }
5250        },
5251
5252        syncFromAudioElement() {
5253          const audio = this.$refs.audio;
5254          this.syncPlaybackState(!audio.paused);
5255          this.currentTime = audio.currentTime;
5256          this.duration = audio.duration === Infinity ? 0 : audio.duration;
5257        },
5258
5259        init() {
5260          const a = this.$refs.audio;
5261          window.__mkrRadioPlayerInstance = this;
5262
5263          // Turbo permanent elemként a player DOM-ja oldalváltások között megmarad.
5264          // iOS Safari érzékeny arra, ha ugyanarra az audio elemre többször tesszük fel
5265          // ugyanazokat a listenereket, ezért az init idempotens.
5266          if (a.dataset.radioPlayerListenersAttached !== 'true') {
5267            a.dataset.radioPlayerListenersAttached = 'true';
5268
5269            const getActivePlayer = () => window.__mkrRadioPlayerInstance;
5270
5271            a.addEventListener('play', () => {
5272              getActivePlayer()?.syncPlaybackState(true);
5273            });
5274            a.addEventListener('pause', () => {
5275              getActivePlayer()?.syncPlaybackState(false);
5276            });
5277            a.addEventListener('ended', () => {
5278              getActivePlayer()?.syncPlaybackState(false);
5279            });
5280            a.addEventListener('error', (e) => {
5281              getActivePlayer()?.syncPlaybackState(false);
5282              console.error('audio error', e);
5283            });
5284
5285            a.addEventListener('timeupdate', () => {
5286              getActivePlayer()?.syncProgressState();
5287            });
5288
5289            a.addEventListener('loadedmetadata', () => {
5290              getActivePlayer()?.syncMetadataState();
5291            });
5292          }
5293
5294          a.volume = this.volume;
5295
5296          window.RadioPlayer = {
5297            setStream: (url, title, isLive, startAt, forcePlay) => this.setStream(url, title, isLive, startAt, forcePlay),
5298            play: () => this.play(),
5299            pause: () => this.pause(),
5300            toggle: () => this.toggle(),
5301            minimize: () => this.minimize(),
5302            expand: () => this.expand(),
5303            applyBodyPadding: () => this.applyBodyPadding(),
5304          };
5305
5306          // Memória betöltés
5307          if (!a.src || a.src === window.location.href || a.src === '') {
5308            const params = new URLSearchParams(window.location.search);
5309            const pStream = params.get('stream');
5310            const pTitle = params.get('title');
5311
5312            if (pStream) this.setStream(pStream, pTitle);
5313            else this.setStream(this.defaultUrl, null);
5314          } else {
5315            this.syncFromAudioElement();
5316            
5317            const savedState = JSON.parse(sessionStorage.getItem('radioState') || '{}');
5318            this.streamUrl = savedState.streamUrl || a.src;
5319            this.programTitle = savedState.programTitle || '';
5320            this.isLiveStream = savedState.isLiveStream !== undefined ? savedState.isLiveStream : true;
5321          }
5322
5323          this.syncFromAudioElement();
5324          
5325          this.applyBodyPadding();
5326        },
5327
5328        formatTime(seconds) {
5329          if (isNaN(seconds) || !isFinite(seconds)) return '00:00';
5330          const h = Math.floor(seconds / 3600);
5331          const m = Math.floor((seconds % 3600) / 60);
5332          const s = Math.floor(seconds % 60);
5333          if (h > 0) {
5334            return `${h}:${m.toString().padStart(2, '0')}:${s.toString().padStart(2, '0')}`;
5335          }
5336          return `${m.toString().padStart(2, '0')}:${s.toString().padStart(2, '0')}`;
5337        },
5338
5339        seek() {
5340          if (this.isLiveStream) return;
5341          this.$refs.audio.currentTime = this.currentTime;
5342        },
5343
5344        // Test Padding hozzáadása dinamikusan
5345        applyBodyPadding() {
5346          document.body.classList.toggle('player-minimized', !!this.minimized);
5347          
5348          // Ha NYITVA van és ARCHÍV, akkor plusz osztály a mobilos kétsoros nézet miatt
5349          if (!this.minimized && !this.isLiveStream) {
5350              document.body.classList.add('player-archive');
5351          } else {
5352              document.body.classList.remove('player-archive');
5353          }
5354        },
5355
5356        minimize() {
5357          this.minimized = true;
5358          sessionStorage.setItem('radioMinimized', 'true');
5359          this.applyBodyPadding();
5360        },
5361
5362        expand() {
5363          this.minimized = false;
5364          sessionStorage.setItem('radioMinimized', 'false');
5365          this.applyBodyPadding();
5366        },
5367
5368        ensureAudioSource() {
5369          const a = this.$refs.audio;
5370          if (this.streamUrl && a.src !== this.streamUrl) {
5371            a.src = this.streamUrl;
5372            a.load();
5373          }
5374        },
5375
5376        setStream(url, title = null, isLive = null, startAt = 0, forcePlay = false) {
5377          if (!url) return;
5378          const a = this.$refs.audio;
5379          const wasPlaying = !a.paused;
5380          const shouldStart = wasPlaying || forcePlay;
5381
5382          this.streamUrl = url;
5383          this.programTitle = title;
5384          this.isLiveStream = isLive !== null ? isLive : url.includes('live_hi');
5385
5386          sessionStorage.setItem('radioState', JSON.stringify({
5387            streamUrl: this.streamUrl,
5388            programTitle: this.programTitle,
5389            isLiveStream: this.isLiveStream
5390          }));
5391
5392          this.targetStartTime = startAt;
5393          this.currentTime = startAt;
5394          this.duration = 0;
5395
5396          if (shouldStart) {
5397            a.pause();
5398            this.ensureAudioSource();
5399            this.syncPlaybackState(false);
5400          } else if (this.isLiveStream) {
5401            // iOS Safari a live stream automatikus a.load()/src indítását a teljes
5402            // oldalbetöltés részének tekinti, ezért a progress bar félúton megállhat,
5403            // a Turbo/Alpine restore pedig félkész DOM-ot festhet. Élő adást csak
5404            // felhasználói play vagy explicit visszajátszás után nyitunk meg.
5405            a.pause();
5406            a.removeAttribute('src');
5407            a.load();
5408            this.syncPlaybackState(false);
5409          } else if (a.src !== url) {
5410            a.pause();
5411            this.ensureAudioSource();
5412            this.syncPlaybackState(false);
5413          }
5414
5415          this.applyBodyPadding(); // Frissítjük a magasságot betöltéskor
5416
5417          if (shouldStart) setTimeout(() => this.play(), 50);
5418        },
5419
5420        async play() {
5421          const a = this.$refs.audio;
5422          this.ensureAudioSource();
5423          try {
5424            await a.play();
5425            this.syncPlaybackState(true);
5426          } catch (e) {
5427            this.syncPlaybackState(false);
5428            console.error('play failed', e);
5429          }
5430        },
5431
5432        pause() {
5433          this.$refs.audio.pause();
5434          this.syncPlaybackState(false);
5435        },
5436
5437        async toggle() {
5438          const a = this.$refs.audio;
5439          if (a.paused) await this.play();
5440          else this.pause();
5441        },
5442
5443        applyVolume() {
5444          this.$refs.audio.volume = this.volume;
5445        },
5446      }));
5447    });
5448  </script>
5448
5449
5450  
5450<script>
5451    if (!window.__mkrRadioTurboBridgeRegistered) {
5452      window.__mkrRadioTurboBridgeRegistered = true;
5453      let wasRadioPlaying = false;
5454
5455      document.addEventListener("turbo:before-render", () => {
5456        const audioEl = document.querySelector('#radio-player-global audio');
5457        if (audioEl) {
5458          wasRadioPlaying = !audioEl.paused;
5459          sessionStorage.setItem('radioWasPlaying', wasRadioPlaying ? 'true' : 'false');
5460        }
5461      });
5462
5463      document.addEventListener("turbo:render", () => {
5464        if (wasRadioPlaying) {
5465          const audioEl = document.querySelector('#radio-player-global audio');
5466          if (audioEl) {
5467            setTimeout(() => {
5468              if (window.RadioPlayer && typeof window.RadioPlayer.play === 'function') {
5469                window.RadioPlayer.play();
5470              } else {
5471                audioEl.play().catch(e => console.log('Auto-play preventálva:', e));
5472              }
5473            }, 50);
5474          }
5475        }
5476
5477        if (window.RadioPlayer && typeof window.RadioPlayer.applyBodyPadding === 'function') {
5478          window.RadioPlayer.applyBodyPadding();
5479        }
5480      });
5481
5482      window.addEventListener('pageshow', () => {
5483        const shouldResumePlayback = sessionStorage.getItem('radioWasPlaying') === 'true';
5484
5485        if (shouldResumePlayback && window.RadioPlayer && typeof window.RadioPlayer.play === 'function') {
5486          window.RadioPlayer.play();
5487        }
5488
5489        if (window.RadioPlayer && typeof window.RadioPlayer.applyBodyPadding === 'function') {
5490          window.RadioPlayer.applyBodyPadding();
5491        }
5492      });
5493    }
5494  </script>
5494
5495</div>
5496
5497
5498  </body>
5499
5500  </html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.