/* ============================================================
   EduPortal - app.css (custom layer over Bootstrap 5)
   Optimized for phone / tablet / desktop
   ============================================================ */

body {
    background: #f3f5f9;
}

/* Brand */
.navbar-edu {
    background: #1e3a5f;
}
.navbar-edu .navbar-brand {
    font-weight: 700;
    letter-spacing: 0.3px;
}
.navbar-edu .nav-link,
.navbar-edu .btn-show-logout {
    color: rgba(255, 255, 255, 0.85);
}
.navbar-edu .nav-link:hover,
.navbar-edu .nav-link.active {
    color: #ffffff;
}

/* Cards */
.card {
    border: 0;
    border-radius: 0.9rem;
    box-shadow: 0 0.125rem 0.5rem rgba(16, 24, 40, 0.07);
}
.stat-card h2 {
    font-weight: 700;
    margin-bottom: 0.15rem;
}
.stat-card .text-muted {
    font-size: 0.85rem;
}
.stat-icon {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
}

/* Tables */
.table td,
.table th {
    vertical-align: middle;
}

/* Auth pages */
.auth-hero {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 12px;
    background:
        radial-gradient(1000px 500px at 10% -10%, rgba(37, 99, 235, 0.14), transparent),
        radial-gradient(800px 400px at 110% 110%, rgba(30, 58, 95, 0.16), transparent),
        #f3f5f9;
}
.auth-card {
    width: 100%;
    max-width: 460px;
}
.auth-logo {
    font-size: 1.6rem;
    font-weight: 700;
    color: #1e3a5f;
}

/* Footer */
.app-footer {
    color: #64748b;
    font-size: 0.875rem;
}

@media (max-width: 576px) {
    .stat-card h2 { font-size: 1.35rem; }
    main.container { padding-left: 12px; padding-right: 12px; }
}