/* المشجرة - مكونات عامة مشتركة */

body.ft-theme .wrap,
body.ft-theme .container,
body.ft-theme .page,
body.ft-theme .header-box,
body.ft-theme .card,
body.ft-theme .admin-card,
body.ft-theme .panel,
body.ft-theme .box,
body.ft-theme details.card{
    border-color:var(--ft-border) !important;
}

body.ft-theme .ft-card,
body.ft-theme .card,
body.ft-theme .admin-card,
body.ft-theme .header-box,
body.ft-theme .wrap,
body.ft-theme .container,
body.ft-theme details.card{
    background:var(--ft-card-bg) !important;
    box-shadow:var(--ft-shadow-soft);
}

body.ft-theme .topbar,
body.ft-theme .admin-topbar,
body.ft-theme .navbar,
body.ft-theme header.admin-header{
    background:linear-gradient(135deg, var(--ft-primary), var(--ft-primary-2)) !important;
    color:#fff !important;
}

body.ft-theme .topbar a,
body.ft-theme .admin-topbar a,
body.ft-theme .navbar a,
body.ft-theme header.admin-header a{
    color:#fff !important;
}

body.ft-theme h1,
body.ft-theme h2,
body.ft-theme h3,
body.ft-theme .page-title,
body.ft-theme .section-title{
    color:var(--ft-primary) !important;
}

body.ft-theme p,
body.ft-theme .hint,
body.ft-theme .muted,
body.ft-theme small{
    color:var(--ft-muted);
}

body.ft-theme input,
body.ft-theme select,
body.ft-theme textarea{
    background:#fff !important;
    color:var(--ft-text) !important;
    border:1px solid var(--ft-border) !important;
    border-radius:12px;
    outline:none;
}

body.ft-theme input:focus,
body.ft-theme select:focus,
body.ft-theme textarea:focus{
    border-color:var(--ft-accent) !important;
    box-shadow:0 0 0 3px color-mix(in srgb, var(--ft-accent-soft) 75%, transparent) !important;
}

body.ft-theme table{
    background:var(--ft-card-bg) !important;
    border-color:var(--ft-border) !important;
}

