@charset "utf-8";

/* ==========================================================
   Ashby Job Board — Modern B2B SaaS (Logo-Matched) + Hierarchy
   VALIDATOR-SAFE VERSION (no pseudo-classes)

   Key fix:
   - Ashby does NOT allow :first-child / :not() / :nth-*
   - Hierarchy is achieved via sibling selectors only

   Upload this as your ONE custom CSS file in Ashby.
   ========================================================== */

:root{
  /* Logo palette */
  --logo-g1: #1E7F3F;
  --logo-g2: #1E6FA8;
  --logo-g3: #1D1B3E;

  /* UI palette */
  --ui-text: #0f172a;
  --ui-muted: #475569;
  --ui-faint: #64748b;

  --ui-border: rgba(15, 23, 42, .12);
  --ui-border-strong: rgba(15, 23, 42, .18);

  --ui-surface: rgba(255,255,255,.92);
  --ui-surface-2: rgba(255,255,255,.78);

  --ui-radius: 14px;
  --ui-radius-lg: 18px;

  --ui-shadow-sm: 0 10px 22px rgba(2, 6, 23, .06);
  --ui-shadow: 0 18px 44px rgba(2, 6, 23, .10);

  --ui-focus: 0 0 0 4px rgba(30, 111, 168, .18);
}

/* ---------- Page background ---------- */
html, body{
  color: var(--ui-text);
  background:
    radial-gradient(1000px 600px at 12% 0%, rgba(30, 127, 63, .12), transparent 62%),
    radial-gradient(980px 560px at 86% 6%, rgba(30, 111, 168, .12), transparent 60%),
    radial-gradient(900px 520px at 70% 0%, rgba(29, 27, 62, .10), transparent 58%),
    linear-gradient(180deg, #f7f9ff 0%, #ffffff 55%, #ffffff 100%) !important;
}

/* ---------- Links ---------- */
a{
  color: var(--logo-g2);
  text-underline-offset: 3px;
}
a:hover{
  color: var(--logo-g3);
}

/* ---------- Main heading ---------- */
.ashby-job-board-heading{
  color: var(--ui-text) !important;
  letter-spacing: -0.02em !important;
  line-height: 1.08 !important;
}
.ashby-job-board-heading-count{
  color: var(--ui-faint) !important;
  font-weight: 700 !important;
}

/* ==========================================================
   Department hierarchy (NO pseudo-classes)
   Strategy:
   - All heading levels get base style
   - Any heading level that follows another is treated as CHILD
   - First one remains visually dominant (parent)
   ========================================================== */

.ashby-department-heading{
  margin-top: 28px !important;
  margin-bottom: 10px !important;
  letter-spacing: -0.01em !important;
}

/* Base = PARENT style */
.ashby-department-heading-level{
  display: block !important;
  font-size: 1.35rem !important;
  font-weight: 850 !important;
  color: var(--ui-text) !important;
  margin-bottom: 2px !important;
}

/* Any subsequent level = CHILD */
.ashby-department-heading-level + .ashby-department-heading-level{
  font-size: 1.05rem !important;
  font-weight: 650 !important;
  color: var(--ui-muted) !important;
  margin-top: 2px !important;
}

/* ---------- Filters ---------- */
.ashby-job-board-filters-label{
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  color: var(--ui-muted) !important;
  font-weight: 800 !important;
  font-size: 0.95rem !important;
}

.ashby-job-board-reset-filters-label{
  background: rgba(15,23,42,.04) !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  border-radius: 999px !important;
  padding: 6px 10px !important;
  color: var(--ui-muted) !important;
  font-weight: 700 !important;
}
.ashby-job-board-reset-filters-label[disabled]{ opacity: .55 !important; }

select.ashby-job-board-filter{
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius) !important;
  color: var(--ui-text) !important;
  height: 46px !important;
  padding: 10px 12px !important;
  font-weight: 700 !important;
  box-shadow: var(--ui-shadow-sm) !important;

  appearance: none !important;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(15,23,42,.55) 50%),
    linear-gradient(135deg, rgba(15,23,42,.55) 50%, transparent 50%),
    linear-gradient(to right, transparent, transparent);
  background-position:
    calc(100% - 18px) calc(50% - 2px),
    calc(100% - 12px) calc(50% - 2px),
    100% 0;
  background-size: 6px 6px, 6px 6px, 2.5em 2.5em;
  background-repeat: no-repeat;
  padding-right: 44px !important;
}

select.ashby-job-board-filter:hover{
  box-shadow: 0 14px 30px rgba(2, 6, 23, .08) !important;
  border-color: var(--ui-border-strong) !important;
}

select.ashby-job-board-filter:focus{
  outline: none !important;
  border-color: rgba(30,111,168,.65) !important;
  box-shadow: var(--ui-focus) !important;
}

/* ---------- Job cards ---------- */
.ashby-job-posting-brief-list a{
  display: block !important;
  text-decoration: none !important;
}

.ashby-job-posting-brief{
  background: linear-gradient(180deg, var(--ui-surface), var(--ui-surface-2)) !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  border-radius: var(--ui-radius-lg) !important;
  box-shadow: var(--ui-shadow-sm) !important;
  padding: 16px 18px !important;
  margin: 10px 0 !important;
  position: relative !important;
  overflow: hidden !important;
}

.ashby-job-posting-brief::before{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  height: 3px !important;
  width: 100% !important;
  background: linear-gradient(90deg, var(--logo-g1), var(--logo-g2), var(--logo-g3)) !important;
  opacity: .75 !important;
}

.ashby-job-posting-brief:hover{
  box-shadow: var(--ui-shadow) !important;
  border-color: rgba(15,23,42,.16) !important;
}

.ashby-job-posting-brief-title{
  color: var(--ui-text) !important;
  font-weight: 850 !important;
}

.ashby-job-posting-brief-details p{
  color: var(--ui-muted) !important;
  margin: 0 !important;
}

/* ---------- Accessibility ---------- */
.ashby-job-posting-brief-list a:focus{
  outline: none !important;
}
.ashby-job-posting-brief-list a:focus .ashby-job-posting-brief{
  box-shadow: 0 0 0 4px rgba(30,111,168,.16), var(--ui-shadow) !important;
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  .ashby-job-posting-brief,
  select.ashby-job-board-filter{
    transition: none !important;
  }
}
