/*
 * SOSU MV — INNOMATE Theme
 * Copyright (c) INNOMATE a/s. All rights reserved.
 *
 * A single theme file that works for BOTH the standalone jobs widget
 * and the full Job Portal SPA. Upload on the job portal Design tab.
 *
 * Brand reference: https://www.sosumv.dk/om-skolen/job-paa-sosu-mv
 *   - Golden / amber accent: #d4a843
 *   - Font: Montserrat
 *   - Dark headings, clean white cards, subtle shadows
 *
 * How it works:
 *   • The SPA reads variables from `body`
 *   • The embeddable widget reads variables from `#innomate-jobs-widget`
 *   • The combined selector below sets them in one place for both.
 */

/* ---------- Google Font ---------- */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap');

/* ---------- Variable overrides ---------- */
body,
#innomate-jobs-widget {
    /* Typography */
    --innomate-font-family: "Montserrat", "Segoe UI", Arial, sans-serif;
    --innomate-line-height: 1.6;
    --innomate-color-text: #333333;
    --innomate-color-heading: #1a1a2e;

    /* Background — transparent blends with host page */
    --innomate-color-bg: transparent;
    --innomate-content-padding: 0;

    /* Cards / panels */
    --innomate-card-bg: #ffffff;
    --innomate-card-border: #e8e0d0;
    --innomate-card-radius: 5px;
    --innomate-card-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);

    /* Primary colour — SOSU MV golden amber */
    --innomate-color-primary: #d4a843;
    --innomate-color-primary-hover: #c99a38;
    --innomate-color-primary-active: #b8892f;
    --innomate-color-primary-shadow: rgba(212, 168, 67, 0.25);

    /* Card / job hover */
    --innomate-card-hover-shadow: 0 4px 12px rgba(212, 168, 67, 0.18);
    --innomate-card-hover-border: #d4a843;

    /* Info text */
    --innomate-color-info: #555555;

    /* Links */
    --innomate-color-link: #d4a843;
    --innomate-color-link-hover: #b8892f;

    /* Buttons */
    --innomate-button-radius: 6px;

    /* Inputs */
    --innomate-input-focus-border: #d4a843;
    --innomate-input-focus-shadow: 0 0 4px rgba(212, 168, 67, 0.3);

    /* Tab menu */
    --innomate-tab-active-color: #d4a843;

    /* Drop zone / file upload */
    --innomate-dropzone-active-border: #d4a843;
    --innomate-dropzone-link-color: #d4a843;

    /* Progress bar */
    --innomate-progress-fill: #d4a843;

    /* Heading sizes — slightly tighter for integration */
    --innomate-h1-size: 1.5rem;
    --innomate-h2-size: 1.25rem;
    --innomate-h3-size: 1.1rem;
}

@media (min-width: 768px) {
    body,
    #innomate-jobs-widget {
        --innomate-h1-size: 1.75rem;
        --innomate-h2-size: 1.4rem;
        --innomate-h3-size: 1.2rem;
    }
}

@media (min-width: 1024px) {
    body,
    #innomate-jobs-widget {
        --innomate-h1-size: 2rem;
        --innomate-h2-size: 1.6rem;
        --innomate-h3-size: 1.35rem;
        --innomate-card-padding: 1.5em;
    }
}

@media (min-width: 1440px) {
    body,
    #innomate-jobs-widget {
        --innomate-h1-size: 2.25rem;
        --innomate-h2-size: 1.75rem;
        --innomate-h3-size: 1.5rem;
    }
}

/* ---------- Selector-based refinements ---------- */

/* Left gold accent on job cards (echoes SOSU MV section styling) */
.job,
#innomate-jobs-widget .job {
    border-left: 3px solid #d4a843;
}

/* Bold, clean headings */
h1, #innomate-jobs-widget h1 { font-weight: 700; letter-spacing: -0.01em; }
h2, #innomate-jobs-widget h2 { font-weight: 600; }