/**
 * DECTO — App Parity Layer
 * هم‌سان‌سازی کامل ظاهر سایت با اپلیکیشن فلاتر دکتو.
 * منبع: mobile/decto_app/lib/core/theme/ (decto_colors, decto_palette,
 * decto_typography, decto_organic, decto_spacing)
 * این فایل آخرین لایه CSS است و فقط توکن‌ها و کروم اصلی را بازنویسی می‌کند.
 * صفحات ورود/لندینگ و ادیتور پست مستثنا هستند.
 */

/* ═══════════ 1) توکن‌ها — پالت دقیق اپ (لایت) ═══════════ */
:root,
[data-theme="light"] {
    /* بوم و سطح‌ها — decto_colors.dart */
    --bn-cream: #F5F2EB;            /* canvas / ivoryPaper */
    --bn-cream-2: #F3EFE6;          /* ivorySilk */
    --bn-ivory: #FFFCF8;            /* surfaceRaised */
    --bn-surface: #FFFCF8;
    --bn-surface-2: #F5F2EB;
    --bn-white: #FFFEFE;            /* warmWhite */

    /* سبز برند */
    --bn-green: #1A3D36;            /* brandGreenDeep — primary */
    --bn-green-deep: #142824;       /* deepTeal / ink */
    --bn-green-mid: #355944;        /* brandGreenMid */
    --bn-green-light: #3D6B61;
    --bn-green-soft: rgba(26, 61, 54, 0.10);
    --bn-green-glow: rgba(26, 61, 54, 0.16);

    /* طلایی شامپاینی */
    --bn-gold: #C9A66B;             /* brandGold / brass */
    --bn-gold-light: #E8D4A8;       /* brandGoldLight */
    --bn-gold-soft: rgba(201, 166, 107, 0.14);

    /* متن */
    --bn-text: #142824;             /* textPrimary */
    --bn-text-2: #556862;           /* textSecondary */
    --bn-text-3: #6F7A74;           /* textMuted */
    --bn-text-muted: #6F7A74;

    /* حاشیه و خطوط */
    --bn-border: rgba(26, 61, 54, 0.10);
    --bn-border-soft: rgba(26, 61, 54, 0.05);
    --bn-mist: #E8E2D8;

    /* وضعیت */
    --bn-success: #6FA67A;
    --bn-danger: #A95F5F;

    /* گرادیان‌های اپ */
    --bn-gradient-brand: linear-gradient(135deg, #1A3D36 0%, #274842 55%, #355944 100%);
    --bn-gradient-gold: linear-gradient(135deg, #C9A66B, #E8D4A8);
    --bn-gradient-ring: linear-gradient(145deg, #3F6D5A, #C7A86E);   /* avatarRingGradient */
    --bn-gradient-surface: linear-gradient(180deg, #F7F4EE 0%, #F5F2EB 55%, #F0EBE0 100%);

    /* شعاع‌ها — decto_organic.dart */
    --bn-radius-sm: 18px;
    --bn-radius: 24px;
    --bn-radius-lg: 32px;
    --bn-radius-xl: 40px;
    --bn-radius-btn: 22px;
    --bn-radius-input: 22px;

    /* ناوبری اپ */
    --bn-bottom-h: 68px;            /* DectoAnimatedNavBar height */
    --bn-nav-h: 60px;

    /* سایه‌های نرم لایه‌ای اپ */
    --bn-shadow: 0 4px 18px rgba(20, 40, 36, 0.06), 0 1px 3px rgba(201, 166, 107, 0.05);
    --bn-shadow-md: 0 8px 28px rgba(20, 40, 36, 0.08), 0 2px 6px rgba(201, 166, 107, 0.06);
    --bn-shadow-lg: 0 16px 44px rgba(20, 40, 36, 0.12), 0 4px 12px rgba(201, 166, 107, 0.07);
}

/* ═══════════ 2) توکن‌ها — پالت تیره اپ ═══════════ */
[data-theme="dark"] {
    --bn-cream: #161F1C;            /* dark canvas */
    --bn-cream-2: #1D2825;          /* dark ivory */
    --bn-ivory: #212C28;            /* dark surface */
    --bn-surface: #212C28;
    --bn-surface-2: #1D2825;
    --bn-white: #26312E;            /* dark input fill */

    --bn-green: #C9A66B;            /* در تم تیره primary → طلایی (مثل اپ) */
    --bn-green-deep: #E8D4A8;
    --bn-green-mid: #C9A66B;
    --bn-green-light: #E8D4A8;
    --bn-green-soft: rgba(201, 166, 107, 0.12);
    --bn-green-glow: rgba(201, 166, 107, 0.18);

    --bn-gold: #C9A66B;
    --bn-gold-light: #E8D4A8;
    --bn-gold-soft: rgba(201, 166, 107, 0.16);

    --bn-text: #F8FCFA;
    --bn-text-2: #E2EBE7;
    --bn-text-3: #B8C5BF;
    --bn-text-muted: #B8C5BF;

    --bn-border: rgba(232, 212, 168, 0.14);
    --bn-border-soft: rgba(232, 212, 168, 0.07);
    --bn-mist: #35433E;

    --bn-gradient-brand: linear-gradient(135deg, #283833 0%, #212C28 100%);
    --bn-gradient-surface: linear-gradient(180deg, #1D2825 0%, #161F1C 100%);

    --bn-shadow: 0 4px 18px rgba(0, 0, 0, 0.32);
    --bn-shadow-md: 0 8px 28px rgba(0, 0, 0, 0.4);
    --bn-shadow-lg: 0 16px 44px rgba(0, 0, 0, 0.5);
}

/* ═══════════ 3) تایپوگرافی — وزن‌های سنگین اپ ═══════════ */
body {
    background: var(--bn-gradient-surface) fixed, var(--bn-cream);
    color: var(--bn-text);
    line-height: 1.45;
}

h1, h2, h3, .bn-heading, .section-title, .page-title {
    font-weight: 900 !important;
    letter-spacing: -0.02em;
    color: var(--bn-text);
}

h4, h5, h6, .card-title {
    font-weight: 800 !important;
    letter-spacing: -0.01em;
}

/* ═══════════ 4) ناوبری پایین — DectoAnimatedNavBar ═══════════ */
body:not(.auth-page):not(.index-page) .bottom-nav {
    height: var(--bn-bottom-h);
    background: var(--bn-cream-2);
    border-top: 1px solid rgba(26, 61, 54, 0.07);
    box-shadow: none;
    backdrop-filter: none;
}

[data-theme="dark"] body:not(.auth-page):not(.index-page) .bottom-nav,
body[data-theme="dark"]:not(.auth-page):not(.index-page) .bottom-nav {
    background: #1D2825;
    border-top-color: rgba(232, 212, 168, 0.09);
}

body:not(.auth-page):not(.index-page) .bottom-nav-inner {
    height: 100%;
    align-items: center;
    max-width: 560px;
    margin: 0 auto;
}

body:not(.auth-page):not(.index-page) .bottom-nav-item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 7px 12px;
    border-radius: 20px;
    color: var(--bn-text-3);
    transition: color .22s cubic-bezier(.4,0,.2,1), background .22s cubic-bezier(.4,0,.2,1), transform .22s cubic-bezier(.34,1.3,.64,1);
}

body:not(.auth-page):not(.index-page) .bottom-nav-item svg,
body:not(.auth-page):not(.index-page) .bottom-nav-item i {
    width: 24px;
    height: 24px;
    font-size: 22px;
    transition: transform .22s cubic-bezier(.34,1.3,.64,1);
}

body:not(.auth-page):not(.index-page) .bottom-nav-item span {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0;
}

/* حالت فعال — pill سبز ۱۰٪ مثل اپ */
body:not(.auth-page):not(.index-page) .bottom-nav-item.active,
body:not(.auth-page):not(.index-page) .bottom-nav-item.is-active,
body:not(.auth-page):not(.index-page) .bottom-nav-item[aria-current="page"] {
    color: var(--bn-green);
    background: var(--bn-green-soft);
}

body:not(.auth-page):not(.index-page) .bottom-nav-item.active span,
body:not(.auth-page):not(.index-page) .bottom-nav-item.is-active span,
body:not(.auth-page):not(.index-page) .bottom-nav-item[aria-current="page"] span {
    font-weight: 800;
}

body:not(.auth-page):not(.index-page) .bottom-nav-item.active svg,
body:not(.auth-page):not(.index-page) .bottom-nav-item.active i,
body:not(.auth-page):not(.index-page) .bottom-nav-item.is-active svg,
body:not(.auth-page):not(.index-page) .bottom-nav-item.is-active i {
    transform: scale(1.1);
}

/* تب وسط — هاله طلایی مثل تب AI اپ */
body:not(.auth-page):not(.index-page) .bottom-nav-item--primary {
    color: var(--bn-green);
}

body:not(.auth-page):not(.index-page) .bottom-nav-item--primary::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 50%;
    transform: translateX(-50%);
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(201, 166, 107, 0.28), transparent 70%);
    animation: bnAiPulse 2.6s ease-in-out infinite;
    pointer-events: none;
}

@keyframes bnAiPulse {
    0%, 100% { opacity: .55; transform: translateX(-50%) scale(1); }
    50% { opacity: 1; transform: translateX(-50%) scale(1.18); }
}

@media (prefers-reduced-motion: reduce) {
    body:not(.auth-page):not(.index-page) .bottom-nav-item--primary::before { animation: none; }
}

.bn-bottom-nav-spacer { height: calc(var(--bn-bottom-h) + env(safe-area-inset-bottom, 0px)); }

/* ═══════════ 5) نوار بالا — DectoLuxAppBar ═══════════ */
body:not(.auth-page):not(.index-page) .navbar,
body:not(.auth-page):not(.index-page) .navbar--premium {
    background: var(--bn-cream-2);
    border-bottom: 1px solid rgba(26, 61, 54, 0.06);
    box-shadow: none;
    backdrop-filter: none;
}

[data-theme="dark"] body:not(.auth-page):not(.index-page) .navbar,
[data-theme="dark"] body:not(.auth-page):not(.index-page) .navbar--premium {
    background: #1D2825;
    border-bottom-color: rgba(232, 212, 168, 0.08);
}

body:not(.auth-page):not(.index-page) .navbar .nav-link {
    font-weight: 800;
    color: var(--bn-text-2);
    border-radius: 16px;
}

body:not(.auth-page):not(.index-page) .navbar .nav-link:hover,
body:not(.auth-page):not(.index-page) .navbar .nav-link.active {
    color: var(--bn-green);
    background: var(--bn-green-soft);
}

body:not(.auth-page):not(.index-page) .btn-icon {
    border-radius: 16px;
    color: var(--bn-text-2);
}

body:not(.auth-page):not(.index-page) .btn-icon:hover {
    color: var(--bn-green);
    background: var(--bn-green-soft);
}

/* ═══════════ 6) دکمه‌ها — PrimaryButton اپ ═══════════ */
body:not(.auth-page):not(.index-page) .btn-primary,
body:not(.auth-page):not(.index-page) .btn.btn-primary {
    background: var(--bn-gradient-brand);
    border: none;
    border-radius: var(--bn-radius-btn);
    font-weight: 900;
    color: #fff;
    box-shadow: 0 6px 18px rgba(26, 61, 54, 0.22), 0 2px 6px rgba(201, 166, 107, 0.14);
    transition: transform .18s cubic-bezier(.34,1.3,.64,1), box-shadow .18s ease;
}

[data-theme="dark"] body:not(.auth-page):not(.index-page) .btn-primary,
[data-theme="dark"] body:not(.auth-page):not(.index-page) .btn.btn-primary {
    background: linear-gradient(135deg, #C9A66B, #A8844A);
    color: #142824;
}

body:not(.auth-page):not(.index-page) .btn-primary:active {
    transform: scale(0.96);
}

body:not(.auth-page):not(.index-page) .btn-outline,
body:not(.auth-page):not(.index-page) .btn.btn-outline {
    border: 1.2px solid rgba(26, 61, 54, 0.18);
    border-radius: var(--bn-radius-btn);
    font-weight: 800;
    color: var(--bn-green);
    background: transparent;
}

[data-theme="dark"] body:not(.auth-page):not(.index-page) .btn-outline,
[data-theme="dark"] body:not(.auth-page):not(.index-page) .btn.btn-outline {
    border-color: rgba(232, 212, 168, 0.28);
    color: var(--bn-gold-light);
}

/* ═══════════ 7) فرم‌ها — input های اپ ═══════════ */
body:not(.auth-page):not(.index-page) .form-control,
body:not(.auth-page):not(.index-page) input[type="text"].form-control,
body:not(.auth-page):not(.index-page) input[type="tel"].form-control,
body:not(.auth-page):not(.index-page) input[type="password"].form-control,
body:not(.auth-page):not(.index-page) textarea.form-control,
body:not(.auth-page):not(.index-page) select.form-control {
    background: var(--bn-white);
    border: 1px solid rgba(26, 61, 54, 0.10);
    border-radius: var(--bn-radius-input);
    padding: 14px 20px;
    color: var(--bn-text);
    transition: border-color .2s ease, box-shadow .2s ease;
}

body:not(.auth-page):not(.index-page) .form-control:focus {
    border-color: rgba(26, 61, 54, 0.85);
    border-width: 1.8px;
    box-shadow: none;
    outline: none;
}

[data-theme="dark"] body:not(.auth-page):not(.index-page) .form-control:focus {
    border-color: rgba(201, 166, 107, 0.85);
}

/* ═══════════ 8) چیپ‌ها و تب‌ها — FilterChip اپ ═══════════ */
body:not(.auth-page):not(.index-page) .chip,
body:not(.auth-page):not(.index-page) .bn-chip,
body:not(.auth-page):not(.index-page) .filter-chip,
body:not(.auth-page):not(.index-page) .bn-filter-chip {
    border-radius: 999px;
    border: 1px solid rgba(201, 166, 107, 0.20);
    color: var(--bn-text-2);
    font-weight: 600;
    background: transparent;
}

body:not(.auth-page):not(.index-page) .chip.active,
body:not(.auth-page):not(.index-page) .chip.is-active,
body:not(.auth-page):not(.index-page) .bn-chip.active,
body:not(.auth-page):not(.index-page) .bn-chip.is-active,
body:not(.auth-page):not(.index-page) .filter-chip.active,
body:not(.auth-page):not(.index-page) .filter-chip.is-active,
body:not(.auth-page):not(.index-page) .bn-filter-chip.active,
body:not(.auth-page):not(.index-page) .bn-filter-chip.is-active {
    background: rgba(201, 166, 107, 0.25);
    border-color: rgba(201, 166, 107, 0.50);
    color: var(--bn-green);
    font-weight: 800;
}

/* ═══════════ 9) آواتارها — حلقه گرادیان سبز→طلایی ═══════════ */
body:not(.auth-page):not(.index-page) .story-avatar,
body:not(.auth-page):not(.index-page) .bn-story-ring,
body:not(.auth-page):not(.index-page) .post-avatar,
body:not(.auth-page):not(.index-page) .bn-avatar-ring {
    background: var(--bn-gradient-ring);
    padding: 2.5px;
    border-radius: 50%;
}

/* ═══════════ 10) کارت‌ها — LuxCard اپ ═══════════ */
body:not(.auth-page):not(.index-page) .card,
body:not(.auth-page):not(.index-page) .bn-card,
body:not(.auth-page):not(.index-page) .lux-card {
    background: var(--bn-surface);
    border: 1px solid rgba(26, 61, 54, 0.05);
    border-radius: var(--bn-radius);
    box-shadow: var(--bn-shadow);
}

[data-theme="dark"] body:not(.auth-page):not(.index-page) .card,
[data-theme="dark"] body:not(.auth-page):not(.index-page) .bn-card,
[data-theme="dark"] body:not(.auth-page):not(.index-page) .lux-card {
    border-color: rgba(232, 212, 168, 0.08);
}

/* ═══════════ 11) منوی فول‌اسکرین — سبز تیره اپ (متن سفید قابل‌خواندن) ═══════════ */
/* هرگز پس‌زمینه روشن روی شیت منو نگذار — متن سفید برای پس‌زمینه جنگلی است */
body:not(.auth-page):not(.index-page) .lux-menu-sheet {
    background: transparent !important;
    border-radius: 0 !important;
}

body:not(.auth-page):not(.index-page) aside#luxMenuPanel.lux-menu-panel--ig,
body:not(.auth-page):not(.index-page) .lux-menu-panel.lux-menu-panel--ig {
    background:
        radial-gradient(ellipse 72% 48% at 100% 0%, rgba(61, 107, 94, 0.35), transparent 58%),
        radial-gradient(ellipse 60% 42% at 0% 88%, rgba(201, 166, 107, 0.14), transparent 52%),
        linear-gradient(180deg, #142824 0%, #1A3D36 28%, #274842 62%, #1A3D36 100%) !important;
}

body:not(.auth-page):not(.index-page) .lux-menu-item,
body:not(.auth-page):not(.index-page) .lux-menu-item strong,
body:not(.auth-page):not(.index-page) aside#luxMenuPanel .lux-menu-item,
body:not(.auth-page):not(.index-page) aside#luxMenuPanel .lux-menu-item strong {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
}

body:not(.auth-page):not(.index-page) .lux-menu-item:hover {
    background: rgba(201, 166, 107, 0.12) !important;
}

body:not(.auth-page):not(.index-page) .bn-locale-panel {
    background: rgba(255, 252, 248, 0.96) !important;
    border: 1px solid rgba(201, 166, 107, 0.35) !important;
}

body:not(.auth-page):not(.index-page) .bn-locale-option {
    background: #fff !important;
    color: #142824 !important;
}

body:not(.auth-page):not(.index-page) .bn-locale-option__name,
body:not(.auth-page):not(.index-page) .bn-locale-panel__title {
    color: #142824 !important;
    -webkit-text-fill-color: #142824 !important;
}

/* ═══════════ 12) نشان‌ها و توست ═══════════ */
body:not(.auth-page):not(.index-page) .notif-badge {
    background: #A95F5F;
    font-weight: 800;
}

body:not(.auth-page):not(.index-page) .toast {
    border-radius: 20px;
    background: var(--bn-green-deep);
    color: #fff;
    font-weight: 700;
}

/* ═══════════ 13) اسکرول‌بار ظریف ═══════════ */
body:not(.auth-page):not(.index-page) ::-webkit-scrollbar { width: 6px; height: 6px; }
body:not(.auth-page):not(.index-page) ::-webkit-scrollbar-thumb {
    background: rgba(201, 166, 107, 0.35);
    border-radius: 999px;
}

/* ═══════════ 14) ریسپانسیو — دسکتاپ قاب اپ‌مانند ═══════════ */
@media (hover: hover) and (min-width: 1024px) {
    body:not(.auth-page):not(.index-page) .main-content {
        max-width: none;
    }
}

/* موبایل خیلی کوچک */
@media (max-width: 360px) {
    body:not(.auth-page):not(.index-page) .bottom-nav-item { padding: 6px 8px; }
    body:not(.auth-page):not(.index-page) .bottom-nav-item span { font-size: 9.5px; }
}

/* ═══════════ 15) شعاع ارگانیک اپ — گوشه‌های نامتقارن ═══════════ */
:root {
    /* base×(TL 1.12 / TR 0.88 / BR 1.18 / BL 0.92) — امضای دکتو */
    --bn-organic-16: 18px 14px 19px 15px;
    --bn-organic-20: 22px 18px 24px 18px;
    --bn-organic-24: 27px 21px 28px 22px;
    --bn-organic-32: 36px 28px 38px 29px;
    /* سایه لایه‌ای گرم اپ (سبز + مشکی + طلایی) */
    --bn-depth-1:
        0 1px 2px rgba(39, 72, 66, 0.05),
        0 3px 8px rgba(0, 0, 0, 0.06),
        0 10px 20px rgba(0, 0, 0, 0.08),
        0 16px 32px rgba(201, 166, 107, 0.06);
}

body:not(.auth-page):not(.index-page) .card,
body:not(.auth-page):not(.index-page) .bn-card,
body:not(.auth-page):not(.index-page) .lux-card {
    border-radius: var(--bn-organic-24);
    box-shadow: var(--bn-depth-1);
}

/* ═══════════ 16) فید — کارت پست اینستاگرامی اپ ═══════════ */
/* کارت تمام‌عرض، سطح champagne، جداکننده مویی */
body:not(.auth-page):not(.index-page) .bn-feed-card,
body:not(.auth-page):not(.index-page) .feed-post {
    background: var(--bn-surface);
    border: none;
    border-radius: var(--bn-organic-20);
    box-shadow: var(--bn-depth-1);
    overflow: hidden;
}

body:not(.auth-page):not(.index-page) .bn-feed-card + .bn-feed-card,
body:not(.auth-page):not(.index-page) .feed-post + .feed-post {
    margin-top: 14px;
}

/* هدر پست — آواتار حلقه گرادیانی + نام w900 */
body:not(.auth-page):not(.index-page) .bn-feed-card__author,
body:not(.auth-page):not(.index-page) .feed-post-author {
    padding: 12px 12px 6px;
    gap: 10px;
}

body:not(.auth-page):not(.index-page) .feed-post-author img,
body:not(.auth-page):not(.index-page) .bn-feed-card__author img {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    padding: 2px;
    background: var(--bn-gradient-ring);
}

body:not(.auth-page):not(.index-page) .feed-post-author-name {
    font-weight: 900;
    font-size: 14px;
    color: var(--bn-text);
    letter-spacing: -0.1px;
}

body:not(.auth-page):not(.index-page) .feed-post-author .feed-post-username,
body:not(.auth-page):not(.index-page) .feed-post-author small {
    font-size: 12px;
    font-weight: 600;
    color: var(--bn-text-3);
}

/* مدیا — پس‌زمینه مشکی و contain مثل اپ */
body:not(.auth-page):not(.index-page) .feed-post-media,
body:not(.auth-page):not(.index-page) .bn-feed-card__media {
    background: #000;
}

body:not(.auth-page):not(.index-page) .feed-post-media img,
body:not(.auth-page):not(.index-page) .feed-post-media video {
    object-fit: contain;
    background: #000;
}

/* ردیف اکشن‌ها — لایک/کامنت/اشتراک ... ذخیره انتها */
body:not(.auth-page):not(.index-page) .feed-post-compact-actions {
    padding: 4px 8px 10px;
}

body:not(.auth-page):not(.index-page) .feed-post-icon-actions .feed-stat-pill,
body:not(.auth-page):not(.index-page) .feed-post-icon-actions button {
    background: transparent;
    border: none;
    color: var(--bn-text-3);
    font-weight: 700;
    font-size: 13px;
    border-radius: 16px;
    transition: transform .18s cubic-bezier(.34,1.56,.64,1), color .18s ease;
}

body:not(.auth-page):not(.index-page) .feed-post-icon-actions .feed-stat-pill:active {
    transform: scale(1.22);
}

body:not(.auth-page):not(.index-page) .like-btn.liked,
body:not(.auth-page):not(.index-page) .like-btn.is-liked,
body:not(.auth-page):not(.index-page) .like-btn[data-liked="true"] {
    color: #FF3B5C;
}

body:not(.auth-page):not(.index-page) .feed-save-pill.saved,
body:not(.auth-page):not(.index-page) .feed-save-pill.is-saved,
body:not(.auth-page):not(.index-page) .feed-save-pill[data-saved="true"] {
    color: var(--bn-gold);
}

/* کپشن — تاشو با تینت سبز ۵٪ */
body:not(.auth-page):not(.index-page) .feed-post-caption {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--bn-text);
    line-height: 1.55;
}

body:not(.auth-page):not(.index-page) .feed-post-caption.expanded,
body:not(.auth-page):not(.index-page) .feed-post-caption.is-expanded {
    background: var(--bn-green-soft);
    border-radius: 13px 11px 14px 11px;
    padding: 8px 10px;
}

/* بج دسته‌بندی — شیشه مات + حاشیه طلایی */
body:not(.auth-page):not(.index-page) .feed-post-service-type,
body:not(.auth-page):not(.index-page) .post-category-badge {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    background: rgba(0, 0, 0, 0.45);
    border: 0.9px solid rgba(201, 166, 107, 0.72);
    border-radius: 999px;
    color: #fff;
    font-weight: 900;
    font-size: 11px;
}

/* ═══════════ 17) استوری‌ها — حلقه گرادیان سبز→طلایی ═══════════ */
body:not(.auth-page):not(.index-page) .stories-row .story-item,
body:not(.auth-page):not(.index-page) .bn-rail .story-item {
    width: 84px;
}

body:not(.auth-page):not(.index-page) .story-avatar {
    width: 70px;
    height: 70px;
    padding: 2.5px;
    background: var(--bn-gradient-ring);
    border-radius: 50%;
}

body:not(.auth-page):not(.index-page) .story-avatar img {
    border: 2.5px solid var(--bn-cream);
    border-radius: 50%;
}

body:not(.auth-page):not(.index-page) .story-item span,
body:not(.auth-page):not(.index-page) .story-item .story-name {
    font-size: 11px;
    font-weight: 700;
    color: var(--bn-text-2);
}

/* ═══════════ 18) اکسپلور — گرید ۳ستونه ۱:۱ + ریل‌ها ═══════════ */
body:not(.auth-page):not(.index-page) .explore-app-grid,
body:not(.auth-page):not(.index-page) #exploreMasonry {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    padding: 0 16px;
}

body:not(.auth-page):not(.index-page) .explore-app-grid > * {
    aspect-ratio: 1;
    border-radius: 13px 11px 14px 11px;
    overflow: hidden;
    background: var(--bn-mist);
}

body:not(.auth-page):not(.index-page) .explore-app-grid img,
body:not(.auth-page):not(.index-page) .explore-app-grid video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ریل پزشکان/کلینیک‌ها — کانتینر سطح بالا با حاشیه divider */
body:not(.auth-page):not(.index-page) .explore-provider-rail {
    background: var(--bn-surface);
    border: 1px solid var(--bn-border);
    border-radius: var(--bn-organic-16);
    box-shadow: var(--bn-shadow);
}

body:not(.auth-page):not(.index-page) .explore-provider-rail__tab {
    border-radius: 999px;
    font-weight: 800;
    color: var(--bn-text-2);
}

body:not(.auth-page):not(.index-page) .explore-provider-rail__tab.active,
body:not(.auth-page):not(.index-page) .explore-provider-rail__tab.is-active {
    background: rgba(201, 166, 107, 0.25);
    border-color: rgba(201, 166, 107, 0.5);
    color: var(--bn-green);
}

body:not(.auth-page):not(.index-page) .explore-provider-rail .provider-card {
    width: 84px;
    text-align: center;
}

body:not(.auth-page):not(.index-page) .explore-provider-rail .provider-card img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 1px solid var(--bn-border);
}

body:not(.auth-page):not(.index-page) .explore-provider-rail .provider-card strong {
    font-size: 12px;
    font-weight: 700;
    color: var(--bn-text);
}

body:not(.auth-page):not(.index-page) .explore-provider-rail .provider-card small {
    font-size: 10px;
    color: var(--bn-text-3);
}

/* ═══════════ 19) پروفایل — هدر hero + ردیف آمار اپ ═══════════ */
body:not(.auth-page):not(.index-page) .bn-profile-hero,
body:not(.auth-page):not(.index-page) .dp-hero {
    background: var(--bn-surface);
    border-radius: var(--bn-organic-24);
    box-shadow: var(--bn-depth-1);
    border: 1px solid var(--bn-border-soft);
}

body:not(.auth-page):not(.index-page) .bn-profile-avatar-ring,
body:not(.auth-page):not(.index-page) .dp-hero .dp-avatar,
body:not(.auth-page):not(.index-page) .bn-profile-hero .profile-avatar {
    padding: 2px;
    background: var(--bn-gradient-ring);
    border-radius: 50%;
}

body:not(.auth-page):not(.index-page) .bn-profile-hero h1,
body:not(.auth-page):not(.index-page) .dp-hero h1 {
    font-weight: 900 !important;
    letter-spacing: -0.02em;
}

/* ردیف آمار — ۳ سلول با جداکننده عمودی مثل اپ */
body:not(.auth-page):not(.index-page) .bn-profile-stats,
body:not(.auth-page):not(.index-page) .dp-stats,
body:not(.auth-page):not(.index-page) .profile-stats-row {
    background: var(--bn-surface);
    border: 1px solid var(--bn-border);
    border-radius: 18px 14px 19px 15px;
    overflow: hidden;
}

body:not(.auth-page):not(.index-page) .bn-profile-stats > * + *,
body:not(.auth-page):not(.index-page) .dp-stats > * + *,
body:not(.auth-page):not(.index-page) .profile-stats-row > * + * {
    border-inline-start: 1px solid var(--bn-border);
}

body:not(.auth-page):not(.index-page) .bn-profile-stats strong,
body:not(.auth-page):not(.index-page) .dp-stats strong,
body:not(.auth-page):not(.index-page) .profile-stats-row strong {
    font-weight: 900;
    font-size: 17px;
    letter-spacing: -0.3px;
    color: var(--bn-text);
}

body:not(.auth-page):not(.index-page) .bn-profile-stats span,
body:not(.auth-page):not(.index-page) .dp-stats span,
body:not(.auth-page):not(.index-page) .profile-stats-row span {
    font-size: 11px;
    font-weight: 700;
    color: var(--bn-text-2);
}

/* چیپ نقش — طلایی ۱۵٪ */
body:not(.auth-page):not(.index-page) .bn-role-chip,
body:not(.auth-page):not(.index-page) .profile-role-chip,
body:not(.auth-page):not(.index-page) .bn-visitor-info-chip {
    background: rgba(201, 166, 107, 0.15);
    border-radius: 999px;
    color: var(--bn-green);
    font-weight: 800;
    font-size: 12px;
    border: none;
}

/* تب‌های پروفایل — اندیکاتور طلایی */
body:not(.auth-page):not(.index-page) .bn-profile-tabs .tab.active,
body:not(.auth-page):not(.index-page) .profile-tabs .tab.active,
body:not(.auth-page):not(.index-page) .dp-tabs .active {
    color: var(--bn-green);
    border-bottom: 2.5px solid var(--bn-gold);
}

/* ═══════════ 20) چت — حباب‌ها و کامپوزر اپ ═══════════ */
body:not(.auth-page):not(.index-page) .bn-chat-sidebar,
body:not(.auth-page):not(.index-page) .bn-chat-main {
    background: var(--bn-cream);
}

/* آیتم لیست گفتگو — کارت با حاشیه طلایی */
body:not(.auth-page):not(.index-page) .bn-chat-list-item,
body:not(.auth-page):not(.index-page) .bn-chat-list .chat-item {
    background: var(--bn-surface);
    border: 1px solid rgba(201, 166, 107, 0.10);
    border-radius: 18px 14px 19px 15px;
    transition: border-color .2s ease, box-shadow .2s ease;
}

body:not(.auth-page):not(.index-page) .bn-chat-list-item.unread,
body:not(.auth-page):not(.index-page) .bn-chat-list-item.has-unread {
    border-color: rgba(201, 166, 107, 0.35);
    box-shadow: 0 2px 10px rgba(201, 166, 107, 0.14);
}

body:not(.auth-page):not(.index-page) .bn-chat-list-item .chat-name {
    font-weight: 900;
    font-size: 15px;
}

/* حباب من — گرادیان سبز، گوشه راست‌پایین تیز */
body:not(.auth-page):not(.index-page) .bn-chat-messages .message.mine .bubble,
body:not(.auth-page):not(.index-page) .bn-chat-messages .message--mine .bubble,
body:not(.auth-page):not(.index-page) .bn-msg--out .bn-msg-bubble,
body:not(.auth-page):not(.index-page) .message.own .bubble {
    background: linear-gradient(135deg, #1A3D36, #274842);
    color: #fff;
    border-radius: 18px 18px 4px 18px;
    box-shadow: 0 3px 12px rgba(26, 61, 54, 0.18);
    border: none;
    max-width: 72%;
    font-size: 14.5px;
    line-height: 1.45;
}

/* حباب طرف مقابل — سطح روشن، حاشیه طلایی ۱۵٪ */
body:not(.auth-page):not(.index-page) .bn-chat-messages .message.theirs .bubble,
body:not(.auth-page):not(.index-page) .bn-chat-messages .message--theirs .bubble,
body:not(.auth-page):not(.index-page) .bn-msg--in .bn-msg-bubble,
body:not(.auth-page):not(.index-page) .message:not(.own):not(.mine) .bubble {
    background: var(--bn-surface);
    color: var(--bn-text);
    border-radius: 18px 18px 18px 4px;
    border: 1px solid rgba(201, 166, 107, 0.15);
    box-shadow: 0 2px 8px rgba(26, 61, 54, 0.08);
    max-width: 72%;
    font-size: 14.5px;
    line-height: 1.45;
}

[data-theme="dark"] body:not(.auth-page):not(.index-page) .bn-chat-messages .message.mine .bubble,
[data-theme="dark"] body:not(.auth-page):not(.index-page) .bn-msg--out .bn-msg-bubble {
    background: linear-gradient(135deg, #C9A66B, #A8844A);
    color: #142824;
}

/* کامپوزر — بار گرد ۲۶px با حاشیه طلایی */
body:not(.auth-page):not(.index-page) .bn-chat-compose {
    background: var(--bn-white);
    border: 1px solid rgba(201, 166, 107, 0.22);
    border-radius: 26px;
    box-shadow: 0 4px 14px rgba(26, 61, 54, 0.08);
}

body:not(.auth-page):not(.index-page) .bn-chat-compose textarea,
body:not(.auth-page):not(.index-page) .bn-chat-compose input {
    background: transparent;
    border: none;
    box-shadow: none;
}

body:not(.auth-page):not(.index-page) .bn-chat-compose .send-btn,
body:not(.auth-page):not(.index-page) .bn-chat-compose button[type="submit"] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--bn-gradient-brand);
    color: #fff;
    border: none;
}

/* هدر گفتگو — کارت عاجی + نقطه آنلاین */
body:not(.auth-page):not(.index-page) .bn-chat-main-head {
    background: rgba(243, 239, 230, 0.92);
    border: 1px solid rgba(26, 61, 54, 0.08);
    border-radius: 20px 16px 21px 17px;
}

[data-theme="dark"] body:not(.auth-page):not(.index-page) .bn-chat-main-head {
    background: rgba(29, 40, 37, 0.92);
    border-color: rgba(232, 212, 168, 0.10);
}

body:not(.auth-page):not(.index-page) .bn-chat-online-dot,
body:not(.auth-page):not(.index-page) .chat-online-dot {
    background: #6FA67A;
    border: 2px solid #fff;
    border-radius: 50%;
}

/* ═══════════ 21) اعلان‌ها — چیپ فیلتر طلایی و کارت‌ها ═══════════ */
body:not(.auth-page):not(.index-page) .notif-filter,
body:not(.auth-page):not(.index-page) .bn-filter-rail .bn-pill {
    border-radius: 999px;
    border: 1px solid rgba(201, 166, 107, 0.20);
    font-weight: 700;
    color: var(--bn-text-2);
    background: transparent;
}

body:not(.auth-page):not(.index-page) .notif-filter.active,
body:not(.auth-page):not(.index-page) .notif-filter.is-active,
body:not(.auth-page):not(.index-page) .bn-filter-rail .bn-pill.active {
    background: rgba(201, 166, 107, 0.25);
    border-color: rgba(201, 166, 107, 0.50);
    color: var(--bn-green);
    font-weight: 800;
}

body:not(.auth-page):not(.index-page) .notif-list .notif-item,
body:not(.auth-page):not(.index-page) .notification-item {
    background: var(--bn-surface);
    border: 1px solid var(--bn-border-soft);
    border-radius: var(--bn-organic-16);
    box-shadow: var(--bn-shadow);
}

body:not(.auth-page):not(.index-page) .notif-item.unread,
body:not(.auth-page):not(.index-page) .notification-item.unread {
    background: linear-gradient(120deg, rgba(201, 166, 107, 0.08), var(--bn-surface));
}

body:not(.auth-page):not(.index-page) .notif-item.unread::after,
body:not(.auth-page):not(.index-page) .notification-item.unread::after {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--bn-gold);
    position: absolute;
    top: 12px;
    inset-inline-end: 12px;
}

