/* /Layout/MainLayout.razor.rz.scp.css */
/* Cleaned up unused styles. MudBlazor handles the layout. */
/* /Layout/NavMenu.razor.rz.scp.css */
/* General Nav Menu Layout container */
[b-r5jvring6r] .mud-nav-menu {
    padding: 12px 14px !important;
}

/* Base style for all Nav links */
[b-r5jvring6r] .mud-nav-link {
    font-family: 'Roboto', 'Inter', 'Helvetica', 'Arial', sans-serif !important;
    font-size: 0.85rem !important;
    font-weight: 500 !important;
    border-radius: 8px !important;
    margin: 3px 0 !important;
    padding: 8px 16px !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important; /* Fast, responsive, and natural transitions */
    color: var(--mud-palette-text-secondary, #475569) !important; /* Dynamic Slate text */
    border: none !important; /* Remove any border completely for a clean look */
    position: relative;
}

/* Hover effects for links */
[b-r5jvring6r] .mud-nav-link:hover {
    background-color: rgba(var(--mud-palette-primary-rgb), 0.04) !important; /* Soft translucent primary */
    color: var(--kb-primary) !important;
    transform: translateX(6px) !important; /* Premium micro-interaction: gentle slide to the right */
}

/* Eliminate default MudBlazor overlay, focus rings, outlines, and borders upon click/focus */
[b-r5jvring6r] .mud-nav-link::before {
    display: none !important; /* Remove the default MudBlazor overlay highlight on focus/hover */
}

[b-r5jvring6r] .mud-nav-link:focus,
[b-r5jvring6r] .mud-nav-link:active {
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
}

[b-r5jvring6r] .mud-nav-link:focus-visible {
    outline: 2px solid var(--kb-primary-light, #E8734A) !important;
    outline-offset: -2px !important;
    box-shadow: 0 0 0 3px var(--kb-focus-shadow, rgba(232, 115, 74, 0.2)) !important;
}

/* Icon transitions inside links */
[b-r5jvring6r] .mud-nav-link .mud-nav-link-icon {
    margin-right: 12px !important;
    color: var(--mud-palette-drawer-icon, #64748B) !important; /* Slate 500 */
    font-size: 1.22rem !important;
    transition: color 0.25s cubic-bezier(0.4, 0, 0.2, 1), transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Icon hover states */
[b-r5jvring6r] .mud-nav-link:hover .mud-nav-link-icon {
    color: var(--kb-primary) !important;
    transform: scale(1.1) rotate(3deg) !important; /* Premium micro-interaction: scale up and rotate slightly */
}

/* Active Nav Links styling (Selected route) */
[b-r5jvring6r] .mud-nav-link.active {
    background: var(--kb-primary-soft) !important; /* Translucent blue background matching main theme */
    color: var(--kb-primary) !important;
    font-weight: 600 !important;
    border: none !important; /* Completely clean, borderless active state */
    border-radius: 8px !important; /* Fully rounded uniform borders */
    backdrop-filter: blur(4px) !important; /* Frosted glass effect for visual depth */
    -webkit-backdrop-filter: blur(4px) !important;
    box-shadow: inset 0 0 0 1px rgba(var(--mud-palette-primary-rgb), 0.04) !important; /* Subtle inner border line for crisp depth */
}

/* Active Nav Links capsule indicator on the left-hand edge */
[b-r5jvring6r] .mud-nav-link.active::after {
    content: '';
    position: absolute;
    left: 0;
    top: 20%;
    height: 60%;
    width: 4px;
    background-color: var(--kb-primary) !important;
    border-radius: 0 4px 4px 0;
    box-shadow: 0 0 8px var(--kb-primary) !important; /* Glow/neon accent indicator */
}

/* Active Nav Links hover styling (Selected route under hover) */
[b-r5jvring6r] .mud-nav-link.active:hover {
    background: rgba(var(--mud-palette-primary-rgb), 0.12) !important; /* Slightly darker translucent primary to indicate interaction */
    color: var(--kb-primary) !important;
    box-shadow: inset 0 0 0 1px rgba(var(--mud-palette-primary-rgb), 0.08) !important; /* Slightly more pronounced inner border */
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
}

/* Ensure active state maintains its inset shadow and blur filter even during focus/click */
[b-r5jvring6r] .mud-nav-link.active:focus,
[b-r5jvring6r] .mud-nav-link.active:active {
    outline: none !important;
    border: none !important;
    box-shadow: inset 0 0 0 1px rgba(var(--mud-palette-primary-rgb), 0.04) !important;
    background: var(--kb-primary-soft) !important;
}

[b-r5jvring6r] .mud-nav-link.active:hover:focus,
[b-r5jvring6r] .mud-nav-link.active:hover:active {
    box-shadow: inset 0 0 0 1px rgba(var(--mud-palette-primary-rgb), 0.08) !important;
    background: rgba(var(--mud-palette-primary-rgb), 0.12) !important;
}

[b-r5jvring6r] .mud-nav-link.active:focus-visible,
[b-r5jvring6r] .mud-nav-link.active:hover:focus-visible {
    outline: 2px solid var(--kb-primary-light, #E8734A) !important;
    outline-offset: -2px !important;
    box-shadow: 0 0 0 3px var(--kb-focus-shadow, rgba(232, 115, 74, 0.2)) !important;
}

[b-r5jvring6r] .mud-nav-link.active .mud-nav-link-icon {
    color: var(--kb-primary) !important;
}

/* MudNavGroup section headers — styled as section titles */
[b-r5jvring6r] .mud-nav-group > .mud-nav-link {
    font-family: 'Roboto', 'Inter', 'Helvetica', 'Arial', sans-serif !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.8px !important;
    text-transform: uppercase !important;
    color: var(--mud-palette-text-secondary, #94A3B8) !important;
    opacity: 0.65 !important;
    margin-top: 6px !important;
    margin-bottom: 2px !important;
    border-radius: 8px !important;
}

/* Group header hover — subtle accent */
[b-r5jvring6r] .mud-nav-group > .mud-nav-link:hover {
    opacity: 0.85 !important;
    transform: none !important;
}

/* Prevent active capsule indicator on group headers */
[b-r5jvring6r] .mud-nav-group > .mud-nav-link.active::after {
    display: none !important;
}

/* First group after Dashboard gets less top margin */
[b-r5jvring6r] .mud-nav-group:first-of-type > .mud-nav-link {
    margin-top: 2px !important;
}

/* Pulsing premium real-time notification badge */
.kb-nav-badge[b-r5jvring6r] {
    background: #EF4444 !important; /* Premium crimson red */
    color: #FFFFFF !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    padding: 2px 8px !important;
    border-radius: 12px !important;
    min-width: 20px !important;
    text-align: center !important;
    box-shadow: 0 2px 5px rgba(239, 68, 68, 0.4) !important;
    display: inline-block !important;
    animation: badgePulse-b-r5jvring6r 2s infinite ease-in-out !important;
}

@keyframes badgePulse-b-r5jvring6r {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 2px 5px rgba(239, 68, 68, 0.4);
    }
    50% {
        transform: scale(1.08);
        box-shadow: 0 2px 10px rgba(239, 68, 68, 0.6);
    }
}
/* /Pages/Home.razor.rz.scp.css */
[b-jyv1qtxyfg] .dashboard-card {
    border: 1px solid var(--mud-palette-lines-default) !important;
    border-radius: var(--kb-border-radius) !important;
    background-color: var(--kb-surface) !important;
    box-shadow: var(--kb-shadow-premium) !important;
    transition: var(--kb-transition-smooth) !important;
}

[b-jyv1qtxyfg] .dashboard-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: var(--kb-shadow-hover) !important;
    border-color: var(--kb-border-hover) !important;
}

.kpi-icon-container[b-jyv1qtxyfg] {
    width: 52px;
    height: 52px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--kb-transition-smooth) !important;
}
/* /Shared/Components/ReceiptVoucher.razor.rz.scp.css */
.receipt-container[b-251ie4m81u] {
    display: flex;
    font-family: 'Roboto', 'Inter', sans-serif;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: var(--kb-border-radius, 12px);
    background-color: var(--mud-palette-surface);
    width: 100%;
    max-width: 820px;
    min-height: 290px;
    box-sizing: border-box;
    overflow: hidden;
    margin: 0 auto;
    box-shadow: var(--kb-shadow-premium) !important;
    transition: var(--kb-transition-smooth) !important;
}

.receipt-container:hover[b-251ie4m81u] {
    transform: translateY(-4px);
    box-shadow: var(--kb-shadow-hover) !important;
    border-color: var(--kb-border-hover) !important;
}

/* Talon / Souche (Left Part) */
.receipt-left[b-251ie4m81u] {
    width: 30%;
    padding: 16px;
    border-right: 2px dashed var(--mud-palette-lines-default);
    background-color: var(--mud-palette-background-grey);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
    transition: var(--kb-transition-smooth);
}

.talon-header[b-251ie4m81u] {
    font-size: 10px;
    font-weight: 700;
    color: var(--mud-palette-text-secondary);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.talon-body[b-251ie4m81u] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
    margin-bottom: 12px;
}

.talon-row[b-251ie4m81u] {
    display: flex;
    flex-direction: column;
}

.talon-label[b-251ie4m81u] {
    font-size: 9px;
    font-weight: 500;
    color: var(--mud-palette-text-secondary);
    opacity: 0.8;
    text-transform: uppercase;
}

.talon-value[b-251ie4m81u] {
    font-size: 12px;
    font-weight: 600;
    color: var(--mud-palette-text-primary);
    word-break: break-word;
}

.talon-amount[b-251ie4m81u] {
    font-size: 14px;
    font-weight: 700;
    color: var(--mud-palette-primary);
    font-family: 'Roboto Mono', monospace;
}

/* Corps du Reçu (Right Part) */
.receipt-right[b-251ie4m81u] {
    width: 70%;
    padding: 20px 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
    position: relative;
    transition: var(--kb-transition-smooth);
}

.receipt-header[b-251ie4m81u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    padding-bottom: 10px;
}

.brand-title[b-251ie4m81u] {
    font-size: 20px;
    font-weight: 800;
    color: var(--mud-palette-primary);
    letter-spacing: -0.02em;
}

.brand-subtitle[b-251ie4m81u] {
    font-size: 9px;
    color: var(--mud-palette-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 500;
}

.receipt-badge[b-251ie4m81u] {
    background-color: var(--kb-primary-soft);
    color: var(--mud-palette-primary);
    font-size: 11px;
    font-weight: 800;
    padding: 6px 12px;
    border-radius: 6px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.receipt-body[b-251ie4m81u] {
    margin-top: 14px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.receipt-line[b-251ie4m81u] {
    font-size: 13px;
    color: var(--mud-palette-text-secondary);
    line-height: 1.6;
}

.receipt-field-value[b-251ie4m81u] {
    font-weight: 600;
    color: var(--mud-palette-text-primary);
}

.receipt-field-italic[b-251ie4m81u] {
    font-style: italic;
    font-weight: 600;
    color: var(--mud-palette-primary);
    background-color: var(--mud-palette-background-grey);
    padding: 2px 6px;
    border-radius: 4px;
    border-bottom: 1px dashed var(--mud-palette-lines-default);
}

.receipt-footer[b-251ie4m81u] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: 16px;
}

.amount-box[b-251ie4m81u] {
    border: 2px solid var(--mud-palette-primary);
    background-color: var(--kb-primary-soft);
    padding: 8px 16px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.amount-box-label[b-251ie4m81u] {
    font-size: 8px;
    font-weight: 700;
    color: var(--mud-palette-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 2px;
}

.amount-box-value[b-251ie4m81u] {
    font-size: 16px;
    font-weight: 800;
    color: var(--mud-palette-primary);
    font-family: 'Roboto Mono', monospace;
}

.signature-box[b-251ie4m81u] {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 140px;
}

.signature-label[b-251ie4m81u] {
    font-size: 9px;
    font-weight: 600;
    color: var(--mud-palette-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 40px; /* Space for physical signature and stamp */
}

.signature-line[b-251ie4m81u] {
    width: 100%;
    border-top: 1px dashed var(--mud-palette-lines-default);
}

.receipt-actions[b-251ie4m81u] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 16px;
    max-width: 820px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.cut-line[b-251ie4m81u] {
    border-top: 1px dashed var(--mud-palette-lines-default);
    margin: 20px 0;
    display: none;
}

/* Print Styles */
@media print {
    @page { 
        size: A4 landscape !important; 
        margin: 10mm !important; 
    }
    
    body[b-251ie4m81u], html[b-251ie4m81u] {
        background-color: #FFFFFF !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    /* Hide navigations, appbars, and any no-print marked elements */
    .mud-appbar[b-251ie4m81u], .mud-drawer[b-251ie4m81u], .no-print[b-251ie4m81u], 
    .receipt-actions[b-251ie4m81u], header[b-251ie4m81u], nav[b-251ie4m81u], footer[b-251ie4m81u], aside[b-251ie4m81u] {
        display: none !important;
    }
    
    .print-area[b-251ie4m81u] {
        display: flex !important;
        border: 1px solid #000000 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        margin: 0 auto !important;
        page-break-inside: avoid !important;
    }
    
    .cut-line[b-251ie4m81u] {
        display: block !important;
        border-top: 1px dashed #000000 !important;
        margin: 15mm 0 !important;
    }
    
    .receipt-left[b-251ie4m81u] {
        border-right: 2px dashed #000000 !important;
        background-color: #FFFFFF !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    
    .amount-box[b-251ie4m81u] {
        border: 2px solid #000000 !important;
        background-color: #FFFFFF !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    
    .receipt-badge[b-251ie4m81u], .kb-status-chip[b-251ie4m81u] {
        border: 1px solid #000000 !important;
        background-color: #FFFFFF !important;
        color: #000000 !important;
    }
}