/* ===========================================================
   EIN TOOLS PUBLIC 8 - FINAL POLISH V8
   Only loaded by the rebuilt 8 tools.
   =========================================================== */

body[data-ein-public="1"][data-ein-tool]{
  --v8-bg:#f4f9f5;
  --v8-card:#ffffff;
  --v8-soft:#eaf4ed;
  --v8-soft2:#f7fbf8;
  --v8-green:#357b50;
  --v8-green-dark:#edf6ef;
  --v8-text:#293f31;
  --v8-muted:#64776a;
  --v8-line:#d3e3d7;

  background:#f4f9f5 !important;
  background-image:none !important;

  color:#293f31 !important;

  font-size:17px !important;
  line-height:1.7 !important;
}


/* ----- outer shell ----- */

body[data-ein-public="1"][data-ein-tool]
:where(
  main,
  .wrap,
  .container,
  .shell,
  .page,
  .frame,
  .stage,
  .workspace,
  .workbench,
  .diagnostic-shell,
  .utility-shell
){
  background:#f4f9f5 !important;
  background-image:none !important;

  color:#293f31 !important;

  box-shadow:none !important;
}


/* Remove the old dark side-wall look */

body[data-ein-public="1"][data-ein-tool]
:where(
  [class*="rail"],
  [class*="side-rail"],
  [class*="sidewall"],
  [class*="side-wall"],
  [class*="grid-bg"],
  [class*="grid-overlay"],
  [class*="scanline"]
){
  background:#eef6f0 !important;
  background-image:none !important;

  border-color:#d3e3d7 !important;

  box-shadow:none !important;
}


/* ----- general card language ----- */

body[data-ein-public="1"][data-ein-tool]
:where(
  section,
  article,
  .hero,
  .panel,
  .console,
  .card,
  .module,
  .tile,
  .box,
  .result-summary,
  .diagnostic-panel,
  .notice-card,
  .explain-card,
  [class*="-card"],
  [class*="-panel"],
  [class*="-module"]
){
  background:#ffffff !important;
  background-image:none !important;

  color:#293f31 !important;

  border:1px solid #d3e3d7 !important;
  border-radius:18px !important;

  box-shadow:
    none;
}


/* Hero */

body[data-ein-public="1"][data-ein-tool] .hero{
  background:#e5f1e8 !important;

  border:1px solid #c6dccb !important;
  border-left:6px solid #59936a !important;

  border-radius:20px !important;

  padding:30px 34px !important;
}


/* ----- typography ----- */

body[data-ein-public="1"][data-ein-tool] h1{
  color:#245b38 !important;

  font-size:
    clamp(34px,3.2vw,44px) !important;

  line-height:1.18 !important;

  letter-spacing:.01em !important;

  text-shadow:none !important;
}

body[data-ein-public="1"][data-ein-tool] h2{
  color:#285f3c !important;

  font-size:27px !important;
  line-height:1.35 !important;
}

body[data-ein-public="1"][data-ein-tool] h3{
  color:#306b45 !important;

  font-size:21px !important;
}

body[data-ein-public="1"][data-ein-tool]
:where(p,li){
  color:#3e5546 !important;

  font-size:17px !important;
  line-height:1.8 !important;
}

body[data-ein-public="1"][data-ein-tool]
:where(
  label,
  small,
  .note,
  .hint,
  .caption,
  .legend,
  [class*="label"],
  [class*="caption"],
  [class*="legend"],
  [class*="hint"]
){
  color:#617568 !important;

  font-size:14px !important;
  line-height:1.55 !important;

  text-shadow:none !important;
}


/* No 7-9px readable UI */

body[data-ein-public="1"][data-ein-tool]
:where(
  [class*="event"],
  [class*="phase"],
  [class*="state"],
  [class*="status"],
  [class*="step"]
){
  font-size:14px !important;
  line-height:1.5 !important;
}


/* ----- inputs ----- */

body[data-ein-public="1"][data-ein-tool]
:where(input,textarea,select){
  min-height:52px !important;

  background:#ffffff !important;

  color:#263e30 !important;

  font-size:16px !important;

  border:1px solid #bcd3c2 !important;
  border-radius:12px !important;

  box-shadow:none !important;
}

