/* BusinessMarketing.Pro — tool-specific styles. Brand tokens live in base.html. */

.result-box {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
  font-size: .9rem;
  word-break: break-all;
  background: #f4f7fa;
  border: 1px dashed rgba(20, 24, 31, 0.18);
  border-radius: 10px;
  padding: .9rem 1rem;
  color: #5b6675;
  min-height: 3.2rem;
}
.result-box.ready { color: var(--brand); border-style: solid; border-color: rgba(22, 199, 132, 0.5); background: #f0fbf6; }

/* Multiline code output (meta tags, robots.txt, JSON-LD) */
.code-out {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
  font-size: .82rem;
  line-height: 1.5;
  white-space: pre-wrap;
  word-break: normal;
  overflow-wrap: anywhere;
  background: #0f1c2e;
  color: #cfe3d8;
  border: 1px solid rgba(22, 199, 132, 0.25);
  border-radius: 10px;
  padding: 1rem 1.1rem;
  margin: 0;
  max-height: 420px;
  overflow: auto;
}
.code-out.ready { color: #e6f3ec; border-color: rgba(22, 199, 132, 0.55); }

/* Calculator metric tiles */
.metric { padding: .85rem .5rem; border-radius: 12px; background: #f4f7fa; height: 100%; }
.metric-hero { background: #eef4fb; }
.metric-num { font-family: var(--font-display); font-size: 1.6rem; font-weight: 700; line-height: 1.1; }
.metric-label { font-size: .72rem; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-soft); margin-top: .15rem; }

/* Google SERP snippet preview */
.serp-preview {
  background: #fff;
  border: 1px solid var(--hairline);
  border-radius: 12px;
  padding: 1.25rem 1.4rem;
  font-family: Arial, sans-serif;
  max-width: 600px;
}
.serp-preview.serp-mobile { max-width: 412px; box-shadow: 0 1px 6px rgba(32,33,36,0.18); }
.serp-url { color: #202124; font-size: .82rem; line-height: 1.3; margin-bottom: .15rem; }
.serp-title { color: #1a0dab; font-size: 1.25rem; line-height: 1.3; margin-bottom: .25rem; }
.serp-mobile .serp-title { font-size: 1.1rem; }
.serp-desc { color: #4d5156; font-size: .875rem; line-height: 1.45; }