/* ── FJC Jobs — Frontend Shortcode Styles ───────────────────────────────────
   Single-column stacked layout on all screen sizes.
   !important used selectively to survive Kadence theme overrides.
   ──────────────────────────────────────────────────────────────────────────── */

/* ── Wrapper — always single column, no grid ───────────────────────────────── */
.fjc-jobs,
.fjc-jobs--cards,
.fjc-jobs--list {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    grid-template-columns: none !important; /* kill any theme grid inheritance */
    margin: 28px 0 !important;
    padding: 0 !important;
    list-style: none !important;
    font-family: inherit !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* ── Single job card ─────────────────────────────────────────────────────────
   width: 100% + box-sizing ensures the card never breaks out of its column   */
.fjc-fe-job {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    background: #fff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    transition: box-shadow .2s, border-color .2s;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important; /* Kadence sometimes floats grid children */
}
.fjc-fe-job:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,.1) !important;
    border-color: #3b82f6 !important;
}

.fjc-fe-job__body {
    padding: 22px 24px !important;
    box-sizing: border-box !important;
}

/* ── Title ───────────────────────────────────────────────────────────────────*/
.fjc-fe-job__title {
    margin: 0 0 8px !important;
    padding: 0 !important;
    font-size: 1.15rem !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    border: none !important;
}
.fjc-fe-job__title a {
    color: #1e293b !important;
    text-decoration: none !important;
    font-weight: 700 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}
.fjc-fe-job__title a:hover {
    color: #2563eb !important;
    text-decoration: underline !important;
}

/* ── Meta row: company · location · category ─────────────────────────────── */
.fjc-fe-job__meta {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 0.875rem !important;
    color: #64748b !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
}
.fjc-fe-company {
    font-weight: 600 !important;
    color: #334155 !important;
}
.fjc-fe-sep {
    color: #cbd5e1 !important;
    margin: 0 2px !important;
}

/* ── Salary ──────────────────────────────────────────────────────────────────*/
.fjc-fe-job__salary {
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    color: #16a34a !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
}
.fjc-fe-predicted {
    font-size: 0.75rem !important;
    font-weight: 400 !important;
    color: #94a3b8 !important;
    margin-left: 4px !important;
}

/* ── Description ─────────────────────────────────────────────────────────────*/
.fjc-fe-job__desc {
    font-size: 0.9rem !important;
    color: #475569 !important;
    line-height: 1.65 !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden !important;
}

/* ── Footer: badges + apply button ──────────────────────────────────────────*/
.fjc-fe-job__footer {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 14px 0 0 !important;
    padding: 14px 0 0 !important;
    border-top: 1px solid #f1f5f9 !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
}

/* ── Badges ──────────────────────────────────────────────────────────────────*/
.fjc-fe-badge {
    display: inline-block !important;
    font-size: 0.7rem !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: .05em !important;
    background: #eff6ff !important;
    color: #2563eb !important;
    border-radius: 4px !important;
    padding: 3px 8px !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
    line-height: 1.4 !important;
}
.fjc-fe-badge--time {
    background: #f0fdf4 !important;
    color: #15803d !important;
}

/* ── Apply / View button ─────────────────────────────────────────────────────*/
.fjc-fe-apply-btn {
    margin-left: auto !important;
    display: inline-block !important;
    background: #2563eb !important;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    padding: 9px 20px !important;
    border-radius: 6px !important;
    border: none !important;
    box-shadow: none !important;
    transition: background .15s;
    white-space: nowrap !important;
    cursor: pointer !important;
    line-height: 1.4 !important;
}
.fjc-fe-apply-btn:hover,
.fjc-fe-apply-btn:focus {
    background: #1d4ed8 !important;
    color: #fff !important;
    text-decoration: none !important;
    box-shadow: none !important;
    outline: 2px solid #93c5fd;
    outline-offset: 2px;
}

/* ── List style: same stacked layout, slightly more compact ──────────────────
   (list style is also single-column — just less padding per card)            */
.fjc-fe-job--list .fjc-fe-job__body {
    padding: 16px 20px !important;
}
.fjc-fe-job--list .fjc-fe-job__desc {
    -webkit-line-clamp: 2;
}

/* ── Adzuna attribution badge (required by ToS) ──────────────────────────────
   "Jobs by Adzuna" — min 116×23px per Adzuna API Terms of Service.          */
.fjc-attribution {
    margin-top: 16px !important;
    text-align: right !important;
}
.fjc-attribution__link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-size: 0.75rem !important;
    color: #64748b !important;
    text-decoration: none !important;
    opacity: 0.8;
    transition: opacity .15s;
}
.fjc-attribution__link:hover {
    opacity: 1;
    text-decoration: none !important;
    color: #64748b !important;
}
.fjc-attribution__logo {
    display: inline-block !important;
    width: auto !important;
    height: 23px !important;
    min-width: 80px !important;
    vertical-align: middle !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ── Placeholder shown in block editor preview ───────────────────────────────*/
.fjc-placeholder {
    padding: 12px 16px !important;
    background: #fff8e1 !important;
    border-left: 4px solid #f59e0b !important;
    font-style: italic !important;
    color: #78350f !important;
}