/* ═══════════════════════════════════════════════════════════════════
   arpe-attrs.css — Arpentiq · popup « toutes les caractéristiques »
   Namespace .aqa-* · le bouton déclencheur + la popup, rien d'autre.
   Aucune règle body/html/:root — les variables vivent sur .aqa.
   ═══════════════════════════════════════════════════════════════════ */

/* [b2427] Palier de z-index du CRM. Les defauts du kit (640/650) supposent une
   page vierge ; ici la pile monte a 100096 (toasts). On reprend exactement le
   couple du popover de tache — scrim 100092 / contenu 100093 — pour que la
   popup passe au-dessus des panneaux et du dock, et reste SOUS la confirmation
   (100094) et les toasts (100096) : une erreur d'enregistrement doit rester
   lisible alors que la popup est ouverte. */
:root{ --aqa-z-scrim:100092; --aqa-z-box:100093; }

.aqa,[data-theme="light"] .aqa{
  --bg:#f7f8fa;--surface:#ffffff;--s2:#f1f3f7;--s3:#e7ebf2;
  --border:#e4e7ee;--border-hi:#d3d8e3;
  --text:#14161f;--text-dim:#4a5169;--muted:#8a93ab;
  --accent:#6b5cf5;--accent-dim:rgba(107,92,245,.09);--green:#22a06b;
  --r:8px;--r-lg:12px;--r-xl:16px;
  --scrim:rgba(20,22,31,.38);
  --sh:0 1px 2px rgba(20,22,31,.05),0 30px 70px -18px rgba(20,22,31,.3);
  --sans:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
}
[data-theme="noir"] .aqa,[data-theme="donna"] .aqa,[data-theme="ardoise"] .aqa{
  --bg:#0f1115;--surface:#16181d;--s2:#1c1e24;--s3:#23262d;
  --border:#23262d;--border-hi:#2f333c;
  --text:#f2f3f7;--text-dim:#a8adbd;--muted:#5f6578;
  --accent:#8b7bff;--accent-dim:rgba(139,123,255,.12);--green:#4fd49a;
  --r:6px;--r-lg:10px;--r-xl:12px;
  --scrim:rgba(0,0,0,.58);
  --sh:0 1px 2px rgba(0,0,0,.5),0 34px 80px -18px rgba(0,0,0,.8);
}
.aqa{font-family:var(--sans);color:var(--text);-webkit-font-smoothing:antialiased}
.aqa *{box-sizing:border-box}
.aqa button{font-family:inherit;cursor:pointer}

/* ── le bouton déclencheur, à poser dans l'en-tête d'un rail ────── */
.aqa-btn{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;
  color:var(--text-dim);background:var(--s2);border:1px solid var(--border);border-radius:7px;
  padding:4px 9px;transition:.15s}
.aqa-btn:hover{color:var(--text);background:var(--s3);border-color:var(--border-hi)}
.aqa-btn svg{width:13px;height:13px;color:var(--muted)}
.aqa-btn:hover svg{color:var(--accent)}

/* ── popup ──────────────────────────────────────────────────────── */
.aqa.aqa-scrim{position:fixed;inset:0;z-index:var(--aqa-z-scrim,640);background:var(--scrim);
  opacity:0;pointer-events:none;transition:opacity .2s}
.aqa.aqa-scrim.aqa-on{opacity:1;pointer-events:auto}
.aqa.aqa-box{position:fixed;left:50%;top:50%;z-index:var(--aqa-z-box,650);
  width:min(1080px,calc(100vw - 40px));max-height:calc(100vh - 56px);
  display:flex;flex-direction:column;background:var(--surface);
  border:1px solid var(--border-hi);border-radius:var(--r-xl);box-shadow:var(--sh);overflow:hidden;
  transform:translate(-50%,-50%) translateY(10px) scale(.985);opacity:0;pointer-events:none;
  transition:opacity .2s,transform .24s cubic-bezier(.2,.75,.2,1)}
.aqa.aqa-box.aqa-on{opacity:1;transform:translate(-50%,-50%);pointer-events:auto}

