@import url('base-style.css');
:root{--navy:#071a38;--navy-2:#0b2856;--royal:#075fb8;--blue:#0878d1;--cyan:#31a5e7;--bg:#f3f6fa;--ink:#10233f;--muted:#63748c;--line:#dce4ee;--success:#138a62;--warning:#c98214;--danger:#c43d4d;--shadow:0 12px 34px rgba(9,32,67,.09)}
*{scrollbar-color:#9cb0c8 transparent;scrollbar-width:thin}body{background:linear-gradient(180deg,#eef3f8 0,#f7f9fc 390px);font-family:"Segoe UI",Tahoma,Arial,sans-serif;letter-spacing:0;color:var(--ink)}
aside{width:274px;background:linear-gradient(180deg,#06172f 0%,#092651 62%,#06172f 100%);padding:26px 20px;border-left:1px solid rgba(255,255,255,.07);box-shadow:-8px 0 34px rgba(3,17,39,.14);z-index:10}.brand{display:grid;justify-items:center;gap:10px;padding:9px 4px 25px;border-bottom:1px solid rgba(255,255,255,.11)}.brand>b{width:210px;height:72px;border-radius:12px;background:#fff url('arkan-logo.jpeg') center/190px auto no-repeat;font-size:0;box-shadow:0 9px 28px rgba(0,0,0,.18)}.brand span{display:grid;font-size:15px;text-align:center;line-height:1.7}.brand small{font-weight:400;color:#a8bdd8}
nav{gap:9px;margin-top:26px}nav a{position:relative;color:#c5d3e6;padding:14px 17px;border:1px solid transparent;border-radius:12px;font-size:14px;transition:.2s ease}nav a:before{content:"";display:inline-block;width:8px;height:8px;margin-left:11px;border:2px solid #5f91c7;border-radius:3px;transform:rotate(45deg)}nav a.active,nav a:hover{background:linear-gradient(110deg,rgba(13,112,204,.33),rgba(255,255,255,.07));border-color:rgba(105,173,234,.26);color:#fff;transform:translateX(-2px)}.profile{border-top-color:rgba(255,255,255,.13);padding:18px 12px 0}.profile strong{font-size:15px}.profile small{color:#9fb4d0}.profile a{color:#e1e9f4}
main{margin-right:274px;padding:34px 38px 56px;max-width:none;min-height:100vh}header{min-height:80px;padding:0 4px 12px;border-bottom:1px solid var(--line)}header small{color:var(--muted);font-size:12px}header h1{font-size:27px;margin:8px 0 5px;letter-spacing:-.4px}header p{margin:0;color:var(--muted)}.primary{background:linear-gradient(135deg,var(--royal),var(--blue));border-radius:10px;padding:13px 20px;box-shadow:0 8px 18px rgba(7,95,184,.22);transition:.2s ease}.primary:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(7,95,184,.28)}
.hero{position:relative;overflow:hidden;margin:25px 0 18px;padding:28px 31px;border-radius:18px;background:linear-gradient(118deg,#071d41 0%,#0a4485 55%,#087fd2 100%);box-shadow:0 18px 42px rgba(7,45,91,.2)}.hero:after{content:"";position:absolute;left:-55px;top:-95px;width:290px;height:290px;border:55px solid rgba(255,255,255,.07);border-radius:50%}.hero div{position:relative;z-index:1}.hero small{color:#90cff5}.hero h2{font-size:25px;margin:8px 0}.hero p{margin:0;color:#d9eafb}.hero>strong{position:relative;z-index:1;min-width:76px;height:76px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.25);border-radius:18px;background:rgba(255,255,255,.12);font-size:34px;backdrop-filter:blur(7px)}
.dashboard-stats{gap:15px;margin-bottom:20px}.dashboard-stats article{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:14px;padding:19px 20px;background:rgba(255,255,255,.92);box-shadow:0 7px 22px rgba(19,47,81,.055)}.dashboard-stats article:before{content:"";position:absolute;right:0;top:0;bottom:0;width:4px;background:var(--blue)}.dashboard-stats article:nth-child(2):before{background:#13a079}.dashboard-stats article:nth-child(3):before{background:#e29a27}.dashboard-stats article:nth-child(4):before{background:#775fd3}.dashboard-stats small{font-size:12px}.dashboard-stats strong{font-size:30px;color:#0c2a53}
.card,.form-card,.detail{background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:17px;box-shadow:var(--shadow)}.card{padding:0}.card-head{padding:21px 24px 16px}.card-head h2{font-size:20px;margin:0 0 6px}.card-head p{margin:0;color:var(--muted);font-size:13px}.table-wrap{padding:0 20px 20px}table{border-collapse:separate;border-spacing:0}th{padding:15px 13px;background:#f7f9fc;color:#64758d;border-top:1px solid #e8edf3;border-bottom:1px solid #e1e7ef;font-weight:600}th:first-child{border-radius:0 9px 9px 0}th:last-child{border-radius:9px 0 0 9px}td{padding:17px 13px;color:#2a3e59}tbody tr{transition:.18s ease}tbody tr:hover{background:#f5f9fd}.status{border:1px solid #c9dcf4;background:#eef6ff;color:#075ba9;border-radius:999px;padding:6px 11px;font-weight:600;font-size:12px}.empty{padding:54px;color:#7a899c}
.simple{background:linear-gradient(180deg,#071c3b 0 190px,#f3f6fa 190px)}.simple main{max-width:1120px;padding:26px 24px 60px}.simple main>a{display:inline-flex;color:#fff;padding:10px 2px;font-weight:600}.form-card,.detail{padding:28px 30px;margin-top:20px}.form-card h1,.detail h1{color:#0b2856;font-size:26px}.form-card>p,.detail-head p{color:var(--muted)}label{color:#253b58;font-size:13px;gap:8px;margin:16px 0}input,select,textarea{border:1px solid #cfd9e5;border-radius:10px;padding:13px 14px;background:#fbfcfe;color:#172b47;transition:.18s ease}input:focus,select:focus,textarea:focus{outline:0;border-color:#197bc4;box-shadow:0 0 0 4px rgba(25,123,196,.11);background:#fff}.uploads input[type=file]{min-height:52px;background:#f6f9fc;border:1px dashed #aabbd0}
.detail-head{border-bottom:1px solid var(--line);padding-bottom:17px}.info{grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;padding:0;overflow:hidden;background:#dfe6ee;border-radius:13px;border:1px solid #dfe6ee}.info div{padding:17px;background:#f8fafc}.info strong{font-size:14px}.documents a{border-color:#d8e2ed;background:linear-gradient(135deg,#fbfdff,#f3f7fb);padding:16px}.documents a:before{content:"PDF";width:36px;height:24px;display:grid;place-items:center;background:#e8f2fd;color:#0870c5;border-radius:6px;font-size:10px;font-weight:800}.action{background:#f8fbfe;border-color:#d9e4ef;padding:20px;border-radius:13px}.warning{background:#c67c0d}.danger{background:#ba3545}.notice{background:#edf6ff;color:#075aa7;border:1px solid #cfe4f8}.error{background:#fff0f1;color:#a52e3b;border:1px solid #f0cfd3}.timeline{border-right-color:#c9d8e8}.timeline article:before{right:-25px;width:13px;height:13px;border:3px solid #e5f1fc;background:#0874c9}.timeline article{background:#fafcfe;border:1px solid #e5ebf2;border-radius:10px;padding:13px 16px;margin-bottom:12px}.timeline span{display:inline-block;background:#edf6ff;border-radius:999px;padding:4px 9px;font-size:12px}
.login-page{position:relative;overflow:hidden;background:linear-gradient(125deg,#04142d 0%,#082c5e 50%,#0a6cb5 100%)}.login-page:before,.login-page:after{content:"";position:fixed;border-radius:50%;border:90px solid rgba(255,255,255,.045)}.login-page:before{width:430px;height:430px;left:-170px;top:-210px}.login-page:after{width:600px;height:600px;right:-300px;bottom:-350px}.login-card{position:relative;z-index:1;width:min(450px,92vw);padding:39px 42px 42px;border:1px solid rgba(255,255,255,.68);border-radius:22px;box-shadow:0 35px 80px rgba(0,0,0,.34)}.login-card .logo{width:270px;height:92px;border-radius:12px;background:#fff url('arkan-logo.jpeg') center/250px auto no-repeat;font-size:0}.login-card h1{margin:24px 0 7px;color:#092852;font-size:26px}.login-card p{margin:0 0 24px}.login-card .primary{height:49px}
@media(max-width:1000px){.info{grid-template-columns:repeat(2,1fr)}.dashboard-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){aside{position:relative;width:100%;padding:16px}.brand{display:flex;justify-content:flex-start;padding:0 0 13px}.brand>b{width:145px;height:50px;background-size:132px}.brand span{text-align:right}.profile{display:grid;margin-top:13px}main{margin:0;padding:18px}.simple main{padding:18px 14px 45px}.hero{padding:22px}.hero h2{font-size:20px}.dashboard-stats{grid-template-columns:1fr 1fr;gap:9px}.dashboard-stats article{padding:15px}.form-card,.detail{padding:20px 16px}.info{grid-template-columns:1fr}.login-card{padding:30px 24px}.login-card .logo{width:225px;height:78px;background-size:208px}.documents{grid-template-columns:1fr}}