/* ---- app-specifieke aanvullingen op theme.css ---- */

/* bredere content voor tabellen */
main{ max-width:1200px; }

/* secundaire navigatie */
.nav-secondary{ display:flex; gap:4px; padding:6px 28px; background:var(--card-bg); border-bottom:1px solid var(--border); }
.subnav-item{ font-size:12px; font-weight:600; text-decoration:none; color:var(--muted); padding:5px 10px; border-radius:5px; }
.subnav-item:hover, .subnav-item.active{ color:var(--primary-dark); background:color-mix(in srgb, var(--primary) 8%, transparent); }

/* sorteerbare kolomkoppen */
table.grid th a{ color:inherit; text-decoration:none; display:inline-flex; align-items:center; gap:4px; }
table.grid th a:hover{ color:var(--primary-dark); }
th .arrow{ font-size:9px; opacity:.85; }

/* tabel: horizontaal scrollen bij smal scherm */
.table-wrap{ overflow-x:auto; border-radius:8px; }
table.grid td.wrapcell{ max-width:340px; white-space:normal; }
table.grid tr:hover td{ background:color-mix(in srgb, var(--primary) 4%, transparent); }
table.grid td .rowlink{ text-decoration:none; color:var(--primary-dark); font-weight:600; }

/* filterbalk */
.filter-bar{ display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end; margin-bottom:16px; }
.filter-bar .fb-field{ display:flex; flex-direction:column; gap:4px; }
.filter-bar .fb-field.grow{ flex:1; min-width:200px; }
.filter-bar input, .filter-bar select{ min-width:150px; }

/* badges voor 'voldoet aan bbl' */
.badge{ display:inline-block; padding:2px 8px; border-radius:10px; font-size:11px; font-weight:700; white-space:nowrap; }
.badge-ja{ background:#eafaf1; color:#1e7d4f; }
.badge-nee{ background:#fdeceb; color:#b23a2a; }
.badge-neutraal{ background:#fdf3e0; color:#9a6a12; }
.badge-grijs{ background:#f0f0f0; color:#666; }

/* statistiek-tegels */
.tile-row{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:18px; }
.tile{ flex:1; min-width:150px; background:var(--card-bg); border:1px solid var(--border); border-radius:8px; padding:14px 18px; }
.tile .t-label{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--muted); }
.tile .t-value{ font-size:24px; font-weight:700; color:var(--text); margin-top:2px; }

/* meta-lijst (rapport-detail) */
.meta-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:10px 24px; }
.meta-grid .m-item .m-label{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--muted); }
.meta-grid .m-item .m-value{ font-size:13px; margin-top:1px; }

/* paginator */
.paginator{ display:flex; gap:4px; align-items:center; flex-wrap:wrap; margin-top:16px; font-size:13px; }
.paginator a, .paginator span{ padding:5px 10px; border:1px solid var(--border); border-radius:6px; text-decoration:none; color:var(--primary-dark); background:var(--card-bg); }
.paginator span.current{ background:var(--primary); border-color:var(--primary); color:#fff; font-weight:600; }
.paginator span.disabled{ color:var(--muted); background:#f7f9fb; }
.paginator .p-info{ border:none; background:none; color:var(--muted); margin-left:auto; }

/* upload dropzone */
.upload-box{ border:2px dashed var(--border); border-radius:10px; padding:30px; text-align:center; background:color-mix(in srgb, var(--primary) 3%, white); }
.upload-box input[type=file]{ width:auto; display:inline-block; margin-top:10px; }
.empty-state{ text-align:center; padding:40px 20px; color:var(--muted); }