body:not(.auth-page):not(.index-page) .notif-item .notif-icon,
body:not(.auth-page):not(.index-page) .notification-item .notif-icon {
    width: 44px;
    height: 44px;
    border-radius: 16px 12px 17px 13px;
    background: var(--bn-mist);
    color: var(--bn-green);
    display: flex;
    align-items: center;
    justify-content: center;
}

body:not(.auth-page):not(.index-page) .notif-item.unread .notif-icon {
    background: var(--bn-gradient-ring);
    color: #fff;
}

/* ═══════════ 22) هدر اپ — DectoLuxAppBar ═══════════ */
body:not(.auth-page):not(.index-page) .app-header,
body:not(.auth-page):not(.index-page) .app-header--luxury {
    background: var(--bn-cream-2);
    border-bottom: 1px solid rgba(26, 61, 54, 0.06);
    box-shadow: none;
}

[data-theme="dark"] body:not(.auth-page):not(.index-page) .app-header,
[data-theme="dark"] body:not(.auth-page):not(.index-page) .app-header--luxury {
    background: #1D2825;
    border-bottom-color: rgba(232, 212, 168, 0.08);
}

/* ═══════════ 23) حرکت — easing لوکس اپ در کل سایت ═══════════ */
body:not(.auth-page):not(.index-page) a,
body:not(.auth-page):not(.index-page) button {
    transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

body:not(.auth-page):not(.index-page) .btn:active,
body:not(.auth-page):not(.index-page) .card:active,
body:not(.auth-page):not(.index-page) .bn-feed-card:active {
    transform: scale(0.985);
}

/* ═══════════ 24) ریسپانسیو دقیق — همه ابعاد ═══════════ */
/* تبلت */
@media (min-width: 600px) and (max-width: 1023px) {
    body:not(.auth-page):not(.index-page) .explore-app-grid,
    body:not(.auth-page):not(.index-page) #exploreMasonry {
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
    }
    body:not(.auth-page):not(.index-page) .bn-feed-list {
        max-width: 560px;
        margin-inline: auto;
    }
}

