
:root{
  --bg:#0b1220; --panel:#111a2e; --panel2:#0f172a;
  --line:#1e2a44; --text:#e8eefc; --muted:#9fb0d0;
  --accent:#4da3ff; --ok:#22c55e; --warn:#f59e0b;
  --radius:14px;
}
*{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)
}
.app{display:flex;min-height:100vh}
aside{
  width:250px;background:linear-gradient(180deg,#0e1630,#0b1220);
  border-right:1px solid var(--line);padding:18px
}
.brand{font-weight:900;font-size:20px;color:var(--accent)}
.brand span{color:white}
nav{margin-top:20px;display:flex;flex-direction:column;gap:8px}
nav a{
  text-decoration:none;color:var(--text);padding:10px 12px;border-radius:12px;
  background:rgba(255,255,255,.03);border:1px solid var(--line)
}
nav a.active{border-color:var(--accent);box-shadow:0 0 0 3px rgba(77,163,255,.15)}
main{flex:1;padding:22px}
h1,h2,h3{margin:0 0 10px}
.card{
  background:linear-gradient(180deg,var(--panel),var(--panel2));
  border:1px solid var(--line);border-radius:var(--radius);padding:16px
}
.grid{display:grid;gap:14px}
.grid-3{grid-template-columns:repeat(3,1fr)}
.small{font-size:12px;color:var(--muted)}
button{
  background:var(--panel2);color:var(--text);border:1px solid var(--line);
  border-radius:10px;padding:8px 12px;cursor:pointer
}
button.primary{background:var(--accent);color:#04142e;border:none}
button.ghost{background:transparent}
table{width:100%;border-collapse:collapse}
th,td{padding:10px;border-bottom:1px solid var(--line)}
th{text-align:left;color:var(--muted);font-size:12px}
input,select{
  width:100%;background:var(--panel2);border:1px solid var(--line);
  border-radius:10px;padding:8px;color:var(--text)
}
.row{display:flex;gap:10px;align-items:center}
.spacer{height:12px}
.badge{padding:4px 8px;border-radius:8px;font-size:12px}
.badge.elec{background:#2563eb}
.badge.plomberie{background:#0ea5e9}
.badge.securite{background:#22c55e;color:#052e16}

.brand{display:flex;align-items:center;gap:10px;margin:16px 14px 10px;font-weight:900;}
.brand-mark{width:32px;height:32px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg, rgba(91,158,255,0.95), rgba(124,92,255,0.95));}
.brand-name{letter-spacing:.5px;}

/* Brand split (no space) */
.brand{font-weight:900; letter-spacing:.6px;}
.brand-accent{color: rgba(91,158,255,0.95);}
.brand-rest{color: rgba(255,255,255,0.95);}

/* Logo du site (sidebar) */
.sidebar .brand{
  display:flex;
  align-items:center;
  justify-content:center;
  height:64px;
  padding:0 16px;
  overflow:hidden;
}

.sidebar .brand img.brand-logo{
  height:60px;
  width:auto;
  max-width:160px;
  object-fit:contain;
  display:block;
}
