/*
Theme Name: ATDT Hittastockholm.se
Theme URI: https://www.hittastockholm.se/
Description: GeneratePress-barntema for hittastockholm.se, hub och dataprofil for Stockholm med stadsdelsguider samt yrkes-, bransch- och bostadssidor. Arketyp F (directory): scanbart och app-likt, kort med toppstripe och jamforelsetabell med betonad forsta kolumn. Identitet: lila mot lilaskiftande papper med djupgron som datafarg, Geist plus Lexend, nyko-mosaiken i sidfoten. Skild fran systersajterna Goteborg, Malmo och Uppsala pa palett, typsnitt, motiv, radie och maxbredd. Komponenter ligger i pluginet atdt-theme-kit. Del av ATDT-natverkets temarkitektur.
Author: Atdt AB
Template: generatepress
Version: 0.4.0
*/

/* ===== GP-globala variabler -> tokens. MASTE ligga forst, fore arketypens kropp.
   Utan detta lacker GeneratePress standardbla (#1e73be) in i navigeringen och
   kolliderar med lilan. GP:s --accent styr lanktext och kopplas till
   --atdt-link. Har sammanfaller link med accent, eftersom lilan redan mater
   9,32:1 mot bakgrunden, men raden skrivs anda mot link-token sa att den haller
   om nagon senare skiljer tonerna at. ===== */
: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;margin-bottom:2.2rem;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 hittastockholm.se.
   Arketypens kropp ovan ar gemensam for de fyra hitta-sajterna, det har ar
   Stockholms 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)}

/* Stockholms varden: radie 10px och spalt 1080px. Systrarna har 6/1040,
   12/1000 och 4/1020, 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)}

/* Kursivfallan galler brodtexten: Lexend har ingen akta kursiv, sa en lutad
   variant blir syntetisk. Betoning gors med vikt 600 och dampad ton. Behovs
   akta kursiv satts den i display-typsnittet Geist, som har verklig kursiv. */
em,i,dfn,.entry-content em,.entry-content i{font-style:normal;font-weight:600;color:var(--atdt-muted)}
cite,.atdt-publikation{font-family:var(--atdt-font-display);font-style:italic;font-weight:500}

/* Flourish: toppstripe overst pa varje kort och sektion. Sajtens enskilt mest
   igenkannbara detalj, och den ska inte finnas pa systersajterna i samma
   tjocklek. Stockholm kor 4px. */
.atdt-card,.atdt-panel{border-top:4px solid var(--atdt-accent);background:var(--atdt-surface)}
.atdt-section-stripe{border-top:4px solid var(--atdt-accent);padding-top:1rem}

/* Mono bar hyresnivaer, antal objekt, kontrolldatum och de levande raknarna. */
.atdt-nyckeltal,.atdt-hyra,.atdt-antal,.atdt-kontrolldatum,.entry-content td.atdt-num{font-family:var(--atdt-font-mono);font-weight:500;font-variant-numeric:tabular-nums}

/* Nyckeltalsraden direkt under ingressen: mono mot neutralfaltet,
   black pa neutral 14,03:1. */
.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)}

/* Den levande raknaren ur databasen far ett eget markerat falt: den ar den
   enda delen ingen annan kan kopiera. */
.atdt-raknare{border:2px solid var(--atdt-accent);border-radius:var(--atdt-radius);background:var(--atdt-surface);padding:.9rem 1.1rem;font-family:var(--atdt-font-mono);font-weight:500;color:var(--atdt-ink)}

/* Jamforelsetabell med betonad forsta kolumn. */
.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:.82rem;text-align:left;letter-spacing:.01em}
.entry-content th,.entry-content td{padding:.62em .85em;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)}

/* List: filterkolumn till vanster, kortresultat 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 utan att sidan blir en
   upplevelseguide, vilket ar gransen mot utforskastockholm.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 djupgron, aldrig lila: nastan varje kort ar ocksa en lank,
   och ingen stapel eller kartmarkor ska kunna las som en lank. */
.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)}

.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, 18,43:1. Dampad sidfotstext 12,63: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: nyko-mosaiken. */
.atdt-motif-rule{max-width:var(--atdt-maxwidth);margin:2.6rem auto 2.2rem;padding:0 1rem}
.atdt-motif-rule svg{display:block;width:100%;height:auto}

/* MEDVETET UTELAMNAT: ingen platshallarstil for saknad data. En sida som inte
   klarar tunnhetsgrinden publiceras inte, och finns ingen tom-stil kan den inte
   heller publiceras av misstag. Bygg inte in en sadan stil har. */

@media (max-width:820px){.atdt-filterlayout{grid-template-columns:1fr}}
@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}
}

/* GeneratePress skriver ut bade andrings- och publiceringsdatum sa snart ett
   inlagg uppdaterats, vilket ger "21 september 202621 september 2026" i
   metaraden. Dolj andringsdatumet, behall det publicerade. Uppmatt 2026-09-21. */
.entry-meta .updated:not(.published) { display: none; }