body[data-ein-public="1"][data-ein-tool]
textarea{
  padding:14px 16px !important;
}


/* ----- buttons ----- */

body[data-ein-public="1"][data-ein-tool]
:where(
  button,
  input[type="button"],
  input[type="submit"],
  .button,
  .btn,
  [class*="button"],
  [class*="-btn"]
){
  min-height:50px !important;

  padding:12px 20px !important;

  background:#357b50 !important;
  background-image:none !important;

  color:#31543e !important;

  font-size:16px !important;
  font-weight:700 !important;

  border:1px solid #357b50 !important;
  border-radius:12px !important;

  box-shadow:none !important;
}


/* ----- status and detail blocks ----- */

body[data-ein-public="1"][data-ein-tool]
:where(
  [class*="state"],
  [class*="status"],
  [class*="phase"],
  [class*="metric"],
  [class*="summary"],
  [class*="result-box"],
  [class*="field"]
){
  background:#f7fbf8 !important;
  background-image:none !important;

  color:#34513f !important;

  border-color:#d9e7dc !important;
  border-radius:12px !important;

  box-shadow:none !important;
}


/* Old black strips */

body[data-ein-public="1"][data-ein-tool]
:where(
  [class*="strip"],
  [class*="bar"],
  [class*="hazard"],
  [class*="chassis"],
  [class*="footer-bar"],
  [class*="control-deck"],
  [class*="control-bar"]
){
  background:#e5f1e8 !important;
  background-image:none !important;

  color:#365f45 !important;

  border-color:#c7ddcc !important;
  border-radius:10px !important;

  box-shadow:none !important;
}


/* ----- meters / gauges ----- */

body[data-ein-public="1"][data-ein-tool]
:where(
  [class*="meter"],
  [class*="gauge"],
  [class*="dial"],
  [class*="radar"],
  [class*="score-ring"],
  [class*="score-dial"]
){
  --bg:#edf6ef !important;
  --panel:#ffffff !important;
  --dark:#edf6ef !important;
  --black:#ffffff !important;
  --accent:#4f8f65 !important;
  --cyan:#4f8f65 !important;

  background:#edf6ef !important;
  background-image:none !important;

  color:#315c41 !important;

  border-color:#bfd7c5 !important;

  box-shadow:none !important;
}

body[data-ein-public="1"][data-ein-tool]
:where(
  [class*="meter"],
  [class*="gauge"],
  [class*="dial"],
  [class*="radar"],
  [class*="score-ring"],
  [class*="score-dial"]
)::before,

body[data-ein-public="1"][data-ein-tool]
:where(
  [class*="meter"],
  [class*="gauge"],
  [class*="dial"],
  [class*="radar"],
  [class*="score-ring"],
  [class*="score-dial"]
)::after{
  background:#e8f3ea !important;
  background-image:none !important;

  border-color:#83aa8e !important;

  box-shadow:none !important;
}


/* SVG meter components */

body[data-ein-public="1"][data-ein-tool]
svg{
  background:transparent !important;
}

body[data-ein-public="1"][data-ein-tool]
svg text{
  fill:#ffffff !important;
}

body[data-ein-public="1"][data-ein-tool]
svg [fill="black" i]{
  fill:#edf6ef !important;
}

body[data-ein-public="1"][data-ein-tool]
svg [stroke="black" i]{
  stroke:#568e68 !important;
}


/* Canvas surround */

body[data-ein-public="1"][data-ein-tool]
canvas{
  background:#edf6ef !important;

  border:1px solid #cfdfd2 !important;
  border-radius:16px !important;

  box-shadow:none !important;
}


/* ----- primary result ----- */

body[data-ein-public="1"][data-ein-tool]
:where(
  .primary,
  .primary-result,
  [class*="primary-result"]
){
  background:#eaf4ed !important;

  color:#285e3c !important;

  border-color:#c7ddcc !important;
  border-radius:16px !important;
}

