@font-face { font-family: 'Yekan Bakh'; src: url('/assets/fonts/YekanBakhFaNum03Light.a7dad26806a476ba.woff') format('woff'); font-weight: 300; font-display: swap; }
@font-face { font-family: 'Yekan Bakh'; src: url('/assets/fonts/YekanBakhFaNum04Regular.bca3a7fd526e490b.woff') format('woff'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Yekan Bakh'; src: url('/assets/fonts/YekanBakhFaNum05Medium.be5546e037d319ce.woff') format('woff'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Yekan Bakh'; src: url('/assets/fonts/YekanBakhFaNum06Bold.ff1230bd5f261449.woff') format('woff'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Yekan Bakh'; src: url('/assets/fonts/YekanBakhFaNum07Heavy.54fd2203af64a902.woff') format('woff'); font-weight: 800; font-display: swap; }

:root {
    color-scheme: light;
    --primary: #981f2b;
    --primary-deep: #68131f;
    --background: #f5f0e9;
    --surface: #fffaf4;
    --surface-soft: #f7efe7;
    --text-strong: #281b1d;
    --text: #4f4143;
    --text-muted: #89797b;
    --border: #e8ddd3;
    --success: #27704a;
    --warning: #966014;
    --danger: #a12e40;
    --rating-star: #d48a1d;
    --sidebar-start: #760f20;
    --sidebar-end: #260b11;
    --hero-start: #8f1b2b;
    --hero-mid: #5f101f;
    --hero-end: #2a0b12;
    --ritual-start: #9f2636;
    --ritual-mid: #4f101c;
    --ritual-end: #220b11;
    --verse-start: #7d1928;
    --verse-end: #3a0f18;
    --story-start: #981f2b;
    --story-end: #3f0a15;
    --sidebar-width: 17.5rem;
    --topbar-height: 5rem;
}

:root[data-theme='dark'] {
    color-scheme: dark;
    --primary: #d34a5d;
    --primary-deep: #8f2636;
    --background: #130f11;
    --surface: #1d1719;
    --surface-soft: #251d20;
    --text-strong: #fff7f2;
    --text: #d9cdd0;
    --text-muted: #9f9094;
    --border: #362a2e;
    --success: #73d19a;
    --warning: #efbd68;
    --danger: #ff8b99;
    --rating-star: #f2be55;
    --sidebar-start: #48121b;
    --sidebar-end: #12090c;
    --hero-start: #571522;
    --hero-mid: #321018;
    --hero-end: #160a0e;
    --ritual-start: #511722;
    --ritual-mid: #2a0e15;
    --ritual-end: #12090c;
    --verse-start: #571723;
    --verse-end: #240d13;
    --story-start: #5d1723;
    --story-end: #1d0b11;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--background); font-size: clamp(16px, .25vw + 15px, 18px); scroll-behavior: smooth; }

img {
    display: block;
    max-width: 100%;
    height: auto;
}

body {
    min-width: 320px;
    min-height: 100vh;
    margin: 0;
    color: var(--text);
    background: radial-gradient(circle at 6% 8%, color-mix(in srgb, var(--primary) 7%, transparent), transparent 24rem), var(--background);
    font-family: 'Yekan Bakh', sans-serif;
    font-size: 1rem;
    line-height: 1.65;
    transition: color .2s ease, background-color .2s ease;
}

button, input, textarea, select { color: inherit; font: inherit; font-size: max(.875rem, 14px); }
small { font-size: max(.8rem, 13px) !important; line-height: 1.65; }
input, textarea, select, audio { color-scheme: inherit; }
audio { accent-color: var(--primary); }
::selection { color: var(--text-strong); background: color-mix(in srgb, var(--primary) 22%, var(--surface)); }
a { color: var(--primary); }
h1:focus { outline: none; }

.placeholder-page {
    min-height: 25rem;
    padding: clamp(2rem, 6vw, 5rem);
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 2rem;
}

.placeholder-page > span { color: var(--primary); font-size: .76rem; }
.placeholder-page h1 { margin: .7rem 0 1rem; color: var(--text-strong); font-size: clamp(2rem, 5vw, 4rem); }
.placeholder-page p { max-width: 38rem; color: var(--text-muted); line-height: 2; }
.page-link { display: inline-flex; margin-top: 1rem; padding: .8rem 1.2rem; color: #fff; background: var(--primary); border-radius: .85rem; text-decoration: none; }

.valid.modified:not([type=checkbox]) { outline: 1px solid var(--success); }
.invalid { outline: 1px solid var(--danger); }
.validation-message { color: var(--danger); }

#blazor-error-ui {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    left: 1rem;
    z-index: 1000;
    display: none;
    padding: 1rem 1.2rem;
    color: #fff;
    background: #8f1b2b;
    border-radius: 1rem;
    box-shadow: 0 16px 40px rgb(30 4 9 / 28%);
}

#blazor-error-ui .reload { margin-right: .8rem; color: #fff; font-weight: 700; }
#blazor-error-ui .dismiss { position: absolute; top: .6rem; left: .8rem; cursor: pointer; }
.blazor-error-boundary { padding: 1rem; color: #fff; background: #8f1b2b; border-radius: 1rem; }
.blazor-error-boundary::after { content: 'خطایی در اجرای برنامه رخ داده است.'; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

@media (max-width: 700px) {
    input, textarea, select { font-size: 16px !important; }
}