/* Custom CSS for Backup Monitor */ .service-card { transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out; } .service-card:hover { transform: translateY(-2px); box-shadow: 0 4px 8px rgba(0,0,0,0.1); } .status-success { color: #28a745; } .status-partial { color: #ffc107; } .status-failed { color: #dc3545; } .status-running { color: #007bff; } .status-unknown { color: #6c757d; } .navbar-brand { font-weight: bold; } .card-header { border-bottom: 2px solid #f8f9fa; } .service-card .card-body { min-height: 200px; } .btn-group-sm > .btn, .btn-sm { font-size: 0.8rem; } /* Loading spinner */ .spinner-border-sm { width: 1rem; height: 1rem; } /* Responsive adjustments */ @media (max-width: 768px) { .display-4 { font-size: 2rem; } .service-card .card-body { min-height: auto; } } /* Status indicators */ .status-indicator { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 8px; } .status-indicator.success { background-color: #28a745; } .status-indicator.warning { background-color: #ffc107; } .status-indicator.danger { background-color: #dc3545; } .status-indicator.info { background-color: #17a2b8; } .status-indicator.secondary { background-color: #6c757d; } /* Custom alert styles */ .alert-sm { padding: 0.25rem 0.5rem; font-size: 0.875rem; } /* Card hover effects */ .card { border: 1px solid rgba(0,0,0,.125); border-radius: 0.375rem; } .card:hover { border-color: rgba(0,123,255,.25); } /* Footer styling */ footer { margin-top: auto; } /* Utility classes */ .text-truncate-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .cursor-pointer { cursor: pointer; } /* Animation for refresh button */ .btn .fa-sync-alt { transition: transform 0.3s ease; } .btn:hover .fa-sync-alt { transform: rotate(180deg); } /* Dark mode support */ @media (prefers-color-scheme: dark) { .card { background-color: #2d3748; border-color: #4a5568; color: #e2e8f0; } .card-header { background-color: #4a5568; border-color: #718096; } .text-muted { color: #a0aec0 !important; } } /* Text contrast and visibility fixes */ .card { background-color: #ffffff !important; color: #212529 !important; } .card-header { background-color: #f8f9fa !important; color: #212529 !important; } .card-body { background-color: #ffffff !important; color: #212529 !important; } .card-footer { background-color: #f8f9fa !important; color: #212529 !important; } /* Ensure table text is visible */ .table { color: #212529 !important; } .table td, .table th { color: #212529 !important; } /* Service detail page text fixes */ .text-muted { color: #6c757d !important; } /* Alert text visibility */ .alert { color: #212529 !important; } .alert-success { background-color: #d4edda !important; border-color: #c3e6cb !important; color: #155724 !important; } .alert-warning { background-color: #fff3cd !important; border-color: #ffeaa7 !important; color: #856404 !important; } .alert-danger { background-color: #f8d7da !important; border-color: #f5c6cb !important; color: #721c24 !important; } .alert-info { background-color: #d1ecf1 !important; border-color: #bee5eb !important; color: #0c5460 !important; }