body[data-ein-public="1"][data-ein-tool]
:where(
  .primary-value,
  [class*="primary-value"],
  [class*="result-value"]
){
  color:#2f7653 !important;

  font-size:36px !important;
  font-weight:700 !important;
}


/* Empty logs should not create giant dead areas */

body[data-ein-public="1"][data-ein-tool]
:where(
  .event-log,
  .live-event-log,
  [class*="event-log"]
):empty{
  display:none !important;
}


/* ----- tables ----- */

body[data-ein-public="1"][data-ein-tool]
:where(table,th,td){
  background:#ffffff !important;

  color:#334d3a !important;

  border-color:#d3e3d7 !important;
}

body[data-ein-public="1"][data-ein-tool] th{
  background:#eaf4ed !important;
}


/* ----- footer ----- */

body[data-ein-public="1"][data-ein-tool] footer,
body[data-ein-public="1"][data-ein-tool]
[class*="footer"]{
  background:#e5f1e8 !important;
  background-image:none !important;

  color:#617568 !important;

  border-color:#cbded0 !important;

  box-shadow:none !important;
}


/* -----------------------------------------------------------
   Tool-specific cleanup
   ----------------------------------------------------------- */

/* Site 360 */

body[data-ein-tool="site-360"]
:where(
  [class*="control-deck"],
  [class*="status-board"],
  [class*="signal"]
){
  background:#f2f8f3 !important;
  color:#34543f !important;
}


/* Domain */

body[data-ein-tool="domain"]
:where(
  [class*="dns"],
  [class*="https"],
  [class*="tls"],
  [class*="registry"]
){
  border-radius:12px !important;
}


/* DNS */

body[data-ein-tool="dns"]
:where(
  [class*="resolver"],
  [class*="record"]
){
  border-radius:12px !important;
}


/* SSL */

body[data-ein-tool="ssl"]
:where(
  [class*="assessment"],
  [class*="certificate"]
){
  background:#f3f9f4 !important;

  color:#315741 !important;

  border-radius:14px !important;
}


/* TTFB */

body[data-ein-tool="ttfb-meter"]
:where(
  [class*="meter"],
  [class*="dial"],
  [class*="gauge"]
){
  background:#e8f3ea !important;
}


/* Security + SEO */

body[data-ein-tool="security-header-score"]
:where(
  [class*="score"],
  [class*="instrument"]
),

body[data-ein-tool="seo-metadata-score"]
:where(
  [class*="score"],
  [class*="instrument"]
){
  background:#eef6f0 !important;
  color:#315b41 !important;
}


/* JSON */

body[data-ein-tool="json-formatter"]
:where(
  pre,
  code,
  [class*="output"],
  [class*="structure"]
){
  background:#ffffff !important;

  color:#294936 !important;

  border-color:#d3e3d7 !important;
  border-radius:12px !important;
}


/* mobile */

@media(max-width:700px){

  body[data-ein-public="1"][data-ein-tool]{
    font-size:16px !important;
  }

  body[data-ein-public="1"][data-ein-tool] h1{
    font-size:31px !important;
  }

  body[data-ein-public="1"][data-ein-tool]
  :where(p,li){
    font-size:16px !important;
  }
}


/* ==========================================================
   EIN TOOLS PUBLIC V8.1
   FINAL METER / BUTTON / SITE360 DETAIL CORRECTION
   ========================================================== */


/* ----------------------------------------------------------
   BUTTONS
   Green + WHITE. No yellow text.
   ---------------------------------------------------------- */

body[data-ein-public="1"][data-ein-tool]
:where(
  button,
  button *,
  .button,
  .button *,
  .btn,
  .btn *,
  [class*="button"],
  [class*="button"] *,
  [class*="-btn"],
  [class*="-btn"] *
){
  color:#31543e !important;
  text-shadow:none !important;
}


/* ----------------------------------------------------------
   REMOVE BLACK INSTRUMENT LANGUAGE
   ---------------------------------------------------------- */

