/* Central theme for app.plugin.earth.
   Matches business.plugin.earth: white, black, #00B33E, and the
   green-500 → green-600 CTA gradient.
   Keep in sync with opencode deploy/local/theme.ts. */
:root {
  color-scheme: light;
  --font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --white: #ffffff;
  --black: #242424;
  --ink: #242424;
  --text: #333333;
  --muted: #7c7c7c;
  --green: #00b33e;
  --green-500: #22c55e;
  --green-600: #16a34a;
  --green-soft: #eaf3e5;
  --bg: #f6f6f6;
  --panel: #ffffff;
  --line: #e5e5e5;
  --chip: #f3f6f4;
  --hover: #eaf3e5;
  --accent: #00b33e;
  --header: #ffffff;
  --cta: linear-gradient(to right, #22c55e 0%, #16a34a 100%);
  --cta-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --danger: #b42318;
  --mark: #333333;
}

html,
body {
  font-family: var(--font-sans);
}

/* Trademark wordmark. Change font-size on the parent; colors live here. */
.mark {
  color: var(--mark);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1;
}

.mark .in {
  color: var(--green);
}

[data-color-scheme="dark"] {
  --mark: #ffffff;
}

a {
  color: var(--green);
}

.cta,
a.button,
button.primary {
  background-image: var(--cta);
  background-color: var(--green-600);
  color: var(--white);
  border: 0;
  border-radius: 999px;
  box-shadow: var(--cta-shadow);
}

.cta:hover,
a.button:hover,
button.primary:hover {
  opacity: 0.9;
}