/* ===== Custom Components for Financial Reports ===== */

/* Financial Cards */
.financial-summary-card {
    @apply bg-white dark:bg-gray-800 rounded-xl shadow-xl p-6 border-2 border-gray-100 dark:border-gray-700;
    transition: all 0.3s ease;
}

.financial-summary-card:hover {
    @apply transform scale-105 shadow-2xl;
}

.financial-summary-card.success {
    @apply border-green-200 dark:border-green-700;
}

.financial-summary-card.danger {
    @apply border-red-200 dark:border-red-700;
}

.financial-summary-card.primary {
    @apply border-blue-200 dark:border-blue-700;
}

.financial-summary-card.warning {
    @apply border-yellow-200 dark:border-yellow-700;
}

/* Financial Tables */
.financial-table {
    @apply w-full border-collapse rounded-xl overflow-hidden shadow-xl;
}

.financial-table th {
    @apply bg-gray-50 dark:bg-gray-700 text-gray-900 dark:text-gray-100 font-bold text-sm px-6 py-4 text-right border-b border-gray-200 dark:border-gray-600;
}

.financial-table td {
    @apply px-6 py-4 text-sm text-gray-700 dark:text-gray-300 text-right border-b border-gray-100 dark:border-gray-700;
}

.financial-table tbody tr:hover {
    @apply bg-gray-50 dark:bg-gray-700 transform translate-x-1;
    transition: all 0.2s ease;
}

.financial-table tbody tr:nth-child(even) {
    @apply bg-gray-25 dark:bg-gray-750;
}

/* Financial Export Buttons */
.export-btn {
    @apply px-6 py-3 rounded-lg font-semibold text-white shadow-lg transition-all duration-300;
}

.export-btn:hover {
    @apply transform -translate-y-1 shadow-xl;
}

.export-btn.excel {
    @apply bg-gradient-to-r from-green-500 to-green-600 hover:from-green-600 hover:to-green-700;
}

.export-btn.pdf {
    @apply bg-gradient-to-r from-red-500 to-red-600 hover:from-red-600 hover:to-red-700;
}

.export-btn.full {
    @apply bg-gradient-to-r from-purple-500 to-purple-600 hover:from-purple-600 hover:to-purple-700;
}

/* Enhanced Form Styling */
.form-section {
    @apply bg-white dark:bg-gray-800 rounded-xl shadow-xl p-6 border-2 border-gray-100 dark:border-gray-700;
}

.form-section h2 {
    @apply text-xl font-bold text-gray-800 dark:text-white mb-6;
}

/* Enhanced Stat Cards */
.stat-card {
    @apply bg-gradient-to-br from-white to-gray-50 dark:from-gray-800 dark:to-gray-700 rounded-xl shadow-xl p-6 border-2 border-gray-100 dark:border-gray-600;
    transition: all 0.3s ease;
}

.stat-card:hover {
    @apply transform scale-105 shadow-2xl;
}

.stat-card .stat-value {
    @apply text-3xl font-bold mb-2;
}

.stat-card .stat-label {
    @apply text-lg font-semibold text-gray-600 dark:text-gray-300 mb-1;
}

.stat-card .stat-description {
    @apply text-sm text-gray-500 dark:text-gray-400;
}

/* Category Badges */
.category-badge {
    @apply px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wide;
}

.category-badge.operation {
    @apply bg-blue-100 text-blue-800 dark:bg-blue-800 dark:text-blue-200;
}

.category-badge.maintenance {
    @apply bg-orange-100 text-orange-800 dark:bg-orange-800 dark:text-orange-200;
}

.category-badge.administrative {
    @apply bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-gray-200;
}

.category-badge.reservation {
    @apply bg-green-100 text-green-800 dark:bg-green-800 dark:text-green-200;
}

.category-badge.other {
    @apply bg-purple-100 text-purple-800 dark:bg-purple-800 dark:text-purple-200;
}

/* Enhanced Page Headers */
.page-header {
    @apply text-center bg-gradient-to-r from-blue-600 to-purple-700 text-white p-8 rounded-xl shadow-2xl mb-8;
}

.page-header h1 {
    @apply text-3xl font-bold mb-2;
}

.page-header p {
    @apply text-blue-100 text-lg;
}

/* Comparison Indicators */
.comparison-up {
    @apply text-green-600 dark:text-green-400;
}

.comparison-down {
    @apply text-red-600 dark:text-red-400;
}

.comparison-neutral {
    @apply text-gray-600 dark:text-gray-400;
}

/* Loading Animations */
.loading-shimmer {
    @apply animate-pulse bg-gradient-to-r from-gray-200 via-gray-300 to-gray-200 dark:from-gray-700 dark:via-gray-600 dark:to-gray-700;
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
}

@keyframes shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* Enhanced Scrollbars for All Elements */
* {
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 #f1f5f9;
}

.dark * {
    scrollbar-color: #6b7280 #374151;
}

*::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

*::-webkit-scrollbar-track {
    @apply bg-gray-100 dark:bg-gray-700 rounded-full;
}

*::-webkit-scrollbar-thumb {
    @apply bg-gray-300 dark:bg-gray-600 rounded-full;
}

*::-webkit-scrollbar-thumb:hover {
    @apply bg-gray-400 dark:bg-gray-500;
}

/* Enhanced Print Styles */
@media print {
    .no-print,
    .fi-sidebar,
    .fi-topbar,
    .fi-header-actions,
    button {
        display: none !important;
    }
    
    body {
        background: white !important;
        color: black !important;
        direction: rtl !important;
        font-size: 12pt !important;
    }
    
    .financial-card,
    .financial-table {
        border: 2px solid #000 !important;
        box-shadow: none !important;
        break-inside: avoid;
        margin-bottom: 20px !important;
    }
    
    h1, h2, h3 {
        color: #000 !important;
        font-weight: bold !important;
    }
}