/* stylelint-disable */

/* ============================================================
   MultiBank Group — Ashby Job Board Custom Theme
   Matched to: multibankgroup.com/careers
   Background: #0B1120 | Blue: #467bff | Teal: #75d9d9 | Font: Plus Jakarta Sans
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');

/* ── CSS VARIABLES ── */
:root {
    --colorPrimary900: #2f57cc;
    --colorPrimary600: #467bff;
    --colorAppBackground: #0B1120;
    --widthMaxJobBoard: 900px;
    --borderRadiusContainer: 8px;
    --borderRadiusControl: 6px;
    --borderRadiusButton: 6px;
    --fontFamily: "Plus Jakarta Sans", "-apple-system", "BlinkMacSystemFont", "Segoe UI", "Helvetica", "Arial", sans-serif;
    --gradientAccent: linear-gradient(88.9deg, #467bff 33.43%, #75d9d9 103.55%);
}

/* ── KEYFRAMES ── */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes pulseBlue {
    0%, 100% { box-shadow: 0 0 0 0 rgba(70, 123, 255, 0); }
    50%       { box-shadow: 0 0 0 6px rgba(70, 123, 255, 0.15); }
}

/* ── GLOBAL BODY ── */
body {
    background-color: #0B1120 !important;
    font-family: "Plus Jakarta Sans", sans-serif !important;
    line-height: 1.2 !important;
    background-image:
        linear-gradient(rgba(70, 123, 255, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(70, 123, 255, 0.03) 1px, transparent 1px) !important;
    background-size: 60px 60px !important;
}

/* ── TOP/BOTTOM DESCRIPTION TEXT ── */
/* Make all description body text light/white instead of grey */
p, span, li {
    color: #CBD5E1;
}

h1, h2, h3, h4, h5, h6 {
    color: #FFFFFF;
}

/* Bold/strong text pops white for emphasis */
strong, b {
    color: #FFFFFF;
}

/* Links stay blue */
a {
    color: #467bff;
}

/* ── JOB BOARD HEADING ── */
.ashby-job-board-heading {
    color: #FFFFFF;
    font-size: 32px;
    font-weight: 800;
    letter-spacing: -0.03em;
    animation: fadeInUp 0.5s ease forwards;
}

.ashby-job-board-heading-count {
    color: #467bff;
    font-size: 18px;
    font-weight: 500;
}

/* ── FILTERS ── */
.ashby-job-board-filters-label {
    color: #94A3B8;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.ashby-job-board-filter {
    background-color: #161D2E;
    border: 1px solid rgba(70, 123, 255, 0.2);
    border-radius: 6px;
    color: #FFFFFF;
    font-size: 13px;
    transition: border-color 0.2s, box-shadow 0.2s;
    -webkit-appearance: none;
    appearance: none;
}

.ashby-job-board-filter:focus {
    border-color: #467bff;
    outline: none;
    box-shadow: 0 0 0 3px rgba(70, 123, 255, 0.15);
}

.ashby-job-board-filter option {
    background-color: #161D2E;
    color: #FFFFFF;
}

.ashby-job-board-reset-filters-label {
    color: #467bff;
    font-size: 13px;
    font-weight: 500;
}

/* ── DEPARTMENT HEADINGS ── */
.ashby-department-heading {
    color: #FFFFFF;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(70, 123, 255, 0.15);
    padding-bottom: 10px;
    margin-bottom: 8px;
}

.ashby-department-heading-level {
    color: #467bff;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

/* ── JOB CARDS — matching the card style from the website ── */
.ashby-job-posting-brief-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ashby-job-posting-brief {
    background-color: #111827;
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-left: 3px solid transparent;
    border-radius: 8px;
    margin-bottom: 6px;
    padding: 20px 28px;
    transition: background-color 0.25s ease, border-color 0.25s ease, transform 0.2s ease, box-shadow 0.25s ease;
    animation: fadeInUp 0.4s ease forwards;
}

.ashby-job-posting-brief:hover {
    background-color: #161D2E;
    border-left-color: #467bff;
    border-color: rgba(70, 123, 255, 0.3);
    transform: translateX(4px);
    box-shadow: 0 4px 24px rgba(70, 123, 255, 0.08);
}

.ashby-job-posting-brief-title {
    color: #FFFFFF;
    font-size: 15px;
    font-weight: 600;
}

.ashby-job-posting-brief-details {
    color: #64748B;
    font-size: 13px;
    margin-top: 4px;
}

.ashby-job-posting-brief-department-heading {
    color: #467bff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.ashby-job-posting-brief-department-heading-level {
    color: #64748B;
    font-size: 11px;
    text-transform: uppercase;
}

/* ── JOB DETAIL PAGE ── */
.ashby-job-posting-header {
    background-color: #0D1117;
    border-bottom: 1px solid rgba(70, 123, 255, 0.12);
    padding: 40px 48px;
    animation: fadeInUp 0.5s ease forwards;
}

.ashby-job-posting-heading {
    color: #FFFFFF;
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -0.02em;
}

/* Left pane — mimics "About Us" card from careers page */
.ashby-job-posting-left-pane {
    background-color: #111827;
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 10px;
    padding: 32px;
    color: #94A3B8;
    font-size: 14px;
    line-height: 1.8;
    animation: fadeInUp 0.5s ease 0.1s forwards;
    opacity: 0;
}

.ashby-job-posting-right-pane {
    background-color: transparent;
    animation: fadeInUp 0.5s ease 0.15s forwards;
    opacity: 0;
}

/* Tabs — blue underline slider like website nav */
.ashby-job-posting-right-pane-overview-tab {
    color: #64748B;
    font-size: 14px;
    font-weight: 500;
    transition: color 0.2s;
}

.ashby-job-posting-right-pane-application-tab {
    color: #64748B;
    font-size: 14px;
    font-weight: 500;
    transition: color 0.2s;
}

.ashby-job-posting-right-pane-tab-slider {
    background-color: #467bff;
    height: 2px;
    border-radius: 1px;
}

/* Back button */
.ashby-job-board-back-to-all-jobs-button {
    color: #467bff;
    font-size: 13px;
    font-weight: 500;
    background: transparent;
    border: none;
    transition: color 0.2s;
}

.ashby-job-board-back-to-all-jobs-button:hover {
    color: #75d9d9;
}

/* ── APPLICATION FORM ── */
.ashby-application-form-container {
    background-color: #111827;
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 10px;
    padding: 36px;
    animation: fadeInUp 0.5s ease forwards;
}

.ashby-application-form-section-container {
    background-color: transparent;
}

.ashby-application-form-section-header {
    border-bottom: 1px solid rgba(70, 123, 255, 0.12);
    padding-bottom: 14px;
    margin-bottom: 24px;
}

.ashby-application-form-section-header-title {
    color: #FFFFFF;
    font-size: 17px;
    font-weight: 700;
}

.ashby-application-form-section-header-description {
    color: #64748B;
    font-size: 13px;
    margin-top: 4px;
}

.ashby-application-form-field-entry {
    margin-bottom: 22px;
}

.ashby-application-form-question-title {
    color: #E2E8F0;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 8px;
}

.ashby-application-form-question-description {
    color: #64748B;
    font-size: 12px;
    margin-bottom: 8px;
}

/* Submit button — matches "Submit your CV" button on careers page */
.ashby-application-form-submit-button {
    background-color: #467bff;
    color: #FFFFFF;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 700;
    padding: 13px 36px;
    border: none;
    cursor: pointer;
    letter-spacing: 0.02em;
    transition: background-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}

.ashby-application-form-submit-button:hover {
    background-color: #75d9d9;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(70, 123, 255, 0.3);
    animation: pulseBlue 1.5s ease infinite;
}

/* Status messages */
.ashby-application-form-success-container {
    background-color: rgba(70, 123, 255, 0.08);
    border: 1px solid rgba(70, 123, 255, 0.25);
    border-radius: 8px;
    color: #FFFFFF;
    padding: 28px;
    animation: fadeInUp 0.4s ease forwards;
}

.ashby-application-form-failure-container {
    background-color: rgba(239, 68, 68, 0.08);
    border: 1px solid rgba(239, 68, 68, 0.25);
    border-radius: 8px;
    color: #FCA5A5;
    padding: 28px;
    animation: fadeInUp 0.4s ease forwards;
}

.ashby-application-form-blocked-application-container {
    background-color: rgba(234, 179, 8, 0.08);
    border: 1px solid rgba(234, 179, 8, 0.25);
    border-radius: 8px;
    color: #FDE047;
    padding: 28px;
    animation: fadeInUp 0.4s ease forwards;
}

/* Autofill section */
.ashby-application-form-autofill-pane {
    background-color: rgba(70, 123, 255, 0.05);
    border: 1px dashed rgba(70, 123, 255, 0.3);
    border-radius: 8px;
    padding: 22px;
    margin-bottom: 28px;
    transition: background-color 0.2s, border-color 0.2s;
}

.ashby-application-form-autofill-pane:hover {
    background-color: rgba(70, 123, 255, 0.1);
    border-color: rgba(70, 123, 255, 0.5);
}

.ashby-application-form-autofill-input-root {}
.ashby-application-form-autofill-input-base-layer {}
.ashby-application-form-autofill-input-drag-layer {}
.ashby-application-form-autofill-input-pending-layer {}
.ashby-application-form-autofill-input-form-alert {}
.ashby-application-form-autofill-uploader {}

.ashby-application-form-autofill-input-title {
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 600;
}

.ashby-application-form-autofill-input-description {
    color: #64748B;
    font-size: 13px;
}

.ashby-application-form-autofill-input-icon {
    color: #467bff;
}

.ashby-application-form-texting-consent-description {
    color: #64748B;
    font-size: 12px;
    line-height: 1.65;
}

/* Survey */
.ashby-survey-form-container {
    background-color: #111827;
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 10px;
    padding: 36px;
    animation: fadeInUp 0.5s ease forwards;
}

/* ── RESPONSIVE ── */
@media (max-width: 768px) {
    .ashby-job-board-heading {
        font-size: 24px;
    }
    .ashby-job-posting-header {
        padding: 28px 20px;
    }
    .ashby-job-posting-left-pane {
        padding: 22px;
    }
    .ashby-application-form-container {
        padding: 22px 18px;
    }
    .ashby-job-posting-brief {
        padding: 16px 18px;
    }
    .ashby-job-posting-brief:hover {
        transform: none;
    }
}

@media (max-width: 1024px) and (min-width: 769px) {
    .ashby-job-posting-left-pane { padding: 26px; }
    .ashby-application-form-container { padding: 26px; }
}

@media (prefers-reduced-motion: reduce) {
    .ashby-job-posting-brief,
    .ashby-job-board-heading,
    .ashby-job-posting-header,
    .ashby-job-posting-left-pane,
    .ashby-job-posting-right-pane,
    .ashby-application-form-container,
    .ashby-application-form-success-container,
    .ashby-application-form-failure-container,
    .ashby-survey-form-container {
        animation: none;
        opacity: 1;
        transform: none;
    }
    .ashby-job-posting-brief:hover { transform: none; }
    .ashby-application-form-submit-button:hover {
        transform: none;
        animation: none;
    }
}

@media (prefers-color-scheme: dark) {
    :root { --colorAppBackground: #0B1120; }
}

@media print {
    .ashby-job-posting-left-pane,
    .ashby-application-form-container {
        border: 1px solid #ccc;
        background-color: #ffffff;
        color: #000000;
    }
    .ashby-job-posting-heading,
    .ashby-job-board-heading {
        color: #000000;
    }
}

/* ── FIX: White job description text ── */
.ashby-job-posting-right-pane p,
.ashby-job-posting-right-pane li,
.ashby-job-posting-right-pane span,
.ashby-job-posting-right-pane ul,
.ashby-job-posting-right-pane ol {
    color: #CBD5E1 !important;
}

.ashby-job-posting-right-pane h1,
.ashby-job-posting-right-pane h2,
.ashby-job-posting-right-pane h3,
.ashby-job-posting-right-pane h4 {
    color: #FFFFFF !important;
}

/* ── FIX: Job detail page matching site style ── */
.ashby-job-posting-right-pane {
    background-color: #0B1120 !important;
    color: #E2E8F0 !important;
}

/* Body text — slightly off-white like the site */
.ashby-job-posting-right-pane p,
.ashby-job-posting-right-pane li,
.ashby-job-posting-right-pane ul,
.ashby-job-posting-right-pane ol,
.ashby-job-posting-right-pane span {
    color: #E2E8F0 !important;
}

/* Headings — bold pure white */
.ashby-job-posting-right-pane h1,
.ashby-job-posting-right-pane h2,
.ashby-job-posting-right-pane h3,
.ashby-job-posting-right-pane h4,
.ashby-job-posting-right-pane strong,
.ashby-job-posting-right-pane b {
    color: #FFFFFF !important;
    font-weight: 700 !important;
}

/* Job title heading */
.ashby-job-posting-heading {
    color: #FFFFFF !important;
    font-weight: 800 !important;
    text-align: center !important;
}

/* Left pane labels like Location, Employment Type */
.ashby-job-posting-left-pane {
    background-color: #0B1120 !important;
    border: none !important;
    color: #E2E8F0 !important;
}

/* ── NUCLEAR: Force dark on ALL elements inside job posting ── */
.ashby-job-posting-right-pane * {
    background-color: transparent !important;
    color: #E2E8F0 !important;
}

.ashby-job-posting-right-pane h1 *,
.ashby-job-posting-right-pane h2 *,
.ashby-job-posting-right-pane h3 *,
.ashby-job-posting-right-pane h4 *,
.ashby-job-posting-right-pane strong,
.ashby-job-posting-right-pane b {
    color: #FFFFFF !important;
}
