/* Curatys MVP base styles */
:root {
  --bg:#f4f6f8;
  --panel:#ffffff;
  --text:#1b2a49;
  --muted:#6b7280;
  --primary:#3a7bd5;
  --accent:#2ecc71;
  --danger:#ef4444;
  --border:#e5e7eb;
}
* { box-sizing: border-box; }
body {
  margin:0; font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:var(--bg); color:var(--text);
}
header {
  background:var(--panel); border-bottom:1px solid var(--border);
  padding:12px 16px; display:flex; align-items:center; gap:12px; position:sticky; top:0; z-index:10;
}
header .brand { font-weight:700; letter-spacing:0.3px; }
header nav a { margin-right:12px; text-decoration:none; color:var(--muted); }
header nav a.active, header nav a:hover { color:var(--primary); }
.container { max-width:1100px; margin:24px auto; padding:0 16px; }
.card {
  background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:16px; box-shadow: 0 2px 10px rgba(0,0,0,0.03);
}
.btn { display:inline-block; padding:10px 14px; border-radius:10px; text-decoration:none; border:1px solid var(--border); color:var(--text); background:#fff; }
.btn.primary { background:var(--primary); color:#fff; border-color: transparent; }
.btn.success { background:var(--accent); color:#fff; border-color: transparent; }
.btn.danger { background:var(--danger); color:#fff; border-color: transparent; }
.input, select {
  width:100%; padding:10px 12px; border-radius:10px; border:1px solid var(--border); background:#fff;
}
.grid { display:grid; gap:16px; }
.grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
table { width:100%; border-collapse: collapse; }
th, td { padding:10px; border-bottom:1px solid var(--border); text-align:left; }
th { color:var(--muted); font-weight:600; }
.search-row { display:flex; gap:8px; margin-bottom:12px; }
.badge { padding:3px 8px; background:#eef2ff; color:#3730a3; border-radius:999px; font-size:12px; }
footer { color:var(--muted); font-size:12px; text-align:center; padding:24px; }

/* === Wide containers for full-width tables === */
.container.wide { max-width: 1600px; }

/* === Minimal modal (fix: hidden by default) === */
.modal-backdrop {
  position: fixed; inset: 0; background: rgba(0,0,0,.35);
  opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .2s ease;
  z-index: 50;
}
.modal-backdrop.open { opacity: 1; visibility: visible; pointer-events: auto; }

.modal {
  position: fixed; inset: 0; display: grid; place-items: center;
  opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .2s ease;
  z-index: 51;
}
.modal.open { opacity: 1; visibility: visible; pointer-events: auto; }

.modal .panel {
  width: min(640px, 92vw); background: var(--panel);
  border: 1px solid var(--border); border-radius: 14px; padding: 16px;
  box-shadow: 0 20px 60px rgba(0,0,0,.20);
}
.modal .panel h3 { margin: 0 0 8px 0; }
.modal .panel .actions { display:flex; gap:8px; justify-content:flex-end; margin-top: 12px; }