body.ft-theme th{
    background:var(--ft-primary) !important;
    color:#fff !important;
    border-color:color-mix(in srgb, var(--ft-primary) 78%, #fff) !important;
}

body.ft-theme td{
    border-color:var(--ft-border) !important;
}

body.ft-theme tr:nth-child(even){
    background:color-mix(in srgb, var(--ft-card-bg-soft) 72%, #fff) !important;
}

body.ft-theme .btn,
body.ft-theme button,
body.ft-theme input[type="submit"],
body.ft-theme input[type="button"]{
    border-radius:12px;
    font-family:inherit;
}

body.ft-theme .btn-primary,
body.ft-theme .primary,
body.ft-theme button[type="submit"],
body.ft-theme input[type="submit"]{
    background:var(--ft-primary) !important;
    border-color:var(--ft-primary) !important;
    color:#fff !important;
}

body.ft-theme .btn-primary:hover,
body.ft-theme .primary:hover,
body.ft-theme button[type="submit"]:hover,
body.ft-theme input[type="submit"]:hover{
    background:var(--ft-primary-2) !important;
}

body.ft-theme .btn-light,
body.ft-theme .btn-secondary,
body.ft-theme .secondary{
    background:var(--ft-primary-soft) !important;
    border-color:var(--ft-border) !important;
    color:var(--ft-primary) !important;
}

body.ft-theme .btn-danger,
body.ft-theme .danger,
body.ft-theme .delete,
body.ft-theme .btn-delete{
    background:var(--ft-danger) !important;
    border-color:var(--ft-danger) !important;
    color:#fff !important;
}

body.ft-theme .btn-danger:hover,
body.ft-theme .danger:hover,
body.ft-theme .delete:hover,
body.ft-theme .btn-delete:hover{
    background:var(--ft-danger-2) !important;
}

body.ft-theme .badge,
body.ft-theme .tag,
body.ft-theme .pill{
    background:var(--ft-primary-soft) !important;
    border:1px solid var(--ft-border) !important;
    color:var(--ft-primary) !important;
}

body.ft-theme .msg,
body.ft-theme .alert,
body.ft-theme .notice{
    border-radius:14px;
    border:1px solid var(--ft-border);
    background:var(--ft-card-bg-soft);
    color:var(--ft-text);
}

body.ft-theme .msg.success,
body.ft-theme .alert-success{
    background:var(--ft-success-soft) !important;
    border-color:color-mix(in srgb, var(--ft-success) 30%, #fff) !important;
    color:var(--ft-success) !important;
}

body.ft-theme .msg.error,
body.ft-theme .alert-danger,
body.ft-theme .alert-error{
    background:var(--ft-danger-soft) !important;
    border-color:color-mix(in srgb, var(--ft-danger) 28%, #fff) !important;
    color:var(--ft-danger) !important;
}

body.ft-theme .msg.warning,
body.ft-theme .alert-warning{
    background:var(--ft-warning-soft) !important;
    border-color:color-mix(in srgb, var(--ft-warning) 28%, #fff) !important;
    color:var(--ft-warning) !important;
}

/*
  توحيد أزرار الحذف والتحذير مركزيًا.
  أي زر يحمل أحد هذه الكلاسات أو رابط يحتوي delete/remove يظهر باللون الأحمر.
*/
html body.ft-theme a.btn-danger,
html body.ft-theme button.btn-danger,
html body.ft-theme input.btn-danger,
html body.ft-theme a.danger,
html body.ft-theme button.danger,
html body.ft-theme input.danger,
html body.ft-theme a.delete,
html body.ft-theme button.delete,
html body.ft-theme input.delete,
html body.ft-theme a.btn-delete,
html body.ft-theme button.btn-delete,
html body.ft-theme input.btn-delete,
html body.ft-theme a.delete-btn,
html body.ft-theme button.delete-btn,
html body.ft-theme input.delete-btn,
html body.ft-theme a.action-delete,
html body.ft-theme button.action-delete,
html body.ft-theme a[href*="delete"],
html body.ft-theme a[href*="remove"],
html body.ft-theme button[name*="delete"],
html body.ft-theme button[value*="delete"]{
    background:var(--ft-danger) !important;
    border:1px solid var(--ft-danger) !important;
    color:#fff !important;
    box-shadow:0 8px 18px color-mix(in srgb, var(--ft-danger) 18%, transparent) !important;
}

html body.ft-theme a.btn-danger:hover,
html body.ft-theme button.btn-danger:hover,
html body.ft-theme input.btn-danger:hover,
html body.ft-theme a.danger:hover,
html body.ft-theme button.danger:hover,
html body.ft-theme input.danger:hover,
html body.ft-theme a.delete:hover,
html body.ft-theme button.delete:hover,
html body.ft-theme input.delete:hover,
html body.ft-theme a.btn-delete:hover,
html body.ft-theme button.btn-delete:hover,
html body.ft-theme input.btn-delete:hover,
html body.ft-theme a.delete-btn:hover,
html body.ft-theme button.delete-btn:hover,
html body.ft-theme input.delete-btn:hover,
html body.ft-theme a.action-delete:hover,
html body.ft-theme button.action-delete:hover,
html body.ft-theme a[href*="delete"]:hover,
html body.ft-theme a[href*="remove"]:hover,
html body.ft-theme button[name*="delete"]:hover,
html body.ft-theme button[value*="delete"]:hover{
    background:var(--ft-danger-2) !important;
    border-color:var(--ft-danger-2) !important;
    color:#fff !important;
}

html body.ft-theme a.btn-danger::before,
html body.ft-theme a.danger::before,
html body.ft-theme a.delete::before,
html body.ft-theme a.btn-delete::before,
html body.ft-theme a.delete-btn::before,
html body.ft-theme a.action-delete::before,
html body.ft-theme a[href*="delete"]::before,
html body.ft-theme a[href*="remove"]::before{
    content:"🗑 ";
    font-size:.95em;
}

html body.ft-theme .actions,
html body.ft-theme .node-actions,
html body.ft-theme .form-actions,
html body.ft-theme .row-actions,
html body.ft-theme .table-actions{
    gap:8px;
}

/* ==========================================================
   المشجرة - فصل ألوان المشجرة عن الواجهة
   الهدف:
   1) المشجرة تبقى فاتحة وخفيفة لأن محتواها أسماء فقط.
   2) الواجهة وباقي الموقع تأخذ تمييزًا أوضح للبطاقات لأن فيها تفاصيل أكثر.
   3) بدون تغيير المقاسات أو ترتيب العناصر.
   ========================================================== */

/* الحاويات الكبيرة في الموقع: فاتحة وهادئة */
html body .section-card,
html body .hero-card,
html body .header-box,
html body .wrap,
html body .container,
html body .panel,
html body .box,
html body .page-block,
html body .section-block{
    background:#fffdf8 !important;
    border-color:#e7dcc9 !important;
    box-shadow:0 10px 26px rgba(58,47,31,.055) !important;
}

/* الواجهة وباقي الموقع: بطاقات أوضح من الحاوية */
html body .family-card,
html body .person-card,
html body .item-card,
html body .public-card,
html body .result-card,
html body .member-card,
html body .child-card,
html body .home-card,
html body .stat-card,
html body .latest-card,
html body .photo-card,
html body .occasion-card,
html body .shabat-card,
html body .wedding-card,
html body .news-card,
html body .family-box,
html body .person-box,
html body .member-box{
    position:relative !important;
    background:linear-gradient(180deg, #fbf1df 0%, #f1dfc2 100%) !important;
    border:1px solid #c4a878 !important;
    box-shadow:
        0 10px 22px rgba(58,47,31,.13),
        inset 0 1px 0 rgba(255,255,255,.72) !important;
    color:#1c2b22 !important;
}

/* لمسة علوية هادئة للبطاقات العامة فقط */
html body .family-card::before,
html body .person-card::before,
html body .item-card::before,
html body .public-card::before,
html body .result-card::before,
html body .member-card::before,
html body .child-card::before,
html body .home-card::before,
html body .latest-card::before,
html body .photo-card::before,
html body .occasion-card::before,
html body .shabat-card::before,
html body .wedding-card::before,
html body .news-card::before,
html body .family-box::before,
html body .person-box::before,
html body .member-box::before{
    content:"";
    position:absolute;
    top:-1px;
    left:12px;
    right:12px;
    height:4px;
    border-radius:0 0 8px 8px;
    background:linear-gradient(90deg, #b98a43 0%, #2f6f4e 100%) !important;
    opacity:.55 !important;
    pointer-events:none;
}

/* إلغاء أي شريط سفلي سابق في البطاقات العامة */
html body .family-card::after,
html body .person-card::after,
html body .item-card::after,
html body .public-card::after,
html body .result-card::after,
html body .member-card::after,
html body .child-card::after,
html body .home-card::after,
html body .latest-card::after{
    opacity:0 !important;
}

/* المشجرة تحديدًا: فاتحة جدًا حتى لا تثقل عرض الأسماء */
html body .tree-wrap{
    background:#fffdf8 !important;
    border-color:#e9dece !important;
    box-shadow:0 10px 24px rgba(58,47,31,.045) !important;
}

html body .node-card,
html body .root-card{
    position:relative !important;
    background:#fff9ed !important;
    border:1px solid #dcc49b !important;
    box-shadow:
        0 7px 16px rgba(58,47,31,.085),
        inset 0 1px 0 rgba(255,255,255,.78) !important;
    color:#1c2b22 !important;
}

/* شريط المشجرة أخف بكثير من الواجهة */
html body .node-card::before,
html body .root-card::before{
    content:"";
    position:absolute;
    top:-1px;
    left:16px;
    right:16px;
    height:3px;
    border-radius:0 0 8px 8px;
    background:#2f6f4e !important;
    opacity:.30 !important;
    pointer-events:none;
}

html body .node-card::after,
html body .root-card::after{
    opacity:0 !important;
}

/* زر الاسم في المشجرة: واضح وخفيف */
html body .name-btn{
    background:#fffaf0 !important;
    color:#123b2a !important;
    border-color:#cfb98f !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.80) !important;
    text-shadow:none !important;
}

html body .name-btn:hover{
    background:#f7ecd6 !important;
    color:#0f3325 !important;
    border-color:#b89a66 !important;
}

/* أسماء البطاقات العامة: نص واضح بلا مستطيل إضافي */
html body .person-name,
html body .family-name,
html body .member-name,
html body .child-name,
html body .node-title,
html body .card-title,
html body .item-title,
html body .result-title,
html body .public-card h3,
html body .item-card h3,
html body .family-card h3,
html body .member-card h3,
html body .latest-card h3,
html body .root-card h3{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    color:#123b2a !important;
    text-shadow:none !important;
    font-weight:800 !important;
}

/* الإحصائيات الصغيرة في الواجهة */
html body .stat-box,
html body .count-box,
html body .meta-box,
html body .small-stat,
html body .family-stats span,
html body .person-meta span,
html body .card-stats span,
html body .mini-count,
html body .mini-stat{
    background:#fffaf0 !important;
    color:#4a4032 !important;
    border-color:#d0b789 !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.72) !important;
}

/* إحصائيات المشجرة أخف من بقية الموقع */
html body .node-sub{
    background:#fffdf7 !important;
    color:#5a5145 !important;
    border-color:#e0cfad !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.72) !important;
}

/* الشارات */
html body .badge,
html body .tag,
html body .pill,
html body .status-badge,
html body .new-badge{
    background:#edf7ea !important;
    color:#17613f !important;
    border-color:#9cc58f !important;
}

/* أزرار البطاقات العامة */
html body .family-card a.btn,
html body .person-card a.btn,
html body .item-card a.btn,
html body .public-card a.btn,
html body .result-card a.btn,
html body .member-card a.btn,
html body .child-card a.btn,
html body .family-box a.btn,
html body .person-box a.btn,
html body .member-box a.btn{
    background:#fffaf0 !important;
    color:#174631 !important;
    border-color:#c0a575 !important;
}

/* أزرار المشجرة أخف */
html body .root-actions a,
html body .node-actions a{
    background:#fffdf7 !important;
    color:#174631 !important;
    border-color:#d1bc95 !important;
}

html body .family-card a:hover,
html body .person-card a:hover,
html body .item-card a:hover,
html body .public-card a:hover,
html body .result-card a:hover,
html body .member-card a:hover,
html body .child-card a:hover,
html body .root-actions a:hover,
html body .node-actions a:hover,
html body .family-box a:hover,
html body .person-box a:hover,
html body .member-box a:hover{
    background:#245f43 !important;
    color:#fff !important;
    border-color:#245f43 !important;
}

/* الصور في البطاقات */
html body .child-photo,
html body .person-photo,
html body .avatar,
html body .photo-box,
html body .member-photo,
html body .family-photo{
    border-color:#c8ad80 !important;
    background:#fffaf0 !important;
    box-shadow:
        0 4px 12px rgba(58,47,31,.11),
        0 0 0 3px rgba(255,250,240,.78) !important;
}

/* صور المشجرة أهدأ */
html body .node-photo{
    border-color:#d8c39c !important;
    background:#fffaf0 !important;
    box-shadow:
        0 4px 10px rgba(58,47,31,.08),
        0 0 0 3px rgba(255,250,240,.72) !important;
}

/* البطاقة المحددة في المشجرة */
html body .node-card.selected{
    background:#fff6e8 !important;
    border-color:#2f6f4e !important;
    box-shadow:
        0 10px 22px rgba(47,111,78,.12),
        0 0 0 2px rgba(47,111,78,.09) !important;
}