<?php

declare(strict_types=1);

require_once __DIR__ . '/functions.php';
require_admin_login();

$conn = nay_theme_db();
nay_theme_ensure_settings($conn);

$tab = nay_theme_valid_tab((string)($_GET['tab'] ?? 'identity'));
$message = '';
$messageType = 'success';

if (is_post()) {
    $postedTab = nay_theme_valid_tab((string)post('tab', $tab));
    $result = nay_theme_save_group($conn, $postedTab, $_POST);
    $message = (string)($result['message'] ?? 'تمت العملية.');
    $messageType = !empty($result['ok']) ? 'success' : 'error';
    $tab = $postedTab;
}

$groups = nay_theme_field_groups();
$values = nay_theme_get_values($conn);
$currentGroup = $groups[$tab];
$page_title = 'إدارة المظهر والثيمات';
require_once __DIR__ . '/../includes/header.php';
require_once __DIR__ . '/../includes/sidebar.php';
?>
<style>
.theme-page-wrap{max-width:1280px;margin:20px auto;padding:0 16px 28px}
.theme-page-head{background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:18px 20px;margin-bottom:16px}
.theme-page-head h1{margin:0 0 8px;font-size:28px;color:#0f172a}
.theme-page-head p{margin:0;color:#64748b;line-height:1.9}
.theme-page-head .theme-head-actions{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap}
.theme-link-btn,.theme-save-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;padding:12px 16px;text-decoration:none;border:0;cursor:pointer;font-size:14px}
.theme-link-btn{background:#fff;color:#0f172a;border:1px solid #e5e7eb}
.theme-save-btn{background:#7ec8e3;color:#fff}
.theme-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.theme-tab{text-decoration:none;background:#fff;border:1px solid #e5e7eb;color:#0f172a;padding:10px 14px;border-radius:12px;font-size:14px}
.theme-tab.active{background:#7ec8e3;color:#fff;border-color:#7ec8e3}
.theme-card{background:#fff;border:1px solid #e5e7eb;border-radius:20px;padding:20px}
.theme-card-head h2{margin:0 0 8px;color:#0f172a}.theme-card-head p{margin:0 0 16px;color:#64748b}
.theme-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.theme-field-card{border:1px solid #e5e7eb;background:#fbfdff;border-radius:16px;padding:14px}
.theme-label{display:block;font-weight:700;margin-bottom:10px;color:#0f172a}
.theme-input-row{display:flex;gap:10px;align-items:center}
.theme-color-picker{width:52px;height:46px;border:1px solid #e5e7eb;background:#fff;border-radius:12px;padding:4px}
.theme-hex-input{flex:1;border:1px solid #e5e7eb;border-radius:12px;min-height:46px;padding:0 12px;direction:ltr;text-align:left;font-size:14px}
.theme-preview{width:46px;height:46px;border-radius:12px;border:1px solid #e5e7eb;display:inline-block}
.theme-alert{border-radius:14px;padding:14px 16px;margin-bottom:16px}
.theme-alert.success{background:rgba(22,163,74,.08);color:#166534;border:1px solid rgba(22,163,74,.2)}
.theme-alert.error{background:rgba(239,68,68,.08);color:#991b1b;border:1px solid rgba(239,68,68,.2)}
.theme-submit-row{display:flex;justify-content:flex-end;margin-top:18px}
.theme-sticky-save{position:sticky;bottom:14px;z-index:20;margin-top:18px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border:1px solid #dbeafe;border-radius:18px;padding:12px;display:flex;justify-content:space-between;gap:12px;align-items:center;box-shadow:0 18px 40px rgba(15,23,42,.10)}
.theme-sticky-save strong{color:#0f172a}.theme-sticky-save span{color:#64748b;font-size:13px}
.theme-api-chip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;background:#eef7fb;color:#0369a1;padding:8px 12px;text-decoration:none;font-size:13px}
.theme-note{margin-top:12px;color:#64748b;font-size:13px;line-height:1.8}
@media (max-width:768px){.theme-input-row{flex-wrap:wrap}.theme-preview{width:100%;height:36px}}
</style>
<div class="theme-page-wrap">
    <div class="theme-page-head">
        <h1>إدارة المظهر والثيمات</h1>
        <p>هذه لوحة مستقلة منفصلة عن الإعدادات العامة، ومرتبة على تبويبات حتى يصير التحكم أوضح وتقل التعارضات بين ألوان الثيم وألوان الحالات والعروض.</p>
        <div class="theme-head-actions">
            <a class="theme-link-btn" href="/app/admin/index.php"><i class="fa-solid fa-gauge-high"></i> الرجوع إلى الداشبورد</a>
            <a class="theme-link-btn" href="/app/admin/settings/index.php"><i class="fa-solid fa-gear"></i> الإعدادات العامة</a>
            <button class="theme-save-btn" type="submit" form="themeForm"><i class="fa-solid fa-floppy-disk"></i> حفظ الثيم</button>
            <a class="theme-api-chip" href="/app/api/v1/public/theme" target="_blank"><i class="fa-solid fa-code"></i> فحص Theme API</a>
        </div>
    </div>

    <?php if ($message !== ''): ?>
        <div class="theme-alert <?= nay_theme_escape($messageType) ?>"><?= nay_theme_escape($message) ?></div>
    <?php endif; ?>

    <div class="theme-tabs">
        <?php foreach ($groups as $groupKey => $group): ?>
            <a class="theme-tab <?= $groupKey === $tab ? 'active' : '' ?>" href="?tab=<?= nay_theme_escape($groupKey) ?>"><?= nay_theme_escape((string)$group['label']) ?></a>
        <?php endforeach; ?>
    </div>

    <div class="theme-card">
        <div class="theme-card-head">
            <h2><?= nay_theme_escape((string)$currentGroup['label']) ?></h2>
            <p><?= nay_theme_escape((string)$currentGroup['description']) ?></p>
        </div>

        <form id="themeForm" method="post" action="?tab=<?= nay_theme_escape($tab) ?>">
            <input type="hidden" name="tab" value="<?= nay_theme_escape($tab) ?>">
            <div class="theme-grid">
                <?php foreach ($currentGroup['fields'] as $key => $meta): ?>
                    <?= nay_theme_render_field($key, (string)$meta[0], (string)($values[$key] ?? $meta[1] ?? '')) ?>
                <?php endforeach; ?>
            </div>
            <div class="theme-submit-row">
                <button class="theme-save-btn" type="submit"><i class="fa-solid fa-floppy-disk"></i> حفظ هذا التبويب</button>
            </div>
            <div class="theme-sticky-save">
                <div>
                    <strong>حفظ الثيم داخل لوحة الأدمن</strong><br>
                    <span>يحفظ القيم ويزامنها مع مفاتيح التطبيق والـ API مباشرة.</span>
                </div>
                <button class="theme-save-btn" type="submit"><i class="fa-solid fa-cloud-arrow-up"></i> حفظ الثيم الآن</button>
            </div>
            <div class="theme-note">القيم تُحفظ داخل جدول settings الحالي حتى يبقى الربط آمناً مع المنظومة الحالية، لكن التحكم صار من لوحة مستقلة خارج الإعدادات.</div>
        </form>
    </div>
</div>
<?php require_once __DIR__ . '/../includes/footer.php'; ?>
