*{box-sizing:border-box}body{margin:0;background:#f4f7fb;color:#20242d;font-family:Arial,sans-serif}header{background:#252b7a;color:#fff;display:flex;justify-content:space-between;align-items:center;padding:10px 4%;min-height:72px;gap:20px}.brand{display:flex;align-items:center;gap:10px}.brand img{width:175px;height:52px;object-fit:contain;background:#fff;border-radius:5px}.brand small{display:block;font-size:10px;opacity:.8}nav{display:flex;gap:12px;flex-wrap:wrap}nav a{color:#fff;text-decoration:none;font-size:12px}main{max-width:1380px;margin:28px auto;padding:0 16px}.grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.card,.box{background:#fff;border-radius:14px;padding:18px;box-shadow:0 7px 24px #1b27570d;margin-bottom:16px}.card h4{font-size:11px;color:#707784;margin:0 0 7px}.num{font-size:25px;font-weight:800;color:#252b7a}.orange{border-top:4px solid #e66a2c}.green{border-top:4px solid #62a744}.yellow{border-top:4px solid #e7b300}.red{border-top:4px solid #c63b3b}.blue{border-top:4px solid #4673c7}h1,h2{color:#252b7a}.table{overflow:auto}table{width:100%;border-collapse:collapse;min-width:850px}th{background:#252b7a;color:#fff;padding:10px;font-size:12px;text-align:left}td{padding:10px;border-bottom:1px solid #edf0f5;font-size:13px}.badge{display:inline-block;padding:5px 9px;border-radius:18px;font-size:11px;font-weight:700}.active,.paid{background:#dff0d8;color:#27632a}.warning,.due{background:#fff2cc;color:#806000}.critical{background:#fce4d6;color:#a52a00}.expired,.overdue,.cancelled{background:#f4cccc;color:#800}.suspended{background:#e4dfec;color:#513b64}.partial{background:#d9eaf7;color:#15537a}.btn{display:inline-block;border:0;border-radius:8px;padding:9px 13px;background:#252b7a;color:#fff;text-decoration:none;cursor:pointer}.btn.orange{background:#e66a2c;color:#fff}.btn.green{background:#62a744;color:#fff}.btn.red{background:#c63b3b;color:#fff}.form{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.field label{display:block;font-size:12px;font-weight:bold;margin-bottom:5px}.field input,.field select,.field textarea{width:100%;padding:10px;border:1px solid #ccd4e3;border-radius:8px;background:#fff}.field textarea{min-height:85px}.full{grid-column:1/-1}.search{display:flex;gap:8px;margin-bottom:15px}.search input,.search select{padding:10px;border:1px solid #ccd4e3;border-radius:8px}.search input{flex:1}.profit{color:#27632a}.loss{color:#a00000}.login{max-width:430px;margin:70px auto}.login img{width:230px;display:block;margin:auto}.wa{background:#1aa85b}.invoice{max-width:850px;margin:auto}.invoice-head{display:flex;justify-content:space-between;gap:20px}.invoice-total{font-size:24px;font-weight:800;color:#252b7a}.right{text-align:right}footer{text-align:center;padding:30px;color:#777;font-size:12px}@media(max-width:1000px){.grid,.grid4{grid-template-columns:repeat(2,1fr)}.form{grid-template-columns:1fr}}@media(max-width:550px){.grid,.grid4{grid-template-columns:1fr}nav{display:none}.brand img{width:145px}}
