:root{--navy:#2e3192;--sky:#29abe2;--green:#0d2e1f;--gray:#808285;--bg:#f5f7fb;--card:#fff;--text:#1c2130;--muted:#6b7280;--border:#e4e8f0}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,Tahoma,Noto Kufi Arabic,Helvetica Neue,Arial,sans-serif;background:var(--bg);color:var(--text);min-height:100vh}a{color:inherit;text-decoration:none}.header{background:var(--navy);color:#fff;padding:16px 28px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}.header h1{font-size:18px;font-weight:700}.header .accent{color:var(--sky)}.header nav{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.header nav a,.header nav button{color:#fff;background:hsla(0,0%,100%,.12);border:none;padding:7px 14px;border-radius:8px;font-size:13px;cursor:pointer;font-family:inherit}.header nav a:hover,.header nav button:hover{background:hsla(0,0%,100%,.22)}.header nav a.active{background:var(--sky)}.container{max-width:1080px;margin:0 auto;padding:28px 20px 60px}.welcome{margin-bottom:24px}.welcome h2{font-size:20px;color:var(--navy);margin-bottom:4px}.welcome p{color:var(--muted);font-size:14px}.company{margin-bottom:30px}.company-title{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;margin-bottom:12px}.company-dot{width:12px;height:12px;border-radius:4px;display:inline-block}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));grid-gap:14px;gap:14px}.card{background:var(--card);border:1px solid var(--border);border-right:4px solid var(--navy);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:8px;transition:box-shadow .15s,transform .15s;position:relative}.card.open:hover{box-shadow:0 6px 18px rgba(46,49,146,.12);transform:translateY(-2px)}.card h3{font-size:15px}.card p{font-size:12.5px;color:var(--muted);line-height:1.6;flex:1 1}.card .cta{font-size:13px;font-weight:600;color:var(--sky)}.card.locked{background:#f2f3f6;opacity:.85}.card.locked h3,.lock-icon{color:var(--gray)}.lock-icon{position:absolute;top:14px;left:14px;font-size:15px}.badge{display:inline-block;font-size:11.5px;padding:4px 10px;border-radius:20px;background:#fff5e0;color:#a06b00;border:1px solid #f0dcae}.badge,button.req{width:-moz-fit-content;width:fit-content}button.req{font-family:inherit;font-size:12.5px;cursor:pointer;background:#fff;color:var(--navy);border:1px solid var(--navy);padding:6px 14px;border-radius:8px}button.req:hover{background:var(--navy);color:#fff}.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,var(--navy),#1c1f66);padding:20px}.login-box{background:#fff;border-radius:16px;padding:36px 32px;width:100%;max-width:380px;box-shadow:0 20px 60px rgba(0,0,0,.25)}.login-box h1{font-size:18px;color:var(--navy);margin-bottom:4px;text-align:center}.login-box .sub{text-align:center;color:var(--muted);font-size:13px;margin-bottom:24px}.login-box label{display:block;font-size:13px;margin-bottom:6px;font-weight:600}.form input,.form select,.login-box input{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:8px;font-family:inherit;font-size:14px;margin-bottom:14px;background:#fafbfd}.form input:focus,.login-box input:focus{outline:2px solid var(--sky);border-color:transparent}.btn-primary{width:100%;background:var(--navy);color:#fff;border:none;padding:12px;border-radius:8px;font-family:inherit;font-size:15px;font-weight:700;cursor:pointer}.btn-primary:hover{background:#24276f}.error{background:#fdecec;color:#b42323;border:1px solid #f5c6c6;padding:10px 12px;border-radius:8px;font-size:13px;margin-bottom:14px}.panel{background:#fff;border:1px solid var(--border);border-radius:12px;padding:22px;margin-bottom:20px}.panel h2{font-size:16px;color:var(--navy);margin-bottom:16px}table{width:100%;border-collapse:collapse;font-size:13.5px}th{text-align:right;color:var(--muted);font-weight:600;padding:8px 10px;border-bottom:2px solid var(--border)}td{padding:10px;border-bottom:1px solid var(--border)}.pill{font-size:11.5px;padding:3px 10px;border-radius:20px;display:inline-block}.pill.pending{background:#fff5e0;color:#a06b00}.pill.approved{background:#e5f7ec;color:#14713d}.pill.rejected{background:#fdecec;color:#b42323}.pill.on{background:#e5f7ec;color:#14713d}.pill.off{background:#f0f1f4;color:var(--gray)}.actions button{font-family:inherit;font-size:12px;cursor:pointer;border-radius:6px;padding:5px 12px;-webkit-margin-end:6px;margin-inline-end:6px;border:1px solid var(--border);background:#fff}.actions .ok{border-color:#14713d;color:#14713d}.actions .ok:hover{background:#14713d;color:#fff}.actions .no{border-color:#b42323;color:#b42323}.actions .no:hover{background:#b42323;color:#fff}.form{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));grid-gap:0 14px;gap:0 14px;align-items:end}.form .btn-primary{width:auto;padding:10px 24px;margin-bottom:14px}.muted{font-size:12.5px}.empty,.muted{color:var(--muted)}.empty{text-align:center;padding:26px 0;font-size:14px}