/* Microsoft-like modern theme */
:root{
  --bg:#f3f6fb;
  --panel:#ffffff;
  --muted:#6b7280;
  --accent:#0078d4; /* Microsoft blue */
  --accent-2:#0063b1;
  --card-shadow: 0 6px 18px rgba(2,6,23,0.08);
  --radius:10px;
  --gap:14px;
}
*{box-sizing:border-box;font-family: "Segoe UI", Roboto, Arial, sans-serif}
body{margin:0;background:var(--bg);color:#0b1720;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.ms-app{max-width:1200px;margin:20px auto;padding:18px}
.ms-topbar{display:flex;justify-content:space-between;align-items:center;background:transparent;padding:8px 0}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:36px;height:36px;background:linear-gradient(135deg,var(--accent),var(--accent-2));border-radius:8px;display:inline-block}
.brand h1{margin:0;font-size:18px;color:#05202b}
.top-actions{display:flex;gap:8px;align-items:center}
.ms-btn{background:transparent;border:1px solid rgba(11,23,32,0.06);padding:8px 12px;border-radius:8px;cursor:pointer}
.ms-btn-primary{background:var(--accent);color:#fff;border:0;box-shadow:0 4px 12px rgba(2,120,212,0.15)}
.ms-icon{background:transparent;border:0;font-size:16px;cursor:pointer}
.ms-main{display:flex;gap:var(--gap);margin-top:12px}
.ms-sidebar{width:220px}
.ms-sidebar nav{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.ms-sidebar a{padding:10px;border-radius:8px;text-decoration:none;color:var(--muted);cursor:pointer}
.ms-sidebar a.active{background:linear-gradient(90deg,#eef7ff,transparent);color:var(--accent);font-weight:600}
.ms-card{background:var(--panel);border-radius:var(--radius);box-shadow:var(--card-shadow);padding:14px;margin-bottom:12px}
.small{padding:10px}
.card-title{font-size:13px;color:var(--muted)}
.card-body{margin-top:6px}
.totals-small{display:flex;justify-content:space-between;gap:6px}
.totals-small .label{font-size:12px;color:var(--muted)}
.ms-content{flex:1}
.form-card{max-width:720px;margin-bottom:12px}
.hidden{display:none}
.form-head{display:flex;justify-content:space-between;align-items:center}
.ms-label{display:block;margin-top:10px;font-size:14px;color:#0b1720}
.ms-label input,.ms-label textarea{width:100%;padding:10px;border-radius:8px;border:1px solid rgba(11,23,32,0.06);margin-top:6px;background:#fbfdff}
.form-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:12px}
.card-head{display:flex;justify-content:space-between;align-items:center}
.muted{color:var(--muted);font-size:13px}
.table-wrap{overflow:auto;margin-top:10px}
.entries-table{width:100%;border-collapse:collapse}
.entries-table thead th{background:#f8fafc;padding:10px;text-align:left;font-size:13px;color:var(--muted);position:sticky;top:0}
.entries-table tbody tr{background:#fff;border-radius:6px;margin-bottom:8px;box-shadow:0 2px 6px rgba(2,6,23,0.03)}
.entries-table td{padding:10px;vertical-align:top;border-bottom:1px solid #f1f5f9}
.drag-handle{cursor:grab;padding-right:8px;color:var(--muted)}
.actions button{margin-right:6px;padding:6px 8px;border-radius:6px;border:0;background:transparent;color:var(--accent);cursor:pointer}
.totals-line{display:flex;justify-content:space-between;margin-top:12px;color:var(--muted);font-size:15px}
.ms-footer{text-align:center;color:var(--muted);margin-top:14px;font-size:13px}

/* Responsive */
@media (max-width:800px){
  .ms-main{flex-direction:column}
  .ms-sidebar{width:100%;order:2}
  .ms-content{order:1}
  .entries-table thead{display:none}
  .entries-table tbody tr{display:block;padding:10px}
  .entries-table td{display:flex;justify-content:space-between;border-bottom:0}
  .entries-table td:before{content:attr(data-label);font-weight:600;color:var(--muted);width:110px}
}