:root {
  --ambient-teal: #005a68;
  --ambient-turquoise: #0bb29e;
  --ambient-gold: #ffbf31;
  --ambient-seafoam: #b5f7f4;
  --ambient-blue: #268edb;
  --ambient-charcoal: #2f2f30;
  --ambient-ivory: #f2f1ef;

  --ambient-red: #e53935;
  --ambient-green: #059669;
  --ambient-slate: #334155;
  --ambient-slate-soft: #e2e8f0;
  --ambient-blue-soft: #dbeafe;
  --ambient-gold-soft: #fef3c7;
}

html,
body {
  background: var(--ambient-ivory) !important;
  color: var(--ambient-charcoal) !important;
  font-family:
    "Open Sans",
    "Inter",
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    sans-serif !important;
  font-size: 14px !important;
  line-height: 1.5;
}

h1,
.h1 {
  color: var(--ambient-charcoal) !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em;
}
h2,
.h2,
h3,
.h3,
h4,
.h4 {
  color: var(--ambient-teal) !important;
}

.novo-header.condensed {
  background: #fff !important;
  border-bottom: 1px solid var(--ambient-slate-soft) !important;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03);
}
.novo-header .header-title {
  align-items: center;
  gap: 0.5rem;
}
.novo-header .header-icon {
  color: var(--ambient-turquoise) !important;
  font-size: 18px !important;
}
.novo-header .header-titles h1 {
  color: var(--ambient-charcoal) !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  margin: 0 !important;
  /* Hiding the company name since the logo is already displayed but we still want the browser tab to show the company name */
  display: none !important;
}

app-sidebar {
  background: #fff !important;
  border-right: 1px solid var(--ambient-slate-soft) !important;
}
app-sidebar .header {
  padding: 1rem !important;
  border-bottom: 1px solid var(--ambient-slate-soft) !important;
  background: var(--ambient-ivory) !important;
}
app-sidebar .filters {
  padding: 0.75rem 1rem 1rem !important;
  font-size: 0.8125rem !important;
  line-height: 1.35 !important;
}
app-sidebar .filter-header span {
  color: var(--ambient-teal) !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
}

app-sidebar novo-check-list label,
app-sidebar .checklist,
app-sidebar .novo-control-input {
  color: var(--ambient-slate) !important;
  font-size: 0.8125rem !important;
}

app-sidebar novo-check-list label {
  line-height: 1.25 !important;
}

app-sidebar button[theme="icon"] {
  border-radius: 999px !important;
}

app-sidebar button[theme="icon"] {
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 !important;
}

app-sidebar button[theme="icon"] i {
  font-size: 0.72rem !important;
}

novo-list-item,
.job,
[class*="jobCard"],
[class*="listing"] {
  background: #fff !important;
  border-radius: 14px !important;
}
.job-card {
  background: #fff !important;
  border: 1px solid var(--ambient-slate-soft) !important;
  border-radius: 14px !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}
a {
  color: var(--ambient-teal) !important;
}
a:hover {
  color: var(--ambient-blue) !important;
}

button,
[type="button"],
[type="submit"],
.novo-button button {
  border-radius: 999px !important;
  font-weight: 600 !important;
}
button[color="positive"],
.novo-button[color="positive"] button {
  background: var(--ambient-gold) !important;
  border-color: var(--ambient-gold) !important;
  color: var(--ambient-charcoal) !important;
}
button[color="positive"]:hover,
.novo-button[color="positive"] button:hover {
  filter: brightness(0.96);
}

app-sidebar .credits {
  border-top: 1px solid var(--ambient-slate-soft) !important;
  background: #fff !important;
}
app-sidebar .credits .powered-by {
  color: #64748b !important;
}

.novo-header .header-icon {
  display: none !important;
}
.novo-header .header-title::before {
  content: "";
  width: 120px;
  height: 90px;
  margin-left: 0.5rem;
  display: inline-block;
  background: url("/assets/ambient-recruiting-logo-full.png") center / contain
    no-repeat;
}