<?php
// test-layout.php - تست مستقل layout با تم
$selectedTheme = 'red';
?>
<!DOCTYPE html>
<html lang="fa" dir="rtl">
<head>
    <meta charset="UTF-8">
    <title>تست مستقل Layout</title>
    <link rel="stylesheet" href="assets/css/themes.css">
    <style>
        body { font-family: 'Vazirmatn', sans-serif; padding: 40px; background: var(--background); }
        .card { background: var(--surface); padding: 30px; border-radius: 18px; border: 1px solid var(--border); max-width: 600px; margin: 0 auto; text-align: center; }
        .btn { padding: 12px 30px; border: none; border-radius: 12px; background: var(--primary); color: white; font-size: 16px; cursor: pointer; }
        .stat { background: var(--surface); padding: 20px; border-radius: 12px; border: 1px solid var(--border); margin: 10px 0; }
        .stat-value { font-size: 26px; font-weight: 800; color: var(--text); }
        .stat-label { color: var(--text-secondary); }
    </style>
</head>
<body class="theme-<?= $selectedTheme ?>">

<div class="card">
    <h1 style="color:var(--text);">تست مستقل Layout</h1>
    <p style="color:var(--text-secondary);">تم فعلی: <strong>قرمز</strong></p>
    
    <button class="btn">دکمه اصلی</button>
    
    <div class="stat">
        <div class="stat-value">۱۲۴</div>
        <div class="stat-label">تعداد مدرسین</div>
    </div>
    
    <div style="margin-top:20px;display:flex;gap:10px;justify-content:center;">
        <span style="display:inline-block;width:40px;height:40px;border-radius:8px;background:var(--primary);"></span>
        <span style="display:inline-block;width:40px;height:40px;border-radius:8px;background:var(--secondary);"></span>
        <span style="display:inline-block;width:40px;height:40px;border-radius:8px;background:var(--background);border:1px solid #ddd;"></span>
        <span style="display:inline-block;width:40px;height:40px;border-radius:8px;background:var(--surface);border:1px solid #ddd;"></span>
    </div>
</div>

</body>
</html>