@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&display=swap');

/* ======= DARK — خلفية داكنة + خطوط فاتحة ======= */
:root, [data-theme="dark"] {
    --bg:#0c1017; --bg2:#111822; --card:#161d2a; --card-hover:#1c2538;
    --border:rgba(255,255,255,0.07);
    --accent:#38bdf8; --accent-hover:#5ccbfa; --accent-bg:rgba(56,189,248,0.1);
    --green:#4ade80; --green-bg:rgba(74,222,128,0.1);
    --red:#f87171; --red-bg:rgba(248,113,113,0.1);
    --yellow:#facc15; --orange:#fb923c; --purple:#a78bfa;
    --text-bright:#ffffff; --text:#e8ecf4; --text-secondary:#b0bcd0; --text-muted:#8094a8;
    --label:#d0d8e4;
    --sidebar-bg:#0f1520; --sidebar-active:rgba(56,189,248,0.15);
    --sidebar-text:#b0bcd0; --sidebar-text-active:#38bdf8;
    --topbar-bg:#0f1520;
    --input-bg:#1a2332; --input-border:rgba(255,255,255,0.1); --input-text:#f0f4f8;
    --switch-off:#4a5568; --switch-on:#38bdf8;
    --card-title:#ffffff; --tab-active:#38bdf8; --tab-line:rgba(255,255,255,0.06);
    --body-text:#e0e6f0;
}

/* ======= GOLD — خلفية دافئة + خطوط ذهبية ======= */
[data-theme="gold"] {
    --bg:#0e0c08; --bg2:#15120c; --card:#1e1a10; --card-hover:#282216;
    --border:rgba(212,169,57,0.1);
    --accent:#d4a939; --accent-hover:#e0ba50; --accent-bg:rgba(212,169,57,0.1);
    --green:#6bcf6b; --green-bg:rgba(107,207,107,0.1);
    --red:#e8665a; --red-bg:rgba(232,102,90,0.1);
    --yellow:#f0c040; --orange:#e6963a; --purple:#c0a8e8;
    --text-bright:#fff8e8; --text:#f0e6d0; --text-secondary:#d0c0a0; --text-muted:#a09070;
    --label:#e0d4b8;
    --sidebar-bg:#12100a; --sidebar-active:rgba(212,169,57,0.15);
    --sidebar-text:#d0c0a0; --sidebar-text-active:#d4a939;
    --topbar-bg:#12100a;
    --input-bg:#221e14; --input-border:rgba(212,169,57,0.12); --input-text:#f5edd8;
    --switch-off:#5a5040; --switch-on:#d4a939;
    --card-title:#fff8e8; --tab-active:#d4a939; --tab-line:rgba(212,169,57,0.08);
    --body-text:#ede0c8;
}

