.demo-dashboard{color:#111721;background:#f3f5f6;grid-template-columns:245px 1fr;min-height:100vh;display:grid}.demo-side{color:#fff;background:#17212e;flex-direction:column;height:100vh;padding:25px 17px;display:flex;position:sticky;top:0}.demo-brand{padding:0 7px 25px;display:block}.demo-brand img{width:150px;height:auto;display:block}.demo-label{color:#8793a2;letter-spacing:.1em;margin:0 7px 13px;font-size:11px;font-weight:900}.demo-side nav{gap:5px;display:grid}.demo-side nav button{color:#aeb8c5;text-align:left;background:0 0;border:0;border-radius:9px;align-items:center;gap:10px;width:100%;padding:12px;font-size:14px;font-weight:800;display:flex}.demo-side nav button svg{width:18px}.demo-side nav button.active{color:#fff;background:#2d3949}.side-summary{background:#202c3a;border:1px solid #344254;border-radius:10px;margin-top:auto;padding:15px}.side-summary small,.side-summary b,.side-summary span{display:block}.side-summary small{color:#9da8b6;font-size:10px;font-weight:900}.side-summary b{margin:5px 0;font-size:23px}.side-summary span{color:#aab5c1;font-size:12px}.back-site{color:#c4ccd5;align-items:center;gap:8px;margin:17px 7px 0;font-size:13px;font-weight:800;display:flex}.back-site svg{width:17px}.demo-main{width:100%;min-width:0;max-width:1380px;margin:0 auto;padding:34px}.demo-header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;display:flex}.demo-header p{color:#7c8590;letter-spacing:.1em;margin:0;font-size:11px;font-weight:900}.demo-header h1{margin:4px 0 0;font-size:34px;line-height:1.1}.demo-badge{color:#795600;letter-spacing:.05em;background:#fff0c9;border-radius:999px;padding:7px 10px;font-size:10px;font-weight:900}.demo-kpis{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.demo-kpis article,.demo-panel{background:#fff;border:1px solid #dfe3e6;border-radius:12px;padding:19px;box-shadow:0 8px 20px #12182108}.demo-kpis span,.demo-kpis b,.demo-kpis small{display:block}.demo-kpis span{color:#626d79;align-items:center;gap:7px;font-size:12px;font-weight:800;display:flex}.demo-kpis span svg{width:16px}.demo-kpis b{margin:10px 0 2px;font-size:25px}.demo-kpis small{color:#818a95;font-size:11px}.demo-kpis .alert{background:snow;border-color:#efc7c3}.demo-kpis .alert b{color:#a23d34}.overview-grid{grid-template-columns:1.25fr .75fr;gap:13px;margin-top:13px;display:grid}.demo-panel-title{justify-content:space-between;align-items:center;gap:15px;margin-bottom:14px;display:flex}.demo-panel-title small{color:#818a95;letter-spacing:.1em;font-size:10px;font-weight:900}.demo-panel-title h2{margin:2px 0 0;font-size:20px}.panel-action{color:#8a6310;align-items:center;gap:10px;display:flex}.panel-action svg{width:20px}.panel-action button{color:#315d9b;background:0 0;border:0;font-size:12px;font-weight:800}.demo-job-row{border-bottom:1px solid #edf0f2;grid-template-columns:1fr auto;gap:7px 12px;padding:12px 0;display:grid}.demo-job-row:last-child{border:0}.demo-job-row div b,.demo-job-row div small{display:block}.demo-job-row div b{font-size:13px}.demo-job-row div small{color:#7c8590;font-size:11px}.demo-job-row>span{font-size:12px;font-weight:900}.demo-job-row i{background:#e4e8eb;border-radius:999px;height:7px;overflow:hidden}.demo-job-row i em{border-radius:inherit;background:#f5b73b;height:100%;display:block}.demo-job-row>strong{color:#61707c;text-align:right;font-size:11px}.cash-row,.cash-total{border-bottom:1px solid #edf0f2;justify-content:space-between;align-items:center;gap:10px;padding:14px 0;font-size:13px;display:flex}.cash-row b{font-size:14px}.cash-row.incoming b{color:#19714a}.cash-total{border:0;align-items:flex-start;padding-top:19px}.cash-total span{color:#59636e;max-width:145px;font-weight:800}.cash-total strong{font-size:24px}.payment-preview{margin-top:13px}.demo-payment-table{border:1px solid #e1e5e8;border-radius:9px;overflow:hidden}.demo-payment-table>div{border-bottom:1px solid #edf0f2;grid-template-columns:95px minmax(170px,1fr) 100px 90px 105px;align-items:center;gap:12px;padding:12px 14px;font-size:12px;display:grid}.demo-payment-table>div:last-child{border:0}.demo-payment-table .table-head{color:#737d88;letter-spacing:.06em;background:#eef1f3;font-size:10px;font-weight:900}.demo-payment-table div>span small{color:#7e8792;font-size:10px;display:block}.demo-payment-table div>strong{text-align:right}.demo-payment-table em{border-radius:999px;width:max-content;padding:4px 8px;font-size:10px;font-style:normal;font-weight:900}.demo-payment-table em.pending{color:#795600;background:#fff0c9}.demo-payment-table em.overdue{color:#98352c;background:#fbe1df}.demo-payment-table em.paid{color:#1a7348;background:#dcf6e8}.job-board{grid-template-columns:1fr 1fr;gap:14px;display:grid}.job-board>article{background:#fff;border:1px solid #dfe3e6;border-radius:12px;padding:21px}.job-card-head{grid-template-columns:auto 1fr auto;align-items:start;gap:13px;display:grid}.job-card-head>span{color:#7d5700;background:#fff0c9;border-radius:10px;place-items:center;width:42px;height:42px;display:grid}.job-card-head>span.done-dot{color:#1a7348;background:#dcf6e8}.job-card-head svg{width:20px}.job-card-head small{color:#7a8490;letter-spacing:.07em;font-size:10px;font-weight:900}.job-card-head h2{margin:2px 0;font-size:19px}.job-card-head p{color:#68727e;margin:0;font-size:12px}.job-card-head>b{font-size:15px}.large-progress{background:#e5e9ec;border-radius:999px;height:9px;margin:20px 0 10px;overflow:hidden}.large-progress span{border-radius:inherit;background:#f5b73b;height:100%;display:block}.job-card-foot{color:#66717d;justify-content:space-between;gap:12px;font-size:11px;font-weight:800;display:flex}.job-card-foot span{align-items:center;gap:5px;display:flex}.job-card-foot svg{width:14px}.full-panel{padding:22px}.payments-top{justify-content:space-between;align-items:center;gap:20px;display:flex}.filters{background:#edf0f2;border-radius:8px;padding:3px;display:flex}.filters button{color:#68727e;background:0 0;border:0;border-radius:6px;padding:7px 10px;font-size:11px;font-weight:800}.filters button.active{color:#151b24;background:#fff;box-shadow:0 2px 7px #1112}.payment-summary{grid-template-columns:repeat(3,1fr);gap:9px;margin-top:16px;display:grid}.payment-summary div{background:#f1f3f4;border-radius:9px;padding:13px}.payment-summary span,.payment-summary b{display:block}.payment-summary span{color:#747e89;font-size:11px}.payment-summary b{margin-top:3px;font-size:14px}.payment-summary .red{color:#9d382f}.payout-layout{grid-template-columns:1fr 330px;gap:14px;display:grid}.payout-list>div{border-bottom:1px solid #edf0f2;grid-template-columns:auto 1fr 90px 80px;align-items:center;gap:12px;padding:14px 0;display:grid}.payout-list>div:last-child{border:0}.person-icon{color:#315d9b;background:#e8eef9;border-radius:9px;place-items:center;width:38px;height:38px;font-size:11px;font-weight:900;display:grid}.payout-list div div b,.payout-list div div small{display:block}.payout-list div div b{font-size:13px}.payout-list div div small,.payout-list>div>span:nth-child(3){color:#727c87;font-size:11px}.payout-list>div>strong{text-align:right}.payout-totals{color:#fff;background:#17212e;border-radius:12px;padding:23px}.payout-totals>small{color:#9ea9b7;letter-spacing:.09em;font-size:10px;font-weight:900}.payout-totals h2{margin:5px 0 22px;font-size:23px}.payout-totals>div{border-bottom:1px solid #344152;justify-content:space-between;gap:10px;padding:12px 0;font-size:12px;display:flex}.payout-totals .payout-grand{border:0;align-items:end;padding-top:20px}.payout-grand strong{color:#f5b73b;font-size:24px}.payout-totals p{color:#aeb7c2;margin:20px 0 0;font-size:11px}.demo-disclaimer{color:#6c7681;border-top:1px solid #dce0e3;justify-content:space-between;align-items:center;gap:20px;width:100%;margin:24px 0 0;padding:15px 0 0;font-size:12px;display:flex}.demo-disclaimer span{align-items:center;gap:7px;display:flex}.demo-disclaimer svg{color:#1f8a59;width:16px}.demo-disclaimer a{color:#19212d;font-weight:900}@media (max-width:1000px){.demo-dashboard{grid-template-columns:1fr}.demo-side{grid-template-columns:auto 1fr auto;align-items:center;gap:15px;height:auto;padding:15px 20px;display:grid;position:static}.demo-brand{padding:0}.demo-brand img{width:130px}.demo-label,.side-summary{display:none}.demo-side nav{justify-content:center;display:flex}.demo-side nav button{width:auto;padding:10px}.back-site{margin:0}.overview-grid,.payout-layout{grid-template-columns:1fr}.demo-kpis{grid-template-columns:1fr 1fr}}@media (max-width:700px){.demo-main{padding:22px 14px}.demo-header{align-items:flex-start}.demo-header h1{font-size:28px}.demo-badge{text-align:center;max-width:92px}.demo-side{grid-template-columns:1fr auto}.demo-side nav{grid-column:1/-1;justify-content:flex-start;overflow-x:auto}.demo-side nav button{flex:none}.back-site span{display:none}.demo-kpis{gap:8px}.demo-kpis article{padding:14px}.demo-kpis b{font-size:21px}.job-board{grid-template-columns:1fr}.payments-top{flex-direction:column;align-items:flex-start}.filters{max-width:100%;overflow-x:auto}.demo-payment-table>div{grid-template-columns:72px minmax(110px,1fr) 78px}.demo-payment-table>div>:nth-child(3),.demo-payment-table>div>:nth-child(4){display:none}.payment-summary{grid-template-columns:1fr}.payout-list>div{grid-template-columns:auto 1fr auto}.payout-list>div>span:nth-child(3){display:none}.demo-disclaimer{flex-direction:column;align-items:flex-start}.job-card-head{grid-template-columns:auto 1fr}.job-card-head>b{grid-column:2}.job-card-foot{flex-direction:column;align-items:flex-start}}@media (max-width:430px){.demo-kpis{grid-template-columns:1fr}.demo-side nav button span{display:none}.demo-side nav button{padding:10px 13px}.overview-grid{gap:10px}.demo-payment-table>div{grid-template-columns:65px 1fr}.demo-payment-table>div>:last-child{display:none}}