/* ============================================================
   Feature Comparison – DMARCeye vs EasyDMARC (HubSpot CMS)
   Standalone CSS. Pair with dmarceye-feature-matrix.html.
   Dialed-in styling: gradient DMARCeye header, black text,
   green check only. Adds: Roadmap badge, muted/cross states.
   Namespaced .deye-fm / #deye-fm-root.
   ============================================================ */

#deye-fm-root.deye-fm {
  --c-card:#fff; --c-ink:#1f2733; --c-muted:#9aa1ab; --c-line:#ececec;
  --c-accent:#ef4423; --c-own:#ece9fb; --c-own-soft:#f3f1fb; --c-green:#4a9d3f;
  --c-zebra:#fbfbfa; --radius:16px;
  box-sizing:border-box!important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif!important;
  color:var(--c-ink)!important; display:block!important; max-width:100%!important;
  -webkit-font-smoothing:antialiased;
}
#deye-fm-root.deye-fm *,
#deye-fm-root.deye-fm *::before,
#deye-fm-root.deye-fm *::after { box-sizing:border-box!important; }

#deye-fm-root .deye-fm__card.deye-fm__card {
  background:var(--c-card)!important; border-radius:var(--radius)!important;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06)!important;
  overflow:hidden!important; border:0!important; padding:0!important;
}

#deye-fm-root table.deye-fm__table.deye-fm__table {
  width:100%!important; border-collapse:collapse!important; border-spacing:0!important;
  text-align:left!important; margin:0!important; border:0!important; background:transparent!important;
  table-layout:fixed!important;
}
#deye-fm-root table.deye-fm__table tr { background:transparent!important; border:0!important; }
#deye-fm-root table.deye-fm__table caption { display:none!important; }

#deye-fm-root table.deye-fm__table th,
#deye-fm-root table.deye-fm__table td {
  padding:18px 30px!important; vertical-align:middle!important; border:0!important;
  border-bottom:1px solid var(--c-line)!important; background:transparent!important;
  font-size:16px!important; line-height:1.4!important; color:var(--c-ink)!important; text-align:left!important;
}
#deye-fm-root table.deye-fm__table tr:last-child td { border-bottom:0!important; }

#deye-fm-root table.deye-fm__table th.deye-fm__th--feat,
#deye-fm-root table.deye-fm__table td.deye-fm__feat { width:38%!important; }

#deye-fm-root table.deye-fm__table thead th.deye-fm__th {
  font-weight:700!important; letter-spacing:-.01em!important; font-size:18px!important;
  padding-top:24px!important; padding-bottom:24px!important;
  color:var(--c-ink)!important; background:transparent!important;
}

#deye-fm-root table.deye-fm__table td.deye-fm__feat { font-weight:700!important; color:var(--c-ink)!important; }

/* DMARCeye highlighted column: gradient header, soft body ------- */
#deye-fm-root table.deye-fm__table td.deye-fm__col-own { background:var(--c-own)!important; }
#deye-fm-root table.deye-fm__table thead th.deye-fm__col-own {
  background:
    radial-gradient(ellipse 70% 80% at 15% 40%, rgba(255,90,50,.35) 0%, rgba(220,70,40,.12) 40%, transparent 70%),
    radial-gradient(ellipse 75% 85% at 90% 70%, rgba(120,80,220,.45) 0%, rgba(90,60,180,.18) 40%, transparent 70%),
    linear-gradient(135deg, #1a0f2e 0%, #15102a 50%, #1f1438 100%) !important;
  color:#fff!important;
}

#deye-fm-root table.deye-fm__table td.deye-fm__val { color:var(--c-ink)!important; font-weight:400!important; }

/* states: green check + black text ------------------------------ */
#deye-fm-root .deye-fm__yes.deye-fm__yes { color:var(--c-ink)!important; font-weight:400!important; }
#deye-fm-root .deye-fm__yes.deye-fm__yes::before { content:"\2713\00a0"!important; color:var(--c-green)!important; }

