/* ============================================================
   Path: src/RichRich.Web/wwwroot/css/coa.css
   Session: COA-TREE-UX-V2  ⚠️ MODIFIED — Original from COA-TREE-UX
   LastModified: 2026-06-20
   Module: M06 Accounting (Frontend) - Chart of Accounts tree styles
   ============================================================
   📝 Changes (COA-TREE-UX-V2):
     • + .coa-leaf-icon: أيقونة money للحساب النهائي (بدل dot القديمة).
     • + .coa-balance + variants (natural/anomaly/zero): بادج الرصيد بألوان.
     • + .coa-act-danger: variant أحمر لزر الحذف.
     • .coa-leaf-dot يبقى كـ legacy في حال استدعاء صفحات أخرى له.
   ============================================================ */

/* ===== Chart of Accounts — professional tree (COA-TREE-UX) ===== */
    /* يعتمد متغيّرات الهوية فقط (themes.css) ليحترم تبديل الثيم. */
    .coa-tree { display: flex; flex-direction: column; gap: 6px; }

    .coa-node { position: relative; }

    /* خط الإزاحة + موصل بصري للمستوى */
    .coa-node-main {
        display: flex; align-items: center; gap: 10px;
        margin-inline-start: var(--coa-indent, 0);
        padding: 6px 14px;
        background: var(--card-bg);
        border: 1px solid var(--card-bdr);
        border-inline-start: 3px solid var(--p);
        border-radius: 10px;
        transition: box-shadow .15s ease, border-color .15s ease, transform .05s ease;
    }
    .coa-node-main:hover {
        box-shadow: 0 2px 10px rgba(0,0,0,.07);
        border-inline-start-color: var(--accent);
    }

    /* تدرّج لون الحدّ الجانبي بحسب العمق (فصل بصري واضح للمستويات) */
    .coa-lvl-0 .coa-node-main { border-inline-start-color: var(--p); }
    .coa-lvl-1 .coa-node-main { border-inline-start-color: var(--p-mid); }
    .coa-lvl-2 .coa-node-main { border-inline-start-color: var(--accent); }
    .coa-lvl-3 .coa-node-main { border-inline-start-color: var(--sec); }
    .coa-lvl-4 .coa-node-main { border-inline-start-color: var(--t3); }

    .coa-lvl-0 .coa-name { font-weight: 800; font-size: 1.02rem; }
    .coa-lvl-0 .coa-node-main { background: var(--p-light); }

    /* COA-DEFAULT-COLLAPSED: خلفية مميزة للحساب النهائي (leaf) — رمادي
       خفيف متناغم مع الهوية اللونية يميّز "نهائي" عن المستويات التجميعية
       (التي ترث card-bg الأبيض). الـ border الجانبي يحافظ على التمييز
       اللوني لكل مستوى. */
    .coa-node-leaf .coa-node-main {
        background: var(--body-bg);
    }
    /* الجذور (lvl-0) دائماً تُغلب على coa-node-leaf لو صادف أن جذر هو
       نهائي أيضاً (حساب مفرد بلا فروع) — للحفاظ على هوية الجذور. */
    .coa-lvl-0.coa-node-leaf .coa-node-main { background: var(--p-light); }

    .coa-node-inactive .coa-node-main { opacity: .55; }

    .coa-toggle {
        flex: 0 0 auto; width: 26px; height: 26px;
        display: inline-flex; align-items: center; justify-content: center;
        border: none; border-radius: 7px;
        background: var(--p-light); color: var(--p-dark);
        cursor: pointer; transition: background .15s ease;
    }
    .coa-toggle:hover { background: var(--p); color: #fff; }

    .coa-leaf-dot {
        flex: 0 0 auto; width: 26px; text-align: center;
        color: var(--t3); font-size: 1.2rem; line-height: 1;
    }

    /* COA-TREE-UX-V2: أيقونة money للحساب النهائي (بدل dot). */
    .coa-leaf-icon {
        flex: 0 0 auto; width: 26px; height: 26px;
        display: inline-flex; align-items: center; justify-content: center;
        border-radius: 7px;
        background: rgba(34,197,94,.12); color: var(--ok, #16a34a);
        font-size: 1rem; line-height: 1;
    }

    .coa-code {
        flex: 0 0 auto; font-family: var(--bs-font-monospace, monospace);
        font-size: .82rem; font-weight: 700;
        padding: 3px 9px; border-radius: 6px;
        background: var(--body-bg); color: var(--t2);
        border: 1px solid var(--card-bdr);
    }

    .coa-name { color: var(--t1); font-weight: 600; }
    .coa-name-parent { font-weight: 700; }

    .coa-badge {
        flex: 0 0 auto; font-size: .72rem; font-weight: 700;
        padding: 3px 10px; border-radius: 999px; color: #fff;
    }
    /* ألوان الأنواع — مشتقّة من لوحة الهوية والحالات */
    .coa-type-0 { background: var(--sec); }      /* Asset */
    .coa-type-1 { background: var(--warn); }      /* Liability */
    .coa-type-2 { background: var(--p); }          /* Equity */
    .coa-type-3 { background: var(--ok); }         /* Revenue */
    .coa-type-4 { background: var(--accent-d); }   /* Expense */
    .coa-type-5 { background: #0d9488; }            /* ContraAsset (مجمّع الإهلاك) */

    /* 🆕 CONTRA-REVENUE-1 (بلاغ طه): كانت الشارة **بلا لون** — لا قاعدة
       للنوع 6، فتظهر شفّافةً بنصٍّ أبيضَ غيرِ مقروء.

       🔑 واللون أخضرُ داكن: يقرِن الخصم بالإيراد (‏--ok الأخضر) ويميّزه
         عنه — نفس منطق #0d9488 الذي يقرِن المقابل بالأصل. */
    .coa-type-6 { background: #15803d; }            /* ContraRevenue (خصومات المبيعات) */

    .coa-nature { flex: 0 0 auto; font-size: .8rem; color: var(--t2); }

    .coa-flex { flex: 1 1 auto; }

    .coa-chip {
        flex: 0 0 auto; font-size: .7rem; font-weight: 700;
        padding: 2px 9px; border-radius: 999px;
        border: 1px solid transparent;
    }
    .coa-chip-leaf { background: var(--p-light); color: var(--p-dark); }
    .coa-chip-parent { background: var(--body-bg); color: var(--t2); border-color: var(--card-bdr); }
    .coa-chip-inactive { background: rgba(239,68,68,.12); color: var(--err); }

    .coa-actions { flex: 0 0 auto; display: inline-flex; gap: 4px; }
    .coa-act {
        width: 30px; height: 30px;
        display: inline-flex; align-items: center; justify-content: center;
        border: 1px solid var(--card-bdr); border-radius: 8px;
        background: var(--card-bg); color: var(--t2);
        cursor: pointer; transition: all .15s ease;
    }
    .coa-act:hover { background: var(--p); color: #fff; border-color: var(--p); }

    /* COA-TREE-UX-V2: variant أحمر لزر الحذف. */
    .coa-act-danger:hover {
        background: var(--err, #dc2626); color: #fff; border-color: var(--err, #dc2626);
    }

    /* COA-TREE-UX-V2: Balance badge — مبلغ مطلق + شارة طبيعة + لون موقفي. */
    .coa-balance {
        flex: 0 0 auto;
        display: inline-flex; align-items: center; gap: 6px;
        font-size: .8rem; font-weight: 700;
        padding: 4px 12px; border-radius: 999px;
        border: 1px solid transparent; cursor: default;
        white-space: nowrap;
    }
    .coa-balance-amount { font-family: var(--bs-font-monospace, monospace); }
    .coa-balance-nature {
        font-size: .68rem; font-weight: 600;
        padding: 1px 6px; border-radius: 4px;
        background: rgba(255,255,255,.5);
    }
    /* أخضر: الرصيد طبيعي (يطابق Nature المتوقّع). */
    .coa-balance-natural {
        background: rgba(34,197,94,.12); color: var(--ok, #16a34a);
        border-color: rgba(34,197,94,.3);
    }
    /* أحمر: شذوذ (طبيعة عكسية — يحتاج مراجعة محاسبية). */
    .coa-balance-anomaly {
        background: rgba(239,68,68,.12); color: var(--err, #dc2626);
        border-color: rgba(239,68,68,.3);
    }
    /* رمادي: صفر (لا حركة). */
    .coa-balance-zero {
        background: var(--body-bg); color: var(--t3);
        border-color: var(--card-bdr);
    }

    .coa-total {
        display: flex; justify-content: flex-end;
        margin-top: 14px; color: var(--t2); font-size: .85rem;
    }

    /* بانر الأب في نافذة الإنشاء */
    .coa-parent-banner {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 14px; border-radius: 10px;
        background: var(--p-light); color: var(--p-dark);
        border-inline-start: 3px solid var(--p);
    }
    .coa-parent-banner-label { font-size: .85rem; color: var(--t2); }
    .coa-parent-banner-name { font-weight: 800; }