/* ── Base ───────────────────────────────────── */
html { font-size: 14px; scroll-behavior: smooth; }
@media (min-width: 768px) { html { font-size: 16px; } }
body { font-family: 'Segoe UI', system-ui, -apple-system, sans-serif; }

/* ── Navbar ─────────────────────────────────── */
.navbar-brand { letter-spacing: -0.5px; }

/* ── Cards ──────────────────────────────────── */
.card { transition: box-shadow 0.2s ease; }
.card:hover { box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.1) !important; }

/* ── Forms ──────────────────────────────────── */
.form-control:focus, .form-select:focus {
    border-color: #28a745;
    box-shadow: 0 0 0 0.25rem rgba(40,167,69,0.15);
}
.btn-success { background-color: #28a745; border-color: #28a745; }
.btn-success:hover { background-color: #218838; border-color: #1e7e34; }

/* ── Sidebar hover ──────────────────────────── */
.nav-link:hover { color: #fff !important; background: rgba(255,255,255,0.1); border-radius: 6px; }

/* ── Progress bars ──────────────────────────── */
.progress { border-radius: 10px; }
.progress-bar { border-radius: 10px; }

/* ── Badges ─────────────────────────────────── */
.badge { font-weight: 500; }

/* ── Mobile bottom nav ──────────────────────── */
@media (max-width: 768px) {
    main { padding-bottom: 70px; }
}

/* ── Chat ───────────────────────────────────── */
.chat-bubble { max-width: 75%; border-radius: 18px; padding: 10px 14px; margin-bottom: 8px; }
.chat-bubble.sent { background: #28a745; color: white; margin-left: auto; border-bottom-right-radius: 4px; }
.chat-bubble.received { background: #f1f3f4; color: #212529; border-bottom-left-radius: 4px; }

/* ── Call screen ────────────────────────────── */
.call-screen { position: fixed; inset: 0; background: #1a1a2e; color: white; z-index: 9999; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.call-avatar { width: 100px; height: 100px; border-radius: 50%; background: rgba(255,255,255,0.1); display: flex; align-items: center; justify-content: center; font-size: 3rem; margin-bottom: 20px; }

/* ── Utility ────────────────────────────────── */
.cursor-pointer { cursor: pointer; }
.text-pink { color: #e83e8c; }
.rounded-4 { border-radius: 1rem !important; }
.rounded-5 { border-radius: 1.5rem !important; }