/* =========================================
   EduPortal - Main Stylesheet
   Bootstrap 5 based, custom overrides
   ========================================= */

:root {
    --ep-primary:   #0d47a1;
    --ep-accent:    #FFD600;
    --ep-radius:    12px;
    --ep-shadow:    0 2px 16px rgba(0,0,0,0.08);
    --font-main:    'Poppins', sans-serif;
    --font-body:    'Inter', sans-serif;
}

/* ── Typography ── */
body {
    font-family: var(--font-body);
    background: #f8f9fa;
    color: #1a1a2e;
}

h1, h2, h3, h4, h5, .navbar-brand {
    font-family: var(--font-main);
}

/* ── Navbar ── */
.navbar {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}
.navbar-nav .nav-link {
    font-weight: 500;
    font-size: 0.9rem;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    transition: background 0.15s;
}
.navbar-dark .navbar-nav .nav-link:hover {
    background: rgba(255,255,255,0.12);
}

/* ── Cards ── */
.card {
    border-radius: var(--ep-radius) !important;
}
.hover-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.hover-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0,0,0,0.12) !important;
}

/* ── Buttons ── */
.btn {
    font-weight: 500;
    border-radius: 8px;
}
.btn-lg { border-radius: 10px; }

/* ── Hero ── */
.hero-section {
    position: relative;
    overflow: hidden;
}
.hero-section::before {
    content: '';
    position: absolute;
    width: 600px; height: 600px;
    border-radius: 50%;
    background: rgba(255,255,255,0.04);
    top: -200px; right: -100px;
    pointer-events: none;
}

/* ── Admission form steps ── */
.form-step { animation: fadeIn 0.3s ease; }
@keyframes fadeIn { from { opacity:0; transform:translateX(10px); } to { opacity:1; transform:none; } }

/* ── MCQ option cards ── */
.option-card {
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
    user-select: none;
}
.option-card:hover {
    border-color: #0d6efd !important;
    background: #f0f6ff;
}
.option-card.selected {
    border-color: #0d6efd !important;
    background: #ebf3ff;
}

/* ── Alerts ── */
.alert { border-radius: 10px; }

/* ── Tables ── */
.table th { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.5px; color: #6c757d; }

/* ── Badge soft variants (BS5.3 style) ── */
.bg-primary-subtle   { background-color: #cfe2ff !important; }
.bg-success-subtle   { background-color: #d1e7dd !important; }
.bg-warning-subtle   { background-color: #fff3cd !important; }
.bg-danger-subtle    { background-color: #f8d7da !important; }
.bg-info-subtle      { background-color: #cff4fc !important; }
.bg-secondary-subtle { background-color: #e2e3e5 !important; }

/* ── PDF viewer ── */
#pdfCanvas { max-width: 100%; display: block; margin: 0 auto; }

/* ── Chat ── */
#chatMessages::-webkit-scrollbar { width: 4px; }
#chatMessages::-webkit-scrollbar-track { background: transparent; }
#chatMessages::-webkit-scrollbar-thumb { background: #dee2e6; border-radius: 4px; }

/* ── Admin sidebar active ── */
.admin-sidebar .nav-link.active {
    background: rgba(255,255,255,0.12);
    color: #fff !important;
}

/* ── Responsive tweaks ── */
@media (max-width: 767px) {
    .hero-section { min-height: auto !important; padding: 3rem 0 !important; }
    .display-4 { font-size: 2rem; }
}

/* ── Utility ── */
.cursor-pointer { cursor: pointer; }
.rounded-4 { border-radius: var(--ep-radius) !important; }
.text-white-75 { color: rgba(255,255,255,0.75); }
.text-white-25 { color: rgba(255,255,255,0.25); }
.w-40 { width: 40%; }
