@import "https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap";:root{--navy:#0c2634;--blue:#1697dd;--ink:#163040;--muted:#77858e;--line:#e8edef;--bg:#f5f7f9}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);margin:0;font-family:Poppins,Arial,sans-serif;font-size:16px}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button,a.primary,a.outline{cursor:pointer}a{color:inherit;text-decoration:none}button{border:0}button:disabled{opacity:.5;cursor:wait}:is(button:focus-visible,a:focus-visible){outline-offset:3px;outline:3px solid #5bb8e9}h1,h2,h3,h4,p{margin-top:0}h1{letter-spacing:-1.1px}small{font-size:14px}input,select,textarea{width:100%;color:var(--ink);background:#fff;border:1px solid #dce4e8;border-radius:9px;outline:none;padding:13px 14px}input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px #20729e12}label{margin-bottom:17px;font-size:15px;font-weight:500;display:block}label input,label select,label textarea{margin-top:7px}textarea{resize:vertical;min-height:88px}.primary,.outline{white-space:nowrap;border-radius:9px;justify-content:center;align-items:center;gap:12px;padding:13px 19px;font-weight:500;display:inline-flex}.primary{background:var(--blue);color:#fff}.primary:hover{background:#185e85}.outline{color:var(--ink);background:#fff;border:1px solid #dbe4e9}.full{width:100%}.eyebrow{letter-spacing:1.7px;color:var(--blue);font-size:14px;font-weight:600}.login{background:#fff;grid-template-columns:46% 54%;min-height:100vh;display:grid}.login-brand{background:var(--navy);color:#fff;flex-direction:column;padding:54px 64px;display:flex;position:relative;overflow:hidden}.brand-white{object-fit:contain;width:175px;height:auto;margin-bottom:85px}.login-brand .eyebrow{color:#8dc1dd}.login-brand h1{margin:20px 0;font-size:45px;font-weight:500;line-height:1.25}.login-brand p{color:#aac0cd;max-width:370px;font-size:14px;line-height:1.9}.login-brand>small{color:#adc0cb;margin-top:auto}.login-art{color:#9bc9e1;place-items:center;height:270px;display:grid;position:relative}.orbit{border:1px solid #ffffff15;border-radius:50%;width:210px;height:210px;position:absolute}.o2{width:300px;height:300px}.o3{width:390px;height:390px}.login-form{flex-direction:column;padding:35px 50px;display:flex}.back{color:var(--muted);font-size:14px}.login-box{width:100%;max-width:400px;margin:auto;padding:45px 0}.icon-tile{width:48px;height:48px;color:var(--blue);background:#eaf3f8;border-radius:13px;place-items:center;margin-bottom:23px;display:grid}.login-box h2{letter-spacing:-.7px;margin-bottom:9px;font-size:28px}.login-box>p{color:var(--muted);margin-bottom:27px;line-height:1.8}.secure{color:var(--muted);align-items:center;gap:8px;margin-top:18px;font-size:14px;display:flex}.demo-box{border-top:1px solid var(--line);margin-top:30px;padding-top:24px}.demo-box>span{letter-spacing:1.2px;color:var(--muted);font-size:13px}.demo-box p{color:var(--muted);margin:9px 0 13px;font-size:14px}.demo-box>div{gap:9px;display:flex}.demo-box button{background:#fff;border:1px solid #dbe4e9;border-radius:7px;flex:1;justify-content:center;align-items:center;gap:7px;padding:11px;font-size:14px;display:flex}.team-login{color:var(--muted);justify-content:center;align-items:center;margin-top:22px;font-size:14px;display:flex}.login-foot{text-align:center;color:var(--muted);font-size:14px}.app{min-height:100vh;display:flex}.sidebar{background:var(--navy);color:#b9c9d2;z-index:10;flex-direction:column;width:280px;min-width:280px;padding:35px 22px;display:flex;position:fixed;inset:0 auto 0 0}.side-logo{width:145px;margin:0 0 39px 10px}.side-caption{letter-spacing:1.2px;color:#7796a7;margin:0 10px 18px;font-size:12px}nav button{color:#aac0cd;text-align:left;background:0 0;border-radius:8px;align-items:center;gap:12px;width:100%;margin-bottom:6px;padding:13px 12px;font-size:14px;display:flex}nav button.active{color:#fff;background:#1697dd}nav button>span{background:#ffffff20;border-radius:5px;margin-left:auto;padding:2px 7px;font-size:13px}.side-callout{background:#ffffff04;border:1px solid #ffffff12;border-radius:12px;margin-top:auto;padding:24px 14px}.side-callout>svg{color:#8bb8cf}.side-callout h4{color:#e7f1f6;margin:15px 0 9px;font-size:15px;font-weight:500}.side-callout p{color:#819eaf;font-size:14px;line-height:1.8}.side-callout a{color:#b3d6e9;align-items:center;gap:10px;margin-top:20px;font-size:14px;display:flex}.side-bottom{border-top:1px solid #ffffff12;align-items:center;gap:9px;margin-top:25px;padding-top:24px;display:flex}.avatar{background:#294653;border-radius:50%;place-items:center;width:31px;height:31px;font-size:15px;display:grid}.side-bottom b{color:#fff;max-width:137px;font-size:14px;font-weight:500;display:block;overflow:hidden}.side-bottom small{color:#7895a5;font-size:12px}.side-bottom button{color:#8cabbc;background:0 0;margin-left:auto;padding:0}main{flex:1;min-width:0;margin-left:280px}header{border-bottom:1px solid var(--line);height:75px;color:var(--muted);background:#fff;justify-content:space-between;align-items:center;padding:0 42px;font-size:14px;display:flex}header>span{align-items:center;gap:12px;display:flex}header b{color:#354e5b;font-weight:500}header>div{align-items:center;gap:8px;display:flex}.header-dot{background:#20729e;border-radius:50%;width:6px;height:6px}.content{max-width:1400px;margin:auto;padding:37px 42px}.heading{justify-content:space-between;align-items:center;gap:25px;margin-bottom:29px;display:flex}.heading h1{margin:11px 0 8px;font-size:28px;font-weight:500}.heading p{color:var(--muted);margin-bottom:0;font-size:14px}.heading .primary,.heading .outline{font-size:14px}.stats{grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:24px;display:grid}.stats article{border:1px solid var(--line);background:#fff;border-radius:13px;padding:22px 23px}.stats article>div{color:#667c89;justify-content:space-between;align-items:center;font-size:14px;display:flex}.stats svg{color:var(--blue)}.stats strong{letter-spacing:-.8px;margin:14px 0 10px;font-size:29px;font-weight:500;display:block}.stats small{color:var(--muted);align-items:center;gap:5px;font-size:13px;display:flex}.stats article.highlight{background:var(--navy);border-color:var(--navy);color:#fff}.highlight>div span,.highlight svg{color:#aed2e5!important}.highlight small{color:#9bb6c4}.journey{background:#eef5f9;border:1px solid #dbe8f0;border-radius:12px;align-items:center;gap:17px;margin-bottom:29px;padding:21px 24px;display:flex}.journey-icon{width:50px;height:50px;color:var(--blue);background:#fff;border-radius:12px;place-items:center;display:grid}.journey h3{margin:0 0 5px;font-size:15px;font-weight:500}.journey p{color:#78909f;margin:0;font-size:14px}.steps{color:#6e8796;align-items:center;gap:13px;margin-left:auto;font-size:13px;display:flex}.steps span{white-space:nowrap;align-items:center;gap:6px;display:flex}.steps i{color:#20729e;border:1px solid #c7dee9;border-radius:50%;place-items:center;width:21px;height:21px;font-style:normal;display:grid}.table-card{border:1px solid var(--line);background:#fff;border-radius:13px;overflow:hidden}.table-heading{justify-content:space-between;align-items:center;gap:15px;padding:24px 25px 18px;display:flex}.table-heading h2{margin:0 0 6px;font-size:15px;font-weight:500}.table-heading p{color:var(--muted);margin:0;font-size:14px}.search{flex-shrink:0;width:225px;margin:0;position:relative}.search input{background:#fafbfc;margin:0;padding:10px 10px 10px 35px;font-size:14px}.search>svg{color:#91a0aa;position:absolute;top:11px;left:12px}.filters{white-space:nowrap;gap:6px;padding:0 25px 17px;display:flex;overflow:auto}.filters button{color:var(--muted);background:#fff;border-radius:6px;align-items:center;gap:7px;padding:8px 10px;font-size:13px;display:flex}.filters button.selected{color:var(--blue);background:#eaf3f8;font-weight:500}.filters span{background:#f0f3f5;border-radius:4px;padding:1px 5px;font-size:12px}.filters .selected span{background:#d8eaf4}.table-wrap{overflow:auto}table{border-collapse:collapse;text-align:left;white-space:nowrap;width:100%}th{border-block:1px solid var(--line);color:#84919b;background:#fafbfc;padding:13px 15px;font-size:13px;font-weight:400}th:first-child,td:first-child{padding-left:25px}td{color:#81909a;border-bottom:1px solid #f0f3f5;padding:18px 15px;font-size:14px}tr:last-child td{border-bottom:0}tbody tr{cursor:pointer}tbody tr:hover{background:#fafcfd}td b{color:#304958;font-size:14px;font-weight:500}td small{margin-top:4px;font-size:13px;display:block}.person{align-items:center;gap:10px;display:flex}.mini-avatar{color:#5c86a0;background:#ecf3f8;border-radius:50%;place-items:center;width:35px;height:35px;font-size:14px;display:grid}.a1{color:#9275ad;background:#f3eef8}.a2{color:#6e9b82;background:#edf4f0}.badge{color:#a58335;background:#f8f1e1;border-radius:5px;align-items:center;gap:6px;padding:5px 9px;font-size:13px;display:inline-flex}.badge i{background:currentColor;border-radius:50%;width:4px;height:4px}.badge.approved{color:#2676a2;background:#edf5fa}.badge.paid{color:#388469;background:#edf7f1}.badge.rejected{color:#ad6666;background:#faf0f0}.paid-value{color:#388469!important}.row-action{color:#9babba;background:0 0;padding:5px}.table-footer{border-top:1px solid var(--line);color:#94a1aa;justify-content:space-between;padding:16px 25px;font-size:13px;display:flex}.table-footer>span{align-items:center;gap:5px;display:flex}footer{color:#98a4ac;justify-content:space-between;align-items:center;margin-top:27px;font-size:13px;display:flex}footer a{align-items:center;gap:5px;display:flex}.demo-banner{color:#547589;background:#e5eff6;align-items:center;gap:9px;padding:11px 42px;font-size:13px;display:flex}.demo-banner button{color:#20729e;background:0 0;align-items:center;gap:7px;margin-left:auto;font-size:13px;font-weight:500;display:flex}.modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:30;background:#071c2b80;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal{background:#fff;border-radius:16px;width:510px;max-height:92vh;padding:30px;overflow:auto;box-shadow:0 25px 100px #0003}.modal-top{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.modal-top button{color:#7b8f9b;background:0 0}.modal h2{margin-bottom:7px;font-size:24px;font-weight:500}.modal>p{color:var(--muted);font-size:14px;line-height:1.8}.modal .badge{margin:6px 0 20px}.detail-info{overflow-wrap:anywhere;background:#f5f8fa;border-radius:9px;flex-direction:column;gap:7px;margin-bottom:20px;padding:15px;font-size:14px;display:flex}.detail-info span{color:var(--muted)}.form-grid{grid-template-columns:1fr 1fr;gap:15px;display:grid}.muted{color:var(--muted);font-size:14px;line-height:1.8}.reward-detail{background:#eef5f9;border-radius:10px;flex-direction:column;gap:10px;margin:0 0 25px;padding:21px;display:flex}.reward-detail strong{font-size:27px;font-weight:500}.reward-detail small,.reward-detail span{color:var(--muted);font-size:14px}.error{color:#a94646;background:#fdf0f0;border-radius:8px;padding:13px;font-size:14px}.notice{color:#327857;background:#eaf7ef;border-radius:8px;justify-content:space-between;align-items:center;padding:13px;font-size:14px;display:flex}.text-btn{color:var(--blue);background:0 0;padding:8px;font-size:14px}.empty{text-align:center;color:#8da0ac;padding:45px}.empty svg{color:#b9cbd5}.empty h3{margin:16px 0 8px;font-size:14px;font-weight:500}.empty p{font-size:14px}.mobile-menu{display:none}@media (min-width:1500px){.login-brand{padding:70px 100px}.login-brand h1{font-size:54px}.content{padding-top:50px}}@media (max-width:1150px){.steps{display:none}.sidebar{width:260px;min-width:260px;padding-inline:17px}main{margin-left:260px}.content{padding:30px 25px}header{padding:0 25px}.heading h1{font-size:24px}.stats strong{font-size:25px}.login-brand{padding:45px}.login-brand h1{font-size:36px}}@media (max-width:800px){.sidebar{display:none}.sidebar.open{display:flex;box-shadow:20px 0 70px #001b3c55}main{margin-left:0}header{height:62px;padding:0 20px}.mobile-menu{color:var(--navy);background:0 0;margin-right:10px;padding:0;display:block}header>div{display:none}header>span{margin-right:auto}.content{padding:26px 20px}.heading{align-items:flex-start}.heading h1{font-size:23px}.heading .primary,.heading .outline{padding:10px;font-size:14px}.stats{gap:10px}.stats article{padding:16px}.stats strong{font-size:23px}.stats article>div>svg{display:none}.stats small{font-size:12px}.demo-banner{padding:10px 20px}.demo-banner>span{max-width:65%}.table-heading{flex-direction:column;align-items:flex-start}.search{width:100%}.login{grid-template-columns:1fr}.login-brand{display:none}.login-form{min-height:100vh;padding:25px}.login-box{padding:50px 0}.journey{padding:17px}.journey-icon{flex-shrink:0}footer{gap:15px;line-height:1.8}.table-footer>span:last-child{display:none}}@media (max-width:480px){.stats{grid-template-columns:1fr 1fr}.stats article.highlight{grid-column:1/-1}.stats strong{font-size:24px}.highlight strong{margin-right:15px;display:inline-block}.heading{flex-wrap:wrap;gap:16px}.heading h1{font-size:25px}.journey p{line-height:1.7}.journey h3{font-size:14px}.modal{padding:22px}.modal-backdrop{padding:12px}.table-heading,.filters,.table-footer{padding-inline:18px}.form-grid{grid-template-columns:1fr;gap:0}}.indicator-top{justify-content:space-between;align-items:center;gap:20px;margin:7px 0 24px;display:flex}.indicator-top h2{margin-bottom:7px;font-size:18px;font-weight:500}.indicator-top p{color:var(--muted);margin:0;font-size:14px}.indicator-top .primary{font-size:14px}.indicator-actions{flex-wrap:wrap;gap:7px;max-width:215px;display:flex}.indicator-actions button{color:#20729e;background:#eff5f9;border-radius:5px;align-items:center;gap:5px;padding:7px 8px;font-size:13px;display:flex}.preserve-note{color:#50788e;background:#eef6fa;border-radius:9px;align-items:flex-start;gap:10px;margin:18px 0;padding:14px;font-size:14px;line-height:1.8;display:flex}.preserve-note svg{flex-shrink:0;margin-top:2px}.check-label{align-items:flex-start;gap:9px;font-size:14px;line-height:1.7;display:flex}.check-label input{flex-shrink:0;width:16px;margin:2px 0 0}.new-indicator{border:1px solid var(--line);border-radius:9px;margin:20px 0;padding:16px}.new-indicator h4{margin-bottom:14px;font-size:15px;font-weight:500}.new-indicator label:last-child{margin-bottom:0}.history-filter{color:#52768a;background:#edf5f9;border:1px solid #d7e6ee;border-radius:9px;justify-content:space-between;align-items:center;gap:15px;margin-bottom:16px;padding:13px 17px;font-size:14px;display:flex}.history-filter button{color:#20729e;background:0 0;align-items:center;gap:7px;font-size:14px;display:flex}@media (max-width:600px){.indicator-top{flex-direction:column;align-items:flex-start}.indicator-top .primary{width:100%}}.password-field{position:relative}.password-field input{padding-right:45px}.password-field button{color:#8296a3;background:0 0;position:absolute;top:20px;right:12px}.password-card{max-width:550px;padding:28px}.password-card h2{font-size:19px;font-weight:500}.demo-banner>a{align-items:center;gap:5px;margin-left:auto;display:flex}.metrics-toolbar{align-items:center;gap:20px;margin-bottom:25px;display:flex}.metrics-toolbar>div{margin-right:auto}.metrics-toolbar h2{text-transform:capitalize;margin-bottom:6px;font-size:18px;font-weight:500}.metrics-toolbar p{color:var(--muted);margin:0;font-size:14px}.metrics-toolbar label{min-width:165px;margin:0;font-size:13px}.metrics-toolbar input{padding:9px 12px}.metrics-toolbar .outline{font-size:14px}.metric-grid{grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:18px;display:grid}.metric-grid article{border:1px solid var(--line);background:#fff;border-radius:12px;flex-direction:column;padding:21px;display:flex}.metric-grid svg{color:var(--blue);margin-bottom:15px}.metric-grid span{color:#607989;font-size:14px}.metric-grid strong{margin:8px 0;font-size:31px;font-weight:500}.metric-grid small{color:var(--muted);font-size:13px}.monthly-finance{grid-template-columns:1fr 1fr;gap:18px;margin-bottom:16px;display:grid}.monthly-finance article{background:var(--navy);color:#fff;border-radius:12px;align-items:center;gap:18px;padding:24px;display:flex}.monthly-finance article:last-child{color:var(--ink);background:#eaf3f9;border:1px solid #d4e5f0}.monthly-finance article div{flex-direction:column;gap:6px;display:flex}.monthly-finance strong{font-size:27px;font-weight:500}.monthly-finance small{font-size:14px}.monthly-finance span{opacity:.65;font-size:13px}.metrics-note{color:#728693;margin:20px 0;font-size:14px;line-height:1.8}.trend{margin-bottom:22px}.legend{color:var(--muted);gap:12px;font-size:12px;display:flex}.legend span{align-items:center;gap:5px;display:flex}.legend i{border-radius:2px;width:7px;height:7px}.legend-approved,.bar-approved{background:#1697dd}.legend-pending,.bar-pending{background:#bcd8e8}.legend-rejected,.bar-rejected{background:#daa2a2}.bar-chart{gap:12px;padding:20px 25px 25px;display:flex;overflow-x:auto}.bar-month{min-width:43px;color:var(--muted);background:0 0;flex-direction:column;flex:1;align-items:center;padding:0;display:flex}.bar-total{margin-bottom:8px;font-size:14px}.bar-track{background:#fafbfd;border-bottom:1px solid #dfe9ef;align-items:flex-end;width:100%;max-width:40px;height:150px;display:flex}.bar-stack{border-radius:4px 4px 0 0;flex-direction:column;width:100%;min-height:1px;display:flex;overflow:hidden}.bar-stack>span{display:block}.bar-month small{white-space:nowrap;margin-top:13px;font-size:12px}.bar-month.active .bar-total{color:var(--blue);font-weight:600}.monthly-table th{white-space:nowrap}@media (max-width:900px){.metric-grid{grid-template-columns:1fr 1fr}.metrics-toolbar{flex-wrap:wrap}.metrics-toolbar>div{width:100%}.monthly-finance{grid-template-columns:1fr}.legend{flex-wrap:wrap}.bar-chart{gap:15px}.bar-month{min-width:48px}}body{line-height:1.55}input,select,textarea{font-size:16px;line-height:1.5}.sidebar{overflow-y:auto}.sidebar nav,.side-logo,.side-callout,.side-bottom{flex-shrink:0}.side-bottom>div:not(.avatar){min-width:0}.side-bottom b{text-overflow:ellipsis;white-space:nowrap;max-width:170px}.side-bottom small{line-height:1.5}nav button{min-height:48px}nav button>svg,.primary>svg,.outline>svg,.stats svg,.journey-icon,.secure>svg{flex-shrink:0}.primary,.outline{white-space:normal;text-align:center;min-height:46px}.login-box{max-width:440px}.demo-box>div{flex-wrap:wrap}.demo-box>div>*{white-space:normal;flex:170px}.secure{align-items:flex-start;line-height:1.6}.search{width:270px}.search input{padding:12px 12px 12px 39px;font-size:16px}.search>svg{top:50%;transform:translateY(-50%)}.table-heading{flex-wrap:wrap}.table-heading h2{font-size:18px}.table-heading p{line-height:1.65}th{font-weight:500}td{line-height:1.6}td small{line-height:1.5}.badge{padding:7px 10px;line-height:1.5}.filters button{min-height:42px}.filters span{padding:2px 6px}.stats article>div{align-items:flex-start;gap:12px}.stats small{align-items:flex-start;line-height:1.6}.steps{gap:9px}.steps i{flex-shrink:0;width:25px;height:25px}.indicator-actions{max-width:270px}.indicator-actions button{min-height:38px;padding:9px 10px}.modal{width:560px}.modal>p,.detail-info,.muted,.preserve-note{line-height:1.7}.check-label input{width:18px;height:18px;margin-top:3px}.table-footer,footer,.demo-banner{flex-wrap:wrap;row-gap:10px}.demo-banner>a{flex-shrink:0}.metrics-toolbar{flex-wrap:wrap}.metrics-toolbar label{min-width:190px}.metrics-toolbar input{font-size:16px}.metric-grid article{padding:20px}.metric-grid small{line-height:1.6}.monthly-finance span{line-height:1.65}.legend{flex-wrap:wrap;gap:12px}.bar-month{min-width:76px}.bar-month small{font-size:12px}.bar-total{font-weight:500}.history-filter{flex-wrap:wrap}.password-field button{padding:7px;top:50%;transform:translateY(-50%)}@media (max-width:1150px){.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.heading,.journey{flex-wrap:wrap}}@media (max-width:800px){.sidebar{width:280px;min-width:0;max-width:85vw}.search{width:100%}.demo-banner>span{flex:240px;max-width:none}.demo-banner>a{margin-left:0}.table-heading{align-items:stretch}.heading .primary,.heading .outline{font-size:14px}.stats small{font-size:13px}}@media (max-width:480px){.stats{grid-template-columns:1fr}.stats article.highlight{grid-column:auto}.stats article{padding:20px}.metric-grid{gap:10px}.metric-grid article{padding:16px}.metrics-toolbar label,.metrics-toolbar .outline{width:100%}.journey h3{font-size:15px}.login-form{padding:24px 20px}.demo-box>div>*{flex-basis:100%}.modal{width:100%}}
