/* =======================================================================
   mobile-fix.css — اصلاحاتِ نمایش در موبایل (نسخهٔ ۱.۱.۰)
   ----------------------------------------------------------------------
   این فایل کاملاً «افزودنی» است: هیچ قانونِ CSS در فایل‌هایِ استایلِ
   دیگر تغییر یا حذف نمی‌شود و هیچ جزئیاتی از رابطِ کاربری پاک
   نمی‌شود. این فایل پس از تمام فایل‌هایِ استایلِ سایت و پنل مدیریت
   بارگذاری می‌شود، پس در صورتِ تساویِ اختصاص، ترتیبِ بارگذاری هم
   در سمتِ ماست.
   ======================================================================= */

/* ۱) پنل مدیریت — جلوگیری از کشیده‌شدنِ افقیِ کلِ صفحه در گوشی
   کانتینرِ پنل (.admin-wrapper) یک فلکس‌باکس است و .main-content
   آیتمِ فلکسیِ آن. حداقلِ عرضِ خودکارِ فلکس‌آیتم (min-width:auto)
   کلِ ستون را حداقل به اندازهٔ min-contentِ محتوایش نگه می‌دارد
   (در داشبورد ۸۲۴px به دلیلِ جدول‌های پهن)، در نتیجه در گوشیِ
   عمودی کلِ صفحهٔ پنل افقی اسکرول می‌شود و همه‌چیز «به‌هم‌ریخته»
   نشان داده می‌شود. با min-width:0 ستون می‌تواند جمع شود؛ جدول‌های
   پهن همچنان داخل کارتِ خود (overflow-x:auto دقیقاً مثل قبل)
   به‌صورتِ افقی اسکرول می‌مانند و هیچ داده‌ای پاک نمی‌شود. */
.admin-wrapper > .main-content {
    min-width: 0;
}

/* ۲) منوی همبرگریِ تم‌های royal و noir — وقتی منو در گوشی باز
   می‌شود، تم‌ها padding و border-radius را صفر کرده‌اند (در حالتِ
   دسکاپ درست است) ولی در حالتِ پنلِ بازشده این یعنی لینک‌ها
   لبه‌به‌لکه و بدون گوشه‌ curvature هستند. این مقادیر فقط در
   عرضِ موبایل و فقط برای منوی بازشده بازگردانده می‌شوند (مقدارها
   همان مقدارهای پایهٔ پنل در style.css است: padding:10px و
   border-radius:17px). */
@media (max-width: 980px) {
    body.theme-royal #mainNav,
    body.theme-noir #mainNav {
        padding: 10px;
        border-radius: 17px;
    }
}

/* ۳) دکمهٔ «ورود» در هدرِ موبایل — style.css در عرض ≤۵۲۰px این دکمه
   را display:none می‌کند تا فضا ذخیره شود، در نتیجه کاربرِ وارد‌نشده
   در گوشی عمودی فقط «ساخت حساب» را می‌بیند و راهی برای ورود ندارد.
   قانونِ اصلی دست‌نخورده باقی می‌ماند و اینجا دکمه با اندازهٔ فشرده‌تر
   (هم‌تراز با دکمهٔ ساخت حساب) برگردانده می‌شود. این header-actions
   فلکس است و لوگو می‌تواند جمع شود (min-width:0 + ellipsis)، پس
   هر دو دکمه جا می‌گیرند. */
@media (max-width: 520px) {
    .header-actions .login-link {
        display: inline-flex;
        align-items: center;
        min-height: 36px;
        padding: 7px 10px;
        font-size: .75rem;
    }
    .header-actions .signup-link {
        padding: 7px 10px;
        min-height: 36px;
        font-size: .75rem;
    }
}