<?php
require_once __DIR__ . '/config/config.php';
require_once __DIR__ . '/includes/functions.php';
$pageTitle = 'Brands & Principals';
$currentPage = 'brands';
$brands = Database::fetchAll("SELECT * FROM brands WHERE is_active=1 ORDER BY sort_order, name");
$categories = [];
foreach ($brands as $b) { $categories[$b['category'] ?: 'Other'][] = $b; }
include __DIR__ . '/includes/header.php';
?>

<section class="pt-28 pb-16 bg-navy-900">
  <div class="max-w-7xl mx-auto px-4">
    <div class="text-center mb-12">
      <div class="inline-flex items-center gap-2 bg-orange-600/10 border border-orange-600/30 rounded-full px-4 py-1.5 text-xs font-medium text-orange-400 uppercase tracking-wider mb-4">
        Global Sourcing Network
      </div>
      <h1 class="text-4xl md:text-5xl font-black font-display mb-4">Brands & <span class="text-orange-500">Principals</span></h1>
      <p class="text-gray-400 max-w-2xl mx-auto">We source from the world's leading manufacturers and authorised distributors across the USA, Europe, Asia, and the Middle East. Every brand we work with is certified to the relevant API, ASME, ISO, or NACE standards.</p>
    </div>

    <?php if ($categories): ?>
      <?php foreach ($categories as $cat => $items): ?>
      <div class="mb-12">
        <div class="flex items-center gap-3 mb-6">
          <div class="h-px flex-1 bg-navy-500"></div>
          <span class="text-xs font-bold uppercase tracking-widest text-orange-400 px-2"><?= e($cat) ?></span>
          <div class="h-px flex-1 bg-navy-500"></div>
        </div>
        <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-5">
          <?php foreach ($items as $brand): ?>
          <div class="card-dark p-5 hover:border-orange-600/50 transition-all hover:-translate-y-0.5 group">
            <!-- Logo / Icon area -->
            <div class="h-16 mb-4 flex items-center">
              <?php if ($brand['logo']): ?>
              <img src="/uploads/<?= e($brand['logo']) ?>" alt="<?= e($brand['name']) ?>"
                class="max-h-12 max-w-full object-contain filter brightness-90 group-hover:brightness-100 transition-all"
                onerror="this.onerror=null;this.style.display='none';this.nextElementSibling.style.display='flex'">
              <div class="hidden h-12 w-full items-center justify-start">
                <span class="text-lg font-bold text-orange-500"><?= e($brand['name']) ?></span>
              </div>
              <?php else: ?>
              <div class="text-xl font-black text-orange-500 font-display"><?= e($brand['name']) ?></div>
              <?php endif; ?>
            </div>
            <h3 class="font-bold text-white text-sm mb-1"><?= e($brand['name']) ?></h3>
            <?php if ($brand['origin_country']): ?>
            <div class="text-xs text-orange-400 mb-2">🌍 <?= e($brand['origin_country']) ?></div>
            <?php endif; ?>
            <?php if ($brand['description']): ?>
            <p class="text-xs text-gray-400 leading-relaxed line-clamp-3"><?= e($brand['description']) ?></p>
            <?php endif; ?>
            <?php if ($brand['website']): ?>
            <a href="<?= e($brand['website']) ?>" target="_blank" rel="noopener"
              class="mt-3 inline-flex items-center gap-1 text-xs text-orange-500 hover:text-orange-400">
              Visit website ↗
            </a>
            <?php endif; ?>
          </div>
          <?php endforeach; ?>
        </div>
      </div>
      <?php endforeach; ?>
    <?php else: ?>
    <div class="text-center py-16 text-gray-400">
      <div class="text-4xl mb-4">🏭</div>
      <p>Brand information coming soon.</p>
    </div>
    <?php endif; ?>

    <!-- Sourcing CTA -->
    <div class="mt-8 card-dark p-8 md:p-12 bg-gradient-to-r from-navy-800 to-navy-700 border-orange-600/30">
      <div class="max-w-3xl mx-auto text-center">
        <h2 class="text-2xl md:text-3xl font-bold mb-4">Don't See the Brand You Need?</h2>
        <p class="text-gray-400 mb-6">Our global sourcing network extends far beyond the brands listed above. If you have a specific make, model, or part number from any manufacturer worldwide, send us the details and we'll source it for you with full certification.</p>
        <a href="/contact.php" class="btn-primary px-8 py-3">Send Us Your Requirement</a>
      </div>
    </div>
  </div>
</section>

<?php include __DIR__ . '/includes/footer.php'; ?>
