<!-- Footer -->
<footer
id="footer"
class="bg-gradient-to-br from-sky-200 to-gray-100 pt-12 px-6"
>
<div
class="max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-4 gap-8 text-gray-800"
>
<!-- Brand -->
<div>
<div class="flex gap-3">
<img
src="https://safeeyesjewelers.com/public/frontend/images/safeeyes.png"
alt="Safeeyes Jeweler logo"
class="w-10 h-10 object-contain"
loading="lazy"
/>
<h3 class="text-3xl font-bold text-sky-800 mb-4">Safeeyes</h3>
</div>
<p class="mb-2">A108 Adam Street</p>
<p class="mb-2">Riyadh, Saudi Arabia</p>
<p class="mb-2">
Phone:
<a href="tel:+966576650902" class="text-sky-800 hover:underline"
>+966 57 665 0902</a
>
</p>
<p>
Email:
<a
href="mailto:Safeeyestrading@gmail.com"
class="text-sky-800 hover:underline"
>Safeeyestrading@gmail.com</a
>
</p>
</div>
<!-- Useful Links -->
<div>
<h4 class="text-lg font-semibold text-sky-800 mb-4">Useful Links</h4>
<ul class="space-y-2">
<li>
<a href="#home" class="text-sky-800 hover:underline">Home</a>
</li>
<li>
<a href="#services" class="text-sky-800 hover:underline"
>Service</a
>
</li>
<li>
<a href="#subscription" class="text-sky-800 hover:underline"
>Subscription</a
>
</li>
<li>
<a href="#contact" class="text-sky-800 hover:underline"
>Contact</a
>
</li>
<li>
<a href="/terms" class="text-sky-800 hover:underline"
>Terms of Service</a
>
</li>
</ul>
</div>
<!-- Our Services -->
<div>
<h4 class="text-lg font-semibold text-sky-800 mb-4">Our Services</h4>
<ul class="space-y-2">
<li>
<a href="services.html" class="text-sky-800 hover:underline" aria-label="Zakat service details">Zakat</a>
</li>
<li>
<a href="#" class="text-sky-800 hover:underline" aria-label="Attendance service details">Attendance</a>
</li>
<li>
<a href="#" class="text-sky-800 hover:underline" aria-label="Inventory Categories service details">Inventory Categories</a>
</li>
<li>
<a href="#" class="text-sky-800 hover:underline" aria-label="Inventories service details">Inventories</a>
</li>
<li>
<a href="#" class="text-sky-800 hover:underline" aria-label="Branches service details">Branches</a>
</li>
<!-- <li>
<a href="#" class="text-sky-800 hover:underline" aria-label="User Management service details">User Management</a>
</li>
<li>
<a href="#" class="text-sky-800 hover:underline" aria-label="Profit & Loss service details">Profit & Loss</a>
</li>
<li>
<a href="#" class="text-sky-800 hover:underline" aria-label="Custom Invoices service details">Custom Invoices</a>
</li> -->
</ul>
</div>
<!-- Follow Us -->
<div>
<h4 class="text-lg font-semibold text-sky-800 mb-4">Follow Us</h4>
<p class="mb-4">Stay connected with us on social media.</p>
<div class="mt-10 flex space-x-4">
<a
href="#"
target="_blank"
aria-label="Facebook"
class="w-12 h-12 bg-sky-100 text-sky-800 rounded-full flex items-center justify-center text-xl hover:bg-sky-800 hover:text-white transition"
>
<i class="bi bi-facebook"></i>
</a>
<a
href="#"
target="_blank"
aria-label="Instagram"
class="w-12 h-12 bg-sky-100 text-sky-800 rounded-full flex items-center justify-center text-xl hover:bg-sky-800 hover:text-white transition"
>
<i class="bi bi-instagram"></i>
</a>
<a
href="#"
target="_blank"
aria-label="LinkedIn"
class="w-12 h-12 bg-sky-100 text-sky-800 rounded-full flex items-center justify-center text-xl hover:bg-sky-800 hover:text-white transition"
>
<i class="bi bi-linkedin"></i>
</a>
<a
href="#"
target="_blank"
aria-label="YouTube"
class="w-12 h-12 bg-sky-100 text-sky-800 rounded-full flex items-center justify-center text-xl hover:bg-sky-800 hover:text-white transition"
>
<i class="bi bi-youtube"></i>
</a>
</div>
</div>
</div>
<hr class="border-t-2 border-gray-200 my-6" />
<p class="text-center text-gray-600 text-sm pb-6">
© 2025 Safeeyes Jeweler. All rights reserved.
</p>
</footer>
</body>
</html>
<?php /**PATH C:\xampp\htdocs\safeEye\resources\views/frontend/component/footer.blade.php ENDPATH**/ ?>