/* دسکتاپ — فید ستون مرکزی مثل اپ، اکسپلور ۴ ستون */
@media (min-width: 1024px) {
    body:not(.auth-page):not(.index-page) .bn-feed-list {
        max-width: 600px;
        margin-inline: auto;
    }
    body:not(.auth-page):not(.index-page) .explore-app-grid,
    body:not(.auth-page):not(.index-page) #exploreMasonry {
        grid-template-columns: repeat(4, 1fr);
        gap: 12px;
        max-width: 1080px;
        margin-inline: auto;
    }
}

/* موبایل کوچک */
@media (max-width: 479px) {
    body:not(.auth-page):not(.index-page) .explore-app-grid,
    body:not(.auth-page):not(.index-page) #exploreMasonry {
        gap: 6px;
        padding: 0 10px;
    }
    body:not(.auth-page):not(.index-page) .story-avatar {
        width: 62px;
        height: 62px;
    }
}

/* ═══════════ 25) فید عمیق — لایه‌اوت اینستاگرام اپ (نه سینمایی) ═══════════ */
body.app-shell .bn-feed-card.feed-post--cinema,
body.app-shell .bn-feed-card.feed-post--iconic {
    background: var(--bn-surface) !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0 !important;
}

body.app-shell .bn-feed-list.iconic-feed-stream,
body.app-shell #feedPosts {
    display: flex;
    flex-direction: column;
    gap: 0;
    max-width: 560px;
    margin-inline: auto;
}

