/*.mud-table-foot {
    display: table-footer-group !important;
}

.mym-center-text {
    text-align: center !important;
}

.mud-button-filled {
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 10%), 0 1px 2px -1px rgb(0 0 0 / 10%) !important;
    transition: box-shadow .15s ease, transform .1s ease !important;
}

.mud-button-filled:hover {
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -2px rgb(0 0 0 / 10%) !important;
}

.mud-dialog {
    box-shadow: 0 20px 25px -5px rgb(0 0 0 / 10%), 0 8px 10px -6px rgb(0 0 0 / 10%) !important;
    border-radius: var(--mud-default-borderradius) !important;
}*/

/* Scope mud-card margin only to page content, not inside the nav shell */
/*.mud-main-content .mud-card {
    margin-bottom: 12px !important;
}

.mud-table {
    margin-bottom: 12px !important;
    border-radius: var(--mud-default-borderradius) !important;
    overflow: hidden;
}*/

/* ── Premium table header ─────────────────────────────────── */
/*.mud-table-head {
    background: var(--mud-palette-surface) !important;
}

.mud-table-head .mud-table-cell {
    border-bottom: 2px solid var(--mud-palette-divider) !important;
}*/

/* Dense table padding */
/*.mud-table-dense * .mud-table-row .mud-table-cell {
    padding: 2px 4px;
}
.mud-table-dense * .mud-table-row .mud-table-cell:first-child {
    padding-inline-start: 8px;
}
.mud-table-dense * .mud-table-row .mud-table-cell:last-child {
    padding-inline-end: 8px;
}*/

/* ── Smooth row transitions ───────────────────────────────── */
/*.mud-table-row {
    transition: background-color .15s ease !important;
}

#blazor-error-ui {
    color: var(--mud-palette-drawer-text);
    background: var(--mud-palette-drawer-background);
}

.mud-overlay-dark {
    backdrop-filter: blur(4px);
}

.mud-card-header .mud-card-header-avatar {
    margin-inline-end: 10px !important;
}

.mud-table-toolbar {
    flex-wrap: wrap;
    margin-bottom: 12px !important;
    padding: 8px 16px !important;
}*/

/* Remove unneeded horizontal scrollbar in main and login */
/*.mud-tooltip.mud-tooltip-center-right:not([data-mudpopover-flip]),
.mud-tooltip.mud-tooltip-center-left[data-mudpopover-flip] {
    transform: translateX(0);
}*/

/* Scrollbar */
/*::-webkit-scrollbar {
    width: 4px;
    height: 0px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #c4c4c4;
    border-radius: 1px;
}

::-webkit-scrollbar-thumb:hover {
    background: #a6a6a6;
}

html, body * {
    scrollbar-width: thin;
    scrollbar-color: #c4c4c4 transparent;
}

.mym-nav-child {
    padding-left: 10px !important;
}

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px var(--mud-palette-surface) inset;
    -webkit-text-fill-color: var(--mud-palette-text-primary) !important;
}



.mud-dialog-fullscreen {
    overflow-y: auto;
}*/

/* ── Popover z-index fix: ensure menus open above the app bar ── */
/*.mud-popover-provider {
    z-index: 9999;
}

.mud-popover-open {
    z-index: var(--mud-zindex-popover) !important;
}

.user-menu-popover.mud-popover-open,
.lang-menu-popover.mud-popover-open {
    z-index: calc(var(--mud-zindex-popover) + 100) !important;
}

.mud-collapse-entering {
    animation-duration: .2s !important;
}*/

/* ── Premium expansion panel ──────────────────────────────── */
/*.mud-expand-panel {
    border-radius: var(--mud-default-borderradius) !important;
    overflow: hidden;
}*/

/* ── Pager polish ─────────────────────────────────────────── */
/*.mud-table-pagination {
    border-top: 1px solid var(--mud-palette-divider);
}*/
/* ═══════════════════════════════════════════════════════════════════════ */
/* MYM ERP Loading Screen — Clean & Performant                           */
/* Only uses transform / opacity animations for GPU compositing.         */
/* Theme-aware — colours injected via CSS custom properties by JS.       */
/* ═══════════════════════════════════════════════════════════════════════ */

#app-loading {
    --mym-load-primary: #3b82f6;
    --mym-load-secondary: #8b5cf6;
    --mym-load-bg: #f8fafc;
    --mym-load-text: #0f172a;
    --mym-load-text-dim: rgba(15,23,42,.4);
    --mym-load-card-bg: rgba(255,255,255,.82);
    --mym-load-card-border: rgba(0,0,0,.06);

    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--mym-load-bg);
    font-family: 'Inter', 'DM Sans', system-ui, -apple-system, sans-serif;
    overflow: hidden;
    transition: opacity .5s ease, transform .5s ease;
}

#app-loading.mym-load--exit {
    opacity: 0;
    transform: scale(1.02);
    pointer-events: none;
}

