*, ::after, ::before, html, body {
    font-family: 'Cairo', sans-serif !important;
}

html, body {
    background-color: #f8fafc;
}

/* Glassmorphism Appbar */
.glass-appbar {
    background: rgba(255, 255, 255, 0.75) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid rgba(255,255,255,0.3) !important;
}

.mud-theme-dark .glass-appbar {
    background: rgba(15, 23, 42, 0.75) !important;
    border-bottom: 1px solid rgba(255,255,255,0.05) !important;
}

/* Modern Hover Effects */
.mud-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

.mud-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1) !important;
}

.mud-table-row {
    transition: background-color 0.2s ease, transform 0.2s ease !important;
}

.mud-button {
    transition: all 0.2s ease !important;
    font-weight: 600 !important;
}

.mud-button:hover:not(.mud-disabled) {
    transform: translateY(-1px);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important;
}

/* Loading animations */
.loading-progress {
    position: relative;
    display: block;
    width: 8rem;
    height: 8rem;
    margin: 20vh auto 1rem auto;
}
.loading-progress circle {
    fill: none;
    stroke: #4338ca;
    stroke-width: 0.6rem;
    transform-origin: 50% 50%;
    transform: rotate(-90deg);
}
.loading-progress circle:last-child {
    stroke: #e2e8f0;
    stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
    transition: stroke-dasharray 0.05s ease-in-out;
}
.loading-progress-text {
    position: absolute;
    text-align: center;
    font-weight: bold;
    inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}
.loading-progress-text:after {
    content: var(--blazor-load-percentage-text, "Loading");
}

/* Fix RTL Dialog Close Button Overlap */
[dir="rtl"] .mud-dialog-title .mud-icon-button {
    right: auto !important;
    left: 8px !important;
}

[dir="rtl"] .mud-dialog-title {
    padding-right: 24px !important;
    padding-left: 48px !important;
}

/* Fix RTL MudBlazor Tab Badge Overlap */
[dir="rtl"] .mud-tab-badge {
    padding-right: 0 !important;
    padding-left: 18px !important;
}

[dir="rtl"] .mud-tab-badge .mud-badge-top.mud-badge-right {
    right: auto !important;
    left: 0 !important;
    transform: translate(-50%, -50%) !important;
}

[dir="rtl"] .mud-badge-root.mud-tab-badge {
    padding-right: 0 !important;
    padding-left: 18px !important;
}

[dir="rtl"] .mud-badge-root.mud-tab-badge .mud-badge-top.mud-badge-right {
    right: auto !important;
    left: 0 !important;
    transform: translate(-50%, -50%) !important;
}

@media print {
    /* Hide layout chrome, navigation, overlays, snackbars, popovers, and buttons specifically */
    .mud-layout, 
    .mud-drawer, 
    .mud-appbar, 
    .mud-dialog-actions, 
    .mud-dialog-close-button, 
    .mud-overlay, 
    .mud-popover-provider, 
    .mud-snackbar-container,
    button, 
    .mud-button,
    .mud-icon-button {
        display: none !important;
        visibility: hidden !important;
    }

    /* Force the body and HTML background to white and clear default margins */
    html, body {
        background-color: #ffffff !important;
        background: #ffffff !important;
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        height: auto !important;
    }

    /* Reset dialog outer boundaries to prevent clipping or page breaks */
    .mud-dialog-container {
        display: block !important;
        position: static !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        overflow: visible !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .mud-dialog, .mud-dialog-content {
        display: block !important;
        position: static !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        box-shadow: none !important;
        border: none !important;
        background: transparent !important;
        overflow: visible !important;
    }

    /* Format print area container */
    #print-area {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 20px !important; /* Give some breathing room on paper */
        box-shadow: none !important;
        border: none !important;
        background: #ffffff !important;
        direction: rtl !important;
        position: relative !important;
    }

    /* Force tables to keep normal table grid layout on print, overriding MudTable mobile view */
    .mud-table, .mud-table-container, table {
        display: table !important;
        width: 100% !important;
        border-collapse: collapse !important;
        margin-top: 15px !important;
        margin-bottom: 15px !important;
    }

    .mud-table-head, thead {
        display: table-header-group !important;
    }

    .mud-table-body, tbody {
        display: table-row-group !important;
    }

    .mud-table-row, tr {
        display: table-row !important;
    }

    .mud-table-cell, th, td {
        display: table-cell !important;
        padding: 8px 12px !important;
        border: 1px solid #cbd5e1 !important;
        text-align: right !important;
    }

    /* Disable mobile label prefixes of MudTable during print */
    .mud-table-cell:before, td:before {
        display: none !important;
        content: none !important;
    }

    /* Force background colors/papers in details view to print nicely */
    .mud-paper {
        box-shadow: none !important;
        border: 1px solid #cbd5e1 !important;
        background-color: #f8fafc !important;
    }
}