/*
 * Pensar theme (Workable deployment) — full dark reskin, ported from the
 * retired pensar-job-postings repo.
 *
 * Use it:
 *   NEXT_PUBLIC_THEME_CSS=/themes/pensar.css
 *   ATS_PROVIDER=workable
 *   WORKABLE_ACCOUNT=pensar
 * plus the brand env preset (see .env.example).
 *
 * Palette sampled from pensarai.com (near-black, terminal-green accent). Face
 * is Geist, loaded via next/font in the root layout and exposed as
 * --font-geist. Loaded after app/globals.css and any NEXT_PUBLIC_BRAND_*
 * overrides, so these win.
 *
 * The shared chrome is built light (white cards, slate text), so beyond the
 * --brand-* tokens this file re-maps the specific Tailwind utilities the
 * candidate-facing pages use. That works because Tailwind v4 emits utilities
 * inside @layer while these rules are un-layered, so they take precedence.
 * Every re-map is scoped :not(.pg-admin *) to keep the Polyguard-branded
 * /admin console (its own dark theme) untouched. If chrome components adopt
 * new slate/white utilities, extend the map here.
 */

:root {
  /* Pensar palette */
  --pensar-bg: #0b0b0c; /* page background, near-black */
  --pensar-surface: #151517; /* cards / inputs */
  --pensar-surface-2: #1d1d20; /* raised surface / hover */
  --pensar-border: #2a2a2d; /* hairline borders */
  --pensar-fg: #e8e8e6; /* primary text */
  --pensar-muted: #9a9a94; /* secondary text */
  --pensar-faint: #6a6a64; /* faint labels */
  --pensar-accent: #22c55e; /* signature green */
  --pensar-accent-bright: #4ade80; /* hover / emphasis */
  --pensar-accent-dark: #16a34a;

  /* Brand tokens consumed by the shared chrome */
  --brand-navy: var(--pensar-bg); /* header / hero surfaces */
  --brand-blue: var(--pensar-accent-bright); /* links / labels / focus */
  --brand-mist: var(--pensar-surface);
  --brand-ink: var(--pensar-fg); /* body text */
  --brand-font: var(--font-geist), 'Geist', ui-sans-serif, system-ui, -apple-system,
    'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

html,
body {
  background: var(--pensar-bg);
}

/* ------------------------------------------------- job-description prose */

.gh-content {
  color: #c9c9c4;
}
.gh-content h1,
.gh-content h2,
.gh-content h3,
.gh-content h4 {
  color: var(--pensar-fg); /* globals.css paints these --brand-navy (= bg here) */
}
.gh-content a {
  color: var(--pensar-accent-bright);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ------------------------------------------- brand-token utility re-maps */

/* Primary CTA ("Submit with Polyguard" and demo buttons): green with black
   text, like pensarai.com. Non-button uses of the same utility (header, hero
   sections) stay on --brand-navy. */
button.bg-\[var\(--brand-navy\)\]:not(.pg-admin *) {
  background-color: var(--pensar-accent);
  color: #0b0b0c;
}
button.bg-\[var\(--brand-navy\)\]:hover:not(:disabled):not(.pg-admin *) {
  background-color: var(--pensar-accent-bright);
}
/* Spinner + checked radios keyed to the primary brand color. */
.text-\[var\(--brand-navy\)\]:not(.pg-admin *) {
  color: var(--pensar-accent);
}
/* Solid accent fills (selected facet pill, list bullets): a deeper green so
   the pill's white text stays readable. */
.bg-\[var\(--brand-blue\)\]:not(.pg-admin *) {
  background-color: var(--pensar-accent-dark);
}

/* ------------------------------------------------ surface / text re-maps */

.bg-white:not(.pg-admin *) {
  background-color: var(--pensar-surface);
}
.bg-slate-50:not(.pg-admin *) {
  background-color: #101012;
}
.hover\:bg-slate-50:hover:not(.pg-admin *) {
  background-color: var(--pensar-surface-2);
}
.hover\:bg-slate-100:hover:not(.pg-admin *) {
  background-color: var(--pensar-surface-2);
}
.bg-slate-900:not(.pg-admin *) {
  background-color: #000000; /* demo-payload <pre> */
}
.file\:bg-slate-100:not(.pg-admin *)::file-selector-button {
  background-color: var(--pensar-surface-2);
}
.hover\:file\:bg-slate-200:hover:not(.pg-admin *)::file-selector-button {
  background-color: var(--pensar-border);
}
.file\:text-slate-700:not(.pg-admin *)::file-selector-button {
  color: var(--pensar-fg);
}

.text-slate-900:not(.pg-admin *),
.text-slate-800:not(.pg-admin *),
.text-slate-100:not(.pg-admin *) {
  color: var(--pensar-fg);
}
.text-slate-700:not(.pg-admin *) {
  color: #c9c9c4;
}
.text-slate-600:not(.pg-admin *),
.text-slate-500:not(.pg-admin *),
.text-slate-300:not(.pg-admin *) {
  color: var(--pensar-muted);
}
.text-slate-400:not(.pg-admin *) {
  color: var(--pensar-faint);
}
.hover\:text-slate-900:hover:not(.pg-admin *),
.hover\:text-slate-700:hover:not(.pg-admin *) {
  color: var(--pensar-fg);
}
.placeholder\:text-slate-400:not(.pg-admin *)::placeholder {
  color: var(--pensar-faint);
}

/* ------------------------------------------------ border / focus re-maps */

.border-slate-100:not(.pg-admin *),
.border-slate-200:not(.pg-admin *) {
  border-color: var(--pensar-border);
}
.border-slate-300:not(.pg-admin *) {
  border-color: #34343a;
}
.divide-slate-200:not(.pg-admin *) > * {
  border-color: var(--pensar-border);
}
.focus\:border-slate-500:focus:not(.pg-admin *) {
  border-color: var(--pensar-accent);
}
.focus\:ring-slate-500:focus:not(.pg-admin *) {
  --tw-ring-color: rgb(34 197 94 / 0.5);
}

/* -------------------------------------- emerald / amber tints, dark forms */

.bg-emerald-50:not(.pg-admin *) {
  background-color: rgb(34 197 94 / 0.1);
}
.bg-emerald-100:not(.pg-admin *) {
  background-color: rgb(34 197 94 / 0.15);
}
.border-emerald-200:not(.pg-admin *),
.border-emerald-300:not(.pg-admin *) {
  border-color: rgb(34 197 94 / 0.35);
}
.text-emerald-900:not(.pg-admin *),
.text-emerald-800:not(.pg-admin *),
.text-emerald-700:not(.pg-admin *) {
  color: var(--pensar-accent-bright);
}
.text-emerald-600:not(.pg-admin *) {
  color: var(--pensar-accent);
}

.bg-amber-50:not(.pg-admin *) {
  background-color: rgb(245 158 11 / 0.1);
}
.border-amber-300:not(.pg-admin *) {
  border-color: rgb(245 158 11 / 0.4);
}
.text-amber-900:not(.pg-admin *) {
  color: #fcd34d;
}