/* ── Soft gradient orbs (pre-blurred via radial-gradient, no filter) ── */
.mym-load-orb {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    will-change: transform;
}

.mym-load-orb--1 {
    width: 480px;
    height: 480px;
    top: -10%;
    right: -8%;
    background: radial-gradient(circle, var(--mym-load-primary) 0%, transparent 70%);
    opacity: .15;
    animation: mym-orb-float 14s ease-in-out infinite alternate;
}

.mym-load-orb--2 {
    width: 400px;
    height: 400px;
    bottom: -12%;
    left: -6%;
    background: radial-gradient(circle, var(--mym-load-secondary) 0%, transparent 70%);
    opacity: .12;
    animation: mym-orb-float 18s ease-in-out infinite alternate-reverse;
}

@keyframes mym-orb-float {
    0%   { transform: translate(0, 0) scale(1); }
    100% { transform: translate(30px, -20px) scale(1.08); }
}

/* ── Center card ─────────────────────────────────────────────────────── */
.mym-load-card {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 44px 56px 36px;
    border-radius: 24px;
    background: var(--mym-load-card-bg);
    border: 1px solid var(--mym-load-card-border);
    backdrop-filter: blur(20px) saturate(1.3);
    -webkit-backdrop-filter: blur(20px) saturate(1.3);
    box-shadow:
        0 1px 0 0 var(--mym-load-card-border),
        0 16px 40px -8px rgba(0,0,0,.1);
    animation: mym-card-in .7s cubic-bezier(.22,1,.36,1) both;
}

@keyframes mym-card-in {
    from { opacity: 0; transform: translateY(24px) scale(.97); }
}

/* ── Logo + spinner ring ─────────────────────────────────────────────── */
.mym-load-logo-wrap {
    position: relative;
    width: 96px;
    height: 96px;
    margin-bottom: 24px;
}

.mym-load-ring {
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 2.5px solid var(--mym-load-card-border);
    border-top-color: var(--mym-load-primary);
    border-right-color: var(--mym-load-secondary);
    animation: mym-ring-spin 1.4s linear infinite;
    will-change: transform;
}

@keyframes mym-ring-spin {
    to { transform: rotate(360deg); }
}

.mym-load-logo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 50%;
    animation: mym-logo-breathe 3s ease-in-out infinite alternate;
}

@keyframes mym-logo-breathe {
    from { transform: scale(1); opacity: .92; }
    to   { transform: scale(1.03); opacity: 1; }
}

/* ── Brand text ──────────────────────────────────────────────────────── */
.mym-load-brand {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 28px;
    animation: mym-fade-up .6s .3s ease both;
}

.mym-load-brand-mym {
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: .03em;
    background: linear-gradient(135deg, var(--mym-load-primary), var(--mym-load-secondary));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.mym-load-brand-erp {
    font-size: 1.25rem;
    font-weight: 600;
    letter-spacing: .1em;
    color: var(--mym-load-text-dim);
}

@keyframes mym-fade-up {
    from { opacity: 0; transform: translateY(10px); }
}

/* ── Progress bar ────────────────────────────────────────────────────── */
.mym-load-progress {
    width: 200px;
    height: 3px;
    border-radius: 3px;
    background: color-mix(in srgb, var(--mym-load-primary) 10%, transparent);
    overflow: hidden;
    margin-bottom: 16px;
    animation: mym-fade-up .5s .5s ease both;
}

.mym-load-progress-bar {
    height: 100%;
    width: 40%;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--mym-load-primary), var(--mym-load-secondary));
    animation: mym-progress-slide 1.6s ease-in-out infinite;
    will-change: transform;
}

@keyframes mym-progress-slide {
    0%   { transform: translateX(-100%); }
    50%  { transform: translateX(150%); }
    100% { transform: translateX(500%); }
}

/* ── Status text ─────────────────────────────────────────────────────── */
.mym-load-status {
    font-size: .75rem;
    font-weight: 500;
    color: var(--mym-load-text-dim);
    transition: opacity .25s ease;
    animation: mym-fade-up .5s .7s ease both;
}

/* ── Footer ──────────────────────────────────────────────────────────── */
.mym-load-footer {
    position: absolute;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%);
    font-size: .68rem;
    font-weight: 500;
    color: var(--mym-load-text-dim);
    letter-spacing: .04em;
    animation: mym-fade-up .5s .9s ease both;
}

/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width: 520px) {
    .mym-load-card {
        padding: 36px 28px 28px;
        border-radius: 18px;
    }
    .mym-load-logo-wrap {
        width: 72px;
        height: 72px;
    }
    .mym-load-brand-mym { font-size: 1.6rem; }
    .mym-load-brand-erp { font-size: 1rem; }
    .mym-load-progress { width: 160px; }
    .mym-load-orb--1 { width: 300px; height: 300px; }
    .mym-load-orb--2 { width: 260px; height: 260px; }
}