body.app-shell .bn-feed-card + .bn-feed-card {
    border-top: 0.5px solid rgba(111, 122, 116, 0.12);
}

/* نویسنده بالای مدیا — روی سطح روشن مثل اپ */
body.app-shell .bn-feed-card__author--app {
    position: relative !important;
    inset: auto !important;
    z-index: 1 !important;
    padding: 10px 12px 6px !important;
    background: var(--bn-surface);
}

body.app-shell .bn-feed-card__author--app .feed-post-author {
    color: var(--bn-text) !important;
    text-shadow: none !important;
}

body.app-shell .bn-feed-card__author--app .feed-post-author-name,
body.app-shell .bn-feed-card__author--app strong {
    color: var(--bn-text) !important;
    font-weight: 900 !important;
    font-size: 14px !important;
    text-shadow: none !important;
}

body.app-shell .bn-feed-card__author--app .feed-post-username {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--bn-text-3);
    margin-top: 1px;
}

body.app-shell .bn-feed-avatar-ring {
    display: inline-flex;
    padding: 2px;
    border-radius: 50%;
    background: var(--bn-gradient-ring);
    flex-shrink: 0;
}

body.app-shell .bn-feed-avatar-ring img {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50%;
    border: 2px solid var(--bn-surface) !important;
    object-fit: cover;
    display: block;
}

