/* ── Email Deliverability Checker ────────────────────────────────────── */
.tool-icon--email { background: linear-gradient(135deg, var(--cyan), var(--green)); }

.ec-form .form-row { display: flex; gap: 10px; }
.ec-form .input {
  width: 100%; height: 44px; padding: 12px 16px;
  background: var(--surface2); border: 1px solid var(--border2);
  border-radius: 10px; color: var(--text); font-size: 15px;
  transition: border-color .2s, box-shadow .2s;
}
.ec-form .input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(91,138,248,.25); }
.ec-form .btn-primary {
  min-height: 44px; padding: 12px 24px; white-space: nowrap;
  background: linear-gradient(135deg, var(--cyan), var(--green));
  color: #0b0d14; border: none; border-radius: 10px;
  font-size: 14px; font-weight: 600; cursor: pointer;
  display: flex; align-items: center; gap: 8px;
  transition: opacity .2s, transform .15s;
}
.ec-form .btn-primary:hover { transform: scale(1.02); filter: brightness(1.08); }
.ec-form .btn-primary:disabled { opacity: .5; cursor: not-allowed; transform: none; }

.ec-error { color: var(--red); font-size: 14px; margin-top: 12px; }

/* Score card */
.ec-score-card { padding: 20px 24px; margin-bottom: 14px; animation: fadeInUp .35s var(--ease-out); }
.ec-domain { font-size: 13px; color: var(--muted); margin-bottom: 12px; }
.ec-score-wrap { display: flex; align-items: center; gap: 16px; margin-bottom: 12px; }
.ec-score { font-size: 44px; font-weight: 800; font-family: var(--mono); line-height: 1; }
.ec-score span { font-size: 22px; }
.ec-score--green  { color: #22c55e; }
.ec-score--yellow { color: var(--yellow); }
.ec-score--red    { color: var(--danger); }
.ec-score-label { font-size: 16px; font-weight: 600; color: var(--text); }
.ec-score-bar { height: 6px; background: var(--surface2); border-radius: 3px; overflow: hidden; }
.ec-score-fill { height: 100%; border-radius: 3px; transition: width .6s ease-out; }
.ec-score-fill--green  { background: linear-gradient(90deg, #22c55e, #4ade80); }
.ec-score-fill--yellow { background: linear-gradient(90deg, #ca8a04, var(--yellow)); }
.ec-score-fill--red    { background: linear-gradient(90deg, #dc2626, #f87171); }

/* Checks list */
.ec-checks { display: flex; flex-direction: column; gap: 10px; }
.ec-check {
  padding: 16px 18px; border-radius: 12px;
  background: var(--surface); border: 1px solid var(--border);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  animation: fadeInUp .35s var(--ease-out);
}
.ec-check--ok   { border-left: 3px solid #22c55e; }
.ec-check--fail { border-left: 3px solid var(--danger); }
.ec-check--warn { border-left: 3px solid var(--yellow); }

.ec-check-header { display: flex; align-items: center; gap: 10px; }
.ec-icon { font-size: 16px; flex-shrink: 0; width: 20px; text-align: center; }
.ec-icon--ok   { color: #22c55e; }
.ec-icon--fail { color: var(--danger); }
.ec-icon--warn { color: var(--yellow); }

.ec-check-name { font-weight: 600; font-size: 14px; flex: 1; }
.ec-check-status {
  font-size: 11px; padding: 2px 8px; border-radius: 20px; font-weight: 500;
}
.ec-check--ok   .ec-check-status { background: rgba(34,197,94,.15); color: #22c55e; }
.ec-check--fail .ec-check-status { background: rgba(239,68,68,.15); color: var(--danger); }
.ec-check--warn .ec-check-status { background: rgba(234,179,8,.15); color: var(--yellow); }

.ec-check-value {
  font-size: 12px; color: var(--muted2); font-family: var(--mono);
  background: var(--surface2); padding: 2px 8px; border-radius: 6px;
}

.ec-check-detail {
  margin-top: 10px; padding-top: 10px;
  border-top: 1px solid var(--border);
  font-size: 12px; color: var(--muted);
}
.ec-detail-line {
  padding: 3px 0; word-break: break-all; line-height: 1.5;
  font-family: var(--mono);
}

@media (max-width: 600px) {
  .ec-form .form-row { flex-direction: column; }
  .ec-form .btn-primary { width: 100%; justify-content: center; }
  .ec-score-wrap { gap: 12px; }
  .ec-score { font-size: 36px; }
}