/* Custom Styles */
 
 body {
     font-family: 'Poppins', sans-serif;
     background-color: #111827;
     /* Dark background */
     color: #F3F4F6;
 }
 /* Gold gradient for text */
 
 .gold-gradient-text {
     background: linear-gradient(135deg, #FFD700, #DAA520);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
 }
 /* Gold gradient for backgrounds */
 
 .gold-gradient-bg {
     background: linear-gradient(135deg, #FFD700, #DAA520);
 }
 /* Custom scrollbar */
 
 ::-webkit-scrollbar {
     width: 8px;
 }
 
 ::-webkit-scrollbar-track {
     background: #1F2937;
 }
 
 ::-webkit-scrollbar-thumb {
     background: #DAA520;
     border-radius: 10px;
 }
 
 ::-webkit-scrollbar-thumb:hover {
     background: #FFD700;
 }
 /* Animation for page transitions */
 
 .page {
     display: none;
     animation: fadeIn 0.8s ease-in-out;
 }
 
 .page.active {
     display: block;
 }
 
 @keyframes fadeIn {
     from {
         opacity: 0;
         transform: translateY(20px);
     }
     to {
         opacity: 1;
         transform: translateY(0);
     }
 }
 /* Pulse animation for empty slots */
 
 @keyframes pulse {
     0%,
     100% {
         transform: scale(1);
         box-shadow: 0 0 0 0 rgba(255, 215, 0, 0.7);
     }
     50% {
         transform: scale(1.05);
         box-shadow: 0 0 0 10px rgba(255, 215, 0, 0);
     }
 }
 
 .pulse-animation {
     animation: pulse 2s infinite;
 }
 /* style.css */
 /*
Tailwind CSS provides the 'hidden' class and transform utilities,
but we'll add a few custom rules for the sidebar and main content.
*/
 
 .page {
     /* Ensures pages are initially hidden */
     display: none;
 }
 
 .page.active {
     /* Shows the active page */
     display: block;
 }
 /* Ensure main content shifts to the right on larger screens */
 
 @media (min-width: 768px) {
     main {
         margin-left: 16rem;
         /* 64px = 16rem, matching the sidebar width */
     }
     #admin-sidebar {
         transform: translateX(0);
     }
 }
 /* Gold Gradient Text and Background (for continuity with the user site) */
 
 .gold-gradient-text {
     background-image: linear-gradient(to right, #FFD700, #FFC000);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
 }
 
 .gold-gradient-bg {
     background-image: linear-gradient(to right, #FFD700, #FFC000);
 }