/* style.css — PPID PA Pasarwajo
   Custom Tailwind overrides + components */

/* Smooth scroll for anchor links */
html { scroll-behavior: smooth; }

/* Offset anchor for sticky navbar */
section[id] { scroll-margin-top: 90px; }

/* Hide scrollbar for carousel */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Card hover effect */
.card-hover {
    transition: box-shadow 0.25s ease, transform 0.25s ease, border-color 0.25s ease;
}
.card-hover:hover {
    box-shadow: 0 12px 32px rgba(99, 102, 241, 0.12);
    transform: translateY(-2px);
}

/* Button primary */
.btn-primary {
    @apply inline-flex items-center justify-center gap-2 px-5 py-2.5 bg-primary-600 text-white font-semibold rounded-xl hover:bg-primary-700 transition shadow-sm shadow-primary-200;
}

/* Button outline */
.btn-outline {
    @apply inline-flex items-center justify-center gap-2 px-5 py-2.5 bg-white text-primary-600 border-2 border-primary-200 font-semibold rounded-xl hover:border-primary-400 hover:bg-primary-50 transition;
}

/* Section heading */
.section-title {
    @apply text-2xl md:text-3xl font-bold text-slate-900 text-center;
}

/* Input base */
.input-base {
    @apply w-full px-4 py-2.5 rounded-lg border border-slate-300 focus:ring-2 focus:ring-primary-500 focus:border-primary-500 outline-none text-sm transition;
}

/* Error input */
.input-error {
    @apply border-rose-400 focus:ring-rose-500 focus:border-rose-500;
}

/* Label */
.label-base {
    @apply block text-sm font-medium text-slate-700 mb-1.5;
}

/* Carousel track */
.carousel-track {
    transition: transform 0.5s ease;
}

/* Fade in animation */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
.animate-fade-in-up {
    animation: fadeInUp 0.6s ease forwards;
}

/* Hero gradient overlay */
.hero-gradient {
    background: linear-gradient(135deg, #eef2ff 0%, #f8fafc 50%, #e0e7ff 100%);
}

/* Prose styling for content blocks */
.prose-content p { margin-bottom: 1rem; line-height: 1.75; }
.prose-content ul { margin: 1rem 0; padding-left: 1.5rem; list-style: disc; }
.prose-content li { margin: 0.5rem 0; }
.prose-content h3 { font-size: 1.25rem; font-weight: 700; margin: 1.5rem 0 0.5rem; color: #1e293b; }

/* Loading spinner */
.spinner {
    border: 3px solid rgba(99, 102, 241, 0.2);
    border-top-color: #6366f1;
    border-radius: 50%;
    width: 1.5rem;
    height: 1.5rem;
    animation: spin 0.6s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Table styling */
.table-base {
    @apply w-full text-sm text-left;
}
.table-base thead {
    @apply bg-slate-50 text-slate-600 uppercase text-xs;
}
.table-base th {
    @apply px-4 py-3 font-semibold;
}
.table-base td {
    @apply px-4 py-3 border-t border-slate-100;
}
.table-base tbody tr:hover {
    @apply bg-primary-50/40;
}

/* Navbar dropdown caret fix */
.nav-dropdown-link {
    @apply block px-4 py-2 text-slate-600 hover:bg-primary-50 hover:text-primary-600 text-sm transition;
}