/* NDSH Manufacturing - Industrial Enterprise
 *
 * Served statically from /app.css. The source of truth is Files/app.css, which
 * EnsureStaticAssets materialises into Objects/www on every start, because
 * Objects is build output and is not tracked.
 *
 * Tokens come from UI Examples/DESIGN.md. The shell rules below were ported
 * from MainView.ShellStyles at identical values, so moving the stylesheet out
 * of the B4J string changed nothing visually. New in this pass: the type scale
 * and the table layer.
 */

/* ---- Tokens -------------------------------------------------------------- */
:root { --navy:#122b4e; --gold:#c8961c; --ink:#172033; --muted:#566176; --bg:#f5f7fa; --line:#dde3ec; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: var(--ink); background: var(--bg); }
a { color: var(--navy); text-decoration: none; }
a:hover { text-decoration: underline; }

.cb-layout { max-width: 1100px; margin: 0 auto; padding: 0 1rem; }
.cb-topbar { display:flex; align-items:center; gap:1rem; padding:1rem 0; border-bottom:2px solid var(--navy); flex-wrap:wrap; }
.cb-brand { font-weight:800; color:var(--navy); font-size:1.1rem; }
.cb-nav { display:flex; gap:1rem; flex:1; }
.cb-nav a { padding:.35rem .7rem; border-radius:.4rem; color:var(--muted); }
.cb-nav a.is-active { background:var(--navy); color:#fff; }
.cb-user { display:flex; align-items:center; gap:.7rem; color:var(--muted); }
.cb-logout { display:inline; }

.cb-main { padding: 1.2rem 0 3rem; }
.pb-content { display:flex; flex-direction:column; gap:1rem; }
.pb-page-header h1 { margin:.2rem 0; color:var(--navy); }
.pb-page-header p { margin:0; color:var(--muted); }

.pb-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:1rem; }
.pb-card { display:block; background:#fff; border:1px solid var(--line); border-radius:.7rem; padding:1rem; color:inherit; }
.pb-card-label { display:block; font-size:.85rem; color:var(--muted); }
.pb-card-value { display:block; font-size:1.4rem; color:var(--navy); margin-top:.3rem; }
.pb-tone-good { border-left:4px solid #1baf7a; }
.pb-tone-watch { border-left:4px solid #eb6834; }
.pb-tone-problem { border-left:4px solid #e34948; }
.pb-tone-neutral { border-left:4px solid var(--line); }

.pb-form { display:flex; flex-direction:column; gap:.9rem; max-width:640px; }
.pb-inline-form { display:flex; gap:.6rem; flex-wrap:wrap; align-items:flex-end; margin-bottom:.8rem; }
.pb-field { display:flex; flex-direction:column; gap:.25rem; }
.pb-field label { font-size:.85rem; color:var(--muted); }
.pb-field input, .pb-field select, .pb-field textarea { padding:.5rem .7rem; border:1px solid var(--line); border-radius:.4rem; font:inherit; background:#fff; }
.pb-radio-row { display:flex; gap:1rem; }
.pb-radio { display:flex; align-items:center; gap:.35rem; }

.pb-button { display:inline-block; padding:.5rem 1rem; border-radius:.45rem; border:none; font:inherit; cursor:pointer; font-weight:600; }
.pb-primary { background:var(--navy); color:#fff; }
.pb-secondary { background:#fff; color:var(--navy); border:1px solid var(--navy); }
.pb-button-small { padding:.25rem .6rem; font-size:.85rem; }
.pb-link { background:none; border:none; color:var(--navy); cursor:pointer; font:inherit; text-decoration:underline; padding:0; }
.pb-link-danger { color:#c02; }

.pb-actions { display:flex; gap:.6rem; align-items:center; flex-wrap:wrap; }
.pb-actions-cell { display:flex; gap:.5rem; align-items:center; }

.pb-table-wrap { overflow-x:auto; background:#fff; border:1px solid var(--line); border-radius:.5rem; }
.pb-table-wrap table { width:100%; border-collapse:collapse; }
.pb-table-wrap th, .pb-table-wrap td { padding:.55rem .7rem; text-align:left; border-bottom:1px solid var(--line); font-size:.92rem; }
.pb-table-wrap thead th { background:#f0f3f8; color:var(--navy); }
.pb-table-wrap td[data-numeric], .pb-table-wrap th[data-numeric] { text-align:right; font-variant-numeric: tabular-nums; }

.pb-alert { padding:.7rem 1rem; border-radius:.4rem; margin:0; }
.pb-alert-error { background:#fde7e7; color:#802; }
.pb-alert-info { background:#e7f0fd; color:#123; }
.pb-note { color:var(--muted); margin:.3rem 0; }

.cb-login { display:flex; align-items:center; justify-content:center; min-height:100vh; padding:1rem; }
.cb-login .pb-card { width:100%; max-width:380px; }