/*
Theme Name: ATDT Adblock.se
Theme URI: https://www.adblock.se/
Description: GeneratePress-barntema för adblock.se. Identitet: oberoende guide till annonsblockering och digital integritet. Mörkt "skyddat läge"-tema, elektrisk mint-grön signalfärg, sköld-motiv, Space Grotesk + Inter. Del av ATDT-nätverkets temarkitektur.
Author: Atdt AB
Template: generatepress
Version: 0.1.0
*/

/* Bas - tokens i tokens.css, komponenter i atdt-theme-kit. Mörkt tema. */

body {
	background: var(--atdt-bg);
	color: var(--atdt-ink);
	font-family: var(--atdt-font-body);
}

/* GeneratePress-ytor mörka (annars vita default-containrar) */
.site-content,
.content-area,
.site-main,
.inside-article,
#content,
#page,
.separate-containers .inside-article,
.separate-containers .comments-area,
.separate-containers .paging-navigation,
.site-footer,
.widget-area .widget,
.sidebar .widget {
	background: var(--atdt-bg);
}

/* Kort/panelytor något ljusare än bas */
.separate-containers .inside-article {
	background: var(--atdt-surface);
	border: 1px solid var(--atdt-neutral);
	border-radius: var(--atdt-radius);
}

h1, h2, h3, h4, h5, h6,
.entry-title {
	font-family: var(--atdt-font-display);
	font-weight: 700;
	color: var(--atdt-ink);
	letter-spacing: -0.01em;
}

p, li, .entry-content { color: var(--atdt-ink); }

a { color: var(--atdt-accent); text-underline-offset: 2px; }
a:hover { color: var(--ab-cyan); }

/* Sidhuvud - mörkt med ordmärke och meny */
.site-header {
	background: var(--atdt-bg);
	border-bottom: 1px solid var(--atdt-neutral);
}
.main-title a,
.site-description { color: var(--atdt-ink); }
.main-navigation,
.main-navigation .main-nav ul li a,
.main-navigation .menu-toggle {
	background: var(--atdt-bg);
	color: var(--atdt-ink);
}
.main-navigation a { font-family: var(--atdt-font-display); font-weight: 600; }
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li.current-menu-item > a {
	color: var(--atdt-accent);
}
/* Undermenyer (dropdowns) - mörk yta, läsbar text */
.main-navigation ul ul {
	background: var(--atdt-surface);
	border: 1px solid var(--atdt-neutral);
}
.main-navigation .main-nav ul ul li a {
	background: var(--atdt-surface);
	color: var(--atdt-ink);
}

/* Brödtext-länkar i innehåll får understrykning för tydlighet */
.entry-content a { text-decoration: underline; }

/* Innehållsbredd för läsbar löptext */
.entry-content > p,
.entry-content > ul,
.entry-content > ol,
.entry-content > h2,
.entry-content > h3,
.entry-content > blockquote {
	max-width: var(--atdt-maxwidth);
}

/* Knappar / CTA */
.atdt-btn,
.wp-block-button__link,
.entry-content .button {
	display: inline-block;
	background: var(--atdt-accent);
	color: var(--atdt-on-accent);
	font-family: var(--atdt-font-display);
	font-weight: 700;
	padding: .7rem 1.4rem;
	border-radius: var(--atdt-radius);
	text-decoration: none;
	transition: transform .12s ease, background .15s ease;
}
.atdt-btn:hover,
.wp-block-button__link:hover {
	background: var(--ab-cyan);
	color: var(--atdt-on-accent);
	transform: translateY(-1px);
}

