/*
Theme Name: ATDT GP Laddtider
Description: GeneratePress-barntema for laddtider.se, guider och rapporter om webbprestanda. Arketyp D (distinkt/nisch, teknik). Koncept "flamdiagram": morkt instrumentband med tidslinjal, lila signalfarg och lime markeringspenna, lanat ur prestandapanelen i webblasarens utvecklarverktyg. Rubriker och tabeller i systemets monospace, brodtext i systemets sans. Laddar inga typsnittsfiler.
Author: Atdt AB
Template: generatepress
Version: 1.0.1
Text Domain: atdt-gp-laddtider-se
*/

/* ===== BAS ===== */
body{background:var(--atdt-bg);color:var(--atdt-ink);font-family:var(--atdt-font-body);font-size:17px;line-height:1.65}
::selection{background:var(--atdt-accent-2);color:var(--atdt-ink)}
a{color:var(--atdt-accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover,a:focus,a:active{color:var(--atdt-accent)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--atdt-accent);outline-offset:2px}
h1,h2,h3,h4,h5,h6{color:var(--atdt-ink)}

/* ===== MORKT INSTRUMENTBAND: sidhuvud + meny + tidslinjal ===== */
.site-header{background:var(--atdt-ink);color:var(--atdt-on-dark)}
.inside-header{padding:28px 40px 20px}
.main-title{font-family:var(--atdt-font-display);font-weight:700;font-size:1.75rem;line-height:1.1;letter-spacing:-.03em;margin:0}
.main-title a,.main-title a:hover,.main-title a:focus,.main-title a:visited{color:var(--atdt-on-dark);text-decoration:none}
.main-title a::before{content:"";display:inline-block;width:.56em;height:.56em;margin-right:.42em;background:var(--atdt-accent-2)}
.site-description{font-family:var(--atdt-font-mono);font-size:.76rem;letter-spacing:.03em;color:var(--atdt-on-dark-muted);margin:.5em 0 0}

.main-navigation,.main-navigation ul ul{background:var(--atdt-ink)}
.main-navigation{border-top:1px solid color-mix(in srgb,var(--atdt-on-dark) 14%,transparent)}
.main-navigation .inside-navigation{padding:0 20px}
.main-navigation .main-nav ul li a,.main-navigation .menu-toggle,.main-navigation .menu-bar-items{color:var(--atdt-on-dark);font-family:var(--atdt-font-mono);font-size:.78rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;line-height:46px;text-decoration:none}
.main-navigation .main-nav ul li:not([class*="current-menu-"]):hover>a,.main-navigation .main-nav ul li:not([class*="current-menu-"]):focus>a,.main-navigation .main-nav ul li.sfHover:not([class*="current-menu-"])>a,.main-navigation .menu-bar-item:hover>a,.main-navigation .menu-bar-item.sfHover>a,button.menu-toggle:hover,button.menu-toggle:focus{color:var(--atdt-accent-2);background:transparent}
.main-navigation .main-nav ul li[class*="current-menu-"]>a,.main-navigation .main-nav ul li.current-page-ancestor>a,.main-navigation .main-nav ul li[class*="current-menu-"]>a:hover{color:var(--atdt-ink);background:var(--atdt-accent-2)}
/* Tidslinjalen: glesa hoga och tata laga skalstreck, som axeln i ett vattenfallsdiagram. */
.main-navigation::after{content:"";display:block;height:9px;background-color:var(--atdt-ink);background-image:repeating-linear-gradient(90deg,var(--atdt-accent-2) 0 2px,transparent 2px 200px),repeating-linear-gradient(90deg,color-mix(in srgb,var(--atdt-accent-2) 50%,transparent) 0 1px,transparent 1px 40px);background-size:auto 100%,auto 45%;background-position:0 0,0 100%;background-repeat:repeat-x}

/* ===== SIDANS YTA ===== */
.separate-containers .site-main{margin:28px 0}
.separate-containers .inside-article,.separate-containers .comments-area,.separate-containers .page-header,.separate-containers .paging-navigation,.one-container .site-content{background:var(--atdt-surface);border:1px solid var(--atdt-neutral);border-radius:var(--atdt-radius)}
.separate-containers .inside-article,.separate-containers .page-header{padding:44px 48px 48px}

/* ===== RUBRIKER ===== */
h1,.entry-title{font-family:var(--atdt-font-display);font-weight:700;font-size:clamp(1.5rem,1.05rem + 2vw,2.25rem);line-height:1.16;letter-spacing:-.035em}
.entry-title a{color:var(--atdt-ink);text-decoration:none}
.entry-title a:hover{color:var(--atdt-accent)}
/* Tidsstapeln under huvudrubriken: tre faser, som en uppdelad begaran. */
.page .entry-header .entry-title::after,.single .entry-header .entry-title::after,.home .entry-content>h1:first-child::after,.home .entry-content>h2:first-child::after,.page-header .page-title::after{content:"";display:block;width:min(100%,340px);height:8px;margin-top:.7em;background:linear-gradient(90deg,var(--atdt-accent) 0 24%,transparent 24% 26%,var(--atdt-accent-2) 26% 62%,transparent 62% 64%,var(--atdt-ink) 64% 100%)}
.entry-header{margin-bottom:1.6em}
.entry-content h2{font-family:var(--atdt-font-body);font-weight:800;font-size:1.5rem;line-height:1.22;letter-spacing:-.018em;margin:2.3em 0 .7em;padding-top:.9em;border-top:1px solid var(--atdt-neutral);position:relative}
.entry-content h2::before{content:"";position:absolute;top:-1px;left:0;width:64px;height:4px;background:var(--atdt-accent)}
.entry-content h3{font-family:var(--atdt-font-body);font-weight:700;font-size:1.17rem;line-height:1.3;margin:1.9em 0 .5em}
.entry-content h4{font-family:var(--atdt-font-display);font-weight:700;font-size:.98rem;line-height:1.35;letter-spacing:-.01em;margin:1.6em 0 .4em}

/* ===== BRODTEXT ===== */
.entry-content{font-size:1rem}
.entry-content>p,.entry-content>ul,.entry-content>ol,.entry-content>blockquote,.entry-content>.wp-block-group{max-width:46rem}
.entry-content a:hover,.entry-content a:focus{color:var(--atdt-ink);background:var(--atdt-accent-2);text-decoration:none}
.entry-content li{margin-bottom:.35em}
.entry-content li::marker{color:var(--atdt-accent);font-family:var(--atdt-font-mono);font-weight:700}
.atdt-lead{font-size:1.2rem;line-height:1.5}
.entry-content .atdt-byline{font-family:var(--atdt-font-mono);letter-spacing:.01em}
.entry-content blockquote{border:0;border-left:4px solid var(--atdt-accent);background:var(--atdt-bg);margin:1.6em 0;padding:.9em 1.2em;font-size:1rem;font-style:normal}
.entry-content hr,.entry-content .wp-block-separator{border:0;border-top:1px solid var(--atdt-neutral);margin:2.2em 0}
.entry-content .wp-block-group.has-border-color[style*="border-left-width:4px"]{border-color:transparent transparent transparent var(--atdt-accent)!important;background:var(--atdt-bg)}
.entry-content figure{margin-left:0;margin-right:0}
.entry-content figcaption,.atdt-fotocred,.wp-element-caption{display:block;font-family:var(--atdt-font-mono);font-size:.74rem;letter-spacing:.02em;color:var(--atdt-muted);margin-top:.6rem;text-align:left}
.atdt-hero{margin:0 0 2rem}
.atdt-hero img{display:block;width:100%;height:auto;border-radius:var(--atdt-radius)}

/* ===== KOD ===== */
.entry-content pre,.entry-content .wp-block-code{background:var(--atdt-code-bg);color:var(--atdt-on-dark);border:0;border-left:4px solid var(--atdt-accent-2);border-radius:var(--atdt-radius);padding:1.1em 1.25em;margin:1.6em 0;font-family:var(--atdt-font-mono);font-size:.83rem;line-height:1.6;overflow-x:auto;white-space:pre}
.entry-content pre code{background:none;border:0;padding:0;color:inherit;font-size:inherit}
.entry-content :not(pre)>code{font-family:var(--atdt-font-mono);font-size:.86em;background:var(--atdt-bg);border:1px solid var(--atdt-neutral);border-radius:3px;padding:.06em .36em;color:var(--atdt-ink)}

/* ===== TABELLER: matprotokoll i monospace ===== */
.entry-content .wp-block-table{margin:1.8em 0;overflow-x:auto}
.entry-content table{width:100%;border-collapse:collapse;margin:1.8em 0;font-family:var(--atdt-font-mono);font-size:.82rem;line-height:1.5;border:1px solid var(--atdt-ink)}
.entry-content .wp-block-table table{margin:0}
.entry-content table th,.entry-content table td{padding:.62em .8em;border:0;border-bottom:1px solid var(--atdt-neutral);text-align:left;vertical-align:top}
.entry-content table thead{border-bottom:0}
.entry-content table thead th{background:var(--atdt-ink);color:var(--atdt-on-dark);font-weight:600;letter-spacing:.03em;border-bottom:0}
.entry-content table tbody tr:nth-child(odd),.entry-content .wp-block-table.is-style-stripes tbody tr:nth-child(odd){background:transparent}
.entry-content table tbody tr:nth-child(even){background:var(--atdt-bg)}
.entry-content table tbody tr:hover{background:color-mix(in srgb,var(--atdt-accent-2) 28%,var(--atdt-surface))}
.entry-content table td a{text-underline-offset:2px}

/* ===== KOMPONENTKROKAR (natverkets gemensamma klasser) ===== */
.atdt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin:2rem 0}
.atdt-card{background:var(--atdt-surface);border:1px solid var(--atdt-neutral);border-top:6px solid var(--atdt-accent);border-radius:var(--atdt-radius);padding:1.2rem 1.3rem}
.atdt-card:hover{border-color:var(--atdt-ink);border-top-color:var(--atdt-accent-2)}
.atdt-card h3{margin-top:0}
.atdt-card a{text-decoration:none}
.wp-block-button__link,.button,input[type="submit"],.search-submit{background:var(--atdt-accent);color:var(--atdt-on-accent);border:0;border-radius:var(--atdt-radius);font-family:var(--atdt-font-mono);font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;text-decoration:none}
.wp-block-button__link:hover,.button:hover,input[type="submit"]:hover,.search-submit:hover{background:var(--atdt-ink);color:var(--atdt-accent-2)}
input[type="search"],input[type="text"],input[type="email"],textarea{background:var(--atdt-surface);color:var(--atdt-ink);border:1px solid var(--atdt-muted);border-radius:var(--atdt-radius)}
input[type="search"]:focus,input[type="text"]:focus,input[type="email"]:focus,textarea:focus{background:var(--atdt-surface);color:var(--atdt-ink);border-color:var(--atdt-accent)}