body[data-ein-public="1"][data-ein-tool]
:where(
  [class*="instrument"],
  [class*="meter"],
  [class*="gauge"],
  [class*="dial"],
  [class*="radar"],
  [class*="deck"],
  [class*="score"]
){
  --black:#ffffff !important;
  --dark:#edf6ef !important;
  --bg:#edf6ef !important;
  --panel:#ffffff !important;
  --panel2:#f6faf7 !important;
  --meter-bg:#edf6ef !important;
  --meter-panel:#ffffff !important;
  --cyan:#4f8f65 !important;

  background-color:#edf6ef !important;
  background-image:none !important;

  color:#2d533b !important;

  border-color:#c9ddce !important;

  box-shadow:none !important;
}


/* inner meter cards */

body[data-ein-public="1"][data-ein-tool]
:where(
  [class*="instrument"],
  [class*="meter"],
  [class*="deck"],
  [class*="score"]
)
:where(
  [class*="card"],
  [class*="cell"],
  [class*="metric"],
  [class*="channel"],
  [class*="tile"],
  [class*="value-box"],
  [class*="status-box"],
  [class*="signal"]
){
  background:#ffffff !important;
  background-image:none !important;

  color:#28503a !important;

  border:1px solid #d3e3d7 !important;
  border-radius:13px !important;

  box-shadow:none !important;
}


/* SVG meter surfaces */

body[data-ein-public="1"][data-ein-tool]
svg :where(
  circle,
  rect
)[fill^="#0" i],

body[data-ein-public="1"][data-ein-tool]
svg :where(
  circle,
  rect
)[fill^="#1" i],

body[data-ein-public="1"][data-ein-tool]
svg :where(
  circle,
  rect
)[fill="black" i]{
  fill:#edf6ef !important;
}


body[data-ein-public="1"][data-ein-tool]
svg :where(
  path,
  line,
  polyline,
  circle
)[stroke^="#0" i],

body[data-ein-public="1"][data-ein-tool]
svg :where(
  path,
  line,
  polyline,
  circle
)[stroke^="#1" i],

body[data-ein-public="1"][data-ein-tool]
svg :where(
  path,
  line,
  polyline,
  circle
)[stroke="black" i]{
  stroke:#568e68 !important;
}


/* ----------------------------------------------------------
   SITE 360 — HERO
   Remove mystery vertical divider.
   ---------------------------------------------------------- */

body[data-ein-tool="site-360"] .hero::before,
body[data-ein-tool="site-360"] .hero::after{
  display:none !important;
  content:none !important;
}

body[data-ein-tool="site-360"] .hero > *{
  border-left:0 !important;
  border-right:0 !important;
}

body[data-ein-tool="site-360"]
:where(
  [class*="hero-side"],
  [class*="hero-visual"],
  [class*="hero-art"],
  [class*="divider"]
){
  border:0 !important;
  background:none !important;
}


/* ----------------------------------------------------------
   SITE 360 — CONTROL DECK
   ---------------------------------------------------------- */

body[data-ein-tool="site-360"]
:where(
  [class*="control-deck"],
  [class*="status-board"],
  [class*="semantic-instrument"],
  [class*="instrument-panel"]
){
  background:#f4f9f5 !important;
  background-image:none !important;

  border-color:#cfe1d3 !important;
  border-radius:16px !important;
}


/* deck title/header */

body[data-ein-tool="site-360"]
:where(
  [class*="control-deck"],
  [class*="instrument"]
)
:where(
  header,
  [class*="head"],
  [class*="title-bar"]
){
  background:#dfeee3 !important;
  background-image:none !important;

  color:#285e3d !important;

  border-color:#c4dac9 !important;

  text-shadow:none !important;
}


/* The five black measurement boxes */

body[data-ein-tool="site-360"]
:where(
  [class*="control-deck"],
  [class*="semantic-instrument"],
  [class*="instrument"]
)
:where(
  [class*="metric"],
  [class*="cell"],
  [class*="channel"],
  [class*="status"],
  [class*="signal"],
  [class*="item"]
){
  background:#ffffff !important;
  background-image:none !important;

  color:#294d38 !important;

  border:1px solid #d5e4d8 !important;
  border-radius:12px !important;

  box-shadow:none !important;
}


