/* ==========================================================================
   Sekai Ashby Job Board Theme
   Validator-safe dark theme using Ashby-supported variables/classes only.
   Goal: deep brand background, readable text, consistent modules.
   ========================================================================== */

:root {
  /* Layout */
  --widthMaxJobBoard: 920px;
  --borderRadiusContainer: 14px;
  --borderRadiusControl: 10px;
  --borderRadiusButton: 10px;

  /* Typography */
  --fontFamily: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --fontWeightNormal: 430;
  --fontWeightLightBold: 560;
  --fontWeightMediumBold: 650;
  --fontWeightHeavyBold: 760;

  --fontSizeSmall: 14px;
  --fontSizeNormal: 17px;
  --fontSizeLarge: 19px;
  --fontSizeXlarge: 22px;
  --fontSizeXxlarge: 26px;
  --fontSizeXxxlarge: 32px;
  --fontSizeXxxxlarge: 40px;

  /* Sekai palette */
  --sekai-bg: #101528;
  --sekai-bg-2: #141B33;
  --sekai-surface: #19213A;
  --sekai-surface-2: #202A46;
  --sekai-border: #354263;

  --sekai-text: #F7FAFF;
  --sekai-text-soft: #DDE6FF;
  --sekai-text-muted: #AEBBDB;

  --sekai-cyan: #40E8F1;
  --sekai-purple: #5B3DFF;
  --sekai-purple-dark: #251CCE;

  /* Ashby neutral tokens.
     These are the key fix: the inner white job-detail surface usually comes from Neutral000. */
  --colorAppBackground: var(--sekai-bg);

  --colorNeutral000: var(--sekai-bg);
  --colorNeutral100: var(--sekai-surface);
  --colorNeutral200: var(--sekai-surface-2);
  --colorNeutral300: var(--sekai-border);
  --colorNeutral400: #53627F;
  --colorNeutral500: var(--sekai-text-muted);
  --colorNeutral600: var(--sekai-text-soft);
  --colorNeutral700: var(--sekai-text);
  --colorNeutral800: var(--sekai-text);
  --colorNeutral900: #FFFFFF;

  --colorPrimary000: rgba(91, 61, 255, 0.14);
  --colorPrimary100: rgba(91, 61, 255, 0.22);
  --colorPrimary200: rgba(91, 61, 255, 0.34);
  --colorPrimary600: var(--sekai-purple);
  --colorPrimary700: #6F56FF;
  --colorPrimary800: #8570FF;
  --colorPrimary900: var(--sekai-cyan);

  --colorSecondary900: rgba(64, 232, 241, 0.35);
}

/* ==========================================================================
   Global background
   ========================================================================== */

body,
[data-ashby-root] {
  background-color: var(--sekai-bg) !important;
  background-image:
    radial-gradient(circle at 70% 0%, rgba(91, 61, 255, 0.22) 0%, rgba(91, 61, 255, 0.10) 22%, transparent 48%),
    radial-gradient(circle at 16% 12%, rgba(64, 232, 241, 0.11) 0%, transparent 32%),
    linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px) !important;
  background-size: 100% 100%, 100% 100%, 28px 28px, 28px 28px !important;
  background-position: center top, center top, center center, center center !important;
  color: var(--sekai-text) !important;
  font-family: var(--fontFamily) !important;
  font-size: var(--fontSizeNormal) !important;
  line-height: 1.72 !important;
}

/* ==========================================================================
   Job board list
   ========================================================================== */

.ashby-job-board-heading {
  color: var(--sekai-text) !important;
  font-size: var(--fontSizeXxxlarge) !important;
  line-height: 1.15 !important;
  font-weight: var(--fontWeightHeavyBold) !important;
  letter-spacing: -0.03em !important;
}

.ashby-job-board-heading-count {
  color: var(--sekai-text-muted) !important;
  font-size: var(--fontSizeNormal) !important;
}

.ashby-department-heading,
.ashby-department-heading-level {
  color: var(--sekai-text) !important;
  font-size: var(--fontSizeXlarge) !important;
  font-weight: var(--fontWeightHeavyBold) !important;
  border-color: var(--sekai-border) !important;
}

.ashby-job-board-filter {
  background-color: rgba(25, 33, 58, 0.96) !important;
  border-color: var(--sekai-border) !important;
  color: var(--sekai-text) !important;
  border-radius: var(--borderRadiusControl) !important;
  font-size: var(--fontSizeNormal) !important;
}

/* Job card */
.ashby-job-posting-brief {
  background-color: rgba(25, 33, 58, 0.94) !important;
  border: 1px solid var(--sekai-border) !important;
  border-radius: var(--borderRadiusContainer) !important;
  padding: 22px !important;
  margin-bottom: 14px !important;
  box-shadow:
    0 14px 36px rgba(0, 0, 0, 0.26),
    inset 0 1px 0 rgba(255, 255, 255, 0.045) !important;
}

.ashby-job-posting-brief-title {
  color: var(--sekai-text) !important;
  font-size: var(--fontSizeLarge) !important;
  font-weight: var(--fontWeightHeavyBold) !important;
  letter-spacing: -0.015em !important;
}

.ashby-job-posting-brief-details {
  color: var(--sekai-text-muted) !important;
  font-size: var(--fontSizeNormal) !important;
}