/* ===== STARTSIDAN: ingangarna ritas som ett vattenfall ===== */
.home .entry-header{display:none}
.home.separate-containers .inside-article{background:transparent;border:0;padding:20px 0 8px}
.home .entry-content>h1:first-child,.home .entry-content>h2:first-child{font-family:var(--atdt-font-display);font-weight:700;font-size:clamp(1.7rem,1.05rem + 2.8vw,2.75rem);line-height:1.08;letter-spacing:-.04em;margin:0 0 .8em;padding:0;border:0}
.home .entry-content>h2:first-child::before{display:none}
.home .entry-content>h1:first-child+p,.home .entry-content>h2:first-child+p{font-size:1.22rem;line-height:1.5}
.home .entry-content h3{font-family:var(--atdt-font-mono);font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--atdt-muted);margin:2.6em 0 1em}
/* Kolumnblocken staplas med flit till EN rad per ingang: sex rader med allt senare
   startpunkt blir ett vattenfallsdiagram, och raderna gar att lasa pa mobil utan omflode. */
/* Tre klasser i rad: GP satter marginal pa .entry-content > [class*="wp-block-"]:not(:last-child):not(.wp-block-heading). */
.home .entry-content>.wp-block-columns.wp-block-columns.wp-block-columns{display:block;margin:0;gap:0}
.home .wp-block-column{position:relative;overflow:hidden;background:var(--atdt-surface);border:1px solid var(--atdt-neutral);margin:-1px 0 0;padding:1.7rem 1.35rem 1.25rem}
.home .wp-block-column::before{content:"";position:absolute;top:0;left:var(--wf-x,0%);width:var(--wf-w,30%);height:6px;background:var(--atdt-accent)}
.home .wp-block-columns:nth-of-type(1) .wp-block-column:nth-child(2){--wf-x:10%;--wf-w:36%}
.home .wp-block-columns:nth-of-type(2) .wp-block-column:nth-child(1){--wf-x:22%;--wf-w:34%}
.home .wp-block-columns:nth-of-type(2) .wp-block-column:nth-child(2){--wf-x:36%;--wf-w:38%}
.home .wp-block-columns:nth-of-type(3) .wp-block-column:nth-child(1){--wf-x:50%;--wf-w:30%}
.home .wp-block-columns:nth-of-type(3) .wp-block-column:nth-child(2){--wf-x:62%;--wf-w:38%}
.home .wp-block-column:hover{border-color:var(--atdt-ink);z-index:1}
.home .wp-block-column:hover::before{background:var(--atdt-accent-2);box-shadow:0 0 0 1px var(--atdt-ink)}
.home .wp-block-column h4{margin:0 0 .45em;font-size:1.02rem}
.home .wp-block-column h4 a{color:var(--atdt-ink);text-decoration:none;background:none}
.home .wp-block-column h4 a::after{content:"";position:absolute;inset:0}
.home .wp-block-column h4 a:hover{color:var(--atdt-accent);background:none}
.home .wp-block-column p{margin:0;color:var(--atdt-muted);font-size:.95rem;line-height:1.5}

