<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:sitemap="http://www.sitemaps.org/schemas/sitemap/0.9">
    <xsl:output method="html" indent="yes" encoding="UTF-8"/>
    
    <xsl:template match="/">
        <html>
            <head>
                <title><?php echo $siteName ?? 'Front Line Hope Relief'; ?> - Sitemap</title>
                <style>
                    body {
                        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
                        max-width: 900px;
                        margin: 40px auto;
                        padding: 20px;
                        background: #FCFBF7;
                        color: #1c1917;
                    }
                    h1 {
                        font-family: 'Playfair Display', serif;
                        font-size: 2rem;
                        color: #1B4D3E;
                        border-bottom: 3px solid #F97316;
                        padding-bottom: 10px;
                    }
                    .stats {
                        background: #f0fdf4;
                        border: 1px solid #bbf7d0;
                        border-radius: 12px;
                        padding: 15px 20px;
                        margin: 20px 0;
                        font-size: 0.9rem;
                        color: #166534;
                    }
                    .stats strong {
                        color: #1B4D3E;
                    }
                    table {
                        width: 100%;
                        border-collapse: collapse;
                        margin: 20px 0;
                        background: white;
                        border-radius: 12px;
                        overflow: hidden;
                        box-shadow: 0 1px 3px rgba(0,0,0,0.1);
                    }
                    th {
                        background: #1B4D3E;
                        color: white;
                        padding: 12px 16px;
                        text-align: left;
                        font-size: 0.75rem;
                        text-transform: uppercase;
                        letter-spacing: 0.05em;
                    }
                    td {
                        padding: 10px 16px;
                        border-bottom: 1px solid #f1f5f9;
                        font-size: 0.85rem;
                    }
                    tr:hover {
                        background: #f8fafc;
                    }
                    a {
                        color: #1B4D3E;
                        text-decoration: none;
                    }
                    a:hover {
                        color: #F97316;
                        text-decoration: underline;
                    }
                    .priority {
                        display: inline-block;
                        padding: 2px 8px;
                        border-radius: 4px;
                        font-size: 0.7rem;
                        font-weight: bold;
                    }
                    .priority-high { background: #fef3c7; color: #92400e; }
                    .priority-medium { background: #dbeafe; color: #1e40af; }
                    .priority-low { background: #e5e7eb; color: #4b5563; }
                    .footer {
                        margin-top: 30px;
                        padding-top: 20px;
                        border-top: 1px solid #e5e7eb;
                        text-align: center;
                        font-size: 0.8rem;
                        color: #6b7280;
                    }
                    .badge {
                        display: inline-block;
                        padding: 2px 10px;
                        border-radius: 9999px;
                        font-size: 0.65rem;
                        font-weight: 600;
                        text-transform: uppercase;
                    }
                    .badge-daily { background: #fef3c7; color: #92400e; }
                    .badge-weekly { background: #dbeafe; color: #1e40af; }
                    .badge-monthly { background: #d1fae5; color: #065f46; }
                    .badge-yearly { background: #e5e7eb; color: #4b5563; }
                </style>
            </head>
            <body>
                <h1>🗺️ <?php echo $siteName ?? 'Front Line Hope Relief'; ?> - Sitemap</h1>
                
                <div class="stats">
                    <strong>📊 Sitemap Index</strong> · 
                    Total URLs: <strong><xsl:value-of select="count(//sitemap:url)"/></strong> · 
                    Generated: <strong><?php echo date('F d, Y H:i:s'); ?></strong>
                </div>
                
                <table>
                    <thead>
                        <tr>
                            <th>URL</th>
                            <th>Last Modified</th>
                            <th>Change Frequency</th>
                            <th>Priority</th>
                        </tr>
                    </thead>
                    <tbody>
                        <xsl:for-each select="//sitemap:url">
                            <tr>
                                <td>
                                    <a href="{sitemap:loc}" target="_blank">
                                        <xsl:value-of select="sitemap:loc"/>
                                    </a>
                                </td>
                                <td><xsl:value-of select="sitemap:lastmod"/></td>
                                <td>
                                    <span class="badge badge-{sitemap:changefreq}">
                                        <xsl:value-of select="sitemap:changefreq"/>
                                    </span>
                                </td>
                                <td>
                                    <span class="priority priority-{substring-before(sitemap:priority, '.')}">
                                        <xsl:value-of select="sitemap:priority"/>
                                    </span>
                                </td>
                            </tr>
                        </xsl:for-each>
                    </tbody>
                </table>
                
                <div class="footer">
                    <p>
                        Generated by <?php echo $siteName ?? 'Front Line Hope Relief'; ?> · 
                        <a href="/">Home</a> · 
                        <a href="/privacy.php">Privacy</a> · 
                        <a href="/terms.php">Terms</a>
                    </p>
                </div>
            </body>
        </html>
    </xsl:template>
</xsl:stylesheet>