.aqa .aqa-h{display:flex;align-items:center;gap:12px;padding:15px 18px;border-bottom:1px solid var(--border);flex-shrink:0}
.aqa .aqa-t{display:block;font-size:15.5px;font-weight:700;letter-spacing:-.02em}
.aqa .aqa-s{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.aqa .aqa-sp{flex:1}
.aqa .aqa-cnt{font-family:var(--mono);font-size:10.5px;color:var(--muted);background:var(--s2);
  border:1px solid var(--border);border-radius:99px;padding:3px 9px;white-space:nowrap}
.aqa .aqa-x{width:30px;height:30px;border:0;border-radius:var(--r);background:transparent;color:var(--muted);
  display:grid;place-items:center;transition:.15s;flex-shrink:0}
.aqa .aqa-x:hover{background:var(--s2);color:var(--text)}
.aqa .aqa-x svg{width:16px;height:16px}

.aqa .aqa-b{flex:1;min-height:0;overflow-y:auto;padding:16px 18px 20px}
/* les sections coulent en colonnes : on garde des points d'ancrage visuels */
.aqa .aqa-cols{columns:3 260px;column-gap:26px}
@media(max-width:820px){.aqa .aqa-cols{columns:1}}
.aqa .aqa-sec{break-inside:avoid;margin-bottom:20px}
.aqa .aqa-sh{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:9px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
  padding-bottom:6px;border-bottom:1px solid var(--border);margin-bottom:2px}
.aqa .aqa-sn{margin-left:auto;letter-spacing:.04em}
.aqa .aqa-r{display:flex;align-items:baseline;gap:12px;padding:6px 0;font-size:13px;line-height:1.4}
.aqa .aqa-k{flex:1;min-width:0;color:var(--muted);font-size:12px}
.aqa .aqa-v{flex-shrink:0;max-width:56%;font-weight:600;text-align:right;letter-spacing:-.012em;overflow-wrap:anywhere}
.aqa .aqa-v.aqa-num{font-family:var(--mono);font-variant-numeric:tabular-nums}
/* champ vide : invite grise, jamais du noir gras — !important pour battre
   le style de l'état éditable, qui remet du poids au focus */
.aqa .aqa-v.aqa-add,.aqa .aqa-v.aqa-add[contenteditable]{color:var(--muted)!important;font-weight:400!important;font-size:12.5px}
.aqa .aqa-v.aqa-add:hover{color:var(--text-dim)!important}
/* édition en place, depuis la popup */
.aqa .aqa-v[contenteditable]{border:1px solid transparent;border-radius:6px;padding:2px 7px;margin:-2px -7px;
  cursor:text;transition:.12s;min-width:52px;display:inline-block;text-align:right}
.aqa .aqa-v[contenteditable]:hover{background:var(--s2);border-color:var(--border)}
.aqa .aqa-v[contenteditable]:focus{outline:none;background:var(--surface);border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-dim);text-align:left;font-weight:600;color:var(--text)}
.aqa .aqa-r.aqa-saved .aqa-v{animation:aqa-flash .9s ease}
@keyframes aqa-flash{0%{background:color-mix(in srgb,var(--green) 20%,transparent)}100%{background:transparent}}

.aqa .aqa-f{display:flex;align-items:center;gap:9px;padding:11px 18px;border-top:1px solid var(--border);
  background:var(--s2);flex-shrink:0}
.aqa .aqa-note{font-size:11.5px;color:var(--muted)}
.aqa .aqa-cp{margin-left:auto;display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;
  border:1px solid var(--border);border-radius:var(--r);background:var(--surface);color:var(--text);
  padding:7px 12px;transition:.15s}
.aqa .aqa-cp:hover{background:var(--s3);border-color:var(--border-hi)}
.aqa .aqa-cp svg{width:14px;height:14px;color:var(--muted)}

@media(prefers-reduced-motion:reduce){.aqa.aqa-box,.aqa.aqa-scrim,.aqa .aqa-v[contenteditable]{transition:none!important}
  .aqa .aqa-r.aqa-saved .aqa-v{animation:none}}