/* ===== RUTAN "RELATERAT I NATVERKET" (mu-plugin): in i temats palett ===== */
.entry-content .matcher-related{max-width:46rem;border-color:var(--atdt-neutral);border-left-color:var(--atdt-accent);border-radius:var(--atdt-radius);background:var(--atdt-bg)}
.entry-content .matcher-related__heading{font-family:var(--atdt-font-mono);font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--atdt-muted);border:0;padding:0;margin:0 0 .8em}
.entry-content .matcher-related__heading::before{display:none}
.entry-content .matcher-related__domain,.entry-content .matcher-related__attribution{color:var(--atdt-muted)}
.entry-content .matcher-related__attribution a{color:var(--atdt-accent)}
.entry-content .atdt-granskad{font-family:var(--atdt-font-mono)}

/* ===== INLAGG, ARKIV, META ===== */
.single .entry-header .entry-meta{display:none}
.entry-meta{font-family:var(--atdt-font-mono);font-size:.76rem;letter-spacing:.02em;color:var(--atdt-muted)}
.entry-meta a{color:var(--atdt-muted)}
.entry-meta a:hover{color:var(--atdt-accent)}
footer.entry-meta{margin-top:2.4em;padding-top:1.1em;border-top:1px solid var(--atdt-neutral)}
.post-navigation{margin-top:.6em}
.read-more,.more-link{font-family:var(--atdt-font-mono);font-size:.82rem;font-weight:700}
.page-header .page-title{font-size:1.5rem}