/* مدیا تمام‌عرض ۱:۱ روی مشکی — بدون گرادیان روی نویسنده */
body.app-shell .bn-feed-card__media {
    background: #000 !important;
}

body.app-shell .bn-feed-card__media::after {
    display: none !important;
}

body.app-shell .bn-feed-card__media .feed-post-media {
    aspect-ratio: 1 / 1;
    width: 100%;
    background: #000;
}

body.app-shell .bn-feed-card__media .feed-post-media img,
body.app-shell .bn-feed-card__media .feed-post-media video {
    width: 100%;
    height: 100%;
    object-fit: contain !important;
    background: #000;
}

body.app-shell .feed-post-service-type--overlay {
    position: absolute;
    bottom: 10px;
    inset-inline-start: 10px;
    z-index: 3;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    background: rgba(0, 0, 0, 0.45);
    border: 0.9px solid rgba(201, 166, 107, 0.72);
    border-radius: 999px;
    color: #fff;
    font-weight: 900;
    font-size: 11px;
    padding: 4px 10px;
}

/* اکشن‌ها: لایک · کامنت · اشتراک …… ذخیره انتهای ردیف */
body.app-shell .feed-post-compact-actions--app {
    display: block !important;
    padding: 4px 8px 8px !important;
}

body.app-shell .feed-post-compact-actions--app .feed-post-icon-actions {
    display: flex !important;
    align-items: center;
    gap: 4px;
    width: 100%;
}

