/*
Theme Name: ATDT Utforskauppsala.se
Description: GeneratePress-barntema (tunt identitetslager) för utforskauppsala.se, besöksguide till Uppsala. Arketyp H warm/wellness, paletten "Tegel i kvällsljus", Crimson Pro + Atkinson Hyperlegible. Komponenter ligger i pluginet atdt-theme-kit. Del av ATDT-nätverkets temarkitektur.
Author: Atdt AB
Template: generatepress
Version: 0.1.0
*/

/* ===== GP:s globala fargvariabler mappade till tokens =====
   Ligger FORST, fore arketypens kropp. Utan den lacker GeneratePress
   standardaccent (blatt #1e73be) in i lankar, knappar och navigering. Extra
   viktigt har, eftersom GP-blatt ligger nara systersajten hittauppsala.se:s
   palett och skulle sudda ut skillnaden mellan sajterna. */
:root:root{--accent:var(--atdt-link);--contrast:var(--atdt-ink);--contrast-2:var(--atdt-muted);--contrast-3:var(--atdt-neutral);--base:var(--atdt-neutral);--base-2:var(--atdt-bg);--base-3:var(--atdt-surface)}

/* ===== ARKETYP H - WARM/WELLNESS (lugnt, luftigt, premium-mjukt: halsa-soft, skonhet, sömn, livsstil) ===== */
/* Mycket luft, dampade toner, mjuka former, centrerade citat. Skiljer sig fran C genom att vara stillsam, inte studsig. */
body{background:var(--atdt-bg);color:var(--atdt-ink);font-family:var(--atdt-font-body);line-height:1.85}
.entry-content{font-size:1.07rem}
.atdt-lead{font-size:1.25rem;line-height:1.7;color:var(--atdt-muted)}
h1,.entry-title,.site-title{font-family:var(--atdt-font-display);font-weight:600;letter-spacing:.005em;line-height:1.2}
.entry-content h2{font-family:var(--atdt-font-display);font-weight:600;font-size:1.55rem;margin:2.8em 0 .8em;position:relative}
.entry-content h2::before{content:"";display:block;width:30px;height:3px;border-radius:3px;background:var(--atdt-accent);margin-bottom:.7em;opacity:.85}
.entry-content h3{font-family:var(--atdt-font-display);font-weight:600;font-size:1.2rem;margin-top:1.8em}
a{color:var(--atdt-accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:color-mix(in srgb,var(--atdt-accent) 45%,transparent)}
a:hover{text-decoration-color:var(--atdt-accent)}
.atdt-hero{margin:0 0 2.2rem}
.atdt-hero img{width:100%;height:auto;border-radius:20px;display:block;box-shadow:0 26px 60px -30px rgba(0,0,0,.4)}
.atdt-hero figcaption,.atdt-fotocred{display:block;text-align:center;font-size:.82rem;color:var(--atdt-muted);margin-top:.8rem;font-style:italic}
.atdt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.4rem;margin:2.4rem 0}
.atdt-card{background:color-mix(in srgb,var(--atdt-accent) 6%,var(--atdt-surface));border:0;border-radius:20px;padding:1.6rem;transition:transform .2s}
.atdt-card:hover{transform:translateY(-2px)}
.atdt-card h3{margin-top:0}
.atdt-card a{text-decoration:none}
.entry-content table{width:100%;border-collapse:collapse;margin:1.9em 0;font-size:1rem}
.entry-content thead th{background:transparent;color:var(--atdt-muted);text-transform:uppercase;letter-spacing:.08em;font-size:.78rem;font-family:var(--atdt-font-body);border-bottom:1px solid var(--atdt-neutral)}
.entry-content th,.entry-content td{padding:.9em .8em;border-bottom:1px solid var(--atdt-neutral);text-align:left}
.entry-content blockquote{border:0;text-align:center;font-family:var(--atdt-font-display);font-style:italic;font-size:1.4rem;line-height:1.5;color:var(--atdt-accent);margin:2.2em auto;padding:.5em 1.2em;max-width:90%}
.wp-block-button__link,.button,button{background:transparent;color:var(--atdt-accent);border:1.5px solid var(--atdt-accent);border-radius:999px;font-family:var(--atdt-font-display);font-weight:600;padding:.6em 1.6em}
.wp-block-button__link:hover{background:var(--atdt-accent);color:var(--atdt-on-accent)}

/* 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}}

/* =====================================================================
   TEMATS EGEN SVANS: overridningar som designkonceptet kraver.
   Allt harunder vinner over arketypen ovanfor.
   ===================================================================== */

/* --- 1. Lankar och citat. Arketyp H satter a{color:var(--atdt-accent)} och
   blockquote{color:var(--atdt-accent)}. Accenten nar bara 3,52:1 mot bakgrunden
   och ar underkand som textfarg, och citatet pa 1,4 rem ar inte stor text i
   WCAG:s mening. Bada satts till --atdt-link: 5,87:1 mot bg, 6,23:1 mot vit och
   5,82:1 mot den 6-procentiga kortytan #FAF6F8. */
