:root{
  --navy:#0B1F3B;--navy2:#102B4F;--gold:#C9A96A;--gold2:#B68D49;--ivory:#F7F4ED;
  --paper:#FCFBF8;--white:#fff;--ink:#243142;--graphite:#303840;--muted:#6B7280;--line:#E7E2D8;
  --green:#087A55;--amber:#B36B00;--red:#B42318;--blue:#3157B7;--purple:#7047A3;--rose:#A13D61;--teal:#0C7D78;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"Cairo",Tahoma,Arial,sans-serif;background:linear-gradient(180deg,#fbfaf7 0%,#f4f0e8 100%);color:var(--graphite);min-height:100vh}
a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}.ltr{direction:ltr}.en{font-family:Inter,Arial,sans-serif}.muted{color:var(--muted)}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:28px;background:radial-gradient(circle at 13% 18%,rgba(201,169,106,.22),transparent 28%),linear-gradient(135deg,#071427,#0B1F3B 55%,#15335a)}
.login-card{width:min(980px,100%);display:grid;grid-template-columns:1.08fr .92fr;border-radius:30px;overflow:hidden;background:#fff;box-shadow:0 34px 84px rgba(0,0,0,.28)}
.login-brand{padding:48px;color:white;background:linear-gradient(160deg,rgba(11,31,59,.96),rgba(16,43,79,.93)),url('../img/logo.png') center/330px no-repeat;min-height:590px;display:flex;flex-direction:column;justify-content:space-between;position:relative;isolation:isolate}.login-brand:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,31,59,.45),rgba(11,31,59,.92));z-index:-1}.login-brand img{width:190px;height:auto}.login-brand h1{font-size:38px;line-height:1.35;margin:34px 0 10px}.login-brand p{color:#d7dfeb;line-height:1.9;max-width:460px}.brand-tag{font-size:13px;letter-spacing:.05em;color:#d7c6a4}.login-pane{padding:50px;display:flex;flex-direction:column;justify-content:center}.eyebrow{font-size:12px;letter-spacing:.12em;color:#997539;font-weight:800}.login-pane h2{font-size:31px;color:var(--navy);margin:8px 0 8px}.sub{color:var(--muted);line-height:1.8;margin:0 0 26px}.field{margin-bottom:16px}.field label{display:block;font-size:13px;font-weight:800;color:#3d4651;margin-bottom:7px}.field .en-label{font-size:10px;font-weight:600;color:#8b9198;margin-right:6px}.input, input, textarea, select{width:100%;background:#fff;border:1px solid #d7dbe2;border-radius:12px;padding:13px 14px;outline:none;color:#263444;transition:.18s}.input:focus,input:focus,textarea:focus,select:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,169,106,.15)}textarea{min-height:116px;resize:vertical}.btn{border:0;border-radius:12px;padding:12px 17px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:.18s}.btn:hover{transform:translateY(-1px)}.btn-primary{background:linear-gradient(135deg,var(--gold2),#d4b575);color:#fff;box-shadow:0 9px 22px rgba(182,141,73,.25)}.btn-navy{background:var(--navy);color:#fff}.btn-ghost{background:#fff;border:1px solid #d9dde4;color:var(--navy)}.btn-danger{background:#fff1f0;color:var(--red);border:1px solid #f2c7c2}.btn-sm{padding:8px 11px;font-size:12px}.full{width:100%}.hint{font-size:12px;color:#776d5b;padding:11px 12px;border-radius:11px;background:#faf8f3;border:1px dashed #d8c9a9;margin-top:14px;line-height:1.7}.alert{padding:12px 14px;border-radius:12px;margin-bottom:12px;font-size:13px}.alert-success{background:#ecfdf3;color:#087a55}.alert-error{background:#fff1f0;color:#b42318}
.topbar{height:78px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 26px;position:sticky;top:0;z-index:20;box-shadow:0 3px 18px rgba(2,17,36,.14)}.brand-row{display:flex;align-items:center;gap:14px}.brand-row img{height:54px;width:auto}.client-pill{padding:7px 11px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);border-radius:999px;font-size:12px;color:#edf1f7}.user-row{display:flex;gap:10px;align-items:center}.user-name{font-size:12px;color:#d7dfea}.shell{display:grid;grid-template-columns:248px 1fr;min-height:calc(100vh - 78px)}.sidebar{background:#fff;border-left:1px solid var(--line);padding:20px 14px;position:sticky;top:78px;height:calc(100vh - 78px)}.nav-section{font-size:10px;color:#a2a6ab;padding:8px 11px;text-transform:uppercase;letter-spacing:.08em}.nav-link{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:12px;margin-bottom:5px;color:#4b5563;font-weight:800;font-size:13px}.nav-link:hover,.nav-link.active{background:#f5f0e5;color:var(--navy)}.nav-icon{width:25px;color:#ad8341;text-align:center}.side-note{margin-top:24px;background:#f8f5ee;border:1px solid #ece3d3;border-radius:13px;padding:13px;font-size:11px;line-height:1.7;color:#766b59}.main{padding:28px;max-width:1480px;width:100%;margin:0 auto}.page-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:22px}.page-head h1{margin:0;color:var(--navy);font-size:29px}.page-head p{margin:5px 0 0;color:var(--muted);font-size:13px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:22px}.stat{background:#fff;border:1px solid #eae5dc;border-radius:17px;padding:17px 18px;box-shadow:0 5px 16px rgba(28,36,48,.025)}.stat-top{display:flex;justify-content:space-between;align-items:center}.stat-num{font-size:30px;line-height:1;font-weight:900;color:var(--navy)}.stat-label{font-size:12px;color:#68717d;margin-top:8px}.stat-en{font-size:9px;color:#a0a5aa;margin-top:2px}.dot{width:9px;height:9px;border-radius:50%}.grid2{display:grid;grid-template-columns:1.25fr .75fr;gap:18px}.card{background:#fff;border:1px solid #e9e4db;border-radius:18px;overflow:hidden;box-shadow:0 7px 24px rgba(35,43,54,.03)}.card-head{padding:17px 19px;border-bottom:1px solid #eee9e1;display:flex;align-items:center;justify-content:space-between;gap:12px}.card-head h2,.card-head h3{margin:0;color:var(--navy);font-size:17px}.card-body{padding:19px}.ticket-list{display:grid;gap:10px}.ticket-card{display:grid;grid-template-columns:1fr auto;gap:12px;padding:15px;border:1px solid #ece7de;border-radius:14px;background:#fff;transition:.18s}.ticket-card:hover{border-color:#d7c19a;box-shadow:0 7px 20px rgba(40,47,59,.05);transform:translateY(-1px)}.ticket-title{font-size:14px;font-weight:900;color:#26374d;margin-bottom:6px}.meta{display:flex;gap:10px;flex-wrap:wrap;font-size:11px;color:#7a828c}.meta span{display:inline-flex;align-items:center;gap:4px}.badge{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;font-size:10px;font-weight:900;white-space:nowrap}.badge-blue{background:#eef4ff;color:#3157b7}.badge-green{background:#ecfdf3;color:#087a55}.badge-amber{background:#fff7e6;color:#a95f00}.badge-red{background:#fff1f0;color:#b42318}.badge-slate{background:#f2f4f7;color:#52606f}.badge-purple{background:#f4effa;color:#7047a3}.badge-rose{background:#fff0f5;color:#a13d61}.badge-teal{background:#e9fbf9;color:#0c7d78}.empty{padding:30px;text-align:center;color:#8a929a;border:1px dashed #d9d5cd;border-radius:14px;background:#fbfaf8}.filters{display:flex;gap:7px;flex-wrap:wrap}.filter{font-size:11px;border:1px solid #dedbd5;background:#fff;color:#606873;border-radius:999px;padding:6px 10px}.filter.active{background:var(--navy);color:#fff;border-color:var(--navy)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.upload-box{border:1px dashed #ccb98f;background:#fcfaf6;border-radius:14px;padding:17px;text-align:center;color:#6d6253}.upload-box input{border:0;padding:0;margin-top:9px;background:transparent}.upload-note{font-size:11px;color:#858078;margin-top:5px}.previews{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;justify-content:center}.previews img{width:78px;height:78px;object-fit:cover;border-radius:10px;border:1px solid #e4ddd1}.section-title{color:var(--navy);font-size:18px;margin:0 0 4px}.section-sub{font-size:12px;color:var(--muted);margin:0 0 18px}.priority-options{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.priority-option input{display:none}.priority-option label{display:block;border:1px solid #dddfe4;border-radius:12px;padding:11px;text-align:center;cursor:pointer;font-weight:800;font-size:12px}.priority-option input:checked+label{border-color:var(--gold);background:#faf5e9;color:var(--navy);box-shadow:0 0 0 2px rgba(201,169,106,.13)}
.ticket-hero{display:grid;grid-template-columns:1fr auto;gap:15px;align-items:start;margin-bottom:18px}.ticket-hero h1{font-size:26px;color:var(--navy);margin:4px 0}.ticket-no{font-size:11px;letter-spacing:.08em;color:#9b783d;font-weight:900}.detail-grid{display:grid;grid-template-columns:1fr 360px;gap:18px}.kv{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.kv-box{border:1px solid #ece7de;border-radius:12px;padding:12px;background:#fcfbf8}.kv-label{font-size:10px;color:#8a9198}.kv-value{font-size:13px;color:#2e3a48;font-weight:800;margin-top:3px}.description{line-height:1.95;color:#4f5965;font-size:13px;white-space:pre-wrap}.timeline{position:relative;margin:3px 9px 0 0;padding-right:24px;border-right:2px solid #e7dfd0}.timeline-event{position:relative;padding:0 0 20px}.timeline-event:before{content:"";position:absolute;right:-31px;top:3px;width:11px;height:11px;border-radius:50%;background:var(--gold);border:3px solid #fff;box-shadow:0 0 0 1px #d6c19b}.timeline-event h4{font-size:13px;color:var(--navy);margin:0 0 3px}.timeline-event time{font-size:10px;color:#9a9fa5}.timeline-event p{font-size:12px;color:#65707b;line-height:1.7;margin:5px 0 0}.attachment-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.attachment{border:1px solid #e7e2da;border-radius:12px;overflow:hidden;background:#fff;display:block}.attachment img{width:100%;height:115px;object-fit:cover;display:block}.attachment-meta{padding:7px;font-size:10px;color:#737b84;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.comment{padding:11px 12px;background:#faf9f6;border:1px solid #ebe7df;border-radius:12px;margin-bottom:8px}.comment-head{display:flex;justify-content:space-between;gap:10px;font-size:10px;color:#8a9096}.comment-body{font-size:12px;color:#4d5761;line-height:1.7;margin-top:5px}.status-select{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.status-select select{width:auto;min-width:190px}.action-panel{display:grid;gap:13px}.admin-table{width:100%;border-collapse:collapse}.admin-table th,.admin-table td{text-align:right;padding:11px 9px;border-bottom:1px solid #ece8e1;font-size:11px;vertical-align:middle}.admin-table th{color:#7d858e;font-weight:800;background:#fbfaf8}.admin-table td strong{color:#2c3b4f}.admin-table tr:hover td{background:#fdfbf7}
.footer{padding:24px 28px;color:#8b9197;font-size:10px;text-align:center}.mobile-nav{display:none}
@media(max-width:1050px){.grid2,.detail-grid{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.login-card{grid-template-columns:1fr}.login-brand{display:none}.login-pane{padding:34px 24px}.shell{grid-template-columns:1fr}.sidebar{display:none}.topbar{padding:0 14px;height:70px}.brand-row img{height:47px}.client-pill,.user-name{display:none}.main{padding:18px}.page-head{align-items:flex-start;flex-direction:column}.page-head h1{font-size:24px}.form-grid{grid-template-columns:1fr}.ticket-card{grid-template-columns:1fr}.attachment-grid{grid-template-columns:repeat(2,1fr)}.mobile-nav{display:flex;position:fixed;bottom:12px;left:12px;right:12px;z-index:40;background:var(--navy);border-radius:16px;padding:7px;box-shadow:0 10px 35px rgba(5,20,41,.3);justify-content:space-around}.mobile-nav a{color:#dbe4ef;font-size:10px;padding:8px;text-align:center}.mobile-nav a b{display:block;font-size:16px;color:var(--gold)}}
@media(max-width:480px){.stats{grid-template-columns:1fr 1fr;gap:9px}.stat{padding:14px}.stat-num{font-size:25px}.priority-options{grid-template-columns:1fr}.ticket-hero{grid-template-columns:1fr}.kv{grid-template-columns:1fr}.attachment-grid{grid-template-columns:1fr}.page-head .btn{width:100%}}