/*
Theme Name: ATDT Tyst.se
Theme URI: https://www.tyst.se/
Description: GeneratePress-barntema för tyst.se, kunskapsportal om akustik och ljudmiljö. Identitet: lugnt, nordiskt minimalt, dämpat. Skiffer-blå, varm sand, dämpad ljudvåg som motiv, Plus Jakarta Sans plus Inter plus IBM Plex Mono. Inkluderar portad produktkort-CSS och byline. Del av ATDT-nätverkets temarkitektur.
Author: Atdt AB
Template: generatepress
Version: 0.1.0
*/

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

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

.wp-block-heading,
.entry-content h2,
.entry-content h3,
.entry-content h4 {
	overflow-wrap: break-word;
	-webkit-hyphens: auto;
	hyphens: auto;
}

a { color: var(--atdt-accent); }
a:hover { color: var(--atdt-accent-2); }

.site-header {
	background: var(--atdt-bg);
	border-bottom: 1px solid var(--atdt-neutral);
}
.site-header .site-title a,
.main-title a {
	color: var(--atdt-ink);
	font-family: var(--atdt-font-display);
	font-weight: 700;
}
.main-navigation,
.main-navigation .inside-navigation {
	background: var(--atdt-bg) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	width: 100%;
}
.main-navigation .main-nav ul li a,
.main-navigation a {
	font-family: var(--atdt-font-display);
	font-weight: 600;
	color: var(--atdt-ink) !important;
	white-space: nowrap;
}
.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li.current-menu-item > a,
.main-navigation a:hover {
	color: var(--atdt-accent) !important;
}
.main-navigation .main-nav ul li.current-menu-item > a {
	box-shadow: inset 0 -3px 0 var(--atdt-accent-2);
}

.entry-content > p,
.entry-content > ul,
.entry-content > ol,
.entry-content > h2,
.entry-content > h3 {
	max-width: var(--atdt-maxwidth);
}

.entry-content code,
.atdt-data {
	font-family: var(--atdt-font-mono);
	font-feature-settings: "tnum" 1;
}
.entry-content code {
	background: var(--atdt-neutral);
	padding: 0.1em 0.35em;
	border-radius: 5px;
	font-size: 0.92em;
}

.entry-content blockquote {
	border-left: 4px solid var(--atdt-accent-2);
	background: var(--atdt-surface);
	border-radius: var(--atdt-radius);
	padding: 1rem 1.25rem;
	margin-left: 0;
}

.entry-content table { border-collapse: collapse; width: 100%; }
.entry-content table th {
	background: var(--atdt-accent);
	color: var(--atdt-on-accent);
	font-family: var(--atdt-font-display);
	font-weight: 600;
	text-align: left;
}
.entry-content table th,
.entry-content table td {
	border: 1px solid var(--atdt-neutral);
	padding: 0.55rem 0.75rem;
}

.entry-content .wp-block-button__link,
.atdt-btn,
button.wp-block-search__button {
	background: var(--atdt-accent);
	color: var(--atdt-on-accent);
	border-radius: var(--atdt-radius);
	font-family: var(--atdt-font-display);
	font-weight: 600;
}

.site-footer {
	background: var(--atdt-ink);
	color: var(--atdt-bg);
}
.site-footer a { color: var(--atdt-accent-2); }

/* === Portad produktkort-CSS (från gamla tyst.se-temat, klassnamn bevarade
   så befintlig /basta/-HTML fortsätter fungera). Färger via tokens. === */
.tyst-product-grid {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr) !important;
	gap: 1.5rem;
	margin: 2rem 0;
}
.tyst-product-card {
	border: 1px solid var(--atdt-neutral);
	border-radius: 8px;
	overflow: hidden;
	transition: box-shadow 0.2s ease;
	background: var(--atdt-surface);
}
.tyst-product-card:hover { box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1); }
.tyst-product-card img { width: 100%; height: auto; display: block; }
.tyst-card-body { padding: 1rem 1.25rem; }
.tyst-card-body h3 { font-size: 1.05rem; margin: 0 0 0.25rem; font-weight: 600; }
.tyst-card-price { font-size: 1.2rem; font-weight: 700; color: var(--atdt-accent); margin: 0.25rem 0; }
.tyst-card-verdict { font-size: 0.9rem; color: var(--atdt-muted); margin: 0.25rem 0 0.75rem; }
.tyst-cta-button {
	display: inline-block;
	background: var(--atdt-accent);
	color: #fff !important;
	padding: 0.6rem 1.25rem;
	border-radius: 4px;
	text-decoration: none !important;
	font-size: 0.9rem;
	font-weight: 500;
	transition: background 0.2s ease;
}
.tyst-cta-button:hover { background: var(--atdt-ink); }
.tyst-review-image { float: right; width: 280px; margin: 0 0 1rem 1.5rem; border-radius: 6px; }
.tyst-review-cta { clear: both; margin-top: 1rem; }
@media (max-width: 782px) {
	.tyst-product-grid { grid-template-columns: 1fr; }
	.tyst-review-image { float: none; width: 100%; margin: 0 0 1rem 0; }
}
.tyst-byline { color: var(--atdt-muted); font-size: 0.9rem; margin: -0.5rem 0 1.5rem 0; }

/*
 * Dämpad ljudvåg som motiv. Staplar som avtar i höjd, speglar hur ljud
 * absorberas till tystnad. Renderas via generate_before_footer som avdelare.
 */
.atdt-damp {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	gap: 5px;
	height: 32px;
	max-width: 1140px;
	margin: 2.75rem auto 0;
	padding: 0 1rem;
}
.atdt-damp span { width: 6px; border-radius: 3px; background: var(--atdt-accent); }
.atdt-damp span:nth-child(1) { height: 100%; }
.atdt-damp span:nth-child(2) { height: 80%; }
.atdt-damp span:nth-child(3) { height: 60%; }
.atdt-damp span:nth-child(4) { height: 42%; background: var(--atdt-accent-2); }
.atdt-damp span:nth-child(5) { height: 28%; background: var(--atdt-accent-2); }
.atdt-damp span:nth-child(6) { height: 16%; background: var(--atdt-accent-2); }
.atdt-damp span:nth-child(7) { height: 8%; background: var(--atdt-accent-2); }