:root{--red:#b50920;--red2:#8e0015;--red3:#d52a42;--soft:#fff1f3;--ink:#171a21;--muted:#7b8492;--line:#e9ecf1;--bg:#f4f6f9;--white:#fff;--green:#1da765;--amber:#e89b13;--blue:#3677d9;--shadow:0 12px 35px rgba(20,28,43,.07)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:"Segoe UI",Tahoma,Arial,sans-serif;font-size:14px}.sidebar{position:fixed;right:0;top:0;bottom:0;width:292px;background:linear-gradient(160deg,#69000e,#a4071c 52%,#7f0012);color:#fff;z-index:1050;display:flex;flex-direction:column;box-shadow:-18px 0 45px rgba(24,25,35,.14);transition:.25s}.brand{height:88px;display:flex;align-items:center;gap:11px;padding:0 17px;border-bottom:1px solid rgba(255,255,255,.11)}.brand-logo{width:47px;height:47px;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 8px 22px rgba(0,0,0,.16)}.brand-logo img{width:100%;height:100%}.brand-copy b{display:block;font-size:21px;letter-spacing:2px}.brand-copy small{display:block;font-size:9px;opacity:.68;margin-top:2px}.sidebar-collapse{margin-right:auto;width:32px;height:32px;border:0;border-radius:9px;background:rgba(255,255,255,.1);color:#fff}.side-user{margin:17px 13px 11px;padding:13px;border-radius:17px;background:rgba(255,255,255,.085);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;gap:11px}.avatar,.header-avatar{display:grid;place-items:center;font-weight:900}.avatar{width:44px;height:44px;border-radius:13px;background:#fff;color:var(--red);font-size:17px}.side-user b,.side-user small{display:block}.side-user b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:185px}.side-user small{font-size:10px;opacity:.66;margin-top:3px}.side-nav{padding:0 10px;overflow:auto}.nav-label{font-size:9px;opacity:.43;padding:14px 13px 6px;font-weight:800}.side-nav a{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none;padding:11px 13px;border-radius:12px;margin:3px 0;font-size:13px;transition:.18s}.side-nav a:hover{background:rgba(255,255,255,.1);transform:translateX(-2px)}.side-nav a.active{background:#fff;color:var(--red);font-weight:800;box-shadow:0 8px 24px rgba(0,0,0,.12)}.side-nav i{font-size:17px;width:22px;text-align:center}.side-bottom{margin-top:auto;padding:12px 14px 16px}.support-mini{display:flex;gap:10px;align-items:center;padding:11px;border-radius:13px;background:rgba(0,0,0,.12);margin-bottom:10px}.support-mini i{font-size:20px}.support-mini b,.support-mini small{display:block}.support-mini b{font-size:10px}.support-mini small{font-size:9px;opacity:.6}.logout{display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;color:#fff;border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:10px;font-weight:700;font-size:12px}.logout:hover{background:#fff;color:var(--red)}.main-area{margin-right:292px;min-height:100vh;display:flex;flex-direction:column;transition:.25s}.top-header{height:84px;background:rgba(255,255,255,.94);backdrop-filter:blur(13px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 31px;position:sticky;top:0;z-index:100}.header-left,.header-actions,.header-user{display:flex;align-items:center}.header-left{gap:14px}.eyebrow{display:block;color:var(--red);font-size:8px;font-weight:900;letter-spacing:1.6px;margin-bottom:3px}.menu-btn{display:none;border:0;background:var(--soft);color:var(--red);font-size:23px;border-radius:11px;width:43px;height:43px}.header-actions{gap:18px}.system-status{display:flex;align-items:center;gap:7px;color:#687180;font-size:11px}.system-status span{width:7px;height:7px;border-radius:50%;background:#25b873;box-shadow:0 0 0 4px rgba(37,184,115,.12)}.header-user{gap:9px}.header-avatar{width:38px;height:38px;border-radius:11px;background:var(--soft);color:var(--red)}.header-user-info b,.header-user-info small{display:block}.header-user-info b{font-size:11px}.header-user-info small{font-size:9px;color:var(--muted);margin-top:2px}.header-user>a{color:var(--red);font-size:20px;margin-right:6px}.icon-btn{position:relative;border:0;background:#f7f8fa;width:39px;height:39px;border-radius:11px;color:#535c69;font-size:17px}.icon-btn:hover{background:var(--soft);color:var(--red)}.notif-dot{position:absolute;top:-4px;left:-4px;min-width:17px;height:17px;border-radius:9px;background:var(--red);color:#fff;font-size:8px;display:grid;place-items:center;border:2px solid #fff}.notification-menu{width:300px;border:0;border-radius:16px;box-shadow:0 20px 55px rgba(20,25,35,.16);overflow:hidden}.notif-head{padding:14px 16px;background:#fff7f8;display:flex;justify-content:space-between}.notif-head small{color:var(--red)}.notif-item{display:flex;gap:12px;padding:13px 15px;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line)}.notif-item:hover{background:#fafbfc}.notif-item>i{color:var(--red);font-size:18px}.notif-item b,.notif-item small{display:block}.notif-item b{font-size:12px}.notif-item small{font-size:10px;color:var(--muted);margin-top:2px}.page-content{padding:30px;flex:1;max-width:1800px;width:100%;margin:auto}.footer{display:flex;justify-content:space-between;align-items:center;padding:13px 30px;background:#fff;border-top:1px solid var(--line);color:#8b94a2;font-size:10px}.footer-dot{display:inline-block;width:6px;height:6px;background:#25b873;border-radius:50%;margin-left:5px}.cardx{background:#fff;border:1px solid var(--line);border-radius:19px;box-shadow:var(--shadow)}.hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#67000e,#b50920 58%,#e23a50);color:#fff;border-radius:23px;padding:32px;box-shadow:0 20px 48px rgba(181,9,32,.19)}.hero:after{content:"";position:absolute;width:310px;height:310px;border:42px solid rgba(255,255,255,.06);border-radius:50%;left:-115px;top:-150px}.hero>*{position:relative;z-index:1}.stat{padding:18px;position:relative;overflow:hidden;min-height:145px;transition:.18s}.stat:hover{transform:translateY(-3px);box-shadow:0 16px 42px rgba(24,31,45,.1)}.stat:after{content:"";position:absolute;width:105px;height:105px;border-radius:50%;background:var(--soft);left:-35px;bottom:-52px}.stat .ic{width:47px;height:47px;border-radius:14px;background:var(--soft);color:var(--red);display:grid;place-items:center;font-size:19px}.stat h3{font-size:28px;font-weight:900;margin:9px 0 1px}.muted,.text-muted{color:var(--muted)!important}.btn-mega{background:var(--red);color:#fff;border-color:var(--red);font-weight:800;border-radius:11px;padding:.62rem 1rem;box-shadow:0 7px 17px rgba(181,9,32,.14)}.btn-mega:hover{background:var(--red2);border-color:var(--red2);color:#fff;transform:translateY(-1px)}.form-control,.form-select{border-radius:11px;padding:.68rem .78rem;border-color:#dfe3ea}.form-control:focus,.form-select:focus{border-color:#df5264;box-shadow:0 0 0 .22rem rgba(181,9,32,.08)}.form-label{font-weight:700;font-size:12px}.table{margin-bottom:0}.table>thead{background:#fff5f6}.table>thead th{color:#5c6472;font-size:11px;font-weight:800;border-bottom:1px solid #f0dfe2;padding:13px}.table>tbody td{padding:13px;border-color:#eef0f4;font-size:12px}.table>tbody tr:hover{background:#fffafb}.badge-soft{padding:.48rem .7rem;border-radius:9px;background:var(--soft);color:var(--red);font-size:11px;font-weight:800}.modal-content{border:0;border-radius:20px;box-shadow:0 25px 80px rgba(0,0,0,.2)}.modal-header{border-bottom:1px solid var(--line);padding:18px 22px}.modal-footer{border-top:1px solid var(--line);padding:14px 22px}.page-title{font-weight:900}.action-btns{white-space:nowrap}.action-btns .btn{border-radius:8px;font-size:11px}.empty{padding:55px;text-align:center;color:var(--muted)}.empty i{display:block;font-size:35px;color:#d5dae3;margin-bottom:12px}.alert-modern{border:0;border-radius:13px;display:flex;align-items:center;gap:9px}.login{min-height:100vh;background:radial-gradient(circle at 15% 20%,rgba(255,255,255,.08),transparent 30%),linear-gradient(135deg,#5d000c,#c70822);display:grid;place-items:center;padding:25px}.loginbox{width:94%;max-width:1050px;background:#fff;border-radius:26px;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.28)}.loginart{padding:60px;background:linear-gradient(145deg,#72000f,#b50920 65%,#e43449);color:#fff}.loginform{padding:55px}.setup-page{min-height:100vh;background:#f7f7f9;display:grid;place-items:center}.setup-card{max-width:650px;background:#fff;border-radius:24px;padding:40px;box-shadow:0 20px 60px rgba(0,0,0,.1)}.brand-big{font-size:44px;font-weight:900;color:var(--red);letter-spacing:3px}code{color:var(--red2);background:var(--soft);padding:2px 5px;border-radius:5px}a{color:var(--red)}.dashboard-chart{height:290px}.quick-card{height:100%;padding:19px;display:flex;align-items:center;gap:13px;text-decoration:none;color:var(--ink);transition:.18s}.quick-card:hover{transform:translateY(-3px);color:var(--red)}.quick-icon{width:45px;height:45px;border-radius:13px;background:var(--soft);color:var(--red);display:grid;place-items:center;font-size:18px}.mini-progress{height:7px;background:#edf0f4;border-radius:10px;overflow:hidden}.mini-progress>span{display:block;height:100%;background:var(--red);border-radius:10px}.sidebar.collapsed{width:82px}.sidebar.collapsed .brand-copy,.sidebar.collapsed .user-copy,.sidebar.collapsed .nav-label,.sidebar.collapsed .side-nav a span,.sidebar.collapsed .support-mini div,.sidebar.collapsed .logout span{display:none}.sidebar.collapsed .brand{justify-content:center;padding:0 10px}.sidebar.collapsed .sidebar-collapse{position:absolute;left:8px}.sidebar.collapsed .side-user{justify-content:center}.sidebar.collapsed .side-nav a{justify-content:center}.main-area.collapsed-main{margin-right:82px}.sidebar-overlay{display:none}@media(max-width:1100px){.system-status{display:none}}@media(max-width:900px){.sidebar{right:-292px}.sidebar.open{right:0}.main-area,.main-area.collapsed-main{margin-right:0}.menu-btn{display:block}.sidebar-collapse{display:none}.sidebar-overlay.show{display:block;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:1040}.page-content{padding:20px}.top-header{padding:0 16px}.header-user-info{display:none}.header-user>a{display:none}}@media(max-width:600px){.page-content{padding:14px}.hero{padding:23px}.footer{padding:12px 14px}.notification-menu{width:280px}.loginform{padding:30px 23px}.loginart{padding:35px 25px}} .btn-loading{opacity:.8;pointer-events:none} .ai-badge{display:inline-flex;align-items:center;gap:5px;background:linear-gradient(135deg,#a6071d,#e52b43);color:#fff;border-radius:999px;padding:6px 12px;font-weight:800;font-size:12px}.ai-result{background:#fff7f8;border:1px solid #f1c7ce;border-radius:18px;overflow:hidden}.ai-result-head{padding:14px 18px;background:#a6071d;color:#fff;display:flex;gap:10px;align-items:center}.ai-result #aiText{padding:20px;line-height:1.9}.ai-result ul{margin-top:8px}.ai-tips>div{display:flex;gap:12px;padding:13px 0;border-bottom:1px solid #eee}.ai-tips>div:last-child{border-bottom:0}.ai-tips i{color:#a6071d;font-size:20px}.ai-loading{padding:15px;text-align:center;color:#777}.btn-mega{background:#a6071d;color:#fff;border:0}.btn-mega:hover{background:#870516;color:#fff} /* ========================= MEGA Theme Switcher Light / Dark Mode ========================= */ :root{color-scheme:light} body.theme-dark{color-scheme:dark;--bg:#111318;--white:#191c23;--ink:#f3f4f6;--muted:#a4acb8;--line:#2b303a;--soft:#35151b;--shadow:0 16px 45px rgba(0,0,0,.28);background:var(--bg);color:var(--ink)} body.theme-dark .top-header{background:rgba(25,28,35,.94);border-color:var(--line)} body.theme-dark .footer{background:#191c23;border-color:var(--line);color:#9aa3b1} body.theme-dark .cardx,.theme-dark .cardx{background:#191c23;border-color:var(--line);color:var(--ink)} body.theme-dark .table{--bs-table-bg:#191c23;--bs-table-color:#eef0f3;--bs-table-border-color:#2b303a} body.theme-dark .table>thead{background:#24171a} body.theme-dark .table>thead th{color:#d7dbe2;border-color:#402329} body.theme-dark .table>tbody td{border-color:#2b303a} body.theme-dark .table>tbody tr:hover{background:#21191c} body.theme-dark .form-control,body.theme-dark .form-select{background:#15181e;border-color:#353b46;color:#f3f4f6} body.theme-dark .form-control::placeholder{color:#7f8997} body.theme-dark .form-control:focus,body.theme-dark .form-select:focus{background:#15181e;color:#fff} body.theme-dark .form-label{color:#e4e7ec} body.theme-dark .icon-btn{background:#242831;color:#dce0e6} body.theme-dark .icon-btn:hover{background:#35151b;color:#ff6173} body.theme-dark .notification-menu{background:#191c23;color:#f3f4f6} body.theme-dark .notif-head{background:#24171a} body.theme-dark .notif-item{color:#eef0f3;border-color:#2b303a} body.theme-dark .notif-item:hover{background:#22262e} body.theme-dark .modal-content{background:#191c23;color:#f3f4f6} body.theme-dark .modal-header,body.theme-dark .modal-footer{border-color:#2b303a} body.theme-dark .dropdown-menu{background:#191c23;border-color:#343943} body.theme-dark .dropdown-item{color:#e8ebef} body.theme-dark .dropdown-item:hover{background:#242831;color:#fff} body.theme-dark .text-dark{color:#f3f4f6!important} body.theme-dark .bg-white{background:#191c23!important} body.theme-dark .bg-light{background:#22262e!important} body.theme-dark .border{border-color:#2b303a!important} body.theme-dark .border-bottom{border-color:#2b303a!important} body.theme-dark .breadcrumb,.theme-dark .breadcrumb{color:#9da5b2} body.theme-dark .quick-card{color:#f3f4f6} body.theme-dark .mini-progress{background:#303540} body.theme-dark .empty i{color:#606978} body.theme-dark .ai-result{background:#24171a;border-color:#572631} body.theme-dark .ai-nav-link em{background:rgba(255,255,255,.12);color:#ff8290} body.theme-dark .header-ai-btn{background:rgba(181,9,32,.15);border-color:rgba(255,91,112,.18);color:#ff7a89} body.theme-dark .setup-page{background:#111318} body.theme-dark .setup-card{background:#191c23;color:#f3f4f6} .theme-toggle{width:40px;height:40px;border:1px solid var(--line);border-radius:11px;background:var(--white);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:.18s;font-size:17px;box-shadow:0 4px 12px rgba(20,28,43,.05)} .theme-toggle:hover{color:var(--red);border-color:rgba(181,9,32,.3);transform:translateY(-1px)} .theme-toggle .sun-icon{display:none}.theme-dark .theme-toggle .moon-icon{display:none}.theme-dark .theme-toggle .sun-icon{display:inline-block} .theme-label{font-size:10px;font-weight:800;color:var(--muted);white-space:nowrap} @media(max-width:700px){.theme-label{display:none}.theme-toggle{width:38px;height:38px}} html.theme-preload-dark body{background:#111318;color:#f3f4f6} .login-theme-toggle{position:fixed;top:22px;left:22px;z-index:20;background:rgba(255,255,255,.9)} body.theme-dark.login{background:radial-gradient(circle at 15% 20%,rgba(255,255,255,.04),transparent 30%),linear-gradient(135deg,#160208,#41000a)} body.theme-dark .loginbox{background:#191c23;color:#f3f4f6} body.theme-dark .loginart{background:linear-gradient(145deg,#320008,#8e0015 65%,#b50920)} body.theme-dark .loginform{background:#191c23} body.theme-dark .loginform .text-muted{color:#a4acb8!important} body.theme-dark .loginform .bg-light{background:#22262e!important;color:#e8ebef} body.theme-dark .login-theme-toggle{background:#191c23;color:#f3f4f6;border-color:#353b46} /* ========================= Floating MEGA AI Assistant ========================= */ .mega-ai-float{position:fixed;left:24px;bottom:24px;z-index:1080;direction:rtl}.mega-ai-fab{position:relative;width:62px;height:62px;border:0;border-radius:20px;background:linear-gradient(145deg,#a6071d,#d92843);color:#fff;font-size:25px;display:grid;place-items:center;cursor:pointer;box-shadow:0 14px 35px rgba(166,7,29,.35);transition:.2s}.mega-ai-fab:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 18px 42px rgba(166,7,29,.42)}.mega-ai-pulse{position:absolute;top:7px;left:7px;width:9px;height:9px;background:#53d769;border:2px solid #fff;border-radius:50%}.mega-ai-panel{position:absolute;left:0;right:auto;bottom:78px;width:370px;max-width:calc(100vw - 30px);height:535px;background:var(--white);border:1px solid var(--line);border-radius:22px;box-shadow:0 24px 75px rgba(15,23,42,.22);overflow:hidden;display:flex;flex-direction:column;opacity:0;visibility:hidden;transform:translateY(12px) scale(.97);transform-origin:bottom left;transition:.2s}.mega-ai-float.open .mega-ai-panel{opacity:1;visibility:visible;transform:none}.mega-ai-head{padding:15px 16px;background:linear-gradient(135deg,#a6071d,#c51b34);color:#fff;display:flex;align-items:center;gap:11px}.mega-ai-avatar{width:43px;height:43px;border-radius:14px;background:rgba(255,255,255,.16);display:grid;place-items:center;font-size:20px}.mega-ai-head strong{display:block;font-size:14px}.mega-ai-head small{display:block;opacity:.82;font-size:10px;margin-top:2px}.mega-ai-close{margin-right:auto;background:transparent;border:0;color:#fff;font-size:16px;width:32px;height:32px;border-radius:9px}.mega-ai-close:hover{background:rgba(255,255,255,.12)}.mega-ai-body{flex:1;overflow-y:auto;padding:16px;background:var(--bg)}.mega-ai-msg{display:flex;gap:8px;align-items:flex-start;margin-bottom:12px;font-size:12px;line-height:1.8}.mega-ai-msg>div:last-child{background:var(--white);border:1px solid var(--line);padding:10px 12px;border-radius:13px 13px 4px 13px;box-shadow:0 4px 12px rgba(20,28,43,.04)}.mega-ai-msg-icon{width:28px;height:28px;flex:0 0 28px;border-radius:9px;background:#a6071d;color:#fff;display:grid;place-items:center}.mega-ai-msg.user{justify-content:flex-start;flex-direction:row-reverse}.mega-ai-msg.user>div:last-child{background:#a6071d;color:#fff;border:0;border-radius:13px 13px 13px 4px}.mega-ai-suggestions{display:flex;flex-wrap:wrap;gap:7px;margin:7px 0 14px 36px}.mega-ai-suggestions button{border:1px solid rgba(166,7,29,.18);background:var(--white);color:var(--red);border-radius:999px;padding:6px 9px;font-size:10px;font-weight:700;cursor:pointer}.mega-ai-suggestions button:hover{background:var(--soft)}.mega-ai-input{display:flex;gap:7px;padding:10px;border-top:1px solid var(--line);background:var(--white)}.mega-ai-input input{flex:1;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:12px;padding:10px 12px;font-size:12px;outline:0}.mega-ai-input input:focus{border-color:#d65a6b;box-shadow:0 0 0 3px rgba(166,7,29,.07)}.mega-ai-input button{width:42px;border:0;border-radius:12px;background:#a6071d;color:#fff}.mega-ai-foot{font-size:9px;color:var(--muted);padding:7px 12px;text-align:center;border-top:1px solid var(--line);background:var(--white)}.mega-ai-foot i{color:#a6071d;margin-left:3px}.mega-ai-typing{display:inline-flex;gap:4px;padding:3px}.mega-ai-typing span{width:5px;height:5px;border-radius:50%;background:#9aa3b1;animation:megaAiBounce 1s infinite}.mega-ai-typing span:nth-child(2){animation-delay:.15s}.mega-ai-typing span:nth-child(3){animation-delay:.3s}@keyframes megaAiBounce{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-4px)}}body.theme-dark .mega-ai-panel{box-shadow:0 25px 75px rgba(0,0,0,.5)}@media(max-width:600px){.mega-ai-float{left:14px;bottom:14px}.mega-ai-fab{width:56px;height:56px;border-radius:18px}.mega-ai-panel{left:-5px;right:auto;bottom:68px;height:calc(100vh - 120px);max-height:560px;width:calc(100vw - 28px)}} /* ========================= MEGA Professional UI Polish ========================= */ :root{--shadow-soft:0 10px 30px rgba(20,28,43,.07);--shadow-hover:0 16px 38px rgba(20,28,43,.11)} body{background:var(--bg);letter-spacing:.01em} .main-area{min-width:0} .top-header{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)} .breadcrumb-wrap h5{line-height:1.35} .cardx{overflow:hidden;box-shadow:var(--shadow-soft);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease} .cardx:hover{box-shadow:var(--shadow-hover)} .stat{min-height:132px;display:flex;flex-direction:column;justify-content:center} .stat .ic{margin-bottom:10px} .section-head{gap:16px;flex-wrap:wrap} .section-head>div:first-child{min-width:0} .table-responsive{border-radius:14px} .table{margin-bottom:0;vertical-align:middle} .table thead th{white-space:nowrap;font-size:12px;font-weight:800;color:var(--muted);background:rgba(166,7,29,.035);border-bottom:1px solid var(--line);padding:13px 12px} .table tbody td{padding:13px 12px;border-color:var(--line)} .table tbody tr{transition:background .15s ease} .table tbody tr:hover{background:rgba(166,7,29,.025)} .form-control,.form-select{min-height:44px;border-radius:12px;border-color:var(--line);box-shadow:none} .form-control:focus,.form-select:focus{border-color:#d45a6b;box-shadow:0 0 0 3px rgba(166,7,29,.07)} .form-label{font-weight:800;font-size:12px;margin-bottom:7px} .btn{border-radius:11px;font-weight:800} .btn-mega{box-shadow:0 8px 18px rgba(166,7,29,.16)} .badge{font-weight:800} .page-title{font-weight:900;letter-spacing:-.02em} .hero{border-radius:22px;overflow:hidden;box-shadow:0 15px 35px rgba(166,7,29,.10)} .quick-card{min-height:86px;display:flex;align-items:center;gap:10px;padding:12px;text-decoration:none!important;transition:.18s ease} .quick-card:hover{transform:translateY(-2px);border-color:rgba(166,7,29,.18)} .quick-icon{width:40px;height:40px;flex:0 0 40px;display:grid;place-items:center;border-radius:12px;background:rgba(166,7,29,.08);color:var(--red)} .action-btns{white-space:nowrap} .action-btns form{margin:0} .empty{padding:42px 20px;text-align:center;color:var(--muted)} .dashboard-chart{height:290px;position:relative} .admin-stats-grid{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px!important;margin-left:0;margin-right:0} .admin-stats-grid>[class*="col-"]{width:auto!important;padding:0!important} .admin-stats-grid .cardx{height:100%} @media(max-width:1300px){.admin-stats-grid{grid-template-columns:repeat(4,minmax(0,1fr))}} @media(max-width:900px){.admin-stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:600px){.admin-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px!important}.stat{min-height:118px}.cardx{border-radius:16px}.section-head{align-items:flex-start}.dashboard-chart{height:240px}.table thead th,.table tbody td{padding:10px 9px}} body.theme-dark .cardx{box-shadow:0 12px 30px rgba(0,0,0,.18)} body.theme-dark .table thead th{background:rgba(255,255,255,.025)} body.theme-dark .table tbody tr:hover{background:rgba(255,255,255,.025)} body.theme-dark .quick-icon{background:rgba(255,255,255,.07)} /* ========================= Dashboard visual cards ========================= */ .dashboard-visuals .chart-card{min-height:360px;border:1px solid var(--line);background:var(--white)} .chart-card-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:8px} .chart-card-head h5{margin:0;font-size:16px;font-weight:900;letter-spacing:-.02em} .chart-card-head small{display:block;color:var(--muted);margin-top:5px;font-size:11px} .chart-filter{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid var(--line);border-radius:11px;color:var(--muted);font-size:10px;font-weight:800;background:var(--white);white-space:nowrap} .dashboard-chart-wide{height:285px;margin-top:12px} .maintenance-overview{height:285px;display:flex;align-items:center;justify-content:center;gap:28px;padding:8px 0} .maintenance-donut{position:relative;width:235px;height:235px;flex:0 0 235px} .maintenance-donut canvas{width:100%!important;height:100%!important} .donut-center{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;pointer-events:none} .donut-center strong{font-size:27px;line-height:1;font-weight:900} .donut-center span{font-size:9px;color:var(--muted);margin-top:7px} .maintenance-legend{display:flex;flex-direction:column;gap:17px;min-width:145px} .maintenance-legend>div{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:9px;font-size:11px} .maintenance-legend b{font-size:12px} .legend-dot{width:9px;height:9px;border-radius:50%;display:block} .legend-dot.home{background:var(--red)}.legend-dot.company{background:#20252d}.legend-dot.progress{background:#aeb7c4} @media(max-width:1200px){.maintenance-overview{gap:18px}.maintenance-donut{width:210px;height:210px;flex-basis:210px}} @media(max-width:700px){.dashboard-visuals .chart-card{min-height:330px}.chart-card-head{align-items:flex-start}.dashboard-chart-wide{height:235px}.maintenance-overview{height:auto;flex-direction:column;gap:18px;padding:15px 0}.maintenance-donut{width:205px;height:205px;flex-basis:205px}.maintenance-legend{width:100%;gap:12px}.maintenance-legend>div{grid-template-columns:10px 1fr auto}} body.theme-dark .dashboard-visuals .chart-card{background:var(--white);border-color:var(--line)} body.theme-dark .chart-filter{background:rgba(255,255,255,.03)} /* ========================= Dashboard Charts — Premium Polish ========================= */ .dashboard-visuals{align-items:stretch} .dashboard-visuals .chart-card{position:relative;min-height:405px;border-radius:22px;background:var(--white);border:1px solid var(--line);box-shadow:0 14px 38px rgba(20,28,43,.065);overflow:hidden} .dashboard-visuals .chart-card:before{content:"";position:absolute;top:0;right:0;left:0;height:3px;background:linear-gradient(90deg,var(--red),#e25b6c,transparent)} .dashboard-visuals .chart-card-secondary:before{background:linear-gradient(90deg,#252a33,var(--red),transparent)} .chart-card-head{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:8px} .chart-title-wrap{display:flex;align-items:center;gap:11px;min-width:0} .chart-title-icon{width:39px;height:39px;flex:0 0 39px;border-radius:12px;display:grid;place-items:center;background:var(--soft);color:var(--red);font-size:17px} .chart-title-wrap h5{margin:0;font-size:16px;font-weight:900;letter-spacing:-.02em} .chart-title-wrap small{display:block;color:var(--muted);margin-top:4px;font-size:10px} .chart-filter{display:inline-flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid var(--line);border-radius:11px;color:var(--muted);font-size:10px;font-weight:800;background:var(--white);white-space:nowrap} .chart-filter i{font-size:11px;color:var(--red)} .chart-summary{display:flex;align-items:center;justify-content:space-between;margin:14px 0 2px;padding:11px 13px;border-radius:13px;background:linear-gradient(90deg,rgba(181,9,32,.055),rgba(181,9,32,.015));border:1px solid rgba(181,9,32,.06)} .chart-summary span{display:block;color:var(--muted);font-size:9px;font-weight:700} .chart-summary strong{display:block;font-size:20px;line-height:1.15;margin-top:2px;font-weight:900} .chart-trend{display:inline-flex;align-items:center;gap:6px;color:var(--red);font-size:9px;font-weight:800} .chart-trend i{font-size:14px} .dashboard-chart-wide{height:240px;margin-top:10px} .maintenance-overview{height:275px;display:flex;align-items:center;justify-content:center;gap:25px;padding:7px 0} .maintenance-donut{position:relative;width:220px;height:220px;flex:0 0 220px;filter:drop-shadow(0 10px 18px rgba(20,28,43,.07))} .maintenance-donut canvas{width:100%!important;height:100%!important} .donut-center{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;pointer-events:none} .donut-center strong{font-size:27px;line-height:1;font-weight:900;letter-spacing:-.04em} .donut-center span{font-size:9px;color:var(--muted);margin-top:7px;font-weight:700} .maintenance-legend{display:flex;flex-direction:column;gap:16px;min-width:140px} .maintenance-legend>div{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:9px;font-size:10px;color:var(--muted)} .maintenance-legend b{font-size:12px;color:var(--ink)} .legend-dot{width:9px;height:9px;border-radius:50%;display:block;box-shadow:0 0 0 4px rgba(181,9,32,.06)} .legend-dot.home{background:var(--red)}.legend-dot.company{background:#252a33;box-shadow:0 0 0 4px rgba(37,42,51,.06)}.legend-dot.progress{background:#aeb7c4;box-shadow:0 0 0 4px rgba(174,183,196,.10)} body.theme-dark .dashboard-visuals .chart-card{background:var(--white);box-shadow:0 16px 40px rgba(0,0,0,.2)} body.theme-dark .chart-summary{background:rgba(181,9,32,.08);border-color:rgba(255,255,255,.05)} body.theme-dark .chart-filter{background:rgba(255,255,255,.025)} body.theme-dark .chart-title-icon{background:rgba(181,9,32,.12)} @media(max-width:1200px){.dashboard-visuals .chart-card{min-height:390px}.maintenance-overview{gap:16px}.maintenance-donut{width:205px;height:205px;flex-basis:205px}} @media(max-width:700px){.dashboard-visuals .chart-card{min-height:360px}.chart-card-head{align-items:flex-start}.chart-filter{padding:7px 9px}.chart-title-wrap h5{font-size:14px}.chart-summary{margin-top:11px}.dashboard-chart-wide{height:220px}.maintenance-overview{height:auto;flex-direction:column;gap:15px;padding:14px 0}.maintenance-donut{width:195px;height:195px;flex-basis:195px}.maintenance-legend{width:100%;gap:11px}.maintenance-legend>div{grid-template-columns:10px 1fr auto}} /* ========================= Quick Access — Arabic Dashboard ========================= */ .dashboard-bottom{align-items:stretch} .dashboard-bottom>.col-xl-8,.dashboard-bottom>.col-xl-4{display:flex} .dashboard-bottom .cardx{width:100%} .quick-access-card{position:relative;overflow:hidden;background:linear-gradient(145deg,#fff8f9 0%,#f8f1f3 55%,#f3e7ea 100%);border-color:rgba(181,9,32,.12);box-shadow:0 14px 36px rgba(181,9,32,.09)} .quick-access-card:before{content:"";position:absolute;top:0;right:0;left:0;height:4px;background:linear-gradient(90deg,#8e0015,#c61f3b,#e8a0ad)} .quick-access-title-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#fff;color:var(--red);font-size:17px;box-shadow:0 7px 16px rgba(181,9,32,.10)} .quick-access-grid{display:grid;grid-template-columns:1fr;gap:10px;margin-top:12px} .quick-action{display:flex;align-items:center;gap:11px;padding:11px 12px;border:1px solid rgba(181,9,32,.10);border-radius:14px;text-decoration:none!important;color:var(--ink);background:rgba(255,255,255,.78);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease} .quick-action:hover{transform:translateY(-2px);border-color:rgba(166,7,29,.28);box-shadow:0 10px 24px rgba(181,9,32,.12)} .quick-action-icon{width:39px;height:39px;flex:0 0 39px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(145deg,#fff,#f7dfe4);color:var(--red);font-size:16px;box-shadow:0 5px 13px rgba(181,9,32,.08)} .quick-action span:nth-child(2){display:flex;flex-direction:column;min-width:0;flex:1} .quick-action b{font-size:11px;font-weight:900;white-space:nowrap} .quick-action small{font-size:9px;color:var(--muted);margin-top:2px} /* Remove directional trend arrows while keeping the percentage and trend text */ .stat-trend>i{display:none!important} body.theme-dark .quick-access-card{background:linear-gradient(145deg,#271a1d 0%,#21191b 55%,#1c1719 100%);border-color:rgba(225,115,135,.22);box-shadow:0 14px 36px rgba(0,0,0,.22)} body.theme-dark .quick-access-title-icon{background:#302125;color:#f0a7b4} body.theme-dark .quick-action{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.09);color:#f3f4f6} body.theme-dark .quick-action:hover{box-shadow:0 10px 24px rgba(0,0,0,.22)} body.theme-dark .quick-action-icon{background:linear-gradient(145deg,#332226,#44252d);color:#f0a7b4} @media(max-width:1199px){.dashboard-bottom>.col-xl-8,.dashboard-bottom>.col-xl-4{display:block}} /* Customer KPI enhancement — keeps all other dashboard cards unchanged */ .stat-customer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:17px 15px 17px 18px;min-height:145px} .stat-customer .stat-main{position:relative;z-index:2;min-width:0} .stat-customer .ic{width:47px;height:47px} .stat-customer h3{margin-top:8px} .stat-trend{display:flex;align-items:center;gap:4px;margin-top:8px;font-size:9px;font-weight:900;white-space:nowrap} .stat-trend span{display:block;font-size:8px;font-weight:600;color:var(--muted);margin-right:2px} .stat-trend.up{color:var(--green)} .stat-trend.down{color:var(--red)} .stat-trend i{font-size:11px} .stat-sparkline{position:absolute;left:8px;bottom:20px;width:92px;height:50px;opacity:.92;color:var(--red);z-index:1;transform:scaleX(-1)} .stat-customer .stat-sparkline{left:auto;right:7px;bottom:19px;width:82px;height:49px} .stat-customer:after{left:auto;right:-42px;bottom:-55px} @media(max-width:700px){.stat-customer{padding:14px 12px}.stat-customer .stat-sparkline{width:68px;right:3px}.stat-trend{font-size:8px}.stat-trend span{font-size:7px}} /* Universal KPI cards: compact professional trend + sparkline */ .stat-enhanced{position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:16px 14px 15px 15px;min-height:145px;overflow:hidden;background:var(--white);} .stat-enhanced .stat-content{position:relative;z-index:2;min-width:0;} .stat-enhanced .ic{width:47px;height:47px;margin-bottom:8px;} .stat-enhanced h3{margin:0 0 2px;font-size:25px;line-height:1.05;font-weight:950;letter-spacing:-.03em;} .stat-enhanced .muted{font-size:11px;font-weight:800;white-space:nowrap;} .stat-trend{display:flex;align-items:center;gap:4px;margin-top:8px;font-size:10px;font-weight:950;white-space:nowrap;} .stat-trend span{display:block;font-size:8px;font-weight:650;color:var(--muted);margin-right:2px;} .stat-trend.up{color:var(--green);}.stat-trend.down{color:var(--red);} .stat-trend i{font-size:11px;} .stat-sparkline{position:absolute;right:7px;bottom:18px;width:82px;height:49px;opacity:.92;z-index:1;} .stat-sparkline polyline{fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;} .stat-sparkline circle{fill:currentColor;} .stat-enhanced:after{content:"";position:absolute;right:-42px;bottom:-58px;width:120px;height:120px;border-radius:50%;background:currentColor;opacity:.045;} .stat-enhanced:nth-child(4n+1){color:var(--red)} .stat-enhanced:nth-child(4n+2){color:#c21f3a} .stat-enhanced:nth-child(4n+3){color:#d68a00} .stat-enhanced:nth-child(4n){color:#2d70c9} body.theme-dark .stat-enhanced{background:var(--white);} @media(max-width:700px){.stat-enhanced{min-height:126px;padding:13px 10px}.stat-enhanced h3{font-size:21px}.stat-enhanced .muted{font-size:9px}.stat-sparkline{width:62px;height:43px;right:2px}.stat-trend{font-size:8px}.stat-trend span{font-size:7px}} /* طلب المستخدم: تحسين الوصول السريع فقط + ألوان حالة الأجهزة */ .quick-access-card{background:linear-gradient(145deg,#eef7f8 0%,#e7f2f4 52%,#dcecef 100%)!important;border-color:rgba(38,112,126,.18)!important;box-shadow:0 14px 36px rgba(38,112,126,.10)!important} .quick-access-card:before{background:linear-gradient(90deg,#276f7e,#3b91a0,#82bcc5)!important} .quick-access-title-icon{color:#276f7e!important} .quick-action{background:rgba(255,255,255,.88)!important;border-color:rgba(38,112,126,.14)!important;color:#1c3035!important} .quick-action:hover{border-color:rgba(38,112,126,.32)!important;box-shadow:0 10px 24px rgba(38,112,126,.14)!important} .quick-action-icon{background:linear-gradient(145deg,#f7fcfd,#d8edf0)!important;color:#276f7e!important;box-shadow:0 5px 13px rgba(38,112,126,.10)!important} body.theme-dark .quick-access-card{background:linear-gradient(145deg,#172c30 0%,#18353a 55%,#1b3b40 100%)!important;border-color:rgba(111,190,201,.22)!important} body.theme-dark .quick-action{background:rgba(255,255,255,.065)!important;border-color:rgba(111,190,201,.13)!important;color:#f3f7f8!important} body.theme-dark .quick-action-icon{background:linear-gradient(145deg,#213f44,#28525a)!important;color:#8bd0d8!important} body.theme-dark .quick-access-title-icon{color:#8bd0d8!important} .device-status-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-size:11px;font-weight:850;line-height:1;white-space:nowrap;border:1px solid transparent} .device-status-dot{width:7px;height:7px;border-radius:50%;display:inline-block} body:not([data-role="admin"]) .device-status-badge.active{background:#e7f8ef;color:#16824f;border-color:#bcebd1}.device-status-badge.active .device-status-dot{background:#20b56b;box-shadow:0 0 0 3px rgba(32,181,107,.12)} body:not([data-role="admin"]) .device-status-badge.pending{background:#fff7df;color:#a66a00;border-color:#f3df9f}.device-status-badge.pending .device-status-dot{background:#e6a719;box-shadow:0 0 0 3px rgba(230,167,25,.12)} body:not([data-role="admin"]) .device-status-badge.expired{background:#fff0f1;color:#b50920;border-color:#f2c3c8}.device-status-badge.expired .device-status-dot{background:#d52a42;box-shadow:0 0 0 3px rgba(213,42,66,.12)} body:not([data-role="admin"]) .device-status-badge.cancelled{background:#eef1f4;color:#687281;border-color:#dce1e7}.device-status-badge.cancelled .device-status-dot{background:#8993a1;box-shadow:0 0 0 3px rgba(137,147,161,.12)} body.theme-dark body:not([data-role="admin"]) .device-status-badge.active{background:rgba(32,181,107,.12);color:#79dfaa;border-color:rgba(32,181,107,.24)} body.theme-dark body:not([data-role="admin"]) .device-status-badge.pending{background:rgba(230,167,25,.12);color:#f1c96a;border-color:rgba(230,167,25,.24)} body.theme-dark body:not([data-role="admin"]) .device-status-badge.expired{background:rgba(213,42,66,.12);color:#ff9aaa;border-color:rgba(213,42,66,.24)} body.theme-dark body:not([data-role="admin"]) .device-status-badge.cancelled{background:rgba(137,147,161,.12);color:#bac2cc;border-color:rgba(137,147,161,.2)} /* Dashboard final refinement: quick access actions only — no KPI arrows/charts */ .admin-stats-grid .stat-sparkline{display:none!important} .admin-stats-grid .stat-trend i{display:none!important} .quick-action:nth-child(1) .quick-action-icon{background:linear-gradient(145deg,#fff4e8,#ffe1bf)!important;color:#c56a12!important} .quick-action:nth-child(2) .quick-action-icon{background:linear-gradient(145deg,#eef8ff,#d5ebff)!important;color:#2f76b7!important} .quick-action:nth-child(3) .quick-action-icon{background:linear-gradient(145deg,#f1faef,#d9f0d3)!important;color:#2f8a55!important} .quick-action:nth-child(4) .quick-action-icon{background:linear-gradient(145deg,#f7efff,#e9d8fb)!important;color:#7b4aa5!important} .quick-action:nth-child(1):hover{border-color:rgba(197,106,18,.28)!important;box-shadow:0 10px 24px rgba(197,106,18,.10)!important} .quick-action:nth-child(2):hover{border-color:rgba(47,118,183,.28)!important;box-shadow:0 10px 24px rgba(47,118,183,.10)!important} .quick-action:nth-child(3):hover{border-color:rgba(47,138,85,.28)!important;box-shadow:0 10px 24px rgba(47,138,85,.10)!important} .quick-action:nth-child(4):hover{border-color:rgba(123,74,165,.28)!important;box-shadow:0 10px 24px rgba(123,74,165,.10)!important} body.theme-dark .quick-action:nth-child(1) .quick-action-icon{background:linear-gradient(145deg,#3b2c20,#513a26)!important;color:#f2bd7b!important} body.theme-dark .quick-action:nth-child(2) .quick-action-icon{background:linear-gradient(145deg,#223748,#294a62)!important;color:#8ec8f4!important} body.theme-dark .quick-action:nth-child(3) .quick-action-icon{background:linear-gradient(145deg,#203a2a,#285139)!important;color:#8ed7a9!important} body.theme-dark .quick-action:nth-child(4) .quick-action-icon{background:linear-gradient(145deg,#33253e,#473257)!important;color:#c7a1e5!important} /* Final quick-access color treatment: color the four actions themselves only */ .quick-access-card .quick-action:nth-child(1){background:linear-gradient(145deg,#fff1e2,#ffe0bd)!important;border-color:#f2c58f!important;color:#6f3d0b!important} .quick-access-card .quick-action:nth-child(2){background:linear-gradient(145deg,#eaf5ff,#d4e9ff)!important;border-color:#a9cff1!important;color:#194b73!important} .quick-access-card .quick-action:nth-child(3){background:linear-gradient(145deg,#edf9f0,#d6efd9)!important;border-color:#add9b7!important;color:#1f6338!important} .quick-access-card .quick-action:nth-child(4){background:linear-gradient(145deg,#f6efff,#e7d9fa)!important;border-color:#ccb1e9!important;color:#583477!important} .quick-access-card .quick-action:nth-child(1) .quick-action-icon{background:rgba(255,255,255,.58)!important;color:#c56a12!important} .quick-access-card .quick-action:nth-child(2) .quick-action-icon{background:rgba(255,255,255,.58)!important;color:#2f76b7!important} .quick-access-card .quick-action:nth-child(3) .quick-action-icon{background:rgba(255,255,255,.58)!important;color:#2f8a55!important} .quick-access-card .quick-action:nth-child(4) .quick-action-icon{background:rgba(255,255,255,.58)!important;color:#7b4aa5!important} .quick-access-card .quick-action:nth-child(1):hover{background:linear-gradient(145deg,#ffe9cf,#ffd5a7)!important} .quick-access-card .quick-action:nth-child(2):hover{background:linear-gradient(145deg,#dff0ff,#c5e0fb)!important} .quick-access-card .quick-action:nth-child(3):hover{background:linear-gradient(145deg,#e2f5e6,#c9e8ce)!important} .quick-access-card .quick-action:nth-child(4):hover{background:linear-gradient(145deg,#eee3fb,#dfcbf4)!important} body.theme-dark .quick-access-card .quick-action:nth-child(1){background:linear-gradient(145deg,#3a2c20,#503821)!important;color:#f2c18a!important;border-color:rgba(242,193,138,.24)!important} body.theme-dark .quick-access-card .quick-action:nth-child(2){background:linear-gradient(145deg,#213746,#294c65)!important;color:#9bcef4!important;border-color:rgba(155,206,244,.24)!important} body.theme-dark .quick-access-card .quick-action:nth-child(3){background:linear-gradient(145deg,#20392a,#28513a)!important;color:#9be0b3!important;border-color:rgba(155,224,179,.24)!important} body.theme-dark .quick-access-card .quick-action:nth-child(4){background:linear-gradient(145deg,#32263d,#47345a)!important;color:#d0afe9!important;border-color:rgba(208,175,233,.24)!important} body.theme-dark .quick-access-card .quick-action:nth-child(1) .quick-action-icon{background:rgba(255,255,255,.08)!important;color:#f2bd7b!important} body.theme-dark .quick-access-card .quick-action:nth-child(2) .quick-action-icon{background:rgba(255,255,255,.08)!important;color:#8ec8f4!important} body.theme-dark .quick-access-card .quick-action:nth-child(3) .quick-action-icon{background:rgba(255,255,255,.08)!important;color:#8ed7a9!important} body.theme-dark .quick-access-card .quick-action:nth-child(4) .quick-action-icon{background:rgba(255,255,255,.08)!important;color:#c7a1e5!important} /* Keep device warranty states on exactly the same visual language. */ .device-status-badge{min-height:28px;padding:6px 11px;border-radius:999px;font-size:11px;font-weight:800;line-height:1} /* Quick access follows the same light/dark theme as the rest of the dashboard. */ .quick-access-card{background:var(--white)!important;border-color:var(--line)!important;box-shadow:var(--shadow)!important;color:var(--ink)!important} .quick-access-card:before{background:var(--red)!important} .quick-access-title-icon{background:var(--soft)!important;color:var(--red)!important;border:1px solid var(--line);box-shadow:none} .quick-access-card .quick-action{background:var(--white)!important;color:var(--ink)!important;border-color:var(--line)!important;box-shadow:none!important} .quick-access-card .quick-action:hover{background:var(--bg)!important;border-color:var(--line)!important;box-shadow:0 10px 24px rgba(20,28,43,.08)!important} .quick-access-card .quick-action .quick-action-icon{background:var(--soft)!important;color:var(--red)!important;box-shadow:none!important} /* AI chat polish */ .mega-ai-float{filter:drop-shadow(0 8px 20px rgba(181,9,32,.08))} .mega-ai-panel{border-radius:24px} .mega-ai-input input{direction:rtl} /* Unified status pills for every non-admin interface. Admin screens keep their original Bootstrap appearance. */ body:not([data-role="admin"]) .badge.status-badge, body:not([data-role="admin"]) .badge.text-bg-success, body:not([data-role="admin"]) .badge.text-bg-warning, body:not([data-role="admin"]) .badge.text-bg-danger, body:not([data-role="admin"]) .badge.text-bg-secondary, body:not([data-role="admin"]) .badge.text-bg-info, body:not([data-role="admin"]) .badge.text-bg-light, body:not([data-role="admin"]) .badge.text-bg-primary, body:not([data-role="admin"]) .badge-soft{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:28px;padding:6px 11px;border-radius:999px!important;font-size:11px;font-weight:800;line-height:1;white-space:nowrap;border:1px solid transparent!important} body:not([data-role="admin"]) .badge.status-active, body:not([data-role="admin"]) .badge.text-bg-success{background:#e8f8ef!important;color:#16824f!important;border-color:#bde8d0!important} body:not([data-role="admin"]) .badge.status-pending, body:not([data-role="admin"]) .badge.text-bg-warning{background:#fff7df!important;color:#a66a00!important;border-color:#f0dda2!important} body:not([data-role="admin"]) .badge.status-expired, body:not([data-role="admin"]) .badge.text-bg-danger{background:#fff0f1!important;color:#b50920!important;border-color:#efc4c9!important} body:not([data-role="admin"]) .badge.status-cancelled, body:not([data-role="admin"]) .badge.text-bg-secondary{background:#eef1f4!important;color:#687281!important;border-color:#dce1e7!important} body:not([data-role="admin"]) .badge.status-assigned, body:not([data-role="admin"]) .badge.status-in_progress, body:not([data-role="admin"]) .badge.text-bg-primary, body:not([data-role="admin"]) .badge.text-bg-info{background:#eaf4ff!important;color:#2868a8!important;border-color:#c5def8!important} body:not([data-role="admin"]) .badge.status-waiting_parts{background:#fff7df!important;color:#a66a00!important;border-color:#f0dda2!important} body:not([data-role="admin"]) .badge.status-completed, body:not([data-role="admin"]) .badge.status-closed{background:#e8f8ef!important;color:#16824f!important;border-color:#bde8d0!important} body:not([data-role="admin"]) .badge.status-new{background:#f5f6f8!important;color:#596270!important;border-color:#e1e5eb!important} body:not([data-role="admin"]) .badge.text-bg-light, body:not([data-role="admin"]) .badge-soft{background:var(--soft)!important;color:var(--red)!important;border-color:#f1d2d8!important} body.theme-dark:not([data-role="admin"]) .badge.status-active, body.theme-dark:not([data-role="admin"]) .badge.text-bg-success{background:rgba(32,181,107,.12)!important;color:#79dfaa!important;border-color:rgba(32,181,107,.24)!important} body.theme-dark:not([data-role="admin"]) .badge.status-pending, body.theme-dark:not([data-role="admin"]) .badge.text-bg-warning{background:rgba(230,167,25,.12)!important;color:#f1c96a!important;border-color:rgba(230,167,25,.24)!important} body.theme-dark:not([data-role="admin"]) .badge.status-expired, body.theme-dark:not([data-role="admin"]) .badge.text-bg-danger{background:rgba(213,42,66,.12)!important;color:#ff9aaa!important;border-color:rgba(213,42,66,.24)!important} body.theme-dark:not([data-role="admin"]) .badge.status-cancelled, body.theme-dark:not([data-role="admin"]) .badge.text-bg-secondary{background:rgba(137,147,161,.12)!important;color:#bac2cc!important;border-color:rgba(137,147,161,.2)!important} body.theme-dark:not([data-role="admin"]) .badge.status-assigned, body.theme-dark:not([data-role="admin"]) .badge.status-in_progress, body.theme-dark:not([data-role="admin"]) .badge.text-bg-primary, body.theme-dark:not([data-role="admin"]) .badge.text-bg-info{background:rgba(54,119,217,.14)!important;color:#9bc7ff!important;border-color:rgba(54,119,217,.25)!important} body.theme-dark:not([data-role="admin"]) .badge.status-waiting_parts{background:rgba(230,167,25,.12)!important;color:#f1c96a!important;border-color:rgba(230,167,25,.24)!important} body.theme-dark:not([data-role="admin"]) .badge.status-completed, body.theme-dark:not([data-role="admin"]) .badge.status-closed{background:rgba(32,181,107,.12)!important;color:#79dfaa!important;border-color:rgba(32,181,107,.24)!important} body.theme-dark:not([data-role="admin"]) .badge.status-new{background:rgba(255,255,255,.07)!important;color:#d9dee7!important;border-color:rgba(255,255,255,.12)!important} body.theme-dark:not([data-role="admin"]) .badge.text-bg-light, body.theme-dark:not([data-role="admin"]) .badge-soft{background:rgba(181,9,32,.16)!important;color:#f0a7b4!important;border-color:rgba(240,167,180,.2)!important} /* Final status colors for ALL roles, including Admin. */ .badge.status-badge,.badge.status-active,.badge.status-pending,.badge.status-expired,.badge.status-cancelled,.badge.status-assigned,.badge.status-in_progress,.badge.status-waiting_parts,.badge.status-completed,.badge.status-closed,.badge.status-new{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:28px;padding:6px 11px;border-radius:999px!important;font-size:11px;font-weight:800;line-height:1;white-space:nowrap;border:1px solid transparent!important} .badge.status-active{background:#e8f8ef!important;color:#16824f!important;border-color:#bde8d0!important} .badge.status-pending{background:#fff7df!important;color:#a66a00!important;border-color:#f0dda2!important} .badge.status-expired{background:#fff0f1!important;color:#b50920!important;border-color:#efc4c9!important} .badge.status-cancelled{background:#eef1f4!important;color:#687281!important;border-color:#dce1e7!important} .badge.status-assigned,.badge.status-in_progress{background:#eaf4ff!important;color:#2868a8!important;border-color:#c5def8!important} .badge.status-waiting_parts{background:#fff7df!important;color:#a66a00!important;border-color:#f0dda2!important} .badge.status-completed,.badge.status-closed{background:#e8f8ef!important;color:#16824f!important;border-color:#bde8d0!important} .badge.status-new{background:#f5f6f8!important;color:#596270!important;border-color:#e1e5eb!important} body.theme-dark .badge.status-active{background:rgba(32,181,107,.12)!important;color:#79dfaa!important;border-color:rgba(32,181,107,.24)!important} body.theme-dark .badge.status-pending,body.theme-dark .badge.status-waiting_parts{background:rgba(230,167,25,.12)!important;color:#f1c96a!important;border-color:rgba(230,167,25,.24)!important} body.theme-dark .badge.status-expired{background:rgba(213,42,66,.12)!important;color:#ff9aaa!important;border-color:rgba(213,42,66,.24)!important} body.theme-dark .badge.status-cancelled{background:rgba(137,147,161,.12)!important;color:#bac2cc!important;border-color:rgba(137,147,161,.2)!important} body.theme-dark .badge.status-assigned,body.theme-dark .badge.status-in_progress{background:rgba(54,119,217,.14)!important;color:#9bc7ff!important;border-color:rgba(54,119,217,.25)!important} body.theme-dark .badge.status-completed,body.theme-dark .badge.status-closed{background:rgba(32,181,107,.12)!important;color:#79dfaa!important;border-color:rgba(32,181,107,.24)!important} body.theme-dark .badge.status-new{background:rgba(255,255,255,.07)!important;color:#d9dee7!important;border-color:rgba(255,255,255,.12)!important} /* Quick access card and actions use the exact same surface variables in light and dark mode. */ .quick-access-card,.quick-access-card .quick-action{background:var(--white)!important;color:var(--ink)!important;border-color:var(--line)!important} body.theme-dark .quick-access-card,body.theme-dark .quick-access-card .quick-action{background:var(--white)!important;color:var(--ink)!important;border-color:var(--line)!important} .quick-access-card .quick-action:hover{background:var(--bg)!important} /* FINAL V8 USER REQUEST OVERRIDES */ /* One semantic status palette across the whole system. */ .badge.status-badge,.badge.status-active,.badge.status-pending,.badge.status-expired,.badge.status-cancelled,.badge.status-assigned,.badge.status-in_progress,.badge.status-waiting_parts,.badge.status-completed,.badge.status-closed,.badge.status-new{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:28px;padding:6px 11px;border-radius:999px!important;font-size:11px;font-weight:800;line-height:1;white-space:nowrap;border:1px solid transparent!important} .badge.status-active{background:#e8f8ef!important;color:#16824f!important;border-color:#bde8d0!important} .badge.status-pending,.badge.status-waiting_parts{background:#fff7df!important;color:#a66a00!important;border-color:#f0dda2!important} .badge.status-expired{background:#fff0f1!important;color:#b50920!important;border-color:#efc4c9!important} .badge.status-cancelled{background:#eef1f4!important;color:#687281!important;border-color:#dce1e7!important} .badge.status-assigned,.badge.status-in_progress{background:#eaf4ff!important;color:#2868a8!important;border-color:#c5def8!important} .badge.status-completed,.badge.status-closed{background:#e8f8ef!important;color:#16824f!important;border-color:#bde8d0!important} .badge.status-new{background:#f5f6f8!important;color:#596270!important;border-color:#e1e5eb!important} /* Quick-access surfaces follow the same light/dark variables as every other card. */ .quick-access-card,.quick-access-card .quick-action,.quick-card{background:var(--white)!important;color:var(--ink)!important;border-color:var(--line)!important} .quick-access-card .quick-action:hover,.quick-card:hover{background:var(--bg)!important} .quick-access-card .quick-action-icon,.quick-icon{background:var(--soft)!important;color:var(--red)!important} body.theme-dark .quick-access-card,body.theme-dark .quick-access-card .quick-action,body.theme-dark .quick-card{background:var(--white)!important;color:var(--ink)!important;border-color:var(--line)!important} body.theme-dark .quick-access-card .quick-action:hover,body.theme-dark .quick-card:hover{background:var(--bg)!important} body.theme-dark .quick-access-card .quick-action-icon,body.theme-dark .quick-icon{background:var(--soft)!important;color:#f0a7b4!important} /* Dark-mode status colors keep the same meaning while adapting contrast. */ body.theme-dark .badge.status-active,body.theme-dark .badge.status-completed,body.theme-dark .badge.status-closed{background:rgba(32,181,107,.12)!important;color:#79dfaa!important;border-color:rgba(32,181,107,.24)!important} body.theme-dark .badge.status-pending,body.theme-dark .badge.status-waiting_parts{background:rgba(230,167,25,.12)!important;color:#f1c96a!important;border-color:rgba(230,167,25,.24)!important} body.theme-dark .badge.status-expired{background:rgba(213,42,66,.12)!important;color:#ff9aaa!important;border-color:rgba(213,42,66,.24)!important} body.theme-dark .badge.status-cancelled{background:rgba(137,147,161,.12)!important;color:#bac2cc!important;border-color:rgba(137,147,161,.2)!important} body.theme-dark .badge.status-assigned,body.theme-dark .badge.status-in_progress{background:rgba(54,119,217,.14)!important;color:#9bc7ff!important;border-color:rgba(54,119,217,.25)!important} body.theme-dark .badge.status-new{background:rgba(255,255,255,.07)!important;color:#d9dee7!important;border-color:rgba(255,255,255,.12)!important} /* Staff dashboard: restore original layout; keep the five statistics cards in one row on large screens. */ @media (min-width: 1200px){.staff-original-stats > [class*=col-lg-3]{flex:0 0 20%;max-width:20%;}} @media (max-width: 1199.98px){.staff-original-stats > [class*=col-lg-3]{flex:0 0 25%;max-width:25%;}} @media (max-width: 767.98px){.staff-original-stats > [class*=col-lg-3]{flex:0 0 50%;max-width:50%;}} /* Admin dashboard chart filters */ .chart-filter-select{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;cursor:pointer} .chart-filter-select select{border:0;background:transparent;color:inherit;font:inherit;font-weight:700;outline:none;cursor:pointer;direction:rtl;min-width:105px} .chart-filter-select select option{color:#222;background:#fff} /* ألوان أيقونات بطاقات الإحصائيات في لوحة التحكم */ .admin-stats-grid > div:nth-child(1) .stat .ic{background:#fff0f3!important;color:#c6284b!important} .admin-stats-grid > div:nth-child(2) .stat .ic{background:#eaf4ff!important;color:#2878c8!important} .admin-stats-grid > div:nth-child(3) .stat .ic{background:#edf9f0!important;color:#2f8a55!important} .admin-stats-grid > div:nth-child(4) .stat .ic{background:#fff3e8!important;color:#c56a12!important} .admin-stats-grid > div:nth-child(5) .stat .ic{background:#fff7df!important;color:#a66a00!important} .admin-stats-grid > div:nth-child(6) .stat .ic{background:#f1efff!important;color:#6951b8!important} .admin-stats-grid > div:nth-child(7) .stat .ic{background:#f6efff!important;color:#7b4aa5!important} body.theme-dark .admin-stats-grid > div:nth-child(1) .stat .ic{background:rgba(198,40,75,.16)!important;color:#ff9db2!important} body.theme-dark .admin-stats-grid > div:nth-child(2) .stat .ic{background:rgba(40,120,200,.16)!important;color:#8ec8f4!important} body.theme-dark .admin-stats-grid > div:nth-child(3) .stat .ic{background:rgba(47,138,85,.16)!important;color:#8ed7a9!important} body.theme-dark .admin-stats-grid > div:nth-child(4) .stat .ic{background:rgba(197,106,18,.16)!important;color:#f2bd7b!important} body.theme-dark .admin-stats-grid > div:nth-child(5) .stat .ic{background:rgba(166,106,0,.16)!important;color:#f1c96a!important} body.theme-dark .admin-stats-grid > div:nth-child(6) .stat .ic{background:rgba(105,81,184,.16)!important;color:#c0b2ff!important} body.theme-dark .admin-stats-grid > div:nth-child(7) .stat .ic{background:rgba(123,74,165,.16)!important;color:#c7a1e5!important} /* ألوان أيقونات لوحة التحكم فقط */ .admin-stats-grid > div:nth-child(1) .stat .ic { color: #db2777 !important; } .admin-stats-grid > div:nth-child(2) .stat .ic { color: #2563eb !important; } .admin-stats-grid > div:nth-child(3) .stat .ic { color: #16a34a !important; } .admin-stats-grid > div:nth-child(4) .stat .ic { color: #ea580c !important; } .admin-stats-grid > div:nth-child(5) .stat .ic { color: #ca8a04 !important; } .admin-stats-grid > div:nth-child(6) .stat .ic { color: #7c3aed !important; } .admin-stats-grid > div:nth-child(7) .stat .ic { color: #a855f7 !important; } /* ========================================================= QUICK ACCESS ICON COLORS - ALL DASHBOARDS Each quick-access icon has a semantic color matching its action. ========================================================= */ /* Common icon base */ .quick-access-card .quick-action-icon, .quick-card .quick-icon{ width:44px; height:44px; min-width:44px; display:inline-flex; align-items:center; justify-content:center; border-radius:12px; border:1px solid transparent; font-size:18px; } /* ADMIN - Quick Access */ .quick-access-grid > .quick-action:nth-child(1) .quick-action-icon{ background:#eaf4ff!important; color:#2563eb!important; border-color:#c9def8!important; } .quick-access-grid > .quick-action:nth-child(2) .quick-action-icon{ background:#edf9f0!important; color:#16a34a!important; border-color:#c9e8d2!important; } .quick-access-grid > .quick-action:nth-child(3) .quick-action-icon{ background:#fff7df!important; color:#ca8a04!important; border-color:#f0dda2!important; } .quick-access-grid > .quick-action:nth-child(4) .quick-action-icon{ background:#f1efff!important; color:#7c3aed!important; border-color:#ddd5fb!important; } /* STAFF - Quick Access */ .staff-original-stats + .row .quick-card:nth-child(1) .quick-icon{ background:#fceff3!important; color:#db2777!important; border-color:#f2ceda!important; } .staff-original-stats + .row .quick-card:nth-child(2) .quick-icon{ background:#f1efff!important; color:#7c3aed!important; border-color:#ddd5fb!important; } .staff-original-stats + .row .quick-card:nth-child(3) .quick-icon{ background:#eaf4ff!important; color:#2563eb!important; border-color:#c9def8!important; } .staff-original-stats + .row .quick-card:nth-child(4) .quick-icon{ background:#fff7df!important; color:#ca8a04!important; border-color:#f0dda2!important; } /* DEALER - Quick Access */ .quick-card .quick-icon{ transition:background-color .2s ease,color .2s ease,border-color .2s ease; } /* The dealer/customer dashboards use three quick cards. Scope by the page's portal wording to avoid changing other pages. */ .quick-card[href*="dealer/sales"] .quick-icon{ background:#e8f8ef!important; color:#16a34a!important; border-color:#c9e8d2!important; } .quick-card[href*="dealer/devices"] .quick-icon{ background:#eaf4ff!important; color:#2563eb!important; border-color:#c9def8!important; } .quick-card[href*="customer/maintenance_create"] .quick-icon{ background:#fceff3!important; color:#db2777!important; border-color:#f2ceda!important; } .quick-card[href*="customer/warranty"] .quick-icon{ background:#fff7df!important; color:#ca8a04!important; border-color:#f0dda2!important; } .quick-card[href*="customer/maintenance.php"] .quick-icon{ background:#f1efff!important; color:#7c3aed!important; border-color:#ddd5fb!important; } /* Dealer second/third cards share the same sales URL, so distinguish them by their position inside the dealer quick-access row. */ .row.g-3.mb-4 .quick-card[href*="dealer/sales.php"] .quick-icon{ background:#e8f8ef!important; color:#16a34a!important; border-color:#c9e8d2!important; } /* Dark mode: keep the same semantic colors with softer backgrounds. */ body.theme-dark .quick-access-grid > .quick-action:nth-child(1) .quick-action-icon{ background:rgba(37,99,235,.16)!important;color:#8ec5ff!important;border-color:rgba(37,99,235,.28)!important; } body.theme-dark .quick-access-grid > .quick-action:nth-child(2) .quick-action-icon{ background:rgba(22,163,74,.16)!important;color:#86d9a0!important;border-color:rgba(22,163,74,.28)!important; } body.theme-dark .quick-access-grid > .quick-action:nth-child(3) .quick-action-icon{ background:rgba(202,138,4,.16)!important;color:#f1c96a!important;border-color:rgba(202,138,4,.28)!important; } body.theme-dark .quick-access-grid > .quick-action:nth-child(4) .quick-action-icon{ background:rgba(124,58,237,.16)!important;color:#c5b1ff!important;border-color:rgba(124,58,237,.28)!important; } body.theme-dark .staff-original-stats + .row .quick-card:nth-child(1) .quick-icon{ background:rgba(219,39,119,.16)!important;color:#ff9cc4!important;border-color:rgba(219,39,119,.28)!important; } body.theme-dark .staff-original-stats + .row .quick-card:nth-child(2) .quick-icon{ background:rgba(124,58,237,.16)!important;color:#c5b1ff!important;border-color:rgba(124,58,237,.28)!important; } body.theme-dark .staff-original-stats + .row .quick-card:nth-child(3) .quick-icon{ background:rgba(37,99,235,.16)!important;color:#8ec5ff!important;border-color:rgba(37,99,235,.28)!important; } body.theme-dark .staff-original-stats + .row .quick-card:nth-child(4) .quick-icon{ background:rgba(202,138,4,.16)!important;color:#f1c96a!important;border-color:rgba(202,138,4,.28)!important; } body.theme-dark .quick-card[href*="dealer/sales"] .quick-icon{ background:rgba(22,163,74,.16)!important;color:#86d9a0!important;border-color:rgba(22,163,74,.28)!important; } body.theme-dark .quick-card[href*="dealer/devices"] .quick-icon{ background:rgba(37,99,235,.16)!important;color:#8ec5ff!important;border-color:rgba(37,99,235,.28)!important; } body.theme-dark .quick-card[href*="customer/maintenance_create"] .quick-icon{ background:rgba(219,39,119,.16)!important;color:#ff9cc4!important;border-color:rgba(219,39,119,.28)!important; } body.theme-dark .quick-card[href*="customer/warranty"] .quick-icon{ background:rgba(202,138,4,.16)!important;color:#f1c96a!important;border-color:rgba(202,138,4,.28)!important; } body.theme-dark .quick-card[href*="customer/maintenance.php"] .quick-icon{ background:rgba(124,58,237,.16)!important;color:#c5b1ff!important;border-color:rgba(124,58,237,.28)!important; } .dealer-quick-access .quick-card:nth-child(1) .quick-icon{ background:#e8f8ef!important;color:#16a34a!important;border-color:#c9e8d2!important; } .dealer-quick-access .quick-card:nth-child(2) .quick-icon{ background:#eaf4ff!important;color:#2563eb!important;border-color:#c9def8!important; } .dealer-quick-access .quick-card:nth-child(3) .quick-icon{ background:#f1efff!important;color:#7c3aed!important;border-color:#ddd5fb!important; } body.theme-dark .dealer-quick-access .quick-card:nth-child(1) .quick-icon{ background:rgba(22,163,74,.16)!important;color:#86d9a0!important;border-color:rgba(22,163,74,.28)!important; } body.theme-dark .dealer-quick-access .quick-card:nth-child(2) .quick-icon{ background:rgba(37,99,235,.16)!important;color:#8ec5ff!important;border-color:rgba(37,99,235,.28)!important; } body.theme-dark .dealer-quick-access .quick-card:nth-child(3) .quick-icon{ background:rgba(124,58,237,.16)!important;color:#c5b1ff!important;border-color:rgba(124,58,237,.28)!important; } /* ROLE QUICK ACCESS SEMANTIC COLORS - FINAL */ .quick-access-admin .quick-action:nth-child(1) .quick-action-icon, .quick-access-staff .quick-card:nth-child(1) .quick-icon, .quick-access-dealer .quick-card:nth-child(2) .quick-icon{ background:#eaf4ff!important;color:#2563eb!important;border-color:#c9def8!important; } .quick-access-admin .quick-action:nth-child(2) .quick-action-icon, .quick-access-dealer .quick-card:nth-child(1) .quick-icon{ background:#e8f8ef!important;color:#16a34a!important;border-color:#c9e8d2!important; } .quick-access-admin .quick-action:nth-child(3) .quick-action-icon, .quick-access-staff .quick-card:nth-child(3) .quick-icon{ background:#fff7df!important;color:#ca8a04!important;border-color:#f0dda2!important; } .quick-access-admin .quick-action:nth-child(4) .quick-action-icon, .quick-access-staff .quick-card:nth-child(2) .quick-icon, .quick-access-customer .quick-card:nth-child(3) .quick-icon, .quick-access-dealer .quick-card:nth-child(3) .quick-icon{ background:#f1efff!important;color:#7c3aed!important;border-color:#ddd5fb!important; } .quick-access-staff .quick-card:nth-child(1) .quick-icon, .quick-access-customer .quick-card:nth-child(1) .quick-icon{ background:#fceff3!important;color:#db2777!important;border-color:#f2ceda!important; } .quick-access-staff .quick-card:nth-child(4) .quick-icon{ background:#fff3e8!important;color:#ea580c!important;border-color:#f5d4b8!important; } .quick-access-customer .quick-card:nth-child(2) .quick-icon{ background:#fff7df!important;color:#ca8a04!important;border-color:#f0dda2!important; } .quick-access-technician .quick-card .quick-icon{ background:#eaf4ff!important;color:#2563eb!important;border-color:#c9def8!important; } body.theme-dark .quick-access-admin .quick-action:nth-child(1) .quick-action-icon, body.theme-dark .quick-access-staff .quick-card:nth-child(1) .quick-icon, body.theme-dark .quick-access-dealer .quick-card:nth-child(2) .quick-icon, body.theme-dark .quick-access-technician .quick-card .quick-icon{ background:rgba(37,99,235,.16)!important;color:#8ec5ff!important;border-color:rgba(37,99,235,.28)!important; } body.theme-dark .quick-access-admin .quick-action:nth-child(2) .quick-action-icon, body.theme-dark .quick-access-dealer .quick-card:nth-child(1) .quick-icon{ background:rgba(22,163,74,.16)!important;color:#86d9a0!important;border-color:rgba(22,163,74,.28)!important; } body.theme-dark .quick-access-admin .quick-action:nth-child(3) .quick-action-icon, body.theme-dark .quick-access-staff .quick-card:nth-child(3) .quick-icon, body.theme-dark .quick-access-customer .quick-card:nth-child(2) .quick-icon{ background:rgba(202,138,4,.16)!important;color:#f1c96a!important;border-color:rgba(202,138,4,.28)!important; } body.theme-dark .quick-access-admin .quick-action:nth-child(4) .quick-action-icon, body.theme-dark .quick-access-staff .quick-card:nth-child(2) .quick-icon, body.theme-dark .quick-access-customer .quick-card:nth-child(3) .quick-icon, body.theme-dark .quick-access-dealer .quick-card:nth-child(3) .quick-icon{ background:rgba(124,58,237,.16)!important;color:#c5b1ff!important;border-color:rgba(124,58,237,.28)!important; } body.theme-dark .quick-access-staff .quick-card:nth-child(1) .quick-icon, body.theme-dark .quick-access-customer .quick-card:nth-child(1) .quick-icon{ background:rgba(219,39,119,.16)!important;color:#ff9cc4!important;border-color:rgba(219,39,119,.28)!important; } body.theme-dark .quick-access-staff .quick-card:nth-child(4) .quick-icon{ background:rgba(234,88,12,.16)!important;color:#ffb27d!important;border-color:rgba(234,88,12,.28)!important; } /* ========================================================= DASHBOARD STAT ICON COLORS - STAFF / DEALER / TECHNICIAN / CUSTOMER Match the Admin dashboard: every top statistic gets its own semantic color. ========================================================= */ .staff-original-stats > div:nth-child(1) .stat .ic{background:#fff0f3!important;color:#db2777!important;border-color:#f2ceda!important} .staff-original-stats > div:nth-child(2) .stat .ic{background:#eaf4ff!important;color:#2563eb!important;border-color:#c9def8!important} .staff-original-stats > div:nth-child(3) .stat .ic{background:#fff7df!important;color:#ca8a04!important;border-color:#f0dda2!important} .staff-original-stats > div:nth-child(4) .stat .ic{background:#fff3e8!important;color:#ea580c!important;border-color:#f4d1b0!important} .staff-original-stats > div:nth-child(5) .stat .ic{background:#edf9f0!important;color:#16a34a!important;border-color:#c9e8d2!important} /* Precise role scoping */ .dealer-dashboard-stats > div:nth-child(1) .stat .ic{background:#eaf4ff!important;color:#2563eb!important;border-color:#c9def8!important} .dealer-dashboard-stats > div:nth-child(2) .stat .ic{background:#edf9f0!important;color:#16a34a!important;border-color:#c9e8d2!important} .dealer-dashboard-stats > div:nth-child(3) .stat .ic{background:#fff7df!important;color:#ca8a04!important;border-color:#f0dda2!important} .dealer-dashboard-stats > div:nth-child(4) .stat .ic{background:#f1efff!important;color:#7c3aed!important;border-color:#ddd5fb!important} .technician-dashboard-stats > div:nth-child(1) .stat .ic{background:#eaf4ff!important;color:#2563eb!important;border-color:#c9def8!important} .technician-dashboard-stats > div:nth-child(2) .stat .ic{background:#fff3e8!important;color:#ea580c!important;border-color:#f4d1b0!important} .technician-dashboard-stats > div:nth-child(3) .stat .ic{background:#edf9f0!important;color:#16a34a!important;border-color:#c9e8d2!important} .customer-dashboard-stats > div:nth-child(1) .stat .ic{background:#eaf4ff!important;color:#2563eb!important;border-color:#c9def8!important} .customer-dashboard-stats > div:nth-child(2) .stat .ic{background:#edf9f0!important;color:#16a34a!important;border-color:#c9e8d2!important} .customer-dashboard-stats > div:nth-child(3) .stat .ic{background:#fff3e8!important;color:#ea580c!important;border-color:#f4d1b0!important} .customer-dashboard-stats > div:nth-child(4) .stat .ic{background:#f1efff!important;color:#7c3aed!important;border-color:#ddd5fb!important} body.theme-dark .dealer-dashboard-stats > div:nth-child(1) .stat .ic,body.theme-dark .customer-dashboard-stats > div:nth-child(1) .stat .ic,body.theme-dark .technician-dashboard-stats > div:nth-child(1) .stat .ic{background:rgba(37,99,235,.16)!important;color:#8ec5ff!important;border-color:rgba(37,99,235,.28)!important} body.theme-dark .dealer-dashboard-stats > div:nth-child(2) .stat .ic,body.theme-dark .customer-dashboard-stats > div:nth-child(2) .stat .ic,body.theme-dark .technician-dashboard-stats > div:nth-child(3) .stat .ic{background:rgba(22,163,74,.16)!important;color:#86d9a0!important;border-color:rgba(22,163,74,.28)!important} body.theme-dark .dealer-dashboard-stats > div:nth-child(3) .stat .ic,body.theme-dark .staff-original-stats > div:nth-child(3) .stat .ic{background:rgba(202,138,4,.16)!important;color:#f1c96a!important;border-color:rgba(202,138,4,.28)!important} body.theme-dark .dealer-dashboard-stats > div:nth-child(4) .stat .ic,body.theme-dark .customer-dashboard-stats > div:nth-child(4) .stat .ic{background:rgba(124,58,237,.16)!important;color:#c5b1ff!important;border-color:rgba(124,58,237,.28)!important} body.theme-dark .technician-dashboard-stats > div:nth-child(2) .stat .ic,body.theme-dark .customer-dashboard-stats > div:nth-child(3) .stat .ic{background:rgba(234,88,12,.16)!important;color:#ffb47d!important;border-color:rgba(234,88,12,.28)!important} body.theme-dark .staff-original-stats > div:nth-child(1) .stat .ic{background:rgba(219,39,119,.16)!important;color:#ff9cc4!important;border-color:rgba(219,39,119,.28)!important} body.theme-dark .staff-original-stats > div:nth-child(2) .stat .ic{background:rgba(37,99,235,.16)!important;color:#8ec5ff!important;border-color:rgba(37,99,235,.28)!important} body.theme-dark .staff-original-stats > div:nth-child(4) .stat .ic{background:rgba(234,88,12,.16)!important;color:#ffb47d!important;border-color:rgba(234,88,12,.28)!important} body.theme-dark .staff-original-stats > div:nth-child(5) .stat .ic{background:rgba(22,163,74,.16)!important;color:#86d9a0!important;border-color:rgba(22,163,74,.28)!important} /* ========================================================= CUSTOMER DEVICES ========================================================= */ .customer-device-card{transition:transform .2s ease,box-shadow .2s ease} .customer-device-card:hover{transform:translateY(-3px);box-shadow:0 16px 38px rgba(15,23,42,.10)} .customer-device-media{height:190px;position:relative;background:linear-gradient(135deg,var(--soft),rgba(166,7,29,.04));display:flex;align-items:center;justify-content:center;overflow:hidden} .customer-device-media img{width:100%;height:100%;object-fit:cover} .customer-device-placeholder{font-size:5rem;color:var(--mega);opacity:.22} .customer-device-warranty{position:absolute;top:14px;right:14px;padding:.45rem .75rem} .customer-device-icon,.device-mini-icon{width:42px;height:42px;border-radius:12px;background:var(--soft);color:var(--mega);display:flex;align-items:center;justify-content:center;flex:0 0 auto} .customer-device-info{display:grid;grid-template-columns:1fr 1fr;gap:12px} .customer-device-info>div{padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:var(--surface)} .customer-device-info small{display:block;color:var(--muted);font-size:.76rem;margin-bottom:3px} .customer-device-info b{font-size:.84rem;display:block;overflow-wrap:anywhere} .device-last-request{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:12px;background:var(--soft);font-size:.86rem} .device-last-request i{color:var(--mega)} .customer-dashboard-device{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;padding:14px;border:1px solid var(--border);border-radius:14px;background:var(--surface);height:100%;transition:.2s} .customer-dashboard-device:hover{border-color:rgba(166,7,29,.25);transform:translateY(-2px);color:inherit} .customer-dashboard-device .device-mini-icon{width:40px;height:40px} .customer-dashboard-device b{font-size:.92rem} .customer-dashboard-device code{font-size:.74rem} .empty-icon{width:70px;height:70px;border-radius:20px;background:var(--soft);color:var(--mega);display:inline-flex;align-items:center;justify-content:center;font-size:2rem} body.theme-dark .customer-device-media{background:linear-gradient(135deg,rgba(166,7,29,.12),rgba(255,255,255,.02))} body.theme-dark .customer-device-info>div{background:rgba(255,255,255,.02)} /* Customer dashboard + devices: unified table layout */ .page-head-modern{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px;flex-wrap:wrap}.page-kicker{display:inline-flex;gap:7px;align-items:center;color:var(--red);font-size:.78rem;font-weight:800;margin-bottom:5px}.customer-dashboard-devices,.customer-devices-panel{border:1px solid var(--line);box-shadow:var(--shadow);border-radius:18px}.customer-table-wrap{border:1px solid var(--line);border-radius:14px;overflow:auto}.customer-modern-table{min-width:850px}.customer-modern-table thead th{font-size:.76rem;color:var(--muted);font-weight:800;background:var(--soft);border-bottom:1px solid var(--line);padding:14px 15px;white-space:nowrap}.customer-modern-table tbody td{padding:15px;border-bottom:1px solid var(--line);font-size:.84rem;white-space:nowrap}.customer-modern-table tbody tr:last-child td{border-bottom:0}.customer-modern-table tbody tr{transition:.16s}.customer-modern-table tbody tr:hover{background:rgba(166,7,29,.025)}.device-table-name{display:flex;align-items:center;gap:11px;min-width:205px}.device-table-name b{display:block;font-size:.88rem}.device-table-name small{display:block;color:var(--muted);margin-top:2px}.device-table-icon{width:43px;height:43px;border-radius:12px;background:var(--soft);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--red);font-size:1.15rem;flex:0 0 auto;overflow:hidden}.device-table-icon img{width:100%;height:100%;object-fit:cover}.device-status-badge{display:inline-flex;align-items:center;justify-content:center;padding:7px 11px;border-radius:999px;font-size:11px;font-weight:800;border:1px solid transparent}.device-status-badge.active{background:#e8f8ef;color:#16824f;border-color:#bde8d0}.device-status-badge.pending{background:#fff7df;color:#a66a00;border-color:#f0dda2}.device-status-badge.expired{background:#fff0f1;color:#b50920;border-color:#efc4c9}.device-status-badge.cancelled{background:#eef1f4;color:#687281;border-color:#dce1e7}.device-actions{display:flex;gap:6px}.device-actions .btn{border-radius:9px}.summary-box{height:100%;padding:16px;display:flex;align-items:center;gap:12px}.summary-box>span{width:44px;height:44px;border-radius:12px;background:var(--soft);color:var(--red);display:flex;align-items:center;justify-content:center;font-size:1.2rem}.summary-box b{display:block;font-size:1.35rem;line-height:1.1}.summary-box small{display:block;color:var(--muted);margin-top:4px}.customer-device-summary .cardx{border-radius:16px}.customer-dashboard-stats .stat{min-height:126px}.quick-access-customer .quick-card{min-height:82px} body.theme-dark .customer-modern-table thead th{background:rgba(255,255,255,.035)}body.theme-dark .customer-modern-table tbody tr:hover{background:rgba(255,255,255,.025)}body.theme-dark .device-status-badge.active{background:rgba(32,181,107,.12);color:#79dfaa;border-color:rgba(32,181,107,.24)}body.theme-dark .device-status-badge.pending{background:rgba(230,167,25,.12);color:#f1c96a;border-color:rgba(230,167,25,.24)}body.theme-dark .device-status-badge.expired{background:rgba(213,42,66,.12);color:#ff9aaa;border-color:rgba(213,42,66,.24)}body.theme-dark .device-status-badge.cancelled{background:rgba(137,147,161,.12);color:#bac2cc;border-color:rgba(137,147,161,.2)} @media(max-width:767px){.page-head-modern{align-items:flex-start}.page-head-modern .btn{width:100%}.customer-modern-table{min-width:820px}} /* Customer devices: clean table-first layout */ .customer-devices-panel{margin-top:6px}.customer-devices-panel .section-head{padding:18px 20px 14px}.customer-devices-panel .section-head h5{font-size:1.05rem}.customer-devices-panel .customer-table-wrap{border-radius:0 0 14px 14px;border-left:0;border-right:0;border-bottom:0} /* تحسين نموذج إضافة وتعديل الكفالات */ .warranty-modal-head{background:linear-gradient(135deg,#fff7f8,#fff);align-items:flex-start}.warranty-modal-head h5{font-weight:900;color:var(--ink)}.warranty-modal-head small{color:var(--muted);font-size:11px}.warranty-section{border:1px solid #edf0f4;border-radius:16px;padding:18px;margin-bottom:18px;background:#fff}.warranty-section-title{display:flex;gap:12px;align-items:center;margin-bottom:17px}.warranty-section-title .section-number{width:31px;height:31px;border-radius:10px;background:var(--soft);color:var(--red);display:grid;place-items:center;font-weight:900}.warranty-section-title strong{display:block;font-size:14px}.warranty-section-title small{display:block;color:var(--muted);font-size:11px;margin-top:3px}.sale-preview{display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:12px;padding:14px;border-radius:13px;background:#fafbfc;border:1px dashed #dfe4eb}.sale-preview small{display:block;color:var(--muted);font-size:10px;margin-bottom:4px}.sale-preview strong{display:block;font-size:12px;color:var(--ink);overflow-wrap:anywhere}.status-options{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.status-options label{cursor:pointer;border:1px solid #e5e8ee;border-radius:13px;padding:12px;display:flex;gap:9px;align-items:flex-start;transition:.15s}.status-options label:has(input:checked){border-color:#d65a6b;background:#fff5f6}.status-options input{accent-color:var(--red);margin-top:4px}.status-options b{display:block;font-size:12px}.status-options small{display:block;color:var(--muted);font-size:10px;margin-top:3px}@media(max-width:600px){.sale-preview,.status-options{grid-template-columns:1fr}.warranty-section{padding:13px}.warranty-modal-head{padding:16px}.warranty-form .modal-body{padding:14px!important}} /* Dashboard hero: follows the global theme */ .hero{background:var(--white)!important;color:var(--ink)!important;border:1px solid var(--line);box-shadow:var(--shadow)} .hero:after{border-color:var(--line)!important} .hero .hero-kicker,.hero h1,.hero p,.hero i{color:var(--ink)!important} body.theme-dark .hero{background:#191c23!important;color:#f3f4f6!important;border-color:#2b303a!important;box-shadow:0 16px 45px rgba(0,0,0,.28)} body.theme-dark .hero:after{border-color:#2b303a!important} body.theme-dark .hero .hero-kicker, body.theme-dark .hero h1, body.theme-dark .hero p, body.theme-dark .hero i{color:#f3f4f6!important} body.theme-dark .hero p{opacity:.78} /* Unified action buttons - same appearance as Devices page */ .device-actions .btn{border-radius:9px;font-weight:700} .device-actions .btn:hover{transform:translateY(-1px)} /* Slightly larger action buttons on selected management pages only */ body[data-page="إدارة العملاء"] .device-actions .btn, body[data-page="إدارة التجار"] .device-actions .btn, body[data-page="إدارة الصيانة"] .device-actions .btn, body[data-page="المستخدمون والصلاحيات"] .device-actions .btn, body[data-page="إدارة الفنيين"] .device-actions .btn{ font-size:13px; padding:.38rem .68rem; min-height:34px; } /* Language switcher */ .language-toggle{ border:1px solid rgba(0,0,0,.12); background:transparent; color:inherit; border-radius:10px; min-height:38px; padding:7px 11px; display:inline-flex; align-items:center; gap:7px; cursor:pointer; font-weight:700; font-size:.86rem; } .language-toggle:hover{background:rgba(166,7,29,.08)} .login-language-toggle{ position:fixed; top:18px; inset-inline-end:18px; z-index:20; background:rgba(255,255,255,.9); } html[dir="ltr"] .sidebar{direction:ltr} html[dir="ltr"] .side-nav, html[dir="ltr"] .side-user, html[dir="ltr"] .brand, html[dir="ltr"] .side-bottom{direction:ltr} html[dir="ltr"] .breadcrumb-wrap, html[dir="ltr"] .header-actions{direction:ltr} html[dir="ltr"] .dropdown-menu{direction:ltr} html[dir="ltr"] .form-control, html[dir="ltr"] .form-select, html[dir="ltr"] textarea{direction:ltr;text-align:left} /* MEGA: dashboard KPI numbers - same admin red for all role dashboards */ .staff-original-stats .stat h3, .dealer-dashboard-stats .stat h3, .technician-dashboard-stats .stat h3, .customer-dashboard-stats .stat h3 { color: var(--red); } /* MEGA wordmark matched to the supplied reference */ .brand{gap:8px} .brand-wordmark{display:flex;flex-direction:column;justify-content:center;min-width:0} .brand-wordmark img{display:block;width:102px;height:auto;max-height:42px;object-fit:contain;object-position:right center} .brand-wordmark small{display:block;font-size:9px;opacity:.72;margin-top:-2px;white-space:nowrap} .sidebar.collapsed .brand-wordmark small{display:none} .sidebar.collapsed .brand-wordmark img{width:52px;max-height:38px} .sidebar.collapsed .brand-wordmark{align-items:center}