html, body {
    font-family: 'Cairo', 'Montserrat', Helvetica, Arial, sans-serif;
    background: #F4F6F8;
    overflow-x: hidden;j,
}

:root {
    --mud-palette-black: #000000 !important;
    --mud-palette-white: #FFFFFF !important;
    --mud-palette-primary: #1B365D !important;
    --mud-palette-primary-rgb: 27,54,93 !important;
    --mud-palette-primary-text: #FFFFFF !important;
    --mud-palette-primary-darken: rgb(18,39,68) !important;
    --mud-palette-primary-lighten: rgb(47,82,133) !important;
    --mud-palette-primary-hover: rgba(27,54,93, 0.06) !important;
    --mud-palette-secondary: #D9A15D !important;
    --mud-palette-secondary-rgb: 217,161,93 !important;
    --mud-palette-secondary-text: #3B2A00 !important;
    --mud-palette-secondary-darken: rgb(184,129,64) !important;
    --mud-palette-secondary-lighten: rgb(232,188,130) !important;
    --mud-palette-secondary-hover: rgba(217,161,93, 0.06) !important;
    --mud-palette-tertiary: #2A9D8F !important;
    --mud-palette-tertiary-rgb: 42,157,143 !important;
    --mud-palette-tertiary-text: #FFFFFF !important;
    --mud-palette-tertiary-darken: rgb(25,128,116) !important;
    --mud-palette-tertiary-lighten: rgb(87,197,182) !important;
    --mud-palette-tertiary-hover: rgba(42,157,143, 0.06) !important;
    --mud-palette-info: #3D5A80 !important;
    --mud-palette-info-rgb: 61,90,128 !important;
    --mud-palette-info-text: #FFFFFF !important;
    --mud-palette-info-darken: rgb(45,70,102) !important;
    --mud-palette-info-lighten: rgb(107,143,214) !important;
    --mud-palette-info-hover: rgba(61,90,128, 0.06) !important;
    --mud-palette-success: #2A9D8F !important;
    --mud-palette-success-rgb: 42,157,143 !important;
    --mud-palette-success-text: #FFFFFF !important;
    --mud-palette-success-darken: rgb(25,128,116) !important;
    --mud-palette-success-lighten: rgb(87,197,182) !important;
    --mud-palette-success-hover: rgba(42,157,143, 0.06) !important;
    --mud-palette-warning: #FF9800 !important;
    --mud-palette-warning-rgb: 255,152,0 !important;
    --mud-palette-warning-text: #FFFFFF !important;
    --mud-palette-warning-darken: rgb(217,129,0) !important;
    --mud-palette-warning-lighten: rgb(255,167,38) !important;
    --mud-palette-warning-hover: rgba(255,152,0, 0.06) !important;
    --mud-palette-error: #F44336 !important;
    --mud-palette-error-rgb: 244,67,54 !important;
    --mud-palette-error-text: #FFFFFF !important;
    --mud-palette-error-darken: rgb(242,33,18) !important;
    --mud-palette-error-lighten: rgb(246,101,90) !important;
    --mud-palette-error-hover: rgba(244,67,54, 0.06) !important;
    --mud-palette-dark: #424242 !important;
    --mud-palette-dark-rgb: 66,66,66 !important;
    --mud-palette-dark-text: #FFFFFF !important;
    --mud-palette-dark-darken: rgb(47,47,47) !important;
    --mud-palette-dark-lighten: rgb(85,85,85) !important;
    --mud-palette-dark-hover: rgba(66,66,66, 0.06) !important;
    --mud-palette-text-primary: #424242 !important;
    --mud-palette-text-secondary: rgba(0,0,0, 0.54) !important;
    --mud-palette-text-disabled: rgba(0,0,0, 0.38) !important;
    --mud-palette-action-default: rgba(0,0,0, 0.54) !important;
    --mud-palette-action-default-hover: rgba(0,0,0, 0.06) !important;
    --mud-palette-action-disabled: rgba(0,0,0, 0.26) !important;
    --mud-palette-action-disabled-background: rgba(0,0,0, 0.12) !important;
    --mud-palette-surface: #FFFFFF !important;
    --mud-palette-background: #F4F6F8 !important;
    --mud-palette-background-grey: #EEF2F6 !important;
    --mud-palette-drawer-background: #1B365D !important;
    --mud-palette-drawer-text: #FFFFFF !important;
    --mud-palette-drawer-icon: #FFFFFF !important;
    --mud-palette-appbar-background: #FFFFFF !important;
    --mud-palette-appbar-text: #1B365D !important;
    --mud-palette-lines-default: rgba(0,0,0, 0.12) !important;
    --mud-palette-lines-inputs: #BDBDBD !important;
    --mud-palette-table-lines: rgba(224,224,224, 1) !important;
    --mud-palette-table-striped: rgba(0,0,0, 0.02) !important;
    --mud-palette-table-hover: rgba(0,0,0, 0.04) !important;
    --mud-palette-divider: #E0E0E0 !important;
    --mud-palette-divider-light: rgba(0,0,0, 0.8) !important;
    --mud-palette-grey-default: #9E9E9E !important;
    --mud-palette-grey-light: #BDBDBD !important;
    --mud-palette-grey-lighter: #E0E0E0 !important;
    --mud-palette-grey-dark: #757575 !important;
    --mud-palette-grey-darker: #616161 !important;
    --mud-palette-overlay-dark: rgba(33,33,33, 0.5) !important;
    --mud-palette-overlay-light: rgba(255,255,255, 0.5) !important;
    --mud-elevation-0: none !important;
    --mud-elevation-1: 0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12) !important;
    --mud-elevation-2: 0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12) !important;
    --mud-elevation-3: 0px 3px 3px -2px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 1px 8px 0px rgba(0,0,0,0.12) !important;
    --mud-elevation-4: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12) !important;
    --mud-elevation-5: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12) !important;
    --mud-elevation-6: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12) !important;
    --mud-elevation-7: 0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12) !important;
    --mud-elevation-8: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12) !important;
    --mud-elevation-9: 0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12) !important;
    --mud-elevation-10: 0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12) !important;
    --mud-elevation-11: 0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12) !important;
    --mud-elevation-12: 0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12) !important;
    --mud-elevation-13: 0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12) !important;
    --mud-elevation-14: 0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12) !important;
    --mud-elevation-15: 0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12) !important;
    --mud-elevation-16: 0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12) !important;
    --mud-elevation-17: 0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12) !important;
    --mud-elevation-18: 0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12) !important;
    --mud-elevation-19: 0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12) !important;
    --mud-elevation-20: 0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12) !important;
    --mud-elevation-21: 0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12) !important;
    --mud-elevation-22: 0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12) !important;
    --mud-elevation-23: 0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12) !important;
    --mud-elevation-24: 0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12) !important;
    --mud-elevation-25: 0 5px 5px -3px rgba(0,0,0,.06), 0 8px 10px 1px rgba(0,0,0,.042), 0 3px 14px 2px rgba(0,0,0,.036) !important;
    --mud-default-borderradius: 12px !important;
    --mud-drawer-width-left: 240px !important;
    --mud-drawer-width-right: 240px !important;
    --mud-drawer-width-mini-left: 56px !important;
    --mud-drawer-width-mini-right: 56px !important;
    --mud-appbar-min-height: 64px !important;
    --mud-typography-default-family: 'Cairo','Montserrat','Helvetica','Arial','sans-serif' !important;
    --mud-typography-default-size: .875rem !important;
    --mud-typography-default-weight: 400 !important;
    --mud-typography-default-lineheight: 1.43 !important;
    --mud-typography-default-letterspacing: .01071em !important;
    --mud-typography-h1-family: 'Cairo','Montserrat','Helvetica','Arial','sans-serif' !important;
    --mud-typography-h1-size: 6rem !important;
    --mud-typography-h1-weight: 300 !important;
    --mud-typography-h1-lineheight: 1.167 !important;
    --mud-typography-h1-letterspacing: -.01562em !important;
    --mud-typography-h2-family: 'Cairo','Montserrat','Helvetica','Arial','sans-serif' !important;
    --mud-typography-h2-size: 3.75rem !important;
    --mud-typography-h2-weight: 300 !important;
    --mud-typography-h2-lineheight: 1.2 !important;
    --mud-typography-h2-letterspacing: -.00833em !important;
    --mud-typography-h3-family: 'Cairo','Montserrat','Helvetica','Arial','sans-serif' !important;
    --mud-typography-h3-size: 3rem !important;
    --mud-typography-h3-weight: 400 !important;
    --mud-typography-h3-lineheight: 1.167 !important;
    --mud-typography-h3-letterspacing: 0 !important;
    --mud-typography-h4-family: 'Cairo','Montserrat','Helvetica','Arial','sans-serif' !important;
    --mud-typography-h4-size: 2.125rem !important;
    --mud-typography-h4-weight: 400 !important;
    --mud-typography-h4-lineheight: 1.235 !important;
    --mud-typography-h4-letterspacing: .00735em !important;
    --mud-typography-h5-family: 'Cairo','Montserrat','Helvetica','Arial','sans-serif' !important;
    --mud-typography-h5-size: 1.5rem !important;
    --mud-typography-h5-weight: 400 !important;
    --mud-typography-h5-lineheight: 1.334 !important;
    --mud-typography-h5-letterspacing: 0 !important;
    --mud-typography-h6-family: 'Cairo','Montserrat','Helvetica','Arial','sans-serif' !important;
    --mud-typography-h6-size: 1.25rem !important;
    --mud-typography-h6-weight: 400 !important;
    --mud-typography-h6-lineheight: 1.6 !important;
    --mud-typography-h6-letterspacing: .0075em !important;
    --mud-typography-subtitle1-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-subtitle1-size: 1rem !important;
    --mud-typography-subtitle1-weight: 400 !important;
    --mud-typography-subtitle1-lineheight: 1.75 !important;
    --mud-typography-subtitle1-letterspacing: .00938em !important;
    --mud-typography-subtitle2-family: 'Cairo','Montserrat','Helvetica','Arial','sans-serif' !important;
    --mud-typography-subtitle2-size: .875rem !important;
    --mud-typography-subtitle2-weight: 500 !important;
    --mud-typography-subtitle2-lineheight: 1.57 !important;
    --mud-typography-subtitle2-letterspacing: .00714em !important;
    --mud-typography-body1-family: 'Cairo','Montserrat','Helvetica','Arial','sans-serif' !important;
    --mud-typography-body1-size: 1rem !important;
    --mud-typography-body1-weight: 400 !important;
    --mud-typography-body1-lineheight: 1.5 !important;
    --mud-typography-body1-letterspacing: .00938em !important;
    --mud-typography-body2-family: 'Cairo','Montserrat','Helvetica','Arial','sans-serif' !important;
    --mud-typography-body2-size: .875rem !important;
    --mud-typography-body2-weight: 400 !important;
    --mud-typography-body2-lineheight: 1.43 !important;
    --mud-typography-body2-letterspacing: .01071em !important;
    --mud-typography-button-family: 'Cairo','Montserrat','Helvetica','Arial','sans-serif' !important;
    --mud-typography-button-size: .875rem !important;
    --mud-typography-button-weight: 500 !important;
    --mud-typography-button-lineheight: 1.75 !important;
    --mud-typography-button-letterspacing: .02857em !important;
    --mud-typography-caption-family: 'Cairo','Montserrat','Helvetica','Arial','sans-serif' !important;
    --mud-typography-caption-size: .75rem !important;
    --mud-typography-caption-weight: 400 !important;
    --mud-typography-caption-lineheight: 1.66 !important;
    --mud-typography-caption-letterspacing: .03333em !important;
    --mud-typography-overline-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-overline-size: .75rem !important;
    --mud-typography-overline-weight: 400 !important;
    --mud-typography-overline-lineheight: 2.66 !important;
    --mud-typography-overline-letterspacing: .08333em !important;
    --mud-zindex-drawer: 1100 !important;
    --mud-zindex-appbar: 1200 !important;
    --mud-zindex-dialog: 1300 !important;
    --mud-zindex-popover: 1400 !important;
    --mud-zindex-snackbar: 1500 !important;
    --mud-zindex-tooltip: 1600 !important;
}