/* ======= OCEAN — خلفية فاتحة + خطوط داكنة ======= */
[data-theme="ocean"] {
    --bg:#eaf4f8; --bg2:#dceef4; --card:#ffffff; --card-hover:#f0f7fa;
    --border:rgba(0,80,120,0.12);
    --accent:#0891b2; --accent-hover:#06748f; --accent-bg:rgba(8,145,178,0.08);
    --green:#059669; --green-bg:rgba(5,150,105,0.08);
    --red:#dc2626; --red-bg:rgba(220,38,38,0.08);
    --yellow:#b45309; --orange:#c2410c; --purple:#7c3aed;
    --text-bright:#0c2d3e; --text:#1a3a4a; --text-secondary:#4a6a7a; --text-muted:#7a9aaa;
    --label:#2a4a5a;
    --sidebar-bg:#ffffff; --sidebar-active:rgba(8,145,178,0.1);
    --sidebar-text:#4a6a7a; --sidebar-text-active:#0891b2;
    --topbar-bg:#ffffff;
    --input-bg:#f0f7fa; --input-border:rgba(0,80,120,0.15); --input-text:#1a3a4a;
    --switch-off:#b0c4cc; --switch-on:#0891b2;
    --card-title:#0c2d3e; --tab-active:#0891b2; --tab-line:rgba(0,80,120,0.1);
    --body-text:#1e3e50;
}
[data-theme="ocean"] .top-bar { box-shadow:0 1px 4px rgba(0,0,0,0.08); }
[data-theme="ocean"] .sidebar { border-left-color:rgba(0,80,120,0.1); box-shadow:-2px 0 8px rgba(0,0,0,0.04); }
[data-theme="ocean"] .card { box-shadow:0 1px 6px rgba(0,0,0,0.06); }
[data-theme="ocean"] .mode-demo { background:var(--green-bg); color:var(--green); border:1px solid rgba(5,150,105,0.2); }
[data-theme="ocean"] .mode-live { background:var(--red-bg); color:var(--red); border:1px solid rgba(220,38,38,0.2); }
[data-theme="ocean"] .btn-outline-light { border-color:var(--border) !important; color:var(--text-secondary) !important; }
[data-theme="ocean"] .btn-outline-light:hover { background:rgba(0,0,0,0.04) !important; color:var(--text) !important; }
[data-theme="ocean"] .badge.bg-dark { background:var(--bg2) !important; }
[data-theme="ocean"] .table-dark { --bs-table-bg:#f5fafc !important; --bs-table-border-color:rgba(0,80,120,0.08) !important; --bs-table-hover-bg:#eaf3f8 !important; --bs-table-color:var(--text) !important; }
[data-theme="ocean"] .bg-dark { background:var(--card) !important; }
[data-theme="ocean"] .border-secondary { border-color:var(--border) !important; }
[data-theme="ocean"] .text-light { color:var(--text-bright) !important; }

/* ======= أساسيات ======= */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Cairo',sans-serif;background:var(--bg);color:var(--body-text);font-size:15px;line-height:1.8;-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none} a:hover{color:var(--accent-hover)}
h1,h2,h3,h4,h5,h6{color:var(--card-title)}
p{color:var(--body-text)}

/* ======= الشريط العلوي ======= */
.top-bar{background:var(--topbar-bg)!important;border-bottom:1px solid var(--border);padding:10px 20px;z-index:100}
.top-bar .navbar-brand{color:var(--accent)!important;font-weight:800;font-size:17px}
.mode-badge{padding:5px 16px;border-radius:20px;font-size:13px;font-weight:700}
.mode-demo{background:var(--green-bg);color:var(--green);border:1px solid rgba(74,222,128,0.25)}
.mode-live{background:var(--red-bg);color:var(--red);border:1px solid rgba(248,113,113,0.25)}

/* ======= القائمة الجانبية ======= */
.sidebar{width:220px;min-height:calc(100vh - 56px);background:var(--sidebar-bg);border-left:1px solid var(--border);padding:14px 0;position:sticky;top:56px;flex-shrink:0}
.sidebar .nav-link{color:var(--sidebar-text)!important;padding:11px 20px;font-size:14px;font-weight:600;display:flex;align-items:center;gap:10px;border-right:3px solid transparent;transition:all .15s}
.sidebar .nav-link:hover{background:rgba(128,128,128,0.06);color:var(--card-title)!important}
.sidebar .nav-link.active{background:var(--sidebar-active);color:var(--sidebar-text-active)!important;border-right-color:var(--accent);font-weight:700}
.sidebar .nav-link i{font-size:18px;width:22px;text-align:center}

/* ======= المحتوى ======= */
.main-content{flex:1;padding:24px;min-height:calc(100vh - 56px);background:var(--bg)}

/* ======= الكروت — خطوط واضحة ======= */
.card{background:var(--card)!important;border:1px solid var(--border)!important;border-radius:12px}
.card-header{background:transparent!important;border-bottom:1px solid var(--border)!important;color:var(--card-title)!important;font-weight:700;font-size:15px;padding:14px 18px}
.card-header strong,.card-header h5,.card-header h6{color:var(--card-title)!important}
.card-body{padding:18px;color:var(--body-text)}
.card-body p,.card-body li,.card-body span,.card-body div{color:var(--body-text)}
.card-title,.card h3,.card h4,.card h5,.card h6{color:var(--card-title)!important}

/* ======= إحصائيات ======= */
.stat-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px;text-align:center}
.stat-card:hover{border-color:var(--accent)}
.stat-value{font-size:26px;font-weight:800;color:var(--card-title)}
.stat-label{font-size:14px;color:var(--text-secondary);margin-top:4px}

