
:root{
  --blue:#009fbb; /* Swiss premium blue per user */
  --green:#97c120;
  --black:#0e1116;
  --white:#ffffff;
  --gray:#f2f5f8;
  --muted:#8aa0b2;
  --radius:14px;
  --shadow:0 10px 25px rgba(0,0,0,.06);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:#f7fbff;color:#0a1a2a}
a{color:var(--blue);text-decoration:none}
img{max-width:100%}
h1,h2,h3{margin:.2rem 0 .8rem}
h1{font-size:1.8rem}h2{font-size:1.4rem}h3{font-size:1.1rem}
.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:12px 18px;background:#fff;border-bottom:1px solid #e6eef5;box-shadow:var(--shadow)}
.topbar .brand{display:flex;gap:10px;align-items:center;font-weight:800;color:#064b60}
.topbar img{height:34px}
.topbar .btn.small{margin-left:10px}
.sidenav{position:fixed;top:64px;left:0;bottom:0;width:220px;background:#ffffff;border-right:1px solid #e6eef5;padding:12px;display:flex;flex-direction:column;gap:6px}
.sidenav a{padding:10px 12px;border-radius:10px;color:#09384a}
.sidenav a:hover{background:#f1faff}
.sidenav a.active{background:linear-gradient(135deg,var(--blue),#45c1d4);color:#fff;font-weight:700}
.content{margin-left:240px;padding:20px}
.footer{padding:18px;text-align:center;color:#6b8598}
.grid{display:grid;gap:16px}
.grid.two{grid-template-columns:1fr 1fr}
.grid.cards{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{background:#fff;border:1px solid #e6eef5;border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}
.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.stat{background:linear-gradient(135deg,#ffffff,#f2fbfe)}
.stat h3{color:#446c82;font-weight:600}
.statnum{font-size:2rem;font-weight:800;color:#053042}
.table{width:100%;border-collapse:separate;border-spacing:0}
.table th,.table td{padding:10px 12px;border-bottom:1px solid #eef2f6;text-align:left}
.table th{font-size:.9rem;color:#6b8598;font-weight:600}
.badge{padding:4px 8px;border-radius:12px;font-size:.8rem}
.badge.planned{background:#eef7ff;color:#0a5e7a}
.badge.in_progress{background:#fff7e6;color:#8a5a00}
.badge.done{background:#eafff0;color:#156d36}
.badge.billed{background:#f0f7ff;color:#214c7a}
.badge.due{background:#fff3f3;color:#9a1d1d}
.badge.paid{background:#e9fff1;color:#207a3b}
.badge.overdue{background:#fff0e8;color:#8a3b00}
.btn{display:inline-block;background:#0e1f2a;color:#fff;padding:10px 14px;border-radius:12px;border:none;cursor:pointer;box-shadow:var(--shadow)}
.btn.primary{background:linear-gradient(135deg,var(--blue),#36b5c9)}
.btn.small{padding:6px 10px;border-radius:10px;font-size:.85rem}
.btn.danger{background:linear-gradient(135deg,#b90031,#e83d5e)}
.inline{display:flex;gap:8px;align-items:center}
.form label{display:flex;flex-direction:column;gap:6px;font-size:.92rem;color:#375a6f}
.form input,.form select,.form textarea{padding:10px 12px;border:1px solid #d9e6ee;border-radius:10px;background:#fff}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid #bfe9f2;border-color:#84d1df}
.mt{margin-top:16px}
.alert{padding:10px 12px;border-radius:10px}
.alert.error{background:#ffeef0;color:#6a1220}
.flash{background:#e9f9ff;border:1px solid #bfe9f2;color:#064b60;padding:10px 12px;border-radius:10px;margin-bottom:12px}
.checklist{list-style:none;margin:0;padding:0}
.checklist li{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px dashed #edf3f8}
.check{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:2px solid #cfe8ef;border-radius:8px;color:#0a6f88}
.check.on{background:var(--green);color:#fff;border-color:var(--green)}
.photos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.photos figure{margin:0;border:1px solid #e6eef5;border-radius:12px;overflow:hidden;background:#fff}
.photos figcaption{font-size:.8rem;padding:6px 8px;color:#5a7388}
.history{list-style:none;padding:0;margin:0}
.history li{padding:8px 0;border-bottom:1px dashed #edf3f8;color:#244b61}
.login-page{display:grid;place-items:center;min-height:100vh;background:linear-gradient(180deg,#f4fbff,#e8f7ff)}
.login-card{width:min(420px,92vw);background:#fff;border-radius:18px;padding:22px;border:1px solid #d9eef6;box-shadow:var(--shadow);text-align:center}
.logo-wrap img{height:48px}
.logo-wrap h1{margin:.4rem 0 .1rem}
.logo-wrap p{color:#5a7388;margin:0 0 1rem}
.subtle{color:#5a7388;font-size:.9rem;margin-top:8px}
@media (max-width: 980px){ .grid.two,.grid.cards{grid-template-columns:1fr} .sidenav{position:static;width:auto;flex-direction:row;overflow:auto} .content{margin:0} }