html[dir="rtl"] .mud-nav-link,
html[dir="rtl"] .mud-nav-link-text {
    text-align: right;
}

.dash-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 28px 32px;
    margin-bottom: 28px;
    border-radius: 24px;
    color: #fff;
    background: linear-gradient(135deg, #1B365D 0%, #2F5285 55%, #D9A15D 100%);
    box-shadow: 0 18px 40px rgba(27, 54, 93, 0.28);
}

.dash-hero-kicker {
    font-size: .85rem;
    letter-spacing: .08em;
    opacity: .85;
    margin-bottom: 4px;
}

.dash-hero-title {
    color: #fff !important;
    font-weight: 700 !important;
    margin-bottom: 6px !important;
}

.dash-hero-desc {
    color: rgba(255,255,255,.9) !important;
    max-width: 640px;
}

.dash-hero-logo {
    width: 84px;
    height: 84px;
    object-fit: contain;
    background: rgba(255,255,255,.16);
    border-radius: 20px;
    padding: 10px;
}

.dash-section-title {
    font-weight: 700;
    color: #1B365D;
    margin: 4px 0 14px;
}

.dash-card {
    display: flex;
    align-items: center;
    gap: 16px;
    height: 100%;
    min-height: 112px;
    padding: 18px 20px;
    border-radius: 18px;
    cursor: pointer;
    background: #fff;
    border: 1px solid rgba(27, 54, 93, 0.08);
    box-shadow: 0 10px 28px rgba(48, 24, 28, 0.07);
    transition: transform .18s ease, box-shadow .18s ease;
}