.ashby-job-posting-brief-department-heading,
.ashby-job-posting-brief-department-heading-level {
  color: var(--sekai-text-soft) !important;
}

/* ==========================================================================
   Job detail page
   ========================================================================== */

.ashby-job-posting-heading {
  color: var(--sekai-text) !important;
  font-size: var(--fontSizeXxxlarge) !important;
  line-height: 1.14 !important;
  font-weight: var(--fontWeightHeavyBold) !important;
  letter-spacing: -0.035em !important;
}

/* These two are accepted on the newer Ashby hosted job board. */
.ashby-job-posting-left-pane,
.ashby-job-posting-right-pane {
  background-color: rgba(25, 33, 58, 0.96) !important;
  border: 1px solid var(--sekai-border) !important;
  border-radius: var(--borderRadiusContainer) !important;
  color: var(--sekai-text) !important;
  box-shadow:
    0 18px 45px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.ashby-job-posting-right-pane-tab-slider {
  background-color: var(--sekai-cyan) !important;
}

/* ==========================================================================
   Application form
   ========================================================================== */

.ashby-application-form-container,
.ashby-survey-form-container {
  background-color: rgba(25, 33, 58, 0.96) !important;
  border: 1px solid var(--sekai-border) !important;
  border-radius: var(--borderRadiusContainer) !important;
  padding: 32px !important;
  color: var(--sekai-text) !important;
  box-shadow:
    0 18px 45px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.ashby-application-form-section-container {
  color: var(--sekai-text) !important;
}

.ashby-application-form-section-header {
  border-color: var(--sekai-border) !important;
}

.ashby-application-form-section-header-title,
.ashby-application-form-question-title {
  color: var(--sekai-text) !important;
  font-size: var(--fontSizeNormal) !important;
  font-weight: var(--fontWeightMediumBold) !important;
}

.ashby-application-form-section-header-description,
.ashby-application-form-question-description {
  color: var(--sekai-text-muted) !important;
  font-size: var(--fontSizeNormal) !important;
}

.ashby-application-form-field-entry {
  color: var(--sekai-text) !important;
  font-size: var(--fontSizeNormal) !important;
}

.ashby-application-form-field-entry input,
.ashby-application-form-field-entry select,
.ashby-application-form-field-entry textarea {
  background-color: #10182A !important;
  border: 1px solid var(--sekai-border) !important;
  color: var(--sekai-text) !important;
  border-radius: var(--borderRadiusControl) !important;
  font-size: var(--fontSizeNormal) !important;
  padding: 12px 14px !important;
}

.ashby-application-form-field-entry input:focus,
.ashby-application-form-field-entry select:focus,
.ashby-application-form-field-entry textarea:focus {
  border-color: var(--sekai-cyan) !important;
  box-shadow: 0 0 0 3px rgba(64, 232, 241, 0.18) !important;
  outline: none !important;
}

.ashby-application-form-autofill-pane {
  background-color: rgba(32, 42, 70, 0.88) !important;
  border: 1px dashed rgba(64, 232, 241, 0.35) !important;
  border-radius: var(--borderRadiusContainer) !important;
  color: var(--sekai-text) !important;
}

/* Submit / CTA */
.ashby-application-form-submit-button,
.ashby-job-board-back-to-all-jobs-button {
  background: linear-gradient(135deg, var(--sekai-purple) 0%, var(--sekai-purple-dark) 100%) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  border-radius: var(--borderRadiusButton) !important;
  font-size: var(--fontSizeNormal) !important;
  font-weight: var(--fontWeightHeavyBold) !important;
  padding: 12px 22px !important;
  box-shadow: 0 14px 30px rgba(37, 28, 206, 0.35) !important;
}

.ashby-application-form-submit-button:hover,
.ashby-job-board-back-to-all-jobs-button:hover {
  background: linear-gradient(135deg, #6D55FF 0%, #3124E6 100%) !important;
  box-shadow: 0 18px 38px rgba(37, 28, 206, 0.45) !important;
}

.ashby-application-form-success-container {
  background-color: rgba(25, 33, 58, 0.96) !important;
  color: var(--sekai-text) !important;
  border: 1px solid var(--sekai-border) !important;
  border-radius: var(--borderRadiusContainer) !important;
}

.ashby-application-form-failure-container {
  background-color: rgba(80, 27, 44, 0.86) !important;
  color: #FFEAF0 !important;
  border: 1px solid rgba(255, 117, 143, 0.35) !important;
  border-radius: var(--borderRadiusContainer) !important;
}

/* ==========================================================================
   Detail page alignment + readability refinements
   ========================================================================== */

/* Keep the left metadata card and right content card aligned at the same top edge. */
.ashby-job-posting-left-pane,
.ashby-job-posting-right-pane {
  margin-top: 0 !important;
  align-self: flex-start !important;
}

/* Make the detail page tabs feel like part of the same module instead of floating. */
.ashby-job-posting-right-pane-tab-slider {
  height: 3px !important;
}

/* Slightly improve scanability on dense job descriptions. */
.ashby-job-posting-right-pane {
  line-height: 1.72 !important;
}

/* Keep the metadata panel readable but not oversized. */
.ashby-job-posting-left-pane {
  font-size: var(--fontSizeSmall) !important;
  line-height: 1.55 !important;
}

