:root { --primary-color: #0A2342; --secondary-color: #2CA58D; --background-color: #F0F4F8; --highlight-color: #FFD700; --text-color: #333; --heading-font: 'Poppins', sans-serif; --body-font: 'Lato', sans-serif; } body { font-family: var(--body-font); background-color: var(--background-color); color: var(--text-color); } h1, h2, h3, h4, h5, h6 { font-family: var(--heading-font); color: var(--primary-color); } .navbar-brand { font-family: var(--heading-font); font-weight: 700; color: #fff !important; } .nav-link { color: rgba(255,255,255,0.8); } .nav-link:hover { color: #fff; } .btn-primary { background-color: var(--secondary-color); border-color: var(--secondary-color); } .btn-primary:hover { background-color: #248b75; border-color: #248b75; } .table { background-color: #fff; } .table thead { background-color: var(--primary-color); color: #fff; } .page-header { padding: 2rem 0; margin-bottom: 2rem; } .container { max-width: 1200px; } .card { border: none; box-shadow: 0 0 20px rgba(0,0,0,0.05); } .form-label { font-weight: bold; } /* Dashboard specific styles */ .kpi-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; } .kpi-card { background-color: #fff; padding: 1.5rem; border-radius: 8px; text-align: center; box-shadow: 0 4px 12px rgba(0,0,0,0.08); } .kpi-card h6 { font-size: 0.9rem; color: var(--secondary-color); margin-bottom: 0.5rem; text-transform: uppercase; } .kpi-value { font-size: 2rem; font-weight: 700; color: var(--primary-color); margin-bottom: 0; }