@font-face {
    font-family: Vazirmatn;
    src: url('../fonts/vazirmatn-regular.ttf') format('truetype');
    font-weight: 400;
    font-display: swap;
}

:root {
    color-scheme: dark;
    --background: #0a0b0f;
    --text: #f7f7f8;
    --text-soft: #d7d8de;
    --brand: #ff4c12;
    --shadow: 0 24px 70px rgba(0, 0, 0, .28);
}

* { box-sizing: border-box; }

html { background: var(--background); }

body {
    margin: 0;
    min-width: 320px;
    background: var(--background);
    color: var(--text);
    font-family: Vazirmatn, system-ui, sans-serif;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
}

.boot-screen {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #0a0b0f;
}

.boot-screen img { width: 112px; height: 112px; object-fit: contain; }
.boot-screen strong { margin-top: 12px; font-size: 1.25rem; letter-spacing: -.4px; }
.boot-screen span { color: var(--text-soft); font-size: .72rem; }
.boot-track { width: 150px; height: 4px; margin: 20px 0 10px; border-radius: 99px; background: #20232c; overflow: hidden; }
.boot-track i { display: block; width: 45%; height: 100%; background: var(--brand); border-radius: inherit; animation: boot 1.15s ease-in-out infinite alternate; }
@keyframes boot { from { transform: translateX(110%); } to { transform: translateX(-120%); } }

#blazor-error-ui {
    display: none;
    position: fixed;
    z-index: 1000;
    right: 14px;
    bottom: 14px;
    left: 14px;
    padding: 14px 18px;
    border-radius: 14px;
    background: #7e2314;
    color: white;
    box-shadow: var(--shadow);
}

#blazor-error-ui a { color: white; font-weight: 800; margin-right: 8px; }
#blazor-error-ui .dismiss { float: left; border: 0; background: transparent; font-size: 1.3rem; cursor: pointer; }
.blazor-error-boundary { padding: 18px; border-radius: 14px; background: #7e2314; }
.blazor-error-boundary::after { content: 'مشکلی در نمایش این بخش پیش آمد.'; }