<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title><?= esc($company['name']) ?> - <?= $title ?? '' ?></title>
    <?php $font = $company['site_font'] ?? 'Tajawal'; $color = $company['site_primary_color'] ?? '#1e1e2d'; ?>
    <link href="https://fonts.googleapis.com/css2?family=<?= urlencode($font) ?>:wght@400;500;700;900&display=swap" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.rtl.min.css" rel="stylesheet">
    <style>
        :root {
            --primary: <?= esc($color, 'attr') ?>;
        }
        body { font-family: '<?= esc($font) ?>', sans-serif; color: #333; }
        .navbar-brand img { height: 40px; }
        .btn-primary, .bg-primary { background-color: var(--primary) !important; border-color: var(--primary) !important; }
        .text-primary { color: var(--primary) !important; }
        .hero-slide { height: 480px; object-fit: cover; }
        @media (max-width: 768px) { .hero-slide { height: 260px; } }
        .section { padding: 60px 0; }
        .card-product { transition: transform .2s; border: none; box-shadow: 0 2px 10px rgba(0,0,0,.06); }
        .card-product:hover { transform: translateY(-5px); }
        footer { background: #1a1a1a; color: #ccc; }
        footer a { color: #ccc; text-decoration: none; }
        footer a:hover { color: #fff; }
        .social-icons a {
            display: inline-flex; align-items: center; justify-content: center;
            width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.1); margin-left: 8px;
        }
        .navbar { box-shadow: 0 2px 8px rgba(0,0,0,.06); }
    </style>
</head>
<body>

<nav class="navbar navbar-expand-lg navbar-light bg-white sticky-top">
    <div class="container">
        <a class="navbar-brand fw-bold d-flex align-items-center gap-2" href="<?= base_url('site/' . $company['slug']) ?>">
            <?php if (!empty($company['logo'])): ?>
                <img src="<?= base_url('uploads/logos/' . $company['logo']) ?>" alt="<?= esc($company['name']) ?>">
            <?php endif; ?>
            <?= esc($company['name']) ?>
        </a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navMenu">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navMenu">
            <ul class="navbar-nav ms-auto gap-2">
                <li class="nav-item"><a class="nav-link" href="<?= base_url('site/' . $company['slug']) ?>">الرئيسية</a></li>
                <li class="nav-item"><a class="nav-link" href="<?= base_url('site/' . $company['slug'] . '/about') ?>">من نحن</a></li>
                <li class="nav-item"><a class="nav-link" href="<?= base_url('site/' . $company['slug'] . '/products') ?>">منتجاتنا</a></li>
                <li class="nav-item"><a class="nav-link" href="<?= base_url('site/' . $company['slug'] . '/contact') ?>">اتصل بنا</a></li>
            </ul>
        </div>
    </div>
</nav>

<?= $this->renderSection('content') ?>

<footer class="pt-5 pb-4 mt-5">
    <div class="container">
        <div class="row">
            <div class="col-md-4 mb-4">
                <h5 class="text-white"><?= esc($company['name']) ?></h5>
                <p class="small"><?= esc($company['site_tagline'] ?? '') ?></p>
                <div class="social-icons mt-3">
                    <?php if (!empty($company['site_facebook_url'])): ?><a href="<?= esc($company['site_facebook_url']) ?>" target="_blank">f</a><?php endif; ?>
                    <?php if (!empty($company['site_twitter_url'])): ?><a href="<?= esc($company['site_twitter_url']) ?>" target="_blank">X</a><?php endif; ?>
                    <?php if (!empty($company['site_instagram_url'])): ?><a href="<?= esc($company['site_instagram_url']) ?>" target="_blank">IG</a><?php endif; ?>
                    <?php if (!empty($company['site_whatsapp_number'])): ?><a href="https://wa.me/<?= esc($company['site_whatsapp_number']) ?>" target="_blank">W</a><?php endif; ?>
                </div>
            </div>
            <div class="col-md-4 mb-4">
                <h6 class="text-white">روابط سريعة</h6>
                <ul class="list-unstyled small">
                    <li><a href="<?= base_url('site/' . $company['slug']) ?>">الرئيسية</a></li>
                    <li><a href="<?= base_url('site/' . $company['slug'] . '/about') ?>">من نحن</a></li>
                    <li><a href="<?= base_url('site/' . $company['slug'] . '/products') ?>">منتجاتنا</a></li>
                    <li><a href="<?= base_url('site/' . $company['slug'] . '/contact') ?>">اتصل بنا</a></li>
                </ul>
            </div>
            <div class="col-md-4 mb-4">
                <h6 class="text-white">بيانات التواصل</h6>
                <ul class="list-unstyled small">
                    <?php if (!empty($company['phone'])): ?><li>📞 <?= esc($company['phone']) ?></li><?php endif; ?>
                    <?php if (!empty($company['email'])): ?><li>✉️ <?= esc($company['email']) ?></li><?php endif; ?>
                    <?php if (!empty($company['address'])): ?><li>📍 <?= esc($company['address']) ?></li><?php endif; ?>
                </ul>
            </div>
        </div>
        <hr style="border-color:rgba(255,255,255,.1);">
        <p class="small text-center mb-0"><?= !empty($company['site_footer_text']) ? nl2br(esc($company['site_footer_text'])) : '© ' . date('Y') . ' ' . esc($company['name']) . ' - جميع الحقوق محفوظة' ?></p>
    </div>
</footer>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
