import React from 'react';

const AdminGallery = () => {
  return (
    <div className="max-w-6xl mx-auto px-4 py-16">
      <h2 className="text-3xl font-bold text-blue-900 mb-4">Admin - Gallery</h2>
      <p className="text-gray-600 mb-6">Manage gallery images and media files here.</p>

      {/* Example: Gallery cards */}
      <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6">
        {/* Replace with API dynamic mapping */}
        <div className="bg-gray-100 p-4 rounded-lg shadow">
          <img src="https://via.placeholder.com/300" alt="Gallery 1" className="rounded-md mb-2" />
          <p className="text-gray-700 font-medium">Project Image 1</p>
          <div className="mt-2 flex gap-2">
            <button className="bg-blue-600 text-white px-3 py-1 rounded-md">Edit</button>
            <button className="bg-red-600 text-white px-3 py-1 rounded-md">Delete</button>
          </div>
        </div>
      </div>
    </div>
  );
};

export default AdminGallery;