body.app-shell .feed-post-compact-actions--app .feed-save-pill {
    margin-inline-start: auto !important;
}

body.app-shell .feed-post-icon-actions .feed-stat-pill,
body.app-shell .feed-post-icon-actions .feed-save-pill {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: var(--bn-text-3) !important;
    font-size: 13px;
    font-weight: 700;
    padding: 6px 8px;
}

body.app-shell .feed-post-icon-actions .feed-stat-pill i,
body.app-shell .feed-post-icon-actions .feed-save-pill i {
    font-size: 22px;
}

body.app-shell .feed-post-icon-actions .like-btn.liked,
body.app-shell .feed-post-icon-actions .like-btn.liked i {
    color: #FF3B5C !important;
}

body.app-shell .feed-post-icon-actions .feed-save-pill.saved,
body.app-shell .feed-post-icon-actions .feed-save-pill.is-saved,
body.app-shell .feed-post-icon-actions .feed-save-pill.saved i,
body.app-shell .feed-post-icon-actions .feed-save-pill.is-saved i {
    color: var(--bn-gold) !important;
}

body.app-shell .bn-feed-card__caption,
body.app-shell .bn-feed-card__desc {
    padding: 0 12px 12px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--bn-text);
    line-height: 1.55;
}

body.app-shell .bn-feed-card__caption strong {
    font-weight: 900;
    color: var(--bn-text);
}

