/* ============================================================
   assets/css/style.css  –  Club Forum Management System
   ============================================================ */

/* ---------- Base ---------- */
body {
    background-color: #f4f6fb;
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 0.95rem;
    color: #333;
}

/* ---------- Navbar ---------- */
.navbar-brand { font-size: 1.1rem; letter-spacing: 0.02em; }
.navbar .nav-link { font-weight: 500; }
.navbar .nav-link.active { font-weight: 700; }

/* ---------- Cards ---------- */
.card {
    border-radius: 12px;
}
.card-header {
    border-radius: 12px 12px 0 0 !important;
    font-size: 0.9rem;
}

/* ---------- Tables ---------- */
.table th { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; color: #666; }
.table td { font-size: 0.88rem; vertical-align: middle; }

/* ---------- Liked button state ---------- */
.like-btn.liked { background-color: #dc3545 !important; color: #fff !important; border-color: #dc3545 !important; }

/* ---------- Post card ---------- */
.post-card { transition: box-shadow 0.2s; }
.post-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.1) !important; }

/* ---------- Avatar circle ---------- */
.avatar-circle {
    width: 42px; height: 42px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content-center;
    font-weight: 700; font-size: 1rem;
    flex-shrink: 0;
}

/* ---------- Sidebar layout (optional) ---------- */
.sidebar {
    min-height: calc(100vh - 56px);
    background: #fff;
    border-right: 1px solid #e0e0e0;
    padding: 1.5rem 1rem;
}
.sidebar .nav-link { color: #444; border-radius: 8px; padding: 0.5rem 0.75rem; }
.sidebar .nav-link:hover, .sidebar .nav-link.active {
    background: #e8eaf6; color: #1a237e; font-weight: 600;
}

/* ---------- Site builder content ---------- */
.site-content img { max-width: 100%; border-radius: 8px; margin: 0.5rem 0; }
.site-content h1,.site-content h2,.site-content h3 { margin-top: 1.5rem; }

/* ---------- Badge overrides ---------- */
.badge { font-size: 0.75rem; font-weight: 600; }

/* ---------- Forms ---------- */
.form-control:focus, .form-select:focus {
    border-color: #1a237e;
    box-shadow: 0 0 0 0.2rem rgba(26,35,126,0.15);
}
.btn-primary { background: #1a237e; border-color: #1a237e; }
.btn-primary:hover { background: #283593; border-color: #283593; }

/* ---------- Pagination ---------- */
.page-link { color: #1a237e; }
.page-item.active .page-link { background: #1a237e; border-color: #1a237e; }

/* ---------- Alert refinement ---------- */
.alert { border-radius: 10px; }

/* ---------- Responsive tweaks ---------- */
@media (max-width: 576px) {
    .card-body { padding: 1rem !important; }
    h4 { font-size: 1.1rem; }
}

/* ---------- Calendar ---------- */
#calendar { min-height: 500px; }
.fc-event { cursor: pointer; }

/* ---------- Loading spinner ---------- */
.spinner-overlay {
    position: fixed; inset: 0; background: rgba(255,255,255,0.7);
    display: flex; align-items: center; justify-content-center; z-index: 9999;
}

/* ---------- Comment bubble ---------- */
.comment-bubble {
    background: #f0f4f8;
    border-radius: 12px;
    padding: 0.5rem 0.75rem;
}

/* ---------- Dashboard stat cards ---------- */
.stat-card {
    border-left: 4px solid transparent;
    transition: transform 0.15s;
}
.stat-card:hover { transform: translateY(-2px); }