a{color:var(--atdt-link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:color-mix(in srgb,var(--atdt-link) 45%,transparent)}
a:hover,a:focus{color:var(--atdt-link);text-decoration-color:var(--atdt-link);text-decoration-thickness:2px}
.entry-content blockquote{color:var(--atdt-link)}
.entry-content blockquote a{color:var(--atdt-link);text-decoration-color:var(--atdt-link)}
.atdt-card a,.atdt-card h3 a{color:var(--atdt-link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:color-mix(in srgb,var(--atdt-link) 45%,transparent)}
.atdt-card a:hover,.atdt-card h3 a:hover{text-decoration-color:var(--atdt-link)}

/* Knappen har accentram och accenttext i arketypen. Ramen far vara accent,
   den ar grafik och klarar 3:1, men texten flyttas till --atdt-link. Hover
   fyller med accent och satter ink ovanpa, 4,94:1. */
.wp-block-button__link,.button,button{color:var(--atdt-link);border-color:var(--atdt-accent)}
.wp-block-button__link:hover,.button:hover,button:hover{background:var(--atdt-accent);color:var(--atdt-on-accent);border-color:var(--atdt-accent)}

/* --- 2. Typsnitt.
   Crimson Pro har bade vikt 600 och akta kursiv 600, sa arketypens rubriker och
   kursiva citat behover ingen syntes.
   Atkinson Hyperlegible ar STATISK och har BARA 400 och 700. Ingen mellanvikt
   far begaras nagonstans, annars syntetiserar webblasaren. Darfor normaliseras
   halvfet brodtext till 700 och font-synthesis:none satts som sparr. */
html,body{font-synthesis:none}
h1,.entry-title,.site-title,.entry-content h2,.entry-content h3,.atdt-card h3,.widget-title{font-family:var(--atdt-font-display);font-weight:600;font-synthesis:none}
.entry-content blockquote{font-family:var(--atdt-font-display);font-weight:600;font-style:italic;font-synthesis:none}
b,strong,.atdt-lead strong,.entry-content th,.atdt-dag{font-weight:700;font-synthesis:none}
.entry-content em,.entry-content i{font-style:italic;font-weight:400;font-synthesis:none}

/* Ingressen satts av arketypen i --atdt-muted, alltsa en LANG text i dampad
   farg. Den ar matt separat: 6,03:1 mot bg och 5,98:1 mot kortytan, alltsa
   godkand mot 4,5:1 och inte bara mot kravet for stor text. */
.atdt-lead{color:var(--atdt-muted)}

/* Chips: mjuka piller med 1,5 px accentram, ingen fyllning i vila, Crimson Pro
   600 och ink som text. Valt filter fylls med accent och behaller ink (4,94:1). */
.atdt-chip,.atdt-filter{display:inline-block;border:1.5px solid var(--atdt-accent);border-radius:999px;padding:.26em .95em;font-family:var(--atdt-font-display);font-weight:600;font-size:.86rem;color:var(--atdt-ink);background:transparent;font-synthesis:none}
.atdt-chip[aria-pressed="true"],.atdt-chip.is-vald{background:var(--atdt-accent);color:var(--atdt-on-accent)}
.atdt-chiprad{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.2rem 0 1.6rem}

/* Kontrollrad i systemmono, dampad, i samma kort eller tabellfot som vardet. */
.atdt-kontrollerat{font-family:var(--atdt-font-mono);font-size:.8rem;color:var(--atdt-muted)}

/* --- 3. Kortgrid. H:s kort ar luftiga, och luften ar farlig pa en datadriven
   sida. Pa en sida med farre an sex objekt satts rutnatet till tva kolumner sa
   att korten blir breda i stallet for smala och glesa. */
.atdt-grid.atdt-fa-objekt{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}

/* Dagens rad markeras med det rundade accentstrecket fore veckodagen, alltsa
   samma flourish som h2, aldrig med en fargfyllning. */
.entry-content tbody tr.atdt-idag td:first-child::before{content:"";display:inline-block;width:18px;height:3px;border-radius:3px;background:var(--atdt-accent);margin-right:.6em;vertical-align:middle;opacity:.85}

/* Sasongsblock: 20 px radie och 1,5 px ram i lindgront, samma block for Valborg,
   Linnemiljoerna och botaniska. */
.atdt-sasong{border:1.5px solid var(--atdt-accent-2);border-radius:var(--atdt-radius);padding:1.3rem 1.5rem;margin:2.2rem 0}
.atdt-sasong > :first-child{font-family:var(--atdt-font-display);font-weight:600;font-synthesis:none}

/* Nyckeltalsband: siffrorna i Crimson Pro 600 i stor grad, etiketten under i
   dampad, atskilda av det rundade strecket. */
.atdt-nyckeltal b,.atdt-nyckeltal strong{font-family:var(--atdt-font-display);font-weight:600;font-synthesis:none;font-size:2.1rem;line-height:1}
.atdt-nyckeltal small{color:var(--atdt-muted)}
.atdt-nyckeltal li + li::before{content:"";display:inline-block;width:18px;height:3px;border-radius:3px;background:var(--atdt-accent);margin:0 .9em;vertical-align:middle;opacity:.85}

/* --- 4. Sidfotsmotivet, fyrisslinga.
   Granskat renderat i sin egen palett. Vid arketypens 0,5 ar den dova rosan pa
   det rosabrutna papperet nastan osynlig, portfoljens svagaste kombination
   precis som konceptet forutsag. Opaciteten hojd till 0,8, dar meandern och de
   tre broagarna laser. */
.atdt-sine{opacity:.8}