/* ═══════════ 26) اکسپلور عمیق — ۳ ستون ۱:۱ مثل اپ ═══════════ */
body.app-shell .bn-explore-page .explore-app-grid.iconic-bento,
body.app-shell .bn-explore-page #exploreMasonry {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    padding: 8px 16px calc(100px + env(safe-area-inset-bottom)) !important;
    grid-auto-flow: dense;
}

body.app-shell .bn-explore-page .explore-app-card,
body.app-shell .bn-explore-page .explore-app-card--wide,
body.app-shell .bn-explore-page .explore-app-card--tall {
    grid-column: span 1 !important;
    border-radius: 12px !important;
    border: none !important;
    box-shadow: none !important;
    background: var(--bn-mist) !important;
}

body.app-shell .bn-explore-page .explore-app-card:hover {
    transform: none !important;
}

body.app-shell .bn-explore-page .explore-card-media,
body.app-shell .bn-explore-page .explore-app-card--tall:not([data-media-fit]) .explore-card-media,
body.app-shell .bn-explore-page .explore-app-card--wide:not([data-media-fit]) .explore-card-media {
    aspect-ratio: 1 / 1 !important;
}

body.app-shell .explore-provider-rail {
    margin: 0 16px 12px;
    padding: 12px;
    background: var(--bn-surface);
    border: 1px solid var(--bn-border);
    border-radius: var(--bn-organic-16);
}

body.app-shell .explore-provider-rail__tabs {
    display: flex;
    gap: 8px;
}

body.app-shell .explore-provider-rail__tab {
    border-radius: 999px;
    padding: 7px 14px;
    font-weight: 800;
    font-size: 12px;
    border: 1px solid rgba(201, 166, 107, 0.2);
    background: transparent;
    color: var(--bn-text-2);
}

body.app-shell .explore-provider-rail__tab.is-active {
    background: rgba(201, 166, 107, 0.25);
    border-color: rgba(201, 166, 107, 0.5);
    color: var(--bn-green);
}

body.app-shell .explore-provider-rail__scroller {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding: 12px 2px 4px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

body.app-shell .explore-provider-rail__scroller::-webkit-scrollbar { display: none; }

body.app-shell .explore-provider-card {
    flex: 0 0 84px;
    width: 84px;
    text-align: center;
    text-decoration: none;
    color: inherit;
}

body.app-shell .explore-provider-card__avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid var(--bn-border);
    margin: 0 auto 6px;
    display: block;
}