/* Sidfot - djup teal */
.site-footer,
.site-info {
	background: var(--atdt-accent-2);
	color: #EAF0F2;
}
.site-footer a, .site-info a { color: #fff; }

/* Sidfotsmeny (legala sidor) */
.atdt-footer-nav { text-align: center; padding: 1.4rem 0 .4rem; background: var(--atdt-accent-2); }
.atdt-footer-menu { list-style: none; display: flex; flex-wrap: wrap; gap: 1.4rem; justify-content: center; margin: 0; padding: 0; }
.atdt-footer-menu a { color: #EAF0F2; text-decoration: none; font-family: var(--atdt-font-display); font-weight: 600; font-size: .92rem; }
.atdt-footer-menu a:hover { color: var(--atdt-accent); }

/* Hero på startsidan */
.atdt-hero {
	display: grid; gap: 1.6rem;
	grid-template-columns: 1.3fr 1fr;
	align-items: center;
	margin: 1.5rem 0 2.5rem;
}
@media (max-width: 768px) { .atdt-hero { grid-template-columns: 1fr; } }
.atdt-eyebrow {
	font-family: var(--atdt-font-display); font-weight: 700;
	text-transform: uppercase; letter-spacing: .12em;
	font-size: .78rem; color: var(--atdt-accent); margin: 0 0 .4rem;
}
.atdt-hero__title {
	font-size: clamp(2rem, 5vw, 3.2rem); line-height: 1.05; margin: 0 0 .8rem;
}
.atdt-hero__lead { color: var(--atdt-muted); font-size: 1.1rem; max-width: 40ch; }

/* Sköld-panel i hero */
.atdt-panel {
	background: var(--atdt-surface);
	border: 1px solid var(--atdt-neutral);
	border-radius: var(--atdt-radius);
	padding: 1.4rem;
}
.atdt-panel__metrics { display: flex; gap: 1.2rem; margin-top: 1rem; flex-wrap: wrap; }
.atdt-panel__metric { display: flex; flex-direction: column; }
.atdt-panel__metric b { font-family: var(--atdt-font-display); font-size: 1.5rem; color: var(--atdt-accent); }
.atdt-panel__metric span { color: var(--atdt-muted); font-size: .82rem; }
.atdt-card__name { font-family: var(--atdt-font-display); color: var(--atdt-ink); display:block; margin-top: .4rem; }

/* Kategori-piller-strip */
.ab-topics { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1rem 0 2rem; }
.ab-topics a {
	border: 1px solid var(--atdt-neutral); border-radius: 999px;
	padding: .45rem 1rem; text-decoration: none; color: var(--atdt-ink);
	font-family: var(--atdt-font-display); font-weight: 600; font-size: .9rem;
	transition: border-color .15s ease, color .15s ease;
}
.ab-topics a:hover { border-color: var(--atdt-accent); color: var(--atdt-accent); }

/* Kortrutnät för guider */
.atdt-card-grid { display: grid; gap: 1.2rem; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); margin: 1rem 0 2rem; }
.atdt-card {
	background: var(--atdt-surface); border: 1px solid var(--atdt-neutral);
	border-radius: var(--atdt-radius); overflow: hidden;
}
.atdt-card__body { padding: 1rem 1.1rem; }
.atdt-card__name a { text-decoration: none; }
.atdt-card__specs { color: var(--atdt-muted); font-size: .85rem; margin: .3rem 0 0; }

/* Jämförelsetabeller */
.entry-content table { border-collapse: collapse; width: 100%; }
.entry-content table th {
	background: var(--atdt-accent-2); color: #EAF0F2;
	font-family: var(--atdt-font-display); padding: .6rem .8rem; text-align: left;
}
.entry-content table td { border-bottom: 1px solid var(--atdt-neutral); padding: .55rem .8rem; }

/* Sköld-motiv: rad av tonade sköld-/blockprickar */
.atdt-motif-rule {
	height: 14px; border-bottom: none;
	background-image:
		radial-gradient(circle at 9px 7px, var(--atdt-accent) 0 4px, transparent 5px),
		radial-gradient(circle at 27px 7px, var(--ab-cyan) 0 4px, transparent 5px),
		radial-gradient(circle at 45px 7px, var(--ab-coral) 0 4px, transparent 5px);
	background-repeat: repeat-x;
	background-size: 54px 14px;
	background-position: left center;
	opacity: .9;
	margin: 2rem 0;
}

/* Content-intel-callouts har ljusa inline-bakgrunder och antar mörk text från
   ett ljust tema. I mörkt tema ärver de annars temats ljusa text -> ljus-på-ljus.
   Tvinga mörk text + länkar. */
.entry-content div[style*="background:#fefce8"],
.entry-content div[style*="background: #fefce8"],
.entry-content div[style*="background:#f8fafc"],
.entry-content div[style*="background: #f8fafc"],
.entry-content div[style*="background:#fef9c3"],
.entry-content div[style*="background:#f0f9ff"],
.entry-content div[style*="background:#ecfdf5"],
.entry-content div[style*="background:#fff7ed"] {
	color: #15171C;
}
.entry-content div[style*="background:#fefce8"] *,
.entry-content div[style*="background: #fefce8"] *,
.entry-content div[style*="background:#f8fafc"] *,
.entry-content div[style*="background: #f8fafc"] *,
.entry-content div[style*="background:#fef9c3"] *,
.entry-content div[style*="background:#f0f9ff"] *,
.entry-content div[style*="background:#ecfdf5"] *,
.entry-content div[style*="background:#fff7ed"] * {
	color: #15171C;
}
.entry-content div[style*="background:#fefce8"] a,
.entry-content div[style*="background:#f8fafc"] a {
	color: #155E4A; text-decoration: underline;
}