/* COMA AI Visibility widget — matches the coma-scanner design language.
   Selectors are namespaced .coma-av-* so nothing collides with coma-scanner
   or coma-mailcheck when two tools appear on the same page. */

.coma-aivis{
  --coma-ok:#1a7f37;
  --coma-warn:#b58900;
  --coma-bad:#c1121f;
  --coma-ink:#1a1a1a;
  --coma-ink-2:#555;
  --coma-ink-3:#888;
  --coma-line:#e5e5e5;
  --coma-bg-soft:#fafafa;
  margin:48px auto;
  max-width:920px;
  padding:0 4px;
  color:var(--coma-ink);
}

/* head */
.coma-av-h{text-align:center;font-size:30px;margin:0 0 10px;color:var(--coma-ink)}
.coma-av-sub{text-align:center;font-size:16px;color:var(--coma-ink-2);margin:0 auto 28px;max-width:620px;line-height:1.5}

/* form */
.coma-av-form{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:8px}
.coma-av-form--inline{justify-content:flex-start;margin-bottom:0}
.coma-av-input{
  flex:1 1 280px;max-width:480px;padding:0 16px;font-size:16px;
  height:52px;line-height:50px;box-sizing:border-box;margin:0;
  border:1px solid var(--coma-line);border-radius:8px;background:#fff;color:var(--coma-ink);
}
.coma-av-input:focus{outline:2px solid var(--coma-ink);outline-offset:1px}
.coma-av-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 22px;
  font-size:16px;font-weight:600;height:52px;box-sizing:border-box;margin:0;
  border:none;border-radius:8px;cursor:pointer;text-decoration:none;line-height:1.2;
}
.coma-av-btn-primary{background:#1a1a1a;color:#fff}
.coma-av-btn-primary:hover{background:#333;color:#fff}
/* Beat Enfold's #top anchor colour rules on anchor buttons */
#top .coma-aivis a.coma-av-btn-primary,
#top .coma-aivis a.coma-av-btn-primary:link,
#top .coma-aivis a.coma-av-btn-primary:visited,
#top .coma-aivis a.coma-av-btn-primary:hover,
#top .coma-aivis a.coma-av-btn-primary:active{color:#fff !important;text-decoration:none}
.coma-av-btn:disabled{opacity:.6;cursor:default}

/* honeypot — hidden from people and assistive tech, visible to naive bots */
.coma-av-pot{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}

/* status + progress */
.coma-av-status{max-width:480px;margin:14px auto 0;color:var(--coma-ink-2)}
.coma-av-status:empty{margin:0}
.coma-av-status-row{display:flex;align-items:center;gap:10px}
.coma-av-status-txt{flex:1 1 auto;font-size:15px}
.coma-av-elapsed{flex:0 0 auto;font-size:13px;color:var(--coma-ink-3);font-variant-numeric:tabular-nums}
.coma-av-spinner{
  flex:0 0 auto;width:16px;height:16px;border:2px solid rgba(0,0,0,.15);border-top-color:#1a1a1a;
  border-radius:50%;animation:coma-av-spin .7s linear infinite;display:inline-block;
}
@keyframes coma-av-spin{to{transform:rotate(360deg)}}

.coma-av-bar{height:4px;border-radius:999px;background:var(--coma-line);overflow:hidden;margin-top:10px}
.coma-av-bar-fill{
  height:100%;width:3%;border-radius:999px;background:#1a1a1a;
  transition:width .35s cubic-bezier(.4,0,.2,1);
}
.coma-av-norefresh{margin-top:8px;font-size:13px;color:var(--coma-ink-3);text-align:center}

/* Pending engine cards breathe so the grid reads as "working", not "stuck". */
.coma-av-card--pending{animation:coma-av-pulse 1.6s ease-in-out infinite}
@keyframes coma-av-pulse{0%,100%{opacity:.45}50%{opacity:.75}}

@media (prefers-reduced-motion:reduce){
  .coma-av-spinner{animation-duration:2s}
  .coma-av-card--pending{animation:none;opacity:.6}
  .coma-av-bar-fill{transition:none}
}
.coma-av-error{text-align:center;color:var(--coma-bad);margin:12px 0 0}
.coma-av-error:empty{margin:0}

/* score ring */
.coma-av-top{display:flex;gap:28px;align-items:center;flex-wrap:wrap;margin:32px 0 8px}
/* The caption is in normal flow under the ring box, not absolutely positioned
   over it — at bottom:-4px it sat on top of the ring stroke. */
.coma-av-ring-wrap{flex:0 0 140px;width:140px}
.coma-av-ring-box{position:relative;width:140px;height:140px}
.coma-av-ring{width:140px;height:140px;display:block}
.coma-av-ring-bg{fill:none;stroke:var(--coma-line);stroke-width:10}
.coma-av-ring-fg{fill:none;stroke-width:10;stroke-linecap:round;transition:stroke-dashoffset .6s cubic-bezier(.4,0,.2,1)}
.coma-av-ring-fg--ok{stroke:var(--coma-ok)}
.coma-av-ring-fg--warn{stroke:var(--coma-warn)}
.coma-av-ring-fg--bad{stroke:var(--coma-bad)}
/* Number and "/100" stack and centre as one group inside the ring. Do not
   align-self:flex-end the "/100" — that pins it to the bottom of the 140px box,
   where it sits on top of the ring stroke. */
.coma-av-ring-label{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.coma-av-ring-num{font-size:34px;font-weight:700;line-height:1}
.coma-av-ring-max{font-size:12px;line-height:1;color:var(--coma-ink-3);margin-top:3px}
.coma-av-ring-cap{margin-top:8px;text-align:center;font-size:13px;line-height:1.3;color:var(--coma-ink-3)}

/* Still-working ring: no arc, muted placeholder number, gentle breathing. */
.coma-av-ring-wrap--pending .coma-av-ring-num{color:var(--coma-ink-3);font-weight:600}
.coma-av-ring-wrap--pending .coma-av-ring-bg{animation:coma-av-pulse 1.6s ease-in-out infinite}

.coma-av-top-meta{flex:1 1 320px;min-width:0}
.coma-av-domain{font-size:20px;font-weight:700;word-break:break-all}
.coma-av-lede{margin:6px 0 0;color:var(--coma-ink-2);line-height:1.5}
.coma-av-note{margin:8px 0 0;font-size:13px;color:var(--coma-ink-3)}

.coma-av-stats{display:flex;gap:24px;margin-top:14px}
.coma-av-stat-num{font-size:22px;font-weight:700;line-height:1.1}
.coma-av-stat-cap{font-size:12px;color:var(--coma-ink-3);margin-top:2px}

/* sections */
.coma-av-sec{margin:36px 0 0}
.coma-av-sec-h{font-size:19px;margin:0 0 14px}

/* engine cards */
.coma-av-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.coma-av-card{
  border:1px solid var(--coma-line);border-radius:10px;padding:16px;background:#fff;
  display:flex;flex-direction:column;gap:8px;
}
.coma-av-card--wrong{border-color:var(--coma-bad);background:#fff8f8}
.coma-av-card--not_configured{opacity:.6}
.coma-av-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.coma-av-card-name{font-weight:700}
.coma-av-card-sum{margin:0;font-size:14px;line-height:1.5;color:var(--coma-ink-2)}

.coma-av-pill{
  font-size:12px;font-weight:600;padding:3px 9px;border-radius:999px;white-space:nowrap;
  background:#f0f0f0;color:var(--coma-ink-2);
}
.coma-av-pill--knows{background:#e6f4ea;color:var(--coma-ok)}
.coma-av-pill--partial{background:#fdf5e0;color:var(--coma-warn)}
.coma-av-pill--unknown{background:#f0f0f0;color:var(--coma-ink-2)}
.coma-av-pill--wrong{background:#fbe9e9;color:var(--coma-bad)}
.coma-av-pill--error{background:#f0f0f0;color:var(--coma-ink-3)}

.coma-av-wrong{
  font-size:14px;line-height:1.5;color:var(--coma-bad);
  background:#fbe9e9;border-radius:6px;padding:9px 11px;
}
.coma-av-cited{font-size:12px;color:var(--coma-ink-3);margin-top:auto}
.coma-av-cited--yes{color:var(--coma-ok)}

/* readiness checks */
.coma-av-checks{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:6px 20px}
.coma-av-check{display:flex;align-items:flex-start;gap:9px;padding:6px 0;font-size:15px;line-height:1.4}
.coma-av-check-mark{flex:0 0 auto;font-weight:700;width:16px;text-align:center}
.coma-av-check--pass .coma-av-check-mark{color:var(--coma-ok)}
.coma-av-check--fail .coma-av-check-mark{color:var(--coma-bad)}
.coma-av-check--fail .coma-av-check-label{color:var(--coma-ink)}
.coma-av-check--pass .coma-av-check-label{color:var(--coma-ink-2)}

/* crawler tags */
.coma-av-crawlers{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}
.coma-av-tag{font-size:12px;padding:3px 9px;border-radius:6px;border:1px solid var(--coma-line);background:#fff;color:var(--coma-ink-2)}
.coma-av-tag--allowed{border-color:#cfe8d6;background:#f2fbf5;color:var(--coma-ok)}
.coma-av-tag--partial{border-color:#efe1b8;background:#fdfaf0;color:var(--coma-warn)}
.coma-av-tag--blocked{border-color:#efc9c9;background:#fdf4f4;color:var(--coma-bad)}

/* fixes — flex row: [number][body]. The number must be a real flex item so a
   wrapping title can never run underneath it (mobile bug), and so Enfold's
   list-item padding rules cannot break the layout. */
.coma-av-fixes{margin:0;padding:0;list-style:none}
.coma-av-fix{
  display:flex;align-items:flex-start;gap:12px;
  padding:14px 16px;
  border:1px solid var(--coma-line);border-radius:10px;margin-bottom:10px;background:#fff;
}
.coma-av-fix-num{
  flex:0 0 22px;width:22px;height:22px;margin-top:2px;
  border-radius:50%;background:#1a1a1a;color:#fff;
  font-size:12px;font-weight:700;line-height:1;
  display:flex;align-items:center;justify-content:center;
}
.coma-av-fix-body{flex:1 1 auto;min-width:0}
/* wrap so a long title and its priority pill never collide on a narrow screen */
.coma-av-fix-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex-wrap:wrap}
.coma-av-fix-title{font-weight:700;min-width:0;overflow-wrap:anywhere}
.coma-av-fix-why{margin:6px 0 0;font-size:14px;line-height:1.5;color:var(--coma-ink-2)}
.coma-av-prio{font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;white-space:nowrap;background:#f0f0f0;color:var(--coma-ink-2)}
.coma-av-prio--high{background:#fbe9e9;color:var(--coma-bad)}
.coma-av-prio--med{background:#fdf5e0;color:var(--coma-warn)}

/* report + CTA */
.coma-av-report{background:var(--coma-bg-soft);border:1px solid var(--coma-line);border-radius:10px;padding:20px}
.coma-av-report-msg{margin-top:10px;color:var(--coma-ink-2)}
.coma-av-cta{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin:32px 0 0;padding:20px 22px;border-radius:10px;background:var(--coma-bg-soft);border:1px solid var(--coma-line);
}
.coma-av-cta-txt{font-size:17px;font-weight:600}
.coma-av-disclaimer{margin:20px 0 0;font-size:12px;line-height:1.6;color:var(--coma-ink-3)}

@media (max-width:600px){
  .coma-av-h{font-size:24px}
  .coma-av-top{gap:18px}
  .coma-av-stats{gap:18px}
  .coma-av-cta{flex-direction:column;align-items:flex-start}
}