/* Dashboard Global Styles */

.report-dashboard-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 1rem;
}

.dashboard-section-card {
    position: relative;
    overflow: hidden;
}

.dashboard-section-card::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(180deg, #667eea 0%, #764ba2 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.dashboard-section-card:hover::after {
    opacity: 1;
}

.status-badge-not-started {
    background-color: #6c757d;
    color: white;
}

.status-badge-in-progress {
    background-color: #ffc107;
    color: #333;
}

.status-badge-completed {
    background-color: #28a745;
    color: white;
}

.progress-bar-success {
    background: linear-gradient(90deg, #28a745 0%, #20c997 100%);
}

.progress-bar-warning {
    background: linear-gradient(90deg, #ffc107 0%, #ff9800 100%);
}

.progress-bar-info {
    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
}

.dashboard-empty-state {
    text-align: center;
    padding: 3rem 1rem;
    color: #6c757d;
}

.dashboard-empty-state i {
    font-size: 4rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

.dashboard-grid-item {
    animation: fadeInUp 0.3s ease-out;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.dashboard-grid-item:nth-child(1) { animation-delay: 0.05s; }
.dashboard-grid-item:nth-child(2) { animation-delay: 0.1s; }
.dashboard-grid-item:nth-child(3) { animation-delay: 0.15s; }
.dashboard-grid-item:nth-child(4) { animation-delay: 0.2s; }
.dashboard-grid-item:nth-child(5) { animation-delay: 0.25s; }
.dashboard-grid-item:nth-child(6) { animation-delay: 0.3s; }

@media print {
    .dashboard-section-card {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .dashboard-section-card:hover {
        transform: none;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    }
}
