/* الوضع الليلي — متغيرات على لتغطية كل الصفحات (بما فيها الكاشير) */
html[data-theme="dark"] {
color-scheme: dark;
--bg: #141210;
--surface: #1f1c19;
--surface-elevated: #262320;
--border: #3a3530;
--text: #f5f0e8;
--muted: #a89f94;
--brand-lt: #2a261f;
--accent-soft: #3d3528;
--shadow: 0 2px 16px rgba(0, 0, 0, 0.35);
--shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.5);
--header-bg: rgba(31, 28, 25, 0.94);
--overlay-bg: rgba(10, 9, 8, 0.72);
--input-bg: #141210;
--alert-success-bg: #1a2e22;
--alert-success-text: #8fd4a8;
--alert-danger-bg: #2e1a1a;
--alert-danger-text: #f0a8a8;
--alert-info-bg: #1a2438;
--alert-info-text: #a8c8f0;
--badge-cash-bg: #1a2e22;
--badge-card-bg: #1a2438;
--badge-transfer-bg: #2e2818;
--table-hover: rgba(212, 175, 55, 0.06);
}
html[data-theme="dark"] body {
background: var(--bg);
color: var(--text);
}
/* ── رأس الصفحة والتنقل ── */
html[data-theme="dark"] .app-header,
html[data-theme="dark"] .pos-header {
background: var(--header-bg);
border-color: var(--border);
}
html[data-theme="dark"] .app-nav a:hover,
html[data-theme="dark"] .app-nav a.active {
background: var(--brand-lt);
color: var(--brand);
}
/* ── بطاقات ومحتوى ── */
html[data-theme="dark"] .card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .quick-card,
html[data-theme="dark"] .login-box,
html[data-theme="dark"] body.admin-panel .section,
html[data-theme="dark"] body.admin-panel .panel-header,
html[data-theme="dark"] body.admin-panel .panel-nav a,
html[data-theme="dark"] body.admin-panel .form-group {
background: var(--surface);
border-color: var(--border);
color: var(--text);
}
html[data-theme="dark"] body.admin-panel .category-group {
background: color-mix(in srgb, var(--brand) 8%, var(--surface));
}
html[data-theme="dark"] .table th {
background: var(--brand-lt);
color: var(--text);
}
html[data-theme="dark"] .table tr:hover td {
background: var(--table-hover);
}
html[data-theme="dark"] .table-wrap {
border-color: var(--border);
}
/* ── حقول ونماذج ── */
html[data-theme="dark"] .form-input,
html[data-theme="dark"] .field input,
html[data-theme="dark"] .field select,
html[data-theme="dark"] .field textarea,
html[data-theme="dark"] .tab-btn {
background: var(--input-bg);
color: var(--text);
border-color: var(--border);
}
html[data-theme="dark"] .form-input:focus,
html[data-theme="dark"] .field input:focus,
html[data-theme="dark"] .field select:focus,
html[data-theme="dark"] .field textarea:focus {
background: var(--surface);
border-color: var(--accent);
}
html[data-theme="dark"] .btn-ghost {
color: var(--muted);
border-color: var(--border);
}
html[data-theme="dark"] .btn-ghost:hover {
background: var(--brand-lt);
color: var(--text);
}
html[data-theme="dark"] .btn-secondary {
background: var(--brand-lt);
color: var(--text);
border-color: var(--border);
}
/* ── تنبيهات وشارات ── */
html[data-theme="dark"] .alert-success {
background: var(--alert-success-bg);
color: var(--alert-success-text);
}
html[data-theme="dark"] .alert-danger {
background: var(--alert-danger-bg);
color: var(--alert-danger-text);
}
html[data-theme="dark"] .alert-info {
background: var(--alert-info-bg);
color: var(--alert-info-text);
}
html[data-theme="dark"] .badge-cash {
background: var(--badge-cash-bg);
}
html[data-theme="dark"] .badge-card {
background: var(--badge-card-bg);
}
html[data-theme="dark"] .badge-transfer {
background: var(--badge-transfer-bg);
}
html[data-theme="dark"] body.admin-panel .badge-active {
background: var(--badge-cash-bg);
}
html[data-theme="dark"] body.admin-panel .badge-inactive,
html[data-theme="dark"] body.admin-panel .badge-low {
background: var(--alert-danger-bg);
}
/* ── كاشير (POS) ── */
html[data-theme="dark"] body.pos-page {
background:
radial-gradient(ellipse 100% 60% at 100% 0%, rgba(212, 175, 55, 0.06), transparent 50%),
radial-gradient(ellipse 80% 60% at 0% 100%, rgba(154, 123, 79, 0.05), transparent 45%),
var(--bg);
}
html[data-theme="dark"] .pos-toolbar,
html[data-theme="dark"] .svc-card,
html[data-theme="dark"] .search-bar,
html[data-theme="dark"] .modal,
html[data-theme="dark"] .modal-dialog,
html[data-theme="dark"] .card--cart,
html[data-theme="dark"] .pay-panel,
html[data-theme="dark"] .client-picker,
html[data-theme="dark"] .discount-box {
background: var(--surface);
border-color: var(--border);
color: var(--text);
}
html[data-theme="dark"] .search-bar,
html[data-theme="dark"] .search-bar input,
html[data-theme="dark"] .cart-item-body,
html[data-theme="dark"] .svc-card .svc-meta {
background: var(--input-bg);
color: var(--text);
}
html[data-theme="dark"] .search-bar input:focus {
background: var(--surface);
}
html[data-theme="dark"] .cat-tab {
background: var(--surface);
color: var(--muted);
border-color: var(--border);
}
html[data-theme="dark"] .cat-tab.active {
background: linear-gradient(135deg, var(--brand), var(--brand-dk));
color: #fff;
border-color: transparent;
}
html[data-theme="dark"] .pos-cart-pill {
background: linear-gradient(135deg, var(--accent-soft), var(--surface-elevated));
color: var(--text);
}
html[data-theme="dark"] .pos-mobile-nav {
background: var(--header-bg);
border-color: var(--border);
}
html[data-theme="dark"] .pos-sticky-pay {
background: linear-gradient(135deg, #0f0e0c, var(--surface));
border-color: var(--border);
}
html[data-theme="dark"] .success-screen {
background: linear-gradient(180deg, var(--surface), var(--bg));
}
html[data-theme="dark"] .overlay {
background: var(--overlay-bg);
}
html[data-theme="dark"] .toast {
background: var(--surface-elevated);
color: var(--text);
border-color: var(--border);
}
html[data-theme="dark"] .cart-item,
html[data-theme="dark"] .cart-summary,
html[data-theme="dark"] .totals-block {
background: var(--surface);
border-color: var(--border);
}
html[data-theme="dark"] .pay-tab {
background: var(--surface);
color: var(--muted);
border-color: var(--border);
}
html[data-theme="dark"] .pay-tab.active {
background: var(--accent-soft);
color: var(--text);
border-color: var(--accent);
}
/* تعطيل لمعان 3D الأبيض في الوضع الداكن */
html[data-theme="dark"] .card::before,
html[data-theme="dark"] .stat-card::before,
html[data-theme="dark"] .quick-card::before,
html[data-theme="dark"] .svc-card::before {
display: none;
}
html[data-theme="dark"] .card:hover,
html[data-theme="dark"] .stat-card:hover,
html[data-theme="dark"] .quick-card:hover,
html[data-theme="dark"] .svc-card:hover {
box-shadow: var(--shadow-lg) !important;
}
/* معاينة الفاتورة */
html[data-theme="dark"] .invoice-view-page {
background: var(--bg);
color: var(--text);
}
html[data-theme="dark"] .view-toolbar {
background: var(--surface);
color: var(--text);
border-bottom: 1px solid var(--border);
}
html[data-theme="dark"] .view-btn {
border-color: var(--border);
color: var(--text);
}
html[data-theme="dark"] .view-btn:hover {
background: var(--brand-lt);
}
/* ورقة الإيصال تبقى فاتحة للطباعة والـ PDF */
html[data-theme="dark"] .receipt-paper {
background: #fff;
color: #1a1510;
}
.theme-toggle {
min-width: 40px;
padding: 6px 10px !important;
font-size: 18px;
line-height: 1;
}