<?php
// Debug: verifica valori delle variabili (rimuovi dopo aver risolto)
// echo "<!-- DEBUG - Page: " . htmlspecialchars($page) . " | Param: " . htmlspecialchars($param) . " -->\n";
?>

<div class="header">
    <div class="logo-section">
        <img src="<?=$base_path?>/img/RpiGroupPlayWHITE.png" alt="Logo">
    </div>
    <div class="menu-section" style="display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 5px;">
        <a href="<?php echo $base_path; ?>/" data-page="home" class="navLink <?php echo $page == 'home' ? 'active' : ''; ?>">Home</a>
        <a href="<?php echo $base_path; ?>/radio" data-page="radio" class="navLink <?php echo ($page == 'radio' || $page == 'play') ? 'active' : ''; ?>">Radio</a>
        <a href="<?php echo $base_path; ?>/tv" data-page="tv" class="navLink <?php echo ($page == 'tv' || $page == 'playtv') ? 'active' : ''; ?>">TV</a>
        <a href="<?php echo $base_path; ?>/podcast" data-page="podcast" class="navLink <?php echo ($page == 'page' && $param == 'addradio') ? 'active' : ''; ?>">Podcast</a>
    </div>
</div>

<main class="container-fluid" id="content">
    <?php
        $filePath = getPageFilePath($page, $param);
        
        // Validazione specifica delle stazioni radio e tv per sicurezza
        if ($page === 'play' && !empty($param)) {
            $stationId = (int)$param;
            $station = getRadioStation($stationId);
            if ($station === null) {
                $filePath = './pages/page/404.php';
            }
        } elseif ($page === 'playtv' && !empty($param)) {
            $stationId = (int)$param;
            $station = getTVStation($stationId);
            if ($station === null) {
                $filePath = './pages/page/404.php';
            }
        }
        
        include $filePath;
    ?>
</main>

<!-- Loading Overlay -->
<div id="loadingOverlay" class="loading-overlay">
    <div class="loading-content">
        <div class="spinner-large"></div>
        <p class="loading-text">Caricamento...</p>
    </div>
</div>

<div class="footer">
    <div class="menu-section">
        <a href="<?php echo $base_path; ?>/page/termini-condizioni" data-page="page/termini-condizioni" class="navLink">Termini e Condizioni</a> •
        <a href="<?php echo $base_path; ?>/page/policy-privacy" data-page="page/policy-privacy" class="navLink">Policy Privacy</a> •
        <a href="<?php echo $base_path; ?>/page/changelog" data-page="page/changelog" class="navLink">Changelog</a>
    </div>
    <div class="copyright-section" <?php if($is_mobile){ ?> style="padding: 10px 0 25px;" <?php } ?>>© 2025 RPIGroup • Versione: <?php echo $version_app; ?></div>
</div>

<!-- PWA Install Banner (Mobile view bottom prompt) -->
<div id="pwa-install-banner" class="pwa-install-banner" style="display: none;">
    <div class="pwa-banner-content">
        <img src="<?=$base_path?>/img/logoapp.png" alt="App Logo" class="pwa-banner-logo">
        <div class="pwa-banner-text">
            <div class="pwa-banner-title">RPIGroup Play</div>
            <div class="pwa-banner-desc">Installa l'app per ascoltare musica ovunque e a schermo intero!</div>
        </div>
        <div class="pwa-banner-actions">
            <button id="pwa-banner-install-btn" class="pwa-banner-btn">SCARICA APP</button>
            <button id="pwa-banner-close-btn" class="pwa-banner-close-btn">
                <i class="material-icons" style="font-size: 18px; vertical-align: middle;">close</i>
            </button>
        </div>
    </div>
</div>

<!-- PWA Instructions Modal (iOS Safari & Fallback) -->
<div id="pwa-instructions-modal" class="pwa-modal-overlay" style="display: none;">
    <div class="pwa-modal-content">
        <div class="pwa-modal-header">
            <h3>Installa l'applicazione</h3>
            <button id="pwa-modal-close-btn" class="pwa-modal-close-btn-top">
                <i class="material-icons">close</i>
            </button>
        </div>
        <div class="pwa-modal-body">
            <div class="pwa-modal-app-info">
                <img src="<?=$base_path?>/img/logoapp.png" alt="App Logo" class="pwa-modal-logo">
                <div>
                    <h4 style="color: white; font-weight: 700; margin: 0;">RPIGroup Play</h4>
                    <p style="color: rgba(255,255,255,0.7); font-size: 0.8rem; margin: 2px 0 0;">Ascolta le tue stazioni radio preferite</p>
                </div>
            </div>
            <div id="pwa-instructions-content" class="pwa-modal-steps">
                <!-- Will be populated dynamically by pwa-install.js -->
            </div>
        </div>
    </div>
</div>