/* ====================================================
   استایل‌های اصلی اپلیکیشن
   ==================================================== */
:root { --safe-bottom: 20px; --title-color: inherit; --line-height: 2.2; }
@supports (padding-bottom: env(safe-area-inset-bottom)) {
     :root { --safe-bottom: env(safe-area-inset-bottom); }
}

* { -webkit-tap-highlight-color: transparent; }
body { overflow: hidden; overscroll-behavior-y: none; background: #f1f5f9; margin: 0; padding: 0; }

.hidden { display: none !important; }
.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

#bottom-nav { padding-bottom: var(--safe-bottom); border-radius: 24px 24px 0 0; }
.nav-item { transition: all .3s ease; flex: 1; }
.nav-item.active i { color: #0d9488; transform: translateY(-2px); }
.nav-item.active span { color: #0d9488; font-weight: 800; }

.screen { display:none; }
.screen.active { display:flex;flex-direction:column; animation: fadeIn 0.4s ease forwards; }

@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes inlineSpin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

::-webkit-scrollbar{width:4px} ::-webkit-scrollbar-track{background:transparent} ::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:10px}
.glass{background:rgba(255,255,255,0.92);backdrop-filter:blur(16px)}
.theme-light{background-color:#fff;color:#334155}
.theme-sepia{background-color:#fcfaf8;color:#4a3f35}
.theme-dark{background-color:#0f172a;color:#cbd5e1}
.theme-dark .glass{background:rgba(30,41,59,0.92)}
.theme-sepia .glass{background:rgba(244,236,216,0.92)}
.reader-text{line-height:var(--line-height);user-select:text;text-align:justify}
.reader-text h2{color:var(--title-color)!important}
.fade-transform{transition:transform .4s cubic-bezier(.16,1,.3,1),opacity .4s ease}
.slide-up-hide{transform:translateY(-100%);opacity:0}
.slide-down-hide{transform:translateY(100%);opacity:0}

#reader-overlay, #toc-overlay {
    position: fixed; top: 0; bottom: 0; left: 0; right: 0;
    margin: 0 auto;
    z-index: 200; display: none; flex-direction: column;
    box-shadow: 0 0 40px rgba(0,0,0,0.08);
}
#reader-overlay.open, #toc-overlay.open { display: flex; animation: slideUp 0.3s ease; }
@keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }

.auth-input { transition: all 0.3s ease; }
.auth-input:focus { border-color: #0d9488; box-shadow: 0 0 0 4px rgba(13, 148, 136, 0.1); }

.h_iframe-aparat_embed_frame { position: relative; }
.h_iframe-aparat_embed_frame .ratio { display: block; width: 100%; height: auto; }
.h_iframe-aparat_embed_frame iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* WORDPRESS CONTENT STYLE & READING MODE */
.wp-content { text-align: justify; line-height: var(--line-height); }
.wp-content p { margin-bottom: 1.2em; }
.wp-content img { max-width: 100%; height: auto; border-radius: 16px; margin: 1.5em auto; display: block; box-shadow: 0 4px 12px rgba(0,0,0,0.05); }
.wp-content a { color: #0d9488; text-decoration: none; font-weight: bold; }
.wp-content h1, .wp-content h2, .wp-content h3 { font-weight: 900; margin-top: 1.5em; margin-bottom: 0.5em; color: var(--title-color, inherit) !important; }
.wp-content h2 { font-size: 1.25rem; }
.wp-content ul, .wp-content ol { margin-right: 1.5rem; margin-bottom: 1.2em; }
.wp-content li { margin-bottom: 0.5em; }
.wp-content blockquote { border-right: 4px solid #0d9488; padding-right: 1rem; color: #64748b; font-style: italic; background: rgba(13, 148, 136, 0.05); padding: 1rem; border-radius: 8px; margin-bottom: 1.2em; }

/* AUDIO FIXES */
.wp-content .mejs-container, .wp-content .mejs-controls, .wp-content .mejs-offscreen, .wp-content .mejs-time, .wp-content .wp-audio-shortcode { display: none !important; }

/* Theme Styles for Reading Mode */
.reading-mode { transition: background-color 0.4s ease, color 0.4s ease; }
.reading-mode.theme-dark { background-color: #0f172a !important; color: #cbd5e1 !important; }
.reading-mode.theme-dark header { background: rgba(30,41,59,0.92) !important; border-color: rgba(255,255,255,0.05) !important; }
.reading-mode.theme-dark h1, .reading-mode.theme-dark h2 { color: #f1f5f9 !important; }
.reading-mode.theme-dark button { background: rgba(255,255,255,0.1) !important; color: #cbd5e1 !important; }

.reading-mode.theme-sepia { background-color: #fcfaf8 !important; color: #4a3f35 !important; }
.reading-mode.theme-sepia header { background: rgba(244,236,216,0.92) !important; border-color: rgba(0,0,0,0.05) !important; }
.reading-mode.theme-sepia h1, .reading-mode.theme-sepia h2 { color: #4a3f35 !important; }
.reading-mode.theme-sepia button { background: rgba(0,0,0,0.05) !important; color: #4a3f35 !important; }

.reading-mode.theme-light { background-color: #ffffff !important; color: #334155 !important; }
.reading-mode.theme-light header { background: rgba(255,255,255,0.92) !important; border-color: rgba(0,0,0,0.05) !important; }
.reading-mode.theme-light h1, .reading-mode.theme-light h2 { color: #1f2937 !important; }
.reading-mode.theme-light button { background: #f9fafb !important; color: #6b7280 !important; }

/* Global Dark Mode */
body.global-dark { background: #0f172a; }
body.global-dark #app-wrapper { background: #0f172a; }
body.global-dark .screen { background-color: #0f172a; color: #cbd5e1; }
body.global-dark header { background: rgba(15,23,42,0.95) !important; border-color: rgba(255,255,255,0.07) !important; color: #cbd5e1; }
body.global-dark h1, body.global-dark h2, body.global-dark h3, body.global-dark h4 { color: #e2e8f0 !important; }
body.global-dark .bg-white { background-color: #1e293b !important; }
body.global-dark .bg-gray-50 { background-color: #0f172a !important; }
body.global-dark .bg-gray-100 { background-color: #1e293b !important; }
body.global-dark .bg-gray-200 { background-color: #334155 !important; }
body.global-dark .border-gray-100 { border-color: rgba(255,255,255,0.08) !important; }
body.global-dark .border-gray-200 { border-color: rgba(255,255,255,0.1) !important; }
body.global-dark .text-gray-800 { color: #e2e8f0 !important; }
body.global-dark .text-gray-700 { color: #cbd5e1 !important; }
body.global-dark .text-gray-600 { color: #94a3b8 !important; }
body.global-dark .text-gray-500 { color: #64748b !important; }
body.global-dark .text-gray-400 { color: #475569 !important; }
body.global-dark .shadow-sm { box-shadow: 0 1px 4px rgba(0,0,0,0.4) !important; }
body.global-dark #bottom-nav { background: #1e293b !important; border-color: rgba(255,255,255,0.07) !important; }
body.global-dark .nav-item span { color: #94a3b8; }
body.global-dark .nav-item i { color: #94a3b8; }
body.global-dark .nav-item.active i { color: #2dd4bf; }
body.global-dark .nav-item.active span { color: #2dd4bf; }
body.global-dark input, body.global-dark textarea, body.global-dark select { background: #1e293b !important; color: #e2e8f0 !important; border-color: rgba(255,255,255,0.1) !important; }
body.global-dark #loading-screen { background: #0f172a !important; }
body.global-dark #loading-screen h2 { color: #e2e8f0 !important; }
body.global-dark #loading-screen p { color: #94a3b8 !important; }
body.global-dark .notif-panel > div:last-child { background: #1e293b !important; }
.shortcut-icon { background:#f1f5f9; border:1px solid #e2e8f0; color:#64748b; transition: background 0.2s, color 0.2s, border-color 0.2s; }
.shortcut-icon:hover { background:#10b981; border-color:#059669; color:#fff; }
.shortcut-item:hover .shortcut-label { color:#059669; }
.book-card { transition: transform 0.2s; }
.book-card:hover { transform: translateY(-4px); }
.book-card:hover .book-cover-wrap { box-shadow: 0 12px 28px rgba(0,0,0,0.18); }
.book-card:hover .book-title { color: #059669; }