/* ======= جداول ======= */
.table{color:var(--body-text)!important;font-size:14px}
.table-dark{--bs-table-bg:var(--card)!important;--bs-table-border-color:var(--border)!important;--bs-table-hover-bg:var(--card-hover)!important;--bs-table-color:var(--body-text)!important}
.table thead th{background:var(--bg2)!important;color:var(--accent)!important;font-weight:700;font-size:13px;padding:10px 12px;border-color:var(--border)!important}
.table td{padding:10px 12px;border-color:var(--border)!important;color:var(--body-text)!important}

/* ======= أزرار ======= */
.btn-primary{background:var(--accent)!important;border-color:var(--accent)!important;color:#fff!important;font-weight:700;padding:8px 20px;border-radius:8px}
.btn-primary:hover{background:var(--accent-hover)!important}
.btn-outline-light{border-color:var(--border)!important;color:var(--text-secondary)!important}

/* ======= حقول — خطوط واضحة ======= */
.form-control,.form-select{background:var(--input-bg)!important;border:1px solid var(--input-border)!important;color:var(--input-text)!important;font-size:15px;border-radius:8px;padding:10px 14px}
.form-control:focus,.form-select:focus{border-color:var(--accent)!important;box-shadow:0 0 0 3px var(--accent-bg)!important}
.form-control::placeholder{color:var(--text-muted)!important}
.form-label{font-size:14px;color:var(--label)!important;font-weight:600;margin-bottom:6px}

/* ======= تبويبات ======= */
.nav-tabs{border-bottom:2px solid var(--tab-line)!important}
.nav-tabs .nav-link{color:var(--text-muted)!important;border:none!important;font-weight:600;font-size:15px;padding:10px 20px;border-bottom:3px solid transparent!important}
.nav-tabs .nav-link:hover{color:var(--text)!important}
.nav-tabs .nav-link.active{color:var(--tab-active)!important;background:transparent!important;border-bottom-color:var(--tab-active)!important}

/* ======= Switches ======= */
.form-check-input{width:44px;height:24px;background-color:var(--switch-off)!important;border:none!important;cursor:pointer}
.form-check-input:checked{background-color:var(--switch-on)!important}
.form-check-label{font-size:14px;color:var(--body-text)!important}

/* ======= نصوص مساعدة ======= */
.text-light{color:var(--card-title)!important}
.text-muted{color:var(--text-muted)!important}
.text-success{color:var(--green)!important}
.text-danger{color:var(--red)!important}
.text-warning{color:var(--yellow)!important}
.text-info{color:var(--accent)!important}
.text-primary{color:var(--accent)!important}
small,.small{color:var(--text-secondary)!important}
strong{color:var(--card-title)!important}
.badge{font-weight:700;font-size:12px;padding:4px 10px;border-radius:6px}
.alert{border-radius:10px;font-size:14px;font-weight:600}

/* ======= زر التبديل ======= */
.theme-toggle{background:var(--card);border:1px solid var(--border);color:var(--text-secondary);width:38px;height:38px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:18px;transition:all .2s}
.theme-toggle:hover{border-color:var(--accent);color:var(--accent)}

/* ======= Modal ======= */
.modal-content{background:var(--card)!important;border-color:var(--border)!important;border-radius:12px}
.modal-header,.modal-footer{border-color:var(--border)!important}
.modal-body{color:var(--body-text)}
.modal-title{color:var(--card-title)!important}

/* ======= Login ======= */
.auth-body{background:var(--bg);min-height:100vh}
.auth-container{min-height:100vh;display:flex;align-items:center;justify-content:center}
.auth-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:40px;width:100%;max-width:420px}
.auth-header{text-align:center;margin-bottom:30px}
.auth-icon{font-size:40px;color:var(--accent)}

/* ======= Scrollbar ======= */
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--switch-off);border-radius:3px}

/* ======= Responsive ======= */
@media(max-width:768px){.sidebar{display:none}.main-content{padding:16px}.stat-value{font-size:20px}body{font-size:14px}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.4}}

/* === Stat Card Fix === */
.stat-info { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.stat-label { font-size: 13px; color: var(--text-secondary); display: block; margin-bottom: 6px; }
.stat-value { font-size: 24px; font-weight: 800; display: block; }