/*
Theme Name: ATDT framtidensjobb-se
Description: GeneratePress-barntema (tunt identitetslager) for framtidensjobb-se. Arketyp F. Komponenter ligger i pluginet atdt-theme-kit. Del av ATDT-natverkets temarkitektur. TODO: forfina beskrivningen per sajt.
Author: Atdt AB
Template: generatepress
Version: 0.1.0
*/

/* ===== ARKETYP F - DIRECTORY/LISTING (kataloger, jamforelse, "hitta X", aggregatorer) ===== */
/* Scanbart, app-likt, tatt. Kort med toppstripe, jamforelsetabell med betonad forsta kolumn. */
body{background:var(--atdt-bg);color:var(--atdt-ink);font-family:var(--atdt-font-body);line-height:1.6}
.entry-content{font-size:1rem}
.atdt-lead{font-size:1.15rem;line-height:1.5;font-weight:500}
h1,.entry-title,.site-title{font-family:var(--atdt-font-display);font-weight:700;letter-spacing:-.015em;line-height:1.1}
.entry-content h2{font-family:var(--atdt-font-display);font-weight:700;font-size:1.35rem;margin:2.2em 0 .7em;padding-left:.7em;border-left:4px solid var(--atdt-accent)}
.entry-content h3{font-family:var(--atdt-font-display);font-weight:700;font-size:1.05rem;margin-top:1.4em}
a{color:var(--atdt-accent);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--atdt-accent) 40%,transparent)}
a:hover{border-bottom-color:var(--atdt-accent)}
.atdt-hero{margin:0 0 1.6rem}
.atdt-hero img{width:100%;height:auto;aspect-ratio:21/9;object-fit:cover;border-radius:8px;display:block}
.atdt-hero figcaption,.atdt-fotocred{display:block;font-size:.74rem;color:var(--atdt-muted);margin-top:.4rem}
.atdt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:.9rem;margin:1.8rem 0}
.atdt-card{background:var(--atdt-surface);border:1px solid var(--atdt-neutral);border-radius:10px;padding:1.1rem 1.1rem 1rem;position:relative;transition:border-color .15s,box-shadow .15s}
.atdt-card::before{content:"";position:absolute;top:0;left:1.1rem;right:1.1rem;height:3px;background:var(--atdt-accent);border-radius:0 0 3px 3px}
.atdt-card:hover{border-color:var(--atdt-accent);box-shadow:0 8px 22px -16px rgba(0,0,0,.4)}
.atdt-card h3{margin:.35rem 0 .3rem}
.atdt-card a{border:0}
/* jamforelsetabell: accent-header (sticky) + betonad forsta kolumn */
.entry-content table{width:100%;border-collapse:collapse;margin:1.6em 0;font-size:.95rem;border:1px solid var(--atdt-neutral)}
.entry-content thead th{background:var(--atdt-accent);color:var(--atdt-on-accent);font-family:var(--atdt-font-display);position:sticky;top:0}
.entry-content th,.entry-content td{padding:.6em .8em;border-bottom:1px solid var(--atdt-neutral);border-right:1px solid var(--atdt-neutral);text-align:left}
.entry-content tbody td:first-child{font-weight:600;background:color-mix(in srgb,var(--atdt-accent) 6%,var(--atdt-surface))}
.entry-content blockquote{border-left:4px solid var(--atdt-accent);background:var(--atdt-surface);margin:1.6em 0;padding:.8em 1.1em;border-radius:0 8px 8px 0}
.wp-block-button__link,.button,button{background:var(--atdt-accent);color:var(--atdt-on-accent);border-radius:8px;font-family:var(--atdt-font-display);font-weight:600;padding:.5em 1.1em}

/* Sidfotsmotiv (temats variant) */
.atdt-road,.atdt-ridge,.atdt-swell,.atdt-vine,.atdt-trail,.atdt-sine,.atdt-paws,.atdt-vinerule,.atdt-drops,.atdt-stage{display:block;width:100%;height:26px;margin-top:2.6rem;color:var(--atdt-accent);opacity:.5}
/* Responsiv tabell */
@media (max-width:600px){.entry-content table{table-layout:fixed;width:100%;font-size:.8rem}.entry-content th,.entry-content td{word-break:break-word;overflow-wrap:anywhere}}

/* ===== Framtidskartan (interaktiv yrkesutforskare) ===== */
#framtidskartan{margin:2rem 0}
.fk-controls{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1rem}
.fk-controls input,.fk-controls select{font:inherit;padding:.6em .8em;border:1px solid var(--atdt-neutral);border-radius:8px;background:var(--atdt-surface);color:var(--atdt-ink)}
.fk-sok{flex:1 1 240px}
.fk-chipgrupp{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin:.5rem 0}
.fk-chiplabel{font-size:.8rem;color:var(--atdt-muted);text-transform:uppercase;letter-spacing:.04em;margin-right:.3rem;min-width:80px}
.fk-chip{font:inherit;font-size:.85rem;padding:.35em .8em;border:1px solid var(--atdt-neutral);border-radius:999px;background:var(--atdt-surface);color:var(--atdt-ink);cursor:pointer;transition:all .15s}
.fk-chip:hover{border-color:var(--atdt-accent)}
.fk-chip.aktiv{background:var(--atdt-accent);color:#fff;border-color:var(--atdt-accent)}
.fk-stats{margin:1rem 0;color:var(--atdt-muted);font-size:.95rem}
.fk-stats strong{color:var(--atdt-ink)}
.fk-resultat{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}
.fk-kort{background:var(--atdt-surface);border:1px solid var(--atdt-neutral);border-radius:var(--atdt-radius);padding:1.1rem;display:flex;flex-direction:column;gap:.7rem}
.fk-kort-topp{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem}
.fk-titel{font-family:var(--atdt-font-display);font-size:1.12rem;margin:0;line-height:1.2}
.fk-omrade-tag{font-size:.7rem;color:var(--atdt-muted);text-align:right;line-height:1.2;max-width:42%}
.fk-badges{display:flex;flex-wrap:wrap;gap:.4rem}
.fk-badge{font-size:.78rem;font-weight:600;padding:.25em .6em;border-radius:6px;white-space:nowrap}
.prognos-vaxer{background:#e3f5ea;color:#1c7a47}
.prognos-oforandrad{background:#eef0f3;color:#5a6473}
.prognos-minskar{background:#fbe6e3;color:#b23123}
.rekr-brist{background:#e3f5ea;color:#1c7a47}
.rekr-balans{background:#eef0f3;color:#5a6473}
.rekr-overskott{background:#fdeede;color:#a8631a}
.rekr-paradox{background:#fff4d6;color:#946a00}
.fk-ads{background:#eaf0ff;color:var(--atdt-accent)}
.fk-lankar{display:flex;gap:.8rem;margin-top:auto;flex-wrap:wrap}
.fk-lank{font-size:.85rem;font-weight:600;text-decoration:none;border:0}
.fk-lank-profil{color:var(--atdt-accent)}
.fk-lank-jobb{color:var(--atdt-positive)}
.fk-tomt{color:var(--atdt-muted);padding:1.5rem 0}
@media(max-width:600px){.fk-omrade-tag{display:none}}
/* Fotokredit under utvald bild */
.atdt-fotokredit{display:block;font-size:.78rem;color:var(--atdt-muted);font-style:italic;margin:.45rem 0 1.4rem;text-align:right}