/* ========== MADESIGNEL — espace admin ========== */
:root{
  --ink:#111;--paper:#fff;--mist:#f4f4f4;--line:#e0e0e0;--muted:#666;--danger:#b3261e;
}
*,*::before,*::after{box-sizing:border-box}
body{
  margin:0;background:var(--mist);color:var(--ink);
  font-family:"Montserrat",system-ui,sans-serif;font-size:15px;line-height:1.6;
}
a{color:inherit}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

/* ---- barre du haut ---- */
.a-top{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:12px clamp(16px,4vw,40px);background:var(--ink);color:#fff;
}
.a-brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:600;letter-spacing:.06em}
.a-brand span{display:grid;place-items:center;width:38px;height:26px;border-radius:4px;background:#fff;color:var(--ink);font-size:13px;font-weight:700}
.a-top-right{display:flex;gap:18px;font-size:13px}
.a-top-right a{text-decoration:none;opacity:.85}
.a-top-right a:hover{opacity:1;text-decoration:underline}

/* ---- navigation ---- */
.a-nav{display:flex;flex-wrap:wrap;gap:2px;padding:0 clamp(16px,4vw,40px);background:#fff;border-bottom:1px solid var(--line)}
.a-nav a{
  padding:14px 16px;text-decoration:none;font-size:14px;
  border-bottom:2px solid transparent;color:var(--muted);
}
.a-nav a:hover{color:var(--ink)}
.a-nav a.is-active{color:var(--ink);border-color:var(--ink);font-weight:600}
.a-badge{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:6px;padding:0 5px;border-radius:9px;background:var(--danger);color:#fff;font-size:11px;font-style:normal}

/* ---- structure ---- */
.a-main{max-width:1160px;margin:0 auto;padding:clamp(20px,4vw,36px) clamp(16px,4vw,40px) 60px}
.a-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:22px}
h1{margin:0;font-size:24px;font-weight:600}
.a-h2{margin:38px 0 14px;font-size:17px;font-weight:600}
.a-sub{margin:4px 0 0;color:var(--muted);font-size:14px}
.a-link{font-size:14px}

/* ---- boutons ---- */
.a-btn{
  display:inline-block;padding:11px 20px;border:1px solid var(--ink);border-radius:3px;
  background:var(--ink);color:#fff;font:inherit;font-size:14px;text-decoration:none;cursor:pointer;
}
.a-btn:hover{background:#000}
.a-mini{
  padding:6px 11px;border:1px solid var(--line);border-radius:3px;background:#fff;
  font:inherit;font-size:12.5px;cursor:pointer;
}
.a-mini:hover{border-color:var(--ink)}
.a-danger{color:var(--danger)}
button.a-danger:hover{border-color:var(--danger)}

/* ---- messages ---- */
.a-flash{padding:11px 14px;margin:0 0 20px;border-left:3px solid var(--ink);background:#fff;font-size:14px}
.a-flash-error{border-color:var(--danger);color:var(--danger)}
.a-empty{padding:50px 20px;text-align:center;background:#fff;border:1px dashed var(--line);border-radius:4px}

/* ---- filtres ---- */
.a-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.a-filters a{
  padding:6px 14px;border:1px solid var(--line);border-radius:999px;
  background:#fff;text-decoration:none;font-size:13px;
}
.a-filters a.is-active{border-color:var(--ink);font-weight:600}

/* ---- grille de projets ---- */
.a-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}
.a-card{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:4px;
  overflow:hidden;transition:box-shadow .2s,opacity .2s;
}
.a-card:hover{box-shadow:0 6px 20px rgba(0,0,0,.07)}
.a-card.is-hidden{opacity:.5}
.a-card.is-dragging{opacity:.35}
.a-card.is-over{outline:2px dashed var(--ink);outline-offset:-4px}
.a-handle{position:absolute;top:8px;left:10px;z-index:2;cursor:grab;color:#999;font-size:16px;letter-spacing:-2px}
.a-thumb{aspect-ratio:4/3;background:var(--mist);display:grid;place-items:center;overflow:hidden}
.a-thumb img{max-width:100%;max-height:100%;object-fit:contain}
.a-card-body{padding:12px 14px 14px}
.a-card-body h2{margin:0;font-size:15px;font-weight:600}
.a-tag{margin:2px 0 10px;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.a-card-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:12.5px}
.a-card-actions a{text-decoration:none;border-bottom:1px solid transparent}
.a-card-actions a:hover{border-color:currentColor}
.a-card-actions a.is-on{font-weight:600}
.a-card-actions form{display:inline}

/* ---- formulaires ---- */
.a-form{background:#fff;border:1px solid var(--line);border-radius:4px;padding:clamp(18px,3vw,28px);margin-bottom:22px}
.a-form-narrow{max-width:460px}
.a-form-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(20px,4vw,40px)}
.a-form label{display:block;margin-bottom:16px;font-size:13px;font-weight:500}
.a-form input[type=text],.a-form input[type=number],.a-form input[type=password],
.a-form select,.a-form textarea,.a-form input[type=file]{
  display:block;width:100%;margin-top:6px;padding:10px 12px;
  font:inherit;font-size:14px;color:var(--ink);
  background:#fff;border:1px solid var(--line);border-radius:3px;
}
.a-form textarea{resize:vertical}
.a-form input:focus,.a-form select:focus,.a-form textarea:focus{border-color:var(--ink);outline:none}
.a-form small{display:block;margin-top:4px;color:var(--muted);font-weight:400;font-size:12px}
.a-checks{display:flex;flex-wrap:wrap;gap:18px;margin:4px 0 18px}
.a-check{display:flex!important;align-items:center;gap:8px;margin:0!important;font-weight:400}
.a-check input{width:auto!important;margin:0!important}
.a-block{border:1px solid var(--line);border-radius:4px;padding:18px;margin:0 0 18px}
.a-block legend{padding:0 8px;font-size:13px;font-weight:600}

.a-preview{
  display:grid;place-items:center;min-height:230px;padding:12px;
  background:var(--mist);border:1px dashed var(--line);border-radius:4px;color:var(--muted);font-size:13px;
}
.a-preview img{max-width:100%;max-height:300px;object-fit:contain}
.a-preview-sm{min-height:90px;margin-top:6px}
.a-preview-sm img{max-height:70px}

.a-inline-form{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.a-inline-form input{flex:1 1 260px;padding:10px 12px;font:inherit;font-size:14px;border:1px solid var(--line);border-radius:3px}
.a-row-form{display:flex;gap:8px;align-items:center}
.a-row-form input{padding:7px 10px;font:inherit;font-size:14px;border:1px solid var(--line);border-radius:3px}
.a-chiplist{display:flex;flex-wrap:wrap;gap:8px}

/* ---- tableau ---- */
.a-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:4px;overflow:hidden}
.a-table th,.a-table td{padding:12px 14px;text-align:left;border-bottom:1px solid var(--line);font-size:14px;vertical-align:middle}
.a-table th{background:var(--mist);font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.a-table tr:last-child td{border-bottom:0}
.a-table code{font-size:12.5px;color:var(--muted)}

/* ---- messages reçus ---- */
.a-message{background:#fff;border:1px solid var(--line);border-left-width:3px;border-radius:4px;padding:16px 18px;margin-bottom:14px}
.a-message.is-new{border-left-color:var(--ink)}
.a-message header{display:flex;flex-wrap:wrap;gap:12px;align-items:baseline;font-size:13.5px;margin-bottom:8px}
.a-message time{color:var(--muted);font-size:12.5px;margin-left:auto}
.a-subject{margin:0 0 6px;font-weight:600}
.a-message p{margin:0 0 12px}

/* ---- connexion ---- */
.a-login-body{display:grid;place-items:center;min-height:100vh;padding:24px}
.a-login{width:min(380px,100%);background:#fff;border:1px solid var(--line);border-radius:6px;padding:34px 30px;text-align:center}
.a-login-mark{display:inline-grid;place-items:center;width:56px;height:38px;border-radius:5px;background:var(--ink);color:#fff;font-weight:700}
.a-login h1{margin:16px 0 2px;font-size:21px}
.a-login .a-sub{margin-bottom:22px}
.a-login label{display:block;margin-bottom:14px;text-align:left;font-size:13px;font-weight:500}
.a-login input{width:100%;margin-top:6px;padding:11px 12px;font:inherit;font-size:14px;border:1px solid var(--line);border-radius:3px}
.a-login input:focus{border-color:var(--ink);outline:none}
.a-login .a-btn{width:100%;margin-top:6px}
.a-back{display:inline-block;margin-top:18px;font-size:13px;color:var(--muted)}

@media (max-width:760px){
  .a-form-grid{grid-template-columns:1fr}
  .a-message time{margin-left:0;width:100%}
}

/* ---- sélection multi-catégories ---- */
.a-catbox{border:1px solid var(--line);border-radius:4px;padding:14px 16px;margin:0 0 16px}
.a-catbox legend{padding:0 8px;font-size:13px;font-weight:600}
.a-cathelp{margin:0 0 10px;font-size:12.5px;color:var(--muted)}
.a-catgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px 16px}
.a-catgrid .a-check{margin:0!important;font-size:14px}