/* base.css */
* { 
    box-sizing: border-box; 
    margin: 0; 
    padding: 0; 
    font-family: 'Vazirmatn', sans-serif; 
}

body { 
    background: var(--bg-app); 
    color: var(--text-main); 
    direction: rtl; 
    display: flex; 
    height: 100vh; 
    overflow: hidden; 
}

/* =========================================
   اسکرولبار سفارشی (Custom Scrollbar)
========================================= */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--scrollbar-bg);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb {
    background: var(--scrollbar-thumb);
    border-radius: 4px;
    transition: var(--transition);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--scrollbar-thumb-hover);
}

/* فایرفاکس */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-bg);
}

/* حذف تاخیر لمس و هایلایت آبی پیش‌فرض مرورگر */
a, button, .menu-item, .tab-btn {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    transition: transform 0.1s ease, opacity 0.1s ease;
}

/* وقتی کاربر انگشتش را روی لینک یا دکمه می‌گذارد */
a:active, button:active, .menu-item:active, .tab-btn:active {
    transform: scale(0.96); /* کمی کوچک می‌شود */
    opacity: 0.7; /* کمی کمرنگ می‌شود */
}

/* --- PWA Mobile UX & Speed --- */
html, body {
    -webkit-tap-highlight-color: transparent; /* حذف هایلایت آبی/خاکستری پیش‌فرض کلیک */
    touch-action: manipulation; /* حذف تاخیر 300 میلی‌ثانیه‌ای تپ در موبایل */
    -webkit-touch-callout: none; /* غیرفعال کردن منوی طولانی لمس در iOS */
    user-select: none; /* غیرفعال کردن انتخاب متن */
    -webkit-user-select: none;
}

/* برگرداندن قابلیت انتخاب و تایپ برای اینپوت‌ها */
input, textarea {
    user-select: auto;
    -webkit-user-select: auto;
    -webkit-touch-callout: default;
}

/* استایل نوار لودینگ بالای صفحه */
#pwa-top-loader {
    position: fixed;
    top: 0; left: 0;
    height: 3px;
    background: var(--primary, #007bff);
    width: 0%;
    z-index: 99999;
    transition: width 0.2s ease, opacity 0.3s ease;
    pointer-events: none;
    box-shadow: 0 0 10px var(--primary, #007bff);
}
