/*
Theme Name: Vadelma
Description: Vadelma ry:n oma teema, pohjautuu Twenty Twenty -teemaan. Säilyttää nykyisen värimaailman ja taustakuvan, mutta korvaa Customizerin Lisä-CSS-tekstikentän versionhallitulla teemalla.
Template: twentytwenty
Version: 1.0.4
Author: Vadelma ry
Text Domain: vadelma
*/

/* Pienempi, virtaviivaisempi otsikkopalkki */
.header-inner {
	padding: 0.2rem 0 !important;
}

/* Postauksen/sivun otsikko lähemmäs yläreunaa: emoteeman oletus on
 * jopa 8rem paddingia työpöydällä, tehdään siitä hyvin ohut. */
.singular .entry-header {
	padding: 0.3rem 0 0.6rem !important;
	background-color: rgba(1, 20, 1, 0.5) !important;
}

/* Sisällön ensimmäinen palsta (.post-inner) sai emoteemalta oman
 * ison padding-top-arvonsa (jopa 8rem työpöydällä) otsikkolohkon
 * PÄÄLLE - siksi otsikon kaventaminen ei yksin siirtänyt sisältöä. */
.post-inner {
	padding-top: 1rem !important;
}

/* Tyhjä kategorialistaus (sivuilla ei yleensä ole kategorioita) varasi
 * tilaa vaikka siinä ei ollut mitään näkyvää sisältöä. */
.entry-categories:has(> .entry-categories-inner:empty) {
	display: none;
}

.site-logo img {
	max-height: 3.4rem !important;
}

@media (min-width: 700px) {
	.site-logo img {
		max-height: 4.6rem !important;
	}
}

.site-description {
	font-size: 2.0rem !important;
	margin-top: 0.2rem !important;
}

/* Vanhojen artikkelien tumma/musta inline-teksti nakyviin tummalla pohjalla */
.entry-content [style*="color:#000"],
.entry-content [style*="color: #000"],
.entry-content [style*="color:black"],
.entry-content [style*="color: black"],
.entry-content [style*="color:#111"],
.entry-content [style*="color: #111"],
.entry-content [style*="color:#222"],
.entry-content [style*="color: #222"],
.entry-content [style*="color:#333"],
.entry-content [style*="color: #333"],
.entry-content [style*="color: rgb(0"],
.entry-content font[color="#000000"],
.entry-content font[color="black"] {
	color: #ffffff !important;
}

/* Painikkeiden perusmuoto: pyoreat kulmat + keskitys */
.wp-block-button__link {
	border-radius: 8px !important;
}

.entry-content .wp-block-buttons {
	display: flex !important;
	width: 100% !important;
	justify-content: center !important;
	text-align: center !important;
	margin: 1.8rem auto 2.2rem !important;
	flex-wrap: wrap;
}

.entry-content .wp-block-buttons .wp-block-button {
	margin: 0.5rem;
}

/* ===================================================== */
/* DIY-zine / flyer -ilme koko sivustolle: kasintehty, maanlaheinen, punk */
/* ===================================================== */
@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');

.entry-title,
.entry-content h1,
.entry-content h2,
.entry-content h3,
.site-title {
	font-family: 'Archivo Black', Impact, 'Arial Narrow', sans-serif !important;
	text-transform: uppercase;
	letter-spacing: 0.01em;
}

/* Rosoinen alleviivaus valiotsikoille sisallossa (esim. Tapahtumat-sivun kategoriat) */
.entry-content h2 {
	border-bottom: 3px dashed #fa4273;
	padding-bottom: 0.3rem;
	display: block;
	text-align: center !important;
	width: fit-content;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Logo hieman vinoon etusivulla, kasintehdyn nakoinen - ei kehysta */
.home .entry-content > figure.wp-block-image:first-of-type img {
	max-width: 220px;
	height: auto;
	display: block;
	margin: 0 auto 0.5rem;
	transform: rotate(-2deg);
	border: none !important;
	box-shadow: none !important;
}

/* Tarramaiset, hieman vinossa olevat napit, jotka suoristuvat hoverissa */
.entry-content .wp-block-buttons .wp-block-button__link {
	border: 3px solid #002b0d;
	box-shadow: 3px 3px 0 #002b0d;
	font-family: 'Archivo Black', Impact, sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.entry-content .wp-block-buttons .wp-block-button:nth-child(3n+1) .wp-block-button__link {
	transform: rotate(-2deg);
}

.entry-content .wp-block-buttons .wp-block-button:nth-child(3n+2) .wp-block-button__link {
	transform: rotate(1.5deg);
}

.entry-content .wp-block-buttons .wp-block-button:nth-child(3n+3) .wp-block-button__link {
	transform: rotate(-1deg);
}

.entry-content .wp-block-buttons .wp-block-button__link:hover {
	transform: rotate(0deg) scale(1.04);
	box-shadow: 4px 4px 0 #002b0d;
}

/* Rosoinen, repeytynyt jakoviiva */
.wp-block-separator {
	border: none !important;
	height: 12px;
	background-image: repeating-linear-gradient(135deg, #fa4273 0, #fa4273 6px, transparent 6px, transparent 12px);
	opacity: 0.85;
	margin: 2.2rem auto !important;
	max-width: 220px;
	width: 100%;
}

/* Kiinnitetyn/tapetun valokuvan efekti sisaltokuville koko sivustolla (paitsi etusivun logo, ohitettu ylla) */
.entry-content img {
	border: 6px solid #ffffff;
	box-shadow: 0 2px 6px rgba(0,0,0,0.45);
	max-width: 100%;
	height: auto;
	transition: transform 0.2s ease;
}

.entry-content figure.wp-block-image:nth-of-type(odd) img,
.entry-content > img:nth-of-type(odd) {
	transform: rotate(-1.5deg);
}

.entry-content figure.wp-block-image:nth-of-type(even) img,
.entry-content > img:nth-of-type(even) {
	transform: rotate(1.5deg);
}

.entry-content img:hover {
	transform: rotate(0deg) scale(1.02);
}

.home .entry-content > figure.wp-block-image:first-of-type img {
	border: none !important;
	box-shadow: none !important;
}
