/* ==========================================
   BILBILIK LOGO OVERRIDE
   جایگزینی آیکون "ب" با لوگوی برند جدید
   ========================================== */

/* همه instances های logo-mark */
.logo-mark {
    /* مخفی کردن متن "ب" */
    color: transparent !important;
    font-size: 0 !important;
    /* پس‌زمینه = لوگوی جدید */
    background-image: url('https://bilbilack.com/wp-content/uploads/2026/05/cropped-logo-BB.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-color: transparent !important;
    /* حذف افکت‌های آیکون قدیمی */
    border: none !important;
    box-shadow: none !important;
}

/* اطمینان از سایز مناسب در header */
.site-header .logo-mark,
.header .logo-mark {
    width: 72px !important;
    height: 72px !important;
}

/* footer (پس‌زمینه تیره) */
.site-footer .logo-mark,
footer .logo-mark {
    width: 62px !important;
    height: 62px !important;
}

/* drawer موبایل (نسخه کوچک‌تر) */
.mobile-menu-drawer .logo-mark,
.bilbilik-mobile-drawer .logo-mark {
    width: 60px !important;
    height: 60px !important;
}

/* صفحه ورود/ثبت‌نام (نسخه بزرگ‌تر) */
.auth-page .logo-mark,
.auth-logo-big {
    color: transparent !important;
    font-size: 0 !important;
    background-image: url('https://bilbilack.com/wp-content/uploads/2026/05/cropped-logo-BB.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    width: 84px !important;
    height: 84px !important;
}

/* صفحه ۴۰۴ و سایر صفحات با logo بزرگ */
.error-page .logo-mark,
.brand-logo-large {
    width: 92px !important;
    height: 92px !important;
}

/* Hover effect لطیف */
.logo:hover .logo-mark {
    transform: scale(1.05);
    transition: transform 0.25s ease;
}

/* سایز موبایل */
@media (max-width: 768px) {
    .site-header .logo-mark,
    .header .logo-mark {
        width: 40px !important;
        height: 40px !important;
    }
}

@media (max-width: 480px) {
    .site-header .logo-mark,
    .header .logo-mark {
        width: 36px !important;
        height: 36px !important;
    }
}

/* اطمینان از اینکه favicon هم درست باشه — رو tab مرورگر */
/* این بخش CSS نیست، باید از Settings → Site Identity تنظیم بشه */