:root { --gold: #bfa062; --dark: #333; --black: #000; --white: #fff; } body { font-family: "Tahoma", sans-serif; margin: 0; background: #f9f9f9; } .dashboard-sidebar { margin: 20px 0px; width: 100%; background: #fff; border: 1px solid #ddd; } .dashboard-sidebar .dashboard-menu { list-style: none; margin: 0; padding: 0; } .dashboard-sidebar .dashboard-menu li a { text-decoration: none; display: block; color: var(--primary) !important; padding: 14px 18px; cursor: pointer; position: relative; transition: background 0.3s ease; } .dashboard-sidebar .dashboard-menu li a:not(:nth-child(1)) { border-top: 1px #ddd solid; } .dashboard-sidebar .dashboard-menu li a.active, .dashboard-sidebar .dashboard-menu li a:hover { background-color: var(--primary); color: var(--white) !important; } const currentPath = window.location.pathname; document.querySelectorAll('.dashboard-menu li a').forEach(link => { if (currentPath.startsWith(link.getAttribute('href'))) { link.parentElement.classList.add('active'); } });
.dashboard-left { padding: 20px; max-width: 800px; } .user-info { font-size: 19px; margin-bottom: 10px; } .user-info .welcome-message { font-size: 16px; color: #838383; } .user-info strong { font-weight: bold; } .subscription { background: var(--primary); color: var(--white); padding: 8px 12px; margin: 15px 0; display: flex; justify-content: space-between; align-items: center; font-size: 14px; } .subscription .vip { color: var(--gold); font-weight: bold; display: flex; align-items: center; gap: 5px; } .features { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; margin-top: 20px; } .feature-box { border: 1px solid #ddd; border-radius: 8px; padding: 25px 10px; text-align: center; font-size: 14px; background: #fff; cursor: pointer; transition: box-shadow 0.3s ease; } .feature-box .icon { margin-bottom: 15px; } .feature-box:hover { box-shadow: 0 2px 6px rgba(0,0,0,0.15); } .feature-box i { font-size: 28px; display: block; margin-bottom: 8px; color: var(--gold); } @media(max-width:640px) { .features { grid-template-columns: repeat(2, 1fr); gap: 10px; } } html.dark-mode .feature-box { color: var(--primary) !important; } html.dark-mode .feature-box:nth-child(1) svg { fill: unset !important; } html.dark-mode .feature-box:nth-child(1) svg path { stroke: var(--gold) !important; fill: none !important; } html.dark-mode .feature-box svg { fill: var(--gold) !important; } html.dark-mode .feature-box svg path { fill: var(--gold) !important; }
King Icon
ميزات vip
تاريخ الإنتهاء {{ static_widget_23523_widget.expiry_date }}
تصفح عدد اليوم
بحث متقدم
إرسال الصورة