/* ===== SIDFOT ===== */
.atdt-waterfall{display:block;width:100%;max-width:1100px;height:40px;margin:44px auto 0}
.atdt-waterfall rect:nth-child(1){fill:var(--atdt-muted)}
.atdt-waterfall rect:nth-child(2){fill:var(--atdt-accent)}
.atdt-waterfall rect:nth-child(3){fill:var(--atdt-accent-2)}
.atdt-waterfall rect:nth-child(4){fill:var(--atdt-ink)}
.site-footer{margin-top:16px}
.site-info{background:var(--atdt-ink);color:var(--atdt-on-dark-muted);font-family:var(--atdt-font-mono);font-size:.78rem;letter-spacing:.02em}
.inside-site-info{padding:22px 40px}
.site-info a,.footer-bar .widget_nav_menu li a{color:var(--atdt-on-dark);text-decoration:none}
.site-info a:hover,.footer-bar .widget_nav_menu li a:hover{color:var(--atdt-accent-2)}
.site-info .footer-bar .widget_nav_menu .current-menu-item a{color:var(--atdt-accent-2)}
.footer-bar .widget{background:transparent;color:inherit;padding:0;margin:0}
.atdt-no-tracking-footer{background:var(--atdt-ink);font-family:var(--atdt-font-mono);margin-top:0!important;border-top:1px solid color-mix(in srgb,var(--atdt-on-dark) 14%,transparent)!important;padding:1.1em 20px 1.5em!important;line-height:1.7}

/* ===== MOBIL ===== */
@media (max-width:768px){
	.inside-header{padding:20px 20px 16px}
	.main-title{font-size:1.4rem}
	.main-navigation .inside-navigation{padding:0}
	.main-navigation .main-nav ul li a{line-height:44px}
	.separate-containers .site-main{margin:16px 0}
	.separate-containers .inside-article,.separate-containers .page-header{padding:28px 18px 32px;border-left:0;border-right:0;border-radius:0}
	.home.separate-containers .inside-article{padding:14px 18px 4px}
	.entry-content h2{font-size:1.32rem}
	.entry-content table{font-size:.76rem}
	.entry-content table th,.entry-content table td{padding:.5em .55em}
	.entry-content pre,.entry-content .wp-block-code{font-size:.76rem}
	.atdt-waterfall{width:calc(100% - 36px);height:30px;margin-top:28px}
	.inside-site-info{padding:20px 18px}
}