body.app-shell .explore-provider-card__name {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: var(--bn-text);
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.app-shell .explore-provider-card__sub {
    display: block;
    font-size: 10px;
    color: var(--bn-text-3);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (min-width: 1024px) {
    body.app-shell .bn-explore-page .explore-app-grid.iconic-bento,
    body.app-shell .bn-explore-page #exploreMasonry {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 10px !important;
        max-width: 1080px;
        margin-inline: auto;
    }
}

/* ═══════════ 27) چت عمیق — کلاس‌های واقعی bn-chat-bubble ═══════════ */
body.app-shell .bn-chat-bubble {
    max-width: 72% !important;
    font-size: 14.5px !important;
    line-height: 1.45 !important;
    padding: 10px 12px !important;
}

body.app-shell .bn-chat-bubble--mine {
    background: linear-gradient(135deg, #1A3D36, #274842) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 18px 18px 4px 18px !important;
    align-self: flex-end !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    box-shadow: 0 3px 12px rgba(26, 61, 54, 0.18);
}

body.app-shell .bn-chat-bubble--theirs {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    background-image: none !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    border: 1px solid rgba(12, 74, 67, 0.18) !important;
    border-radius: 18px 18px 18px 4px !important;
    align-self: flex-start !important;
    margin-right: auto !important;
    margin-left: 0 !important;
    opacity: 1 !important;
    box-shadow: 0 0 0 1px #fff, 0 4px 14px rgba(12, 74, 67, 0.12) !important;
}

[data-theme="dark"] body.app-shell .bn-chat-bubble--mine {
    background: linear-gradient(135deg, #C9A66B, #A8844A) !important;
    color: #142824 !important;
}

body.app-shell .bn-chat-list-item,
body.app-shell .bn-chat-list-item--unread {
    background: var(--bn-surface) !important;
    border: 1px solid rgba(201, 166, 107, 0.10) !important;
    border-radius: 18px 14px 19px 15px !important;
    margin: 6px 10px;
}

body.app-shell .bn-chat-list-item--unread {
    border-color: rgba(201, 166, 107, 0.35) !important;
    box-shadow: 0 2px 10px rgba(201, 166, 107, 0.14);
}

body.app-shell .bn-chat-list-meta strong {
    font-weight: 900 !important;
    font-size: 15px !important;
}

body.app-shell .bn-chat-compose {
    background: rgba(255, 254, 254, 0.96) !important;
    border: 1px solid rgba(201, 166, 107, 0.22) !important;
    border-radius: 26px !important;
    box-shadow: 0 4px 14px rgba(26, 61, 54, 0.08);
    margin: 8px 12px;
}

body.app-shell .bn-chat-compose button[type="submit"] {
    width: 44px;
    height: 44px;
    border-radius: 50% !important;
    background: var(--bn-gradient-brand) !important;
    color: #fff !important;
    border: none !important;
}

body.app-shell .bn-chat-main-head {
    background: rgba(243, 239, 230, 0.92) !important;
    border: 1px solid rgba(26, 61, 54, 0.08) !important;
    border-radius: 20px 16px 21px 17px !important;
    margin: 8px 12px 0;
}

/* ═══════════ 28) اعلان‌ها — unread و فیلتر طلایی دقیق‌تر ═══════════ */
body.app-shell .notif-list .notif-item,
body.app-shell #notificationsList .notif-item {
    position: relative;
    padding: 14px;
    margin-bottom: 10px;
}

/* ═══════════ 29) پایداری موبایل — بدون شیفت افقی، تمام‌عرض مثل اپ ═══════════ */
html {
    overflow-x: clip;
    max-width: 100%;
}

body.app-shell {
    overflow-x: clip;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding-inline: 0;
    background: var(--bn-cream) !important;
}

body.app-shell .main-content {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
    box-sizing: border-box;
    overflow-x: clip;
    min-width: 0;
}

body.app-shell .app-header-inner,
body.app-shell .bottom-nav-inner {
    width: 100%;
    max-width: 560px;
    margin-inline: auto;
    padding-inline: 12px;
    box-sizing: border-box;
}

body.app-shell .bn-feed-page,
body.app-shell .bn-feed-stream,
body.app-shell .bn-feed-list.iconic-feed-stream,
body.app-shell #feedPosts {
    width: 100% !important;
    max-width: 560px !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
    box-sizing: border-box;
    min-width: 0;
    overflow-x: clip;
}

body.app-shell .bn-feed-card,
body.app-shell .bn-feed-card.feed-post--cinema,
body.app-shell .bn-feed-card.feed-post--iconic {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    box-sizing: border-box;
    min-width: 0;
    transform: none !important;
}

body.app-shell .bn-feed-card__media,
body.app-shell .bn-feed-card__media .feed-post-media,
body.app-shell .bn-feed-card__media .post-carousel,
body.app-shell .bn-feed-card__media .post-carousel-track,
body.app-shell .bn-feed-card__media .post-carousel-slide {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
}

body.app-shell .bn-feed-card__caption strong,
body.app-shell .bn-feed-card__caption .feed-post-author-name {
    margin-left: 0 !important;
    margin-inline-end: 0.35em !important;
}

body.app-shell .bn-home-stories-section,
body.app-shell .bn-stories-panel,
body.app-shell .stories-row {
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
}

/* فید موبایل: ستون تمام‌عرض، بدون قاب دسکتاپ */
@media (max-width: 767px) {
    body.app-shell .main-content,
    body.app-shell .bn-feed-page,
    body.app-shell #feedPosts,
    body.app-shell .bn-feed-list {
        max-width: 100% !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }

    body.app-shell .bn-feed-hero {
        display: none !important; /* اپ خانه استوری+فید است، نه هیرو وب */
    }

    body.app-shell .bottom-nav-item {
        padding-inline: 6px;
        min-width: 0;
        flex: 1 1 0;
    }

    body.app-shell .bottom-nav-item span {
        font-size: 10px;
        white-space: nowrap;
    }
}

@media (min-width: 768px) {
    body.app-shell .main-content {
        max-width: 560px !important;
        margin-inline: auto !important;
        background: var(--bn-surface);
        box-shadow: var(--bn-shadow-lg);
        border-radius: 0 0 28px 28px;
        overflow: hidden;
    }
}

/* منو — کوچک و قوی خوانا روی شیت سبز (لایت و دارک) */
body.app-shell .lux-menu-item small,
body.app-shell aside#luxMenuPanel .lux-menu-item small,
body:not(.auth-page):not(.index-page) .lux-menu-item small {
    color: rgba(232, 212, 168, 0.88) !important;
    -webkit-text-fill-color: rgba(232, 212, 168, 0.88) !important;
    opacity: 1 !important;
}

body.app-shell .lux-menu-head__label,
body.app-shell .lux-menu-head__hint,
body:not(.auth-page):not(.index-page) .lux-menu-head__label,
body:not(.auth-page):not(.index-page) .lux-menu-head__hint {
    color: #f5e6b8 !important;
    -webkit-text-fill-color: #f5e6b8 !important;
}

/* تایپوگرافی یکپارچه اپ — بدون دست زدن به آیکن‌های داخل دکمه */
body.app-shell {
    font-family: 'Vazirmatn', system-ui, sans-serif !important;
}

body.app-shell input,
body.app-shell textarea {
    font-family: inherit !important;
}

body.app-shell .notif-item.unread .notif-icon,
body.app-shell .notification-item.unread .notif-icon {
    background: var(--bn-gradient-ring) !important;
    color: #fff !important;
}

/* پروفایل / داشبورد — قاب اپ‌مانند */
body.app-shell .bn-profile-page,
body.app-shell .settings-page,
body.app-shell .bn-doctors-page {
    max-width: 560px;
    margin-inline: auto;
    width: 100%;
    box-sizing: border-box;
}