/* RL Suite — feuilles de style PWA (desktop-first). */
* { box-sizing: border-box; }
html, body, #root { height: 100%; }
body { margin: 0; font-family: -apple-system, "Segoe UI", Roboto, sans-serif; color: var(--brand-ink); background: var(--brand-paper); }
a { color: var(--brand-orange-deep); }

.app-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 24px; border-bottom:4px solid var(--brand-orange); background:rgba(var(--brand-orange-rgb),0.04); }
.app-header .brand { display:flex; align-items:center; gap:16px; }
.app-header .brand img { width: 56px; height: auto; }
.app-header .brand .name { font-size:18px; letter-spacing:.08em; color: var(--brand-orange-deep); }
.app-header .user { color: var(--brand-accent-gray); font-size:14px; }

.app-nav { display:flex; gap:4px; padding:0 24px; background:#FAFAFA; border-bottom:1px solid #EEE; }
.app-nav a { display:inline-block; padding:12px 16px; text-decoration:none; color: var(--brand-accent-gray); border-bottom:3px solid transparent; }
.app-nav a.active { color: var(--brand-orange-deep); border-bottom-color: var(--brand-orange); font-weight:600; }

.app-main { padding: 24px 32px; max-width: 1200px; }

.card { background:#FFFFFF; border:1px solid #EEE; border-radius:8px; padding:16px 20px; margin-bottom:12px; }
.card h3 { margin: 0 0 8px 0; color: var(--brand-orange-deep); }

.button { background: var(--brand-orange); color:#fff; border:0; padding:10px 18px; border-radius:6px; font-weight:600; cursor:pointer; }
.button:hover { background: var(--brand-orange-deep); }
.button[disabled] { background:#DDD; cursor:not-allowed; }

.input, select, textarea { width:100%; padding:8px 10px; border:1px solid #CCC; border-radius:6px; font: inherit; }
.label { display:block; font-size:12px; color: var(--brand-accent-gray); margin: 10px 0 4px; }
.error { color:#B22; background:#FFF4F4; padding:8px 12px; border-radius:6px; margin:8px 0; }

.kpi-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap:12px; margin-bottom:16px; }
.kpi { background: rgba(var(--brand-orange-rgb),0.12); border:1px solid rgba(var(--brand-orange-rgb),0.3); border-radius:8px; padding:14px 16px; }
.kpi .n { font-size:28px; color: var(--brand-orange-deep); font-weight:700; }
.kpi .l { font-size:13px; color: var(--brand-accent-gray); }