/* Module d'audit SEO gratuit (audit.js) */
[data-audit] { --za-good:#0f9d58; --za-avg:#e37400; --za-bad:#d93025; --za-line:#e6e6ea; --za-soft:#f6f7f9; text-align:left; }
.za-form { max-width: 760px; margin: 0 auto; }
.za-fields { display:grid; grid-template-columns: 1.3fr 1fr auto; gap:.75rem; align-items:end; }
.za-field { display:flex; flex-direction:column; gap:.35rem; font-size:.85rem; font-weight:600; color:#333; }
.za-field input { width:100%; padding:.85rem 1rem; border:1.5px solid #d6d6de; border-radius:10px; font:inherit; font-weight:400; font-size:1rem; background:#fff; color:#1a1a1a; }
.za-field input:focus { outline:none; border-color:#047857; box-shadow:0 0 0 3px rgba(4,120,87,.18); }
.za-submit { padding:.9rem 1.4rem; border:0; border-radius:10px; background:linear-gradient(135deg,#f59e0b,#fbbf24); color:#1f2937; font:inherit; font-weight:700; cursor:pointer; white-space:nowrap; transition:transform .2s, box-shadow .2s; }
.za-submit:hover:not(:disabled) { transform:translateY(-2px); box-shadow:0 10px 24px rgba(245,158,11,.4); }
.za-submit:disabled { opacity:.65; cursor:progress; }
.za-hp { position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }
.za-legal { margin:.75rem 0 0; font-size:.8rem; color:#777; }
.za-error { margin:.75rem 0 0; padding:.7rem 1rem; border-radius:8px; background:#fdecea; color:#a3261c; font-weight:600; font-size:.9rem; }
.za-result { max-width: 960px; margin: 1.5rem auto 0; }
.za-loading { display:flex; gap:1rem; align-items:center; padding:1.25rem 1.5rem; border:1px solid var(--za-line); border-radius:16px; background:#fff; }
.za-loading p { margin:.25rem 0 0; color:#666; font-size:.9rem; }
.za-spinner { flex:none; width:34px; height:34px; border:3px solid #a7f3d0; border-top-color:#047857; border-radius:50%; animation:za-spin .9s linear infinite; }
@keyframes za-spin { to { transform:rotate(360deg); } }
.za-verdict { display:flex; flex-wrap:wrap; gap:.4rem 1rem; align-items:center; padding:1rem 1.25rem; border-radius:14px; margin-bottom:1rem; border:1px solid; }
.za-verdict strong { text-transform:uppercase; font-size:.85rem; letter-spacing:.03em; }
.za-verdict.za-good { background:#e8f5ee; color:#0b6b3d; border-color:#c5e7d4; }
.za-verdict.za-avg { background:#fff4e5; color:#8a4a00; border-color:#ffe0b3; }
.za-verdict.za-bad { background:#fdecea; color:#a3261c; border-color:#f7c9c4; }
.za-card { background:#fff; border:1px solid var(--za-line); border-radius:18px; padding:1.25rem 1.5rem; }
.za-head { display:flex; justify-content:space-between; gap:1rem; align-items:center; }
.za-head p { margin:.2rem 0 0; color:#777; font-size:.85rem; }
.za-chip { display:inline-block; padding:.25rem .7rem; border-radius:999px; background:#e6f7f5; color:#115e59; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em; }
.za-host { margin:.5rem 0 0; font-size:1.5rem; color:#1a1a1a; word-break:break-all; }
.za-shot { max-width:110px; height:auto; border-radius:10px; border:1px solid var(--za-line); }
.za-scores { display:grid; grid-template-columns:repeat(4,1fr); gap:.75rem; margin:1rem 0; }
.za-score { display:flex; flex-direction:column; align-items:center; gap:.4rem; padding:1rem .5rem; background:#fff; border:1px solid var(--za-line); border-radius:16px; font-weight:600; font-size:.9rem; color:#333; text-align:center; }
.za-ring { display:block; transform:rotate(0); }
.za-ring-bg { fill:none; stroke:#eceef2; stroke-width:3; }
.za-ring-fg { fill:none; stroke-width:3; stroke-linecap:round; transform:rotate(-90deg); transform-origin:50% 50%; transition:stroke-dasharray 1.3s cubic-bezier(.4,0,.2,1); }
.za-ring text { font-size:10px; font-weight:800; fill:currentColor; }
.za-ring.za-good { color:var(--za-good); } .za-ring.za-good .za-ring-fg { stroke:var(--za-good); }
.za-ring.za-avg { color:var(--za-avg); } .za-ring.za-avg .za-ring-fg { stroke:var(--za-avg); }
.za-ring.za-bad { color:var(--za-bad); } .za-ring.za-bad .za-ring-fg { stroke:var(--za-bad); }
.za-ring.za-na { color:#999; }
.za-subtitle { margin:1.75rem 0 .75rem; font-size:1.1rem; color:#1a1a1a; display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.za-count { font-size:.78rem; font-weight:600; color:#666; background:var(--za-soft); padding:.2rem .6rem; border-radius:999px; }
.za-metrics { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:.75rem; }
.za-metric { display:flex; flex-direction:column; gap:.2rem; padding:1rem; border-radius:14px; background:var(--za-soft); border-left:4px solid #bbb; }
.za-metric.za-good { border-left-color:var(--za-good); } .za-metric.za-avg { border-left-color:var(--za-avg); } .za-metric.za-bad { border-left-color:var(--za-bad); }
.za-metric-value { font-size:1.45rem; font-weight:800; color:#1a1a1a; }
.za-metric-label { font-size:.82rem; font-weight:600; color:#333; }
.za-metric-hint { font-size:.75rem; color:#777; }
.za-checks { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:.6rem; }
.za-check { display:flex; gap:.7rem; align-items:flex-start; padding:.8rem .9rem; border-radius:12px; background:#fff; border:1px solid var(--za-line); }
.za-check div { display:flex; flex-direction:column; min-width:0; }
.za-check strong { font-size:.9rem; color:#1a1a1a; }
.za-check span:not(.za-dot) { font-size:.82rem; color:#666; overflow-wrap:anywhere; }
.za-dot { flex:none; width:24px; height:24px; border-radius:50%; display:grid; place-items:center; font-size:.8rem; font-weight:800; color:#fff; }
.za-check.za-ok .za-dot { background:var(--za-good); } .za-check.za-warning .za-dot { background:var(--za-avg); } .za-check.za-error .za-dot { background:var(--za-bad); }
.za-issues { margin-top:1.5rem; background:var(--za-soft); border-radius:16px; padding:0 1rem; }
.za-issues summary { cursor:pointer; padding:1rem .25rem; font-weight:700; color:#1a1a1a; }
.za-issues ol { list-style:none; margin:0; padding:0 0 1rem; display:grid; gap:.6rem; max-height:720px; overflow-y:auto; }
.za-issue { background:#fff; border-radius:12px; padding:.9rem 1rem; border:1px solid var(--za-line); }
.za-issue.za-top { border-color:#f7c9c4; box-shadow:0 0 0 2px #fdecea; }
.za-issue-head { display:flex; flex-wrap:wrap; gap:.4rem .6rem; align-items:center; }
.za-issue-head strong { font-size:.92rem; color:#1a1a1a; }
.za-issue p { margin:.45rem 0 0; font-size:.84rem; color:#666; }
.za-tag { font-size:.68rem; font-weight:700; text-transform:uppercase; padding:.15rem .5rem; border-radius:6px; background:#e6f7f5; color:#115e59; }
.za-gain { font-size:.72rem; font-weight:700; padding:.15rem .5rem; border-radius:999px; background:#fdecea; color:#a3261c; }
.za-val { margin-left:auto; font-size:.72rem; font-family:ui-monospace,monospace; color:#555; background:var(--za-soft); padding:.15rem .45rem; border-radius:6px; }
.za-items { margin:.5rem 0 0; padding-left:1rem; font-size:.75rem; color:#555; }
.za-items code { overflow-wrap:anywhere; }
.za-next { margin-top:1.5rem; display:flex; flex-wrap:wrap; gap:1rem; align-items:center; justify-content:space-between; padding:1.25rem 1.5rem; border-radius:16px; background:linear-gradient(135deg,#063d33,#0b5345); color:#fff; }
.za-next div { display:flex; flex-direction:column; gap:.2rem; }
.za-next span { opacity:.85; font-size:.9rem; }
.za-next-btn { background:#f59e0b; color:#1f2937; text-decoration:none; font-weight:700; padding:.75rem 1.2rem; border-radius:10px; }
@media (max-width: 760px) {
  .za-fields { grid-template-columns:1fr; }
  .za-scores { grid-template-columns:repeat(2,1fr); }
  .za-head { flex-direction:column; align-items:flex-start; }
}
