|
|
|
|
|
|
| body {
|
| min-height: 100vh;
|
| display: flex;
|
| flex-direction: column;
|
| }
|
|
|
| main {
|
| flex: 1;
|
| }
|
|
|
|
|
| .card {
|
| box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
| transition: transform 0.2s ease-in-out;
|
| }
|
|
|
| .card:hover {
|
| transform: translateY(-2px);
|
| }
|
|
|
|
|
| .stats-card {
|
| border-radius: 10px;
|
| border: none;
|
| background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
|
| }
|
|
|
| .stats-card .card-title {
|
| font-size: 0.9rem;
|
| text-transform: uppercase;
|
| letter-spacing: 0.5px;
|
| }
|
|
|
|
|
| .navbar {
|
| box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
| }
|
|
|
| .navbar-brand {
|
| font-weight: bold;
|
| letter-spacing: 0.5px;
|
| }
|
|
|
|
|
| .form-control:focus {
|
| border-color: #0d6efd;
|
| box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
|
| }
|
|
|
|
|
| .btn {
|
| border-radius: 5px;
|
| padding: 0.5rem 1.5rem;
|
| transition: all 0.2s ease-in-out;
|
| }
|
|
|
| .btn-primary {
|
| background: linear-gradient(135deg, #0d6efd 0%, #0a58ca 100%);
|
| border: none;
|
| }
|
|
|
| .btn-primary:hover {
|
| transform: translateY(-1px);
|
| box-shadow: 0 4px 8px rgba(13, 110, 253, 0.2);
|
| }
|
|
|
|
|
| .footer {
|
| background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
|
| margin-top: auto;
|
| }
|
|
|
|
|
| .chart-container {
|
| position: relative;
|
| height: 300px;
|
| width: 100%;
|
| }
|
|
|
|
|
| .badge {
|
| padding: 0.5em 1em;
|
| font-weight: 500;
|
| letter-spacing: 0.5px;
|
| }
|
|
|
|
|
| .list-group-numbered {
|
| counter-reset: section;
|
| }
|
|
|
| .list-group-numbered > .list-group-item {
|
| display: flex;
|
| align-items: center;
|
| }
|
|
|
| .list-group-numbered > .list-group-item::before {
|
| content: counter(section);
|
| counter-increment: section;
|
| background-color: #e9ecef;
|
| border-radius: 50%;
|
| width: 24px;
|
| height: 24px;
|
| display: flex;
|
| align-items: center;
|
| justify-content: center;
|
| margin-right: 1rem;
|
| font-size: 0.875rem;
|
| font-weight: 500;
|
| }
|
|
|
|
|
| .spinner-border-sm {
|
| width: 1rem;
|
| height: 1rem;
|
| border-width: 0.2em;
|
| }
|
|
|
|
|
| @media (max-width: 768px) {
|
| .card {
|
| margin-bottom: 1rem;
|
| }
|
|
|
| .btn {
|
| width: 100%;
|
| margin-bottom: 0.5rem;
|
| }
|
| }
|
|
|
