:root{--bg:#f7f8fa;--card:#fff;--txt:#222;--muted:#667;--brand:#2f6feb;--err:#e74c3c;--bd:#e5e7eb;}
*{box-sizing:border-box} body{margin:0;background:var(--bg);color:var(--txt);font:14px/1.5 system-ui,Segoe UI,Roboto,Arial}
.container{
	max-width: 95%;        /* prend 95% de la largeur de l’écran */
	  margin: 0 auto;
	  padding:16px
 }
 
 /* Option : si tu veux absolument une limite sur très grand écran */
 @media (min-width: 1600px) {
   .container {
	 max-width: 1500px;   /* limite douce sur très grand écran */
   }
 }
 
 .subnav {
   display: flex;
   justify-content: space-between; /* espace gauche / droite */
   align-items: center;
   background: #f2f2f2; /* exemple */
   padding: 8px 16px;
 }
 
 .subnav .nav-left,
 .subnav .nav-right {
   display: flex;
   gap: 16px; /* espacement horizontal entre liens */
 }
 
 .subnav a {
   text-decoration: none;
   padding: 4px 8px;
   color:var(--brand);
   border-radius:8px
 }
 
 .subnav a:hover {
   background: #ddd;
   border-radius: 4px;
 }
 
 
.topbar{background:#fff;border-bottom:1px solid var(--bd)}
.topbar .container{display:flex;align-items:center;gap:12px}
.brand a{color:var(--brand);text-decoration:none;font-weight:700}
.spacer{flex:1}
.btn{background:var(--brand);color:#fff;padding:8px 12px;border-radius:8px;border:none;text-decoration:none;display:inline-block}
.btn.danger{background:var(--err)}
.btn:focus{outline:2px solid #0002}
.card{background:var(--card);border:1px solid var(--bd);border-radius:12px;padding:16px;margin:16px 0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
table{width:100%;border-collapse:collapse}
th,td{border-top:1px solid var(--bd);padding:8px;text-align:left}
thead th{background:#fafafa}
.row{display:flex;gap:16px;flex-wrap:wrap}
label{display:block;margin:8px 0}
input,select,textarea{width:100%;padding:8px;border:1px solid var(--bd);border-radius:8px;background:#fff}
.inline{display:inline}
.alert{padding:10px;border-radius:8px;margin:8px 0}
.alerts { margin: 8px 0; }
.alert { padding:8px 10px; border-radius:6px; border:1px solid transparent; }
.alert.error { background:#fef2f2; border-color:#fecaca; color:#991b1b; }
.alert.success { background:#ecfdf5; border-color:#a7f3d0; color:#065f46; }
.alert.success{background:#ecfdf5;color:#065f46;border:1px solid #a7f3d0}
.alert.error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}
.auth{max-width:420px;margin:32px auto}
.footer{border-top:1px solid var(--bd);background:#fff;margin-top:32px}