/* warn (orange) ------------------------------------------------- */
#deye-fm-root .deye-fm__warn.deye-fm__warn { color:var(--c-accent)!important; font-weight:600!important; }

/* not available / not advertised (muted grey, no mark) ---------- */
#deye-fm-root .deye-fm__muted.deye-fm__muted { color:var(--c-muted)!important; font-weight:400!important; }

/* not supported (grey cross) ------------------------------------ */
#deye-fm-root .deye-fm__no.deye-fm__no { color:var(--c-muted)!important; font-weight:400!important; }
#deye-fm-root .deye-fm__no.deye-fm__no::before { content:"\2715\00a0"!important; color:var(--c-muted)!important; }

/* Roadmap badge (orange outline pill) --------------------------- */
#deye-fm-root .deye-fm__badge.deye-fm__badge {
  display:inline-block!important; padding:4px 12px!important; border-radius:6px!important;
  border:1px solid rgba(239,68,35,.35)!important; background:rgba(239,68,35,.06)!important;
  color:var(--c-accent)!important; font-size:14px!important; font-weight:600!important;
  font-style:italic!important; line-height:1.2!important;
}

/* zebra (own column keeps its tint) ----------------------------- */
#deye-fm-root table.deye-fm__table tbody tr:nth-child(even) td:not(.deye-fm__col-own) { background:var(--c-zebra)!important; }
#deye-fm-root table.deye-fm__table tbody tr:nth-child(even) td.deye-fm__col-own { background:var(--c-own-soft)!important; }

/* footnote ------------------------------------------------------ */
#deye-fm-root .deye-fm__note.deye-fm__note {
  margin:14px 4px 0!important; color:var(--c-muted)!important; font-size:13px!important; line-height:1.5!important;
}
#deye-fm-root .deye-fm__note strong { color:var(--c-ink)!important; }

/* ---------- MOBILE < 640px : stacked cards --------------------- */
@media (max-width:639px) {
  #deye-fm-root .deye-fm__card.deye-fm__card { background:transparent!important; box-shadow:none!important; overflow:visible!important; }
  #deye-fm-root table.deye-fm__table.deye-fm__table { display:block!important; table-layout:auto!important; }
  #deye-fm-root table.deye-fm__table thead { display:none!important; }
  #deye-fm-root table.deye-fm__table tbody { display:block!important; }
  #deye-fm-root table.deye-fm__table tr {
    display:block!important; background:var(--c-card)!important; border-radius:var(--radius)!important;
    box-shadow:0 1px 3px rgba(16,24,40,.06)!important; padding:6px 18px 10px!important; margin-bottom:16px!important;
  }
  #deye-fm-root table.deye-fm__table td {
    display:flex!important; justify-content:space-between!important; align-items:center!important;
    gap:16px!important; padding:13px 0!important; border-bottom:1px solid var(--c-line)!important;
    white-space:normal!important; text-align:right!important; width:auto!important;
  }
  #deye-fm-root table.deye-fm__table td:last-child { border-bottom:0!important; }
  #deye-fm-root table.deye-fm__table td::before {
    content:attr(data-label)!important; flex:0 0 40%!important; font-weight:600!important;
    color:#6b7280!important; font-size:13px!important; text-align:left!important;
  }
  #deye-fm-root table.deye-fm__table td.deye-fm__feat {
    display:block!important; font-size:17px!important; padding:14px 0 12px!important; width:auto!important;
    border-bottom:2px solid var(--c-line)!important; text-align:left!important;
  }
  #deye-fm-root table.deye-fm__table td.deye-fm__feat::before { content:none!important; }
  #deye-fm-root table.deye-fm__table tbody tr:nth-child(even) td.deye-fm__col-own,
  #deye-fm-root table.deye-fm__table td.deye-fm__col-own {
    background:var(--c-own)!important; margin:0 -18px!important; padding-left:18px!important; padding-right:18px!important;
  }
}