body { background-color: #f4f6f9; font-family: 'Segoe UI', Tahoma, Arial, sans-serif; } .navbar-brand { font-weight: 700; } /* * .navbar و.refresh-bar إخوة مباشرين تحت ، وكل واحد فيهم بياخد position (relative/sticky). * من غير z-index أعلى للـ navbar، الـ dropdown-menu بتاعها (z-index:1000 افتراضي من Bootstrap) * بيتقارن مباشرة مع z-index بتاع .refresh-bar في الـ stacking context الجذري، فيخسر ويتغطى. * الحل: نخلي .navbar كلها (بكل اللي جواها زي الـ dropdown) تاخد stacking context أعلى من الشريط. */ .navbar { position: relative; z-index: 1030; } .navbar .dropdown-menu { z-index: 1035; } .refresh-bar { background-color: #fff; border-bottom: 1px solid #e3e6eb; position: sticky; top: 0; z-index: 1020; } .refresh-bar #refreshDataBtn { white-space: nowrap; } .zero-note { line-height: 1.4; } .card { border: none; border-radius: 0.75rem; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06); } .card-link-plan, .card-link-account { text-decoration: none; color: inherit; display: block; transition: transform 0.15s ease, box-shadow 0.15s ease; } .card-link-plan:hover, .card-link-account:hover { transform: translateY(-3px); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12); } .section-gateway-card { border: 2px solid #e9ecef; } .section-gateway-card:hover { border-color: #0d6efd; } .section-gateway-icon { font-size: 2.5rem; } .pnl-table th, .pnl-table td { vertical-align: middle; } .row-total { font-weight: 700; background-color: #eef2f7; } .amount-positive { color: #198754; } .amount-negative { color: #dc3545; } /* تقرير مقارنة الفروع: جدول أفقي بعمود بنود ثابت (Sticky) أثناء التمرير الأفقي */ .compare-table-wrap { max-height: 75vh; } .compare-table { min-width: 100%; } .compare-table th, .compare-table td { white-space: nowrap; vertical-align: middle; } .compare-table .sticky-col { position: sticky; inset-inline-start: 0; background-color: #fff; z-index: 2; box-shadow: -2px 0 4px rgba(0, 0, 0, 0.06); } .compare-table thead .sticky-col { z-index: 3; background-color: #f8f9fa; } .compare-table .table-total-col { background-color: #eef2f7; font-weight: 600; } /* * نظام ألوان موحّد لصفحة الإحصائيات (insights.php) - نفس الألوان دي بتتكرر في كل بطاقة * ورسم بياني في الصفحة بدل ما كل رسم يختار ألوانه العشوائية الخاصة: * - أخضر (positive) لأي حاجة إيجابية (ربح، أعلى أداء) - نفس أخضر amount-positive بالظبط. * - أحمر (negative) لأي حاجة سلبية (خسارة، أقل أداء) - نفس أحمر amount-negative بالظبط. * - رمادي (muted) للمؤشرات المحايدة اللي مش بالضرورة سلبية. * - أزرق (neutral) للإجماليات العامة (مش إشارة ربح/خسارة، مجرد رقم كلي). * - 3 ألوان تصنيفية (cat-1/2/3) لتمييز الكيانات (الخطط) في الرسوم الدائرية والمقارنات - * نفس اللون بيتكرر لنفس الخطة في كل الرسوم عشان الهوية تفضل ثابتة. */ :root { --viz-positive: #198754; --viz-positive-dark: #146c43; --viz-negative: #dc3545; --viz-negative-dark: #a02531; --viz-neutral: #2a78d6; --viz-neutral-dark: #1c5cab; --viz-muted: #6c757d; --viz-muted-dark: #565e64; --viz-cat-1: #2a78d6; --viz-cat-2: #eb6834; --viz-cat-3: #1baf7a; --viz-cat-4: #eda100; --viz-cat-5: #4a3aa7; } .stat-card { border-radius: 0.75rem; padding: 1.25rem; color: #fff; } .stat-card.bg-best { background: linear-gradient(135deg, var(--viz-positive), var(--viz-positive-dark)); } .stat-card.bg-worst { background: linear-gradient(135deg, var(--viz-negative), var(--viz-negative-dark)); } .stat-card.bg-info-custom { background: linear-gradient(135deg, var(--viz-neutral), var(--viz-neutral-dark)); } .stat-card.bg-muted-custom { background: linear-gradient(135deg, var(--viz-muted), var(--viz-muted-dark)); } .sortable-table th.sortable { cursor: pointer; user-select: none; white-space: nowrap; } .sortable-table th.sortable .sort-indicator { font-size: 0.7em; opacity: 0.5; margin-inline-start: 0.25rem; } .sortable-table th.sortable.sort-active .sort-indicator { opacity: 1; } .tree-level-badge { display: inline-block; min-width: 1.5rem; text-align: center; } .breadcrumb-nav a { text-decoration: none; } .login-wrapper { min-height: 80vh; display: flex; align-items: center; justify-content: center; } .login-card { max-width: 400px; width: 100%; } @media (max-width: 576px) { .stat-card { margin-bottom: 1rem; } }