/* ----------------------------------------------------------
   SITE 360 — RELATED MEASUREMENTS
   Make the detailed results readable.
   ---------------------------------------------------------- */

body[data-ein-tool="site-360"]
:where(
  [class*="related"],
  [class*="detail"],
  table
){
  font-size:16px !important;
  line-height:1.55 !important;
}


body[data-ein-tool="site-360"]
:where(
  [class*="related"],
  [class*="detail"]
)
:where(
  h2,
  h3,
  header,
  [class*="head"],
  [class*="title"]
){
  color:#285e3d !important;

  font-size:18px !important;
  font-weight:700 !important;

  letter-spacing:0 !important;

  padding:14px 16px !important;

  background:#e7f2e9 !important;
}


body[data-ein-tool="site-360"] table{
  width:100% !important;

  background:#ffffff !important;

  border:1px solid #d3e3d7 !important;
  border-radius:14px !important;

  border-collapse:separate !important;
  border-spacing:0 !important;

  overflow:hidden !important;
}


body[data-ein-tool="site-360"]
table :where(th,td){
  padding:13px 16px !important;

  font-size:15px !important;
  line-height:1.5 !important;

  color:#344f3d !important;

  border-bottom:
    1px solid #dce8df !important;
}


body[data-ein-tool="site-360"]
table tr:nth-child(even)
:where(th,td){
  background:#f5faf6 !important;
}


body[data-ein-tool="site-360"]
table :where(th,td):first-child{
  font-weight:600 !important;
  color:#496a55 !important;
}


body[data-ein-tool="site-360"]
table :where(th,td):last-child{
  color:#285e3d !important;
  font-weight:600 !important;
}


/* fallback for non-table Related Measurements rows */

body[data-ein-tool="site-360"]
:where(
  [class*="related"],
  [class*="detail"]
)
:where(
  [class*="row"],
  [class*="item"]
){
  min-height:46px !important;

  padding:11px 14px !important;

  background:#ffffff !important;

  color:#344f3d !important;

  font-size:15px !important;

  border-bottom:
    1px solid #dce8df !important;
}


/* ----------------------------------------------------------
   TTFB
   Same public treatment.
   ---------------------------------------------------------- */

body[data-ein-tool="ttfb-meter"]
:where(
  [class*="meter"],
  [class*="gauge"],
  [class*="dial"],
  [class*="instrument"],
  [class*="semantic"]
){
  background:#edf6ef !important;
  background-image:none !important;

  color:#294f39 !important;

  border-color:#c9ddce !important;

  box-shadow:none !important;
}


body[data-ein-tool="ttfb-meter"]
:where(
  [class*="meter"],
  [class*="gauge"],
  [class*="dial"],
  [class*="instrument"]
)
:where(
  [class*="value"],
  [class*="metric"],
  [class*="cell"],
  [class*="state"],
  [class*="status"],
  [class*="card"],
  [class*="box"]
){
  background:#ffffff !important;
  background-image:none !important;

  color:#28513a !important;

  border:1px solid #d3e3d7 !important;
  border-radius:12px !important;

  box-shadow:none !important;
}


body[data-ein-tool="ttfb-meter"]
:where(
  [class*="meter"],
  [class*="dial"],
  [class*="gauge"]
)::before,

body[data-ein-tool="ttfb-meter"]
:where(
  [class*="meter"],
  [class*="dial"],
  [class*="gauge"]
)::after{
  background:#e5f1e8 !important;
  background-image:none !important;

  border-color:#83aa8e !important;

  box-shadow:none !important;
}


/* bigger TTFB helper labels */

body[data-ein-tool="ttfb-meter"]
:where(
  [class*="label"],
  [class*="legend"],
  [class*="state"],
  [class*="status"],
  [class*="phase"],
  small
){
  font-size:14px !important;
  line-height:1.5 !important;

  color:#58705f !important;
}


/* absolutely no yellow action text */

body[data-ein-tool="site-360"] button,
body[data-ein-tool="site-360"] button *,
body[data-ein-tool="ttfb-meter"] button,
body[data-ein-tool="ttfb-meter"] button *{
  color:#31543e !important;
}