/*
Theme Name: ATDT Hittauppsala.se
Theme URI: https://www.hittauppsala.se/
Description: GeneratePress-barntema for hittauppsala.se, nyttoguide till Uppsala med stadsdelsguider samt yrkes-, bransch- och bostadssidor, byggd for farre men tatare sidor. Arketyp F (directory): scanbart och app-likt, kort med toppstripe och jamforelsetabell med betonad forsta kolumn, dar tabellen ligger fore kortgridet. Identitet: dampad bla mot svalt papper med koppar som datafarg, Archivo Narrow plus Urbanist, terminsbandet i sidfoten. Skild fran systersajterna Stockholm, Goteborg och Malmo pa palett, typsnitt, motiv, radie och maxbredd, och fran utforskauppsala.se pa uppdrag. Komponenter ligger i pluginet atdt-theme-kit. Del av ATDT-natverkets temarkitektur.
Author: Atdt AB
Template: generatepress
Version: 0.1.0
*/

/* ===== GP-globala variabler -> tokens. MASTE ligga forst, fore arketypens kropp.
   RISKEN AR STORST HAR AV ALLA SAJTER I BATCHEN, eftersom paletten redan ar bla.
   GeneratePress standardbla (#1e73be) som lacker in i navigeringen blir en andra
   bla som ser ut som ett fel men inte som en bugg, och den kan bli kvar lange.
   GP:s --accent styr lanktext och kopplas darfor till --atdt-link, inte till
   --atdt-accent: har ar de tva olika toner (#2A447F mot #2E4B8C) och skillnaden
   ska halla. ===== */
: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 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}}

/* ===================================================================
   Sajtspecifikt lager for hittauppsala.se.
   Arketypens kropp ovan ar gemensam for de fyra hitta-sajterna, det har ar
   Uppsalas egen identitet. De fyra ska screenshotas i montage sida vid sida
   innan nagot deployas: ser de ut som kloner ar det radie, maxbredd och
   stripe-tjocklek som ska skiljas at forst, inte fargerna.
   =================================================================== */

a{color:var(--atdt-link)}
a:hover,a:focus-visible{color:var(--atdt-ink)}

/* Uppsalas varden: radie 4px och spalt 1020px. Uppsala far den HARDASTE radien
   av de fyra, vilket passar den tabelltunga layouten. Systrarna har 10/1080,
   6/1040 och 12/1000, sa att de fyra F-sajterna inte far identisk rytm. */
.site-content .grid-container,.inside-article,.entry-content{max-width:var(--atdt-maxwidth)}
.atdt-card,.atdt-panel,.atdt-hero img,.wp-block-image img{border-radius:var(--atdt-radius)}

/* Kursiv far anvandas. Urbanist har akta kursiv hos fontsource och skarningen
   ligger i assets/fonts/ som egen fil, sa den lutade varianten ar aldrig
   syntetisk. */
em,i,dfn,cite{font-style:italic}

/* Flourish: kortens toppstripe, 3px. Med 4px radie ser stripen NASTAN RAK ut,
   och det ar Uppsalas signatur bland de fyra. Stockholm kor 4px, Malmo 4px men
   med 12px radie och Goteborg 2px, sa tjockleken sitter mellan dem. */
.atdt-card,.atdt-panel{border-top:3px solid var(--atdt-accent);background:var(--atdt-surface)}
.atdt-section-stripe{border-top:3px solid var(--atdt-accent);padding-top:1rem}
/* Arketypens egen ::before-stripe stangs av. Den ritar en andra, indragen
   stripe inuti kortet och ger dubbla linjer overst nar sajtlagret ovan
   redan satt sin egen. Stripe-tjockleken ska agas av sajtlagret, eftersom
   det ar tjockleken som skiljer Uppsala fran de tre systrarna. */
.atdt-card::before{content:none}

/* Mono bar hyresnivaer, antal objekt, annonsantal, SNI-koder och kontrolldatum. */
.atdt-nyckeltal,.atdt-hyra,.atdt-antal,.atdt-sni,.atdt-kontrolldatum,.entry-content td.atdt-num{font-family:var(--atdt-font-mono);font-weight:400;font-variant-numeric:tabular-nums}

/* Nyckeltalsraden direkt under ingressen: mono mot neutralfaltet,
   black pa neutral 13,93:1.
   FORETAGSFALTET renderas inte forran polygonbygget for stadsdelarna ar gjort,
   eftersom companies.city ar postadress och inte geografi. Mallen visar raden
   UTAN faltet, aldrig med ett tomt falt. */
.atdt-nyckeltalsrad{display:flex;flex-wrap:wrap;gap:1.4rem;background:var(--atdt-neutral);border-radius:var(--atdt-radius);padding:.9rem 1.1rem;margin:1.2rem 0;font-family:var(--atdt-font-mono);font-size:.86rem;color:var(--atdt-ink)}
.atdt-nyckeltalsrad .etikett{display:block;font-family:var(--atdt-font-body);font-size:.74rem;font-weight:400;color:var(--atdt-muted)}

/* TABELLEN FORE KORTGRIDET. Det ar sajtens medvetna avvikelse fran de tre
   systrarna och den foljer av att Uppsala kommer att ha farre rader per lista:
   en tabell med tolv rader ser fullstandig ut medan ett kortgrid med tolv kort
   ser glest ut. Kast inte om ordningen utan att lasa konceptet. */
.atdt-resultat{display:flex;flex-direction:column}
.atdt-resultat .atdt-tabell{order:1}
.atdt-resultat .atdt-grid{order:2}
.atdt-resultat .atdt-kurva{order:3}

/* Jamforelsetabell med betonad forsta kolumn (hyresvard pa bostadslagessidan).
   Kolumnrubrikerna satts i den smala displayskarningen: sajten har langa
   stadsdels- och yrkesnamn i tabellrubriker, och en narrow display gor att de
   ryms utan att brytas. Darfor ocksa hyphens:none pa rubrikerna. */
.entry-content table{width:100%;border-collapse:collapse;margin:1.6em 0;font-size:.94rem;background:var(--atdt-surface);border-radius:var(--atdt-radius);overflow:hidden}
.entry-content thead th{background:var(--atdt-neutral);color:var(--atdt-ink);font-family:var(--atdt-font-display);font-weight:700;font-size:.84rem;text-align:left;letter-spacing:.005em;hyphens:none}
.entry-content th,.entry-content td{padding:.6em .8em;border-bottom:1px solid var(--atdt-neutral)}
.entry-content tbody th:first-child,.entry-content tbody td:first-child{font-weight:600;color:var(--atdt-ink)}
/* SNI-avgransningen pa bransch-sidorna: notrad i mono direkt under tabellen.
   Life science-kartlaggningen ar sajtens tyngsta bransch-sida och ska bara ett
   redovisat SNI-snitt som grafik, inte bara som en mening. */
.atdt-notrad{font-family:var(--atdt-font-mono);font-size:.78rem;color:var(--atdt-muted);margin:-1em 0 1.8em}

/* Zombiestadningen efter v2.34.0 maste vara verifierat kord for
   Uppsalavardarna, sa bostadslagessidan bar ett synligt falt med datum for
   senast verifierad stadning. */
.atdt-stadningsdatum{display:inline-block;border:1px solid var(--atdt-neutral);border-radius:var(--atdt-radius);background:var(--atdt-neutral);color:var(--atdt-ink);font-family:var(--atdt-font-mono);font-size:.8rem;padding:.3em .7em}

/* Sasongsmarkering vid terminsstart pa utvecklingskurvan, alltsa samma rytm
   som sidfotsmotivet. Ritas i accent, aldrig i koppar, sa att den inte
   forvaxlas med sjalva dataserien. */
.atdt-sasongsmarkering{border-left:2px solid var(--atdt-accent);padding-left:.5rem}

/* List: filterkolumn till vanster, resultat till hoger. */
.atdt-filterlayout{display:grid;grid-template-columns:minmax(180px,230px) 1fr;gap:1.8rem;align-items:start}
.atdt-filter{background:var(--atdt-surface);border:1px solid var(--atdt-neutral);border-radius:var(--atdt-radius);padding:1rem 1.1rem;font-size:.9rem}

/* Object: brett hero som ger stadsdelen ett ansikte. Heron ar omradets ansikte,
   aldrig en upplevelsebild. Det ar gransen mot utforskauppsala.se. */
.atdt-wide-hero{margin:0 0 1.4rem}
.atdt-wide-hero img{width:100%;height:auto;aspect-ratio:24/9;object-fit:cover;border-radius:var(--atdt-radius)}

/* Datagrafik bar koppar, aldrig bla: nastan varje kort ar ocksa en lank, och
   ingen stapel eller kartmarkor ska kunna lasas som en lank. Koppar mot
   bakgrund 5,38:1, vit text pa koppar 5,68:1. Kopparen bar ocksa
   life science-sparet och arbetsgivarfordelningen pa yrkessidorna.
   Tyngdpunkterna Stadskarnan och resecentrum, Bolanderna, Uppsala Science Park,
   Rosendal, Fyrislund och Granby far bredare kort i kortgridet. */
.atdt-stapel,.atdt-kartmarkor,.atdt-kurva .serie{background:var(--atdt-accent-2);color:var(--atdt-on-accent)}
.atdt-karta{background:var(--atdt-neutral);border-radius:var(--atdt-radius)}
.atdt-card.ar-tyngdpunkt{grid-column:span 2}

.wp-block-button__link,.button,button,input[type=submit]{background:var(--atdt-accent);color:var(--atdt-on-accent);border-radius:var(--atdt-radius);font-family:var(--atdt-font-display);font-weight:700}
.wp-block-button__link:hover,.button:hover,button:hover{background:var(--atdt-ink);color:var(--atdt-on-accent)}

/* Fotokredit under utvald bild. */
.atdt-credit,.atdt-hero figcaption,.wp-block-image figcaption{display:block;font-family:var(--atdt-font-body);font-size:.79rem;font-weight:400;color:var(--atdt-muted);margin-top:.5rem;border-left:3px solid var(--atdt-accent);padding-left:.7em}

/* Sidhuvud och navigering. */
.site-header{background:var(--atdt-surface);border-bottom:1px solid var(--atdt-neutral)}
.site-title,.main-title{font-family:var(--atdt-font-display);font-weight:700}
.site-title a,.main-title a{color:var(--atdt-ink)}
.site-description{color:var(--atdt-muted);font-size:.84rem}
.main-navigation{background:var(--atdt-surface)}
.main-navigation .main-nav ul li a{font-family:var(--atdt-font-display);font-weight:500;color:var(--atdt-ink)}
.main-navigation .main-nav ul li a:hover,.main-navigation .main-nav ul li.current-menu-item>a{color:var(--atdt-accent)}

/* GP:s entry-meta star kvar. Varje programmatisk sida ska bara sitt datum
   synligt, sa den far aldrig plockas bort av en egen mall. */
.entry-meta{font-family:var(--atdt-font-mono);font-size:.78rem;color:var(--atdt-muted)}

/* Sidfot: vit lanktext mot morkt black, 17,98:1. Dampad sidfotstext 12,33:1. */
.site-info{background:var(--atdt-ink);color:#FFFFFF}
.site-info a{color:#FFFFFF;border-bottom:1px solid rgba(255,255,255,.4)}
.site-info .atdt-footer-muted{color:#D8D4DE}

/* Sidfotsmotiv: terminsbandet. */
.atdt-motif-rule{max-width:var(--atdt-maxwidth);margin:2.6rem auto 0;padding:0 1rem}
.atdt-motif-rule svg{display:block;width:100%;height:auto}

/* MEDVETET UTELAMNAT: ingen platshallarstil for saknad data. Pa den minsta av
   de fyra sajterna ar den regeln viktigast, eftersom frestelsen att fylla ut ar
   storst. Finns ingen tom-stil kan en sida under sparren inte publiceras av
   misstag. Bygg inte in en sadan stil har.
   MEDVETET UTELAMNAT: ingen stil for kotid eller kopoang. De har ingen plats i
   mallarna. */

@media (max-width:820px){.atdt-filterlayout{grid-template-columns:1fr}.atdt-card.ar-tyngdpunkt{grid-column:auto}}
@media (max-width:600px){
	.entry-content table{table-layout:fixed;font-size:.82rem}
	.entry-content th,.entry-content td{word-break:break-word;overflow-wrap:anywhere}
	.entry-content h2{font-size:1.2rem}
}
