@font-face {
    font-family: 'Vazir-FD';
    src: url('/fonts/Vazir-FD.woff2') format('woff2'), url('/fonts/Vazir-FD.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

:root {
    --rz-text-font-family: 'Vazir-FD', Tahoma, sans-serif;
    --rz-success-dark: color-mix(in srgb, var(--rz-success), black 40%);
    --transition-easing: cubic-bezier(0.16, 1, 0.3, 1);
    --transition-ease-pop: cubic-bezier(0.34, 1.56, 0.64, 1);
    --transition-duration: 0.25s;
    --app-hi: rgb(255 255 255 / 0.35);
    --app-ao: rgb(0 0 0 / 0.18);
}

.rz-dark,
[data-theme="dark"] {
    --app-hi: rgb(255 255 255 / 0.14);
    --app-ao: rgb(0 0 0 / 0.55);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]):not(.rz-light) {
        --app-hi: rgb(255 255 255 / 0.14);
        --app-ao: rgb(0 0 0 / 0.55);
    }
}

html, body {
    font-family: var(--rz-text-font-family);
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
    overflow-x: hidden;
    direction: rtl;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

@media (prefers-reduced-motion: no-preference) {
    html {
        scroll-behavior: smooth;
    }
}

body {
    overscroll-behavior-y: none;
}

/* === حذف انیمیشن ورود سنگین برای جلوگیری از CLS === */
.dashboard-layout-wrapper {
    /* انیمیشن حذف شد تا پرش نداشته باشیم */
    opacity: 1;
    transform: none;
}

.layout-loading {
    opacity: 0 !important;
    visibility: hidden !important;
    overflow: hidden !important;
    position: fixed !important;
    inset: 0;
    z-index: -1;
}

.layout-ready {
    opacity: 1 !important;
    visibility: visible !important;
    transition: opacity 0.3s var(--transition-easing);
    overflow: auto !important;
    position: relative !important;
    z-index: auto;
}

/* === GPU Acceleration برای عناصر اصلی layout === */
.rz-layout {
    transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    contain: layout style;
}

.rz-body,
.layout-body {
    transform: translateZ(0);
    contain: layout style;
}

.app-header,
.app-sidebar,
.app-footer,
.rz-header,
.rz-sidebar,
.rz-footer {
    transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* انیمیشن sidebar ساده و سریع */
.app-sidebar,
.rz-sidebar {
    transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

/* === دکمه‌های ناوبری === */
.rz-navigation-item,
.rz-button,
.header-icon-btn,
.rz-menu-item,
[role="button"] {
    user-select: none !important;
    -webkit-user-select: none !important;
    -webkit-touch-callout: none;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent;
    outline: none;
}

    .rz-navigation-item:focus-visible,
    .rz-button:focus-visible,
    .header-icon-btn:focus-visible,
    .rz-menu-item:focus-visible,
    [role="button"]:focus-visible {
        outline: 2px solid var(--rz-primary);
        outline-offset: 2px;
        border-radius: 4px;
    }

.header-icon-btn {
    --hib-src: var(--rz-primary);
    --hib-tint: color-mix(in srgb, var(--hib-src), transparent 90%);
    --hib-tint-hover: color-mix(in srgb, var(--hib-src), transparent 82%);
    --hib-ring: color-mix(in srgb, var(--hib-src), transparent 78%);
    --hib-glow: color-mix(in srgb, var(--hib-src), transparent 62%);
    background-color: var(--hib-tint) !important;
    box-shadow: inset 0 0 0 1px var(--hib-ring), inset 0 1px 1px var(--app-hi), inset 0 -2px 3px var(--app-ao), 0 1px 2px rgb(0 0 0 / 0.08), 0 0 0 transparent;
    transition: background-color var(--transition-duration) var(--transition-easing), box-shadow var(--transition-duration) var(--transition-easing), transform var(--transition-duration) var(--transition-ease-pop);
}

    .header-icon-btn i,
    .header-icon-btn .rzi {
        color: var(--hib-src) !important;
        transition: transform var(--transition-duration) var(--transition-ease-pop);
    }

.header-icon-btn--info {
    --hib-src: var(--rz-info);
}

.header-icon-btn--success {
    --hib-src: var(--rz-success);
}

.header-icon-btn--warning {
    --hib-src: var(--rz-warning);
}

.header-icon-btn--danger {
    --hib-src: var(--rz-danger);
}

@media (hover: hover) {
    .header-icon-btn:hover {
        background-color: var(--hib-tint-hover) !important;
        transform: translate3d(0, -1px, 0) scale(1.04);
        box-shadow: inset 0 0 0 1px var(--hib-ring), inset 0 1px 1px var(--app-hi), inset 0 -2px 3px var(--app-ao), 0 6px 12px rgb(0 0 0 / 0.14), 0 0 14px var(--hib-glow);
    }

        .header-icon-btn:hover i,
        .header-icon-btn:hover .rzi {
            transform: translate3d(0, 0, 0) scale(1.08);
        }
}

.header-icon-btn:active {
    transform: translate3d(0, 0, 0) scale(0.97);
}

/* === Container === */
.styled-container {
    display: block;
    width: 100%;
    box-sizing: border-box;
    max-width: var(--container-max-width, 100%);
    padding: var(--container-padding, 0.5rem);
    margin: 0;
    background-color: transparent !important;
    contain: layout paint;
}

    .styled-container.centered {
        margin-inline: auto;
    }

    .styled-container > * {
        max-width: 100%;
        overflow-wrap: break-word;
    }

/* === کاهش repaint روی موبایل === */
@media (hover: none) {
    .rz-layout *,
    .rz-body * {
        -webkit-tap-highlight-color: transparent;
    }
}

/* === احترام به ترجیح کاربر برای کاهش حرکت === */
@media (prefers-reduced-motion: reduce) {
    .dashboard-layout-wrapper {
        animation: none;
        will-change: auto;
    }

    .layout-ready {
        transition: none;
    }

    .header-icon-btn,
    .header-icon-btn i,
    .header-icon-btn .rzi {
        transition: none;
    }

    .app-sidebar,
    .rz-sidebar {
        transition: none;
    }

    html {
        scroll-behavior: auto;
    }
}