.dash-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(48, 24, 28, 0.14);
}

.dash-card-icon {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dash-card-label {
    color: #7a6a62;
    font-size: .82rem;
    margin-bottom: 4px;
}

.dash-card-value {
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.15;
    color: #1B365D;
}

.dash-report {
    display: flex;
    align-items: center;
    gap: 14px;
    height: 100%;
    min-height: 88px;
    padding: 16px 18px;
    border-radius: 18px;
    cursor: pointer;
    background: #fff;
    border: 1px solid rgba(27, 54, 93, 0.08);
    box-shadow: 0 10px 28px rgba(48, 24, 28, 0.07);
    transition: transform .18s ease, box-shadow .18s ease;
}

.dash-report:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 36px rgba(48, 24, 28, 0.14);
}

.dash-report-icon {
    width: 36px;
    height: 36px;
}

.dash-report-title {
    font-weight: 700;
    color: #1B365D;
}

.dash-report-hint {
    font-size: .8rem;
    color: #8d7a72;
}

.dash-report-arrow {
    margin-inline-start: auto;
    opacity: .45;
}

html[dir="rtl"] .dash-report-arrow {
    transform: scaleX(-1);
}

.dash-chart {
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(45, 32, 24, 0.07);
}

@media (max-width: 600px) {
    .dash-hero {
        padding: 20px;
    }

    .dash-hero-logo {
        display: none;
    }
}

/* Unified layout: navy/gold, RTL-safe, responsive */
.app-topbar.mud-appbar {
    background: #ffffff !important;
    color: #1B365D !important;
    border-bottom: 1px solid #D7E0EA;
    box-shadow: 0 8px 24px rgba(27, 54, 93, 0.08) !important;
}

.app-topbar .mud-icon-button,
.app-topbar .mud-typography {
    color: #1B365D !important;
}

.app-topbar-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: min(42vw, 360px);
}

.app-drawer {
    background: #1B365D !important;
    color: #fff !important;
    max-width: min(280px, 86vw);
}

.app-drawer .mud-nav-link-text {
    white-space: normal !important;
    line-height: 1.35;
}

.app-drawer .mud-nav-link,
.app-drawer .mud-nav-link-text,
.app-drawer .mud-nav-group .mud-nav-link,
.app-drawer .mud-typography {
    color: rgba(255, 255, 255, 0.92) !important;
}

.app-drawer .mud-nav-link .mud-nav-link-icon,
.app-drawer .mud-nav-link .mud-icon-root {
    color: rgba(255, 255, 255, 0.9) !important;
}

.app-drawer .mud-nav-link.active:not(.mud-nav-link-disabled) {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.14) !important;
    border-inline-start: 3px solid #D9A15D;
}

.app-drawer .mud-card,
.app-drawer .mud-card-header {
    background: transparent !important;
    color: #fff !important;
}

.app-page {
    padding-bottom: 32px;
}

.page-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    padding: 18px 22px;
    margin-bottom: 18px;
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(135deg, #1B365D 0%, #2F5285 55%, #D9A15D 100%);
    box-shadow: 0 12px 28px rgba(27, 54, 93, 0.18);
}

.page-hero-title {
    color: #fff !important;
    font-weight: 700 !important;
    margin-bottom: 4px !important;
}

.page-hero-desc {
    color: rgba(255, 255, 255, 0.92) !important;
    margin-bottom: 0 !important;
}

.mud-table.mud-paper,
.mud-table-container {
    border-radius: 16px;
}

.mud-table-container {
    overflow-x: auto;
}

.mud-table-toolbar {
    flex-wrap: wrap !important;
    gap: 8px;
    row-gap: 8px;
}

.mud-table .mud-table-head .mud-table-cell {
    background: #F4F6F8;
    color: #1B365D;
    font-weight: 700;
    white-space: nowrap;
}

.mud-dialog {
    border-radius: 16px !important;
}

.mud-dialog .mud-dialog-content {
    max-height: 70vh;
    overflow: auto;
}

html[dir="rtl"] .mud-input-adorned-end .mud-input-slot,
html[dir="rtl"] .mud-input-adorned-end input {
    padding-left: 42px !important;
}

html[dir="rtl"] .mud-input-adorned-end .mud-input-adornment-end {
    margin-left: 0;
    margin-right: auto;
}

.mud-button-filled.mud-button-filled-primary {
    background-color: #1B365D !important;
}

.mud-button-filled.mud-button-filled-secondary {
    background-color: #D9A15D !important;
    color: #3B2A00 !important;
}

@media (max-width: 960px) {
    .page-hero,
    .dash-hero {
        padding: 16px 18px;
        border-radius: 16px;
    }
}

@media (max-width: 600px) {
    .app-topbar-title {
        font-size: 0.95rem !important;
        max-width: 36vw;
    }

    .app-page {
        padding-inline: 4px;
    }

    .page-hero,
    .dash-hero {
        padding: 14px 16px;
        margin-bottom: 14px;
    }

    .mud-dialog {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
        margin: 8px;
    }

    .mud-dialog .mud-dialog-content {
        max-height: 78vh;
        padding: 12px !important;
    }

    .mud-table-toolbar .mud-button-root {
        margin-top: 4px;
    }
}

@media print {
    .mud-drawer,
    .mud-appbar,
    .mud-table-toolbar,
    .mud-table-pagination,
    .mud-snackbar-provider,
    .page-hero,
    .dash-hero {
        display: none !important;
    }

    .mud-main-content {
        margin: 0 !important;
        padding: 0 !important;
    }

    .mud-table {
        box-shadow: none !important;
    }
}