/*!
Theme Name: Tammi Theme
Theme URI: http://underscores.me/
Author: Tammi Digital Oy
Author URI: https://tammidigital.fi/
Description: Custom theme: Tammi Theme, developed by Tammi Digital Oy
Version: 2.1.1
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: tammi-theme
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Tammi Theme is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/

@import "css/blocks.css";
@import "css/variables.css";

/***********************************************************************************/
/* CUSTOM CSS STARTS HERE */
/***********************************************************************************/

/* BOOTSTRAP */

.container-fluid {
	max-width: 1260px;
}
@media (min-width: 992px) {
	.container-fluid {
		padding-left: 30px;
		padding-right: 30px;
	}
}

/* TYPOGRAPHY */

body {
	font-family: 'Montserrat', sans-serif;
}
#content {
	min-height: calc(100vh - 300px);
}
h1 {
	font-size: 2rem;
}
span {
	font-weight: inherit;
}
@media (min-width: 992px) {
	h1 {
		font-size: 2.5rem;
	}
}
a {
	color: var(--pv);
}

/* MARGINS */
#content p {
	margin-bottom: 1.5rem;
}
h1, h2, h3, h4 {
	margin-bottom: 1em;
}
dl, ol, ul, .wp-block-image {
	margin-bottom: 2.5rem;
}

/* HEADER */

.site-header {
	background-color: var(--lv);
}
.site-header .custom-logo {
	width: auto;
	max-height: 60px;
	padding-top: 1rem;
	padding-bottom: 1rem;
}
.menu-col {
	margin: auto 0;
}
@media (min-width: 992px) {
	.site-header .custom-logo {
		max-height: 90px;
	}
}


/* HERO */

.hero {
	max-width: 1920px;
    margin: 0 auto;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.hero .row {
	min-height: 300px;
}
.hero h1 {
	line-height: 2;
	word-spacing: -1rem;
}
.hero h1 span {
	background-color: var(--lv);
	padding: .5rem;
}
@media (min-width: 992px) {
	.hero .row {
		min-height: 600px;
	}
}

/* FOOTER */

.site-footer {
	background-color: black;
	color: white;
	font-size: 0.875rem;
}
.site-footer a {
	color: inherit;
}
.site-footer :not(.menu-item) > a {
	text-decoration: underline;
}
.site-footer a:is(:hover, :focus) {
	color: var(--hv);
}
.site-footer .menu {
	list-style: none;
	padding-left: 0;
}
.site-footer .menu a::before {
	content: "» ";
	color: white;
}

/* SIDEBAR */

.sidebar {
	height: 100%;
}
.sidebar .sidebar-links {
	list-style: none;
	padding-left: 0;
}
.sidebar .sidebar-links a {
	color: inherit;
}
.sidebar .sidebar-links a::before {
	content: "» ";
}
@media (min-width: 992px) {
	.sidebar {
		border-left: 2px solid #000;
		padding-left: 30px;
	}
	.sidebar .sidebar-post [class*="col"] {
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
	}
}

/* YHTEYSTIETO */

.yhteystieto {
	padding-top: 15px;
	padding-bottom: 15px;
}

/* LOADER */
.loader {
	display: block;
	margin: 0 auto 40px;
	color: transparent!important;
	background-color: transparent!important;
	width: 50px;
	height: 50px;
	border: 4px solid var(--pv);
	border-bottom-color: transparent;
	border-radius: 50%;
	box-sizing: border-box;
	animation: sub-product-loading 1s linear infinite;
}
.loader:before {
	height: 0!important;
}
@keyframes sub-product-loading {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}


/**********************************/

/* PAGE */




/**********************************/

/* SINGLE & CUSTOM POST SINGLE */



/**********************************/

/* ARTIKKELILISTAUS */

.categories {
    text-align: center;
}
.category-label {
	cursor: pointer;
	margin-right: 10px;
	margin-bottom: 10px;
	font-weight: 700;
}
.category:checked + .category-label {
	background-color: #000;
	color: #fff;
}
.category:focus-visible + .category-label {
	outline: 2px #FF3363 solid;
}
#loader-container {
    height: 80px;
}
button:disabled {
    opacity: 0.7;
    pointer-events: none;
}
#pagination p {
	margin: 0;
	font-size: 1.1rem;
}
#pagination button {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 28px;
	width: 28px;
	background-color: #FF3363;
	color: white;
	border: none;
}
#pagination button:disabled {
	opacity: 0.5;
}
#pagination button.prev,
#pagination p#current-page {
	margin-right: 10px;
}
#pagination button.next {
	margin-left: 10px;
}
#pagination #max-number {
	margin-left: 10px;
}

/* ARTIKKELIKORTIT */
.artikkelikortti {
	padding: 10px 15px;
    background-color: white;
    box-shadow: 0 5px 10px 0px rgb(86 99 109 / 20%);
	height: 100%;
	position: relative;
}
.artikkelikortti .post-thumbnail {
	margin: 0 -15px;
}
.artikkelikortti .post-thumbnail img {
	aspect-ratio: 16 / 9;
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.card-title {    
    font-size: 1.5rem;
	font-weight: 700;
	margin-bottom: 1.5rem;
}
.artikkelikortti .post-excerpt {
	display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 4.5rem;
}
.artikkelikortti > a:is(:hover, :focus) {
	text-decoration: none;
}
.artikkelikortti > a:is(:hover, :focus) .card-title {
	text-decoration: underline;
	color: var(--pv);
}

/* Oppimateriaalit */
.ld-course-status, .ld-status, .ld-progress, .ld-lesson-list-progress, .learndash_mark_complete_button {
	display: none!important;
}
.learndash-wrapper .ld-content-actions {
	flex-wrap: wrap;
}
a.extra-learndash-nav-link.ld-primary-color.ld-course-step-back {
	min-width: 100%;
}
@media (max-width: 640px) {
	a.extra-learndash-nav-link.ld-primary-color.ld-course-step-back {    
		display: block;
		font-size: 1rem;
		margin: 0;
		text-align: center;
		width: 100%;
		padding: 1.25em;
	}
}

/* LISÄTOIVEET 9.8. */
.sarja-yleinen, .sarja-tutkii, .sarja-inspiroi, .sarja-oppimateriaalit, .sarja-kehittaa,
.is-style-yleinen, .is-style-tutkii, .is-style-inspiroi, .is-style-oppimateriaalit, .is-style-kehittaa {
	position: relative;
}
.is-style-yleinen, .is-style-tutkii, .is-style-inspiroi, .is-style-oppimateriaalit, .is-style-kehittaa {
    padding-bottom: 1.5%;
}
.sarja-yleinen:after, .sarja-tutkii:after, .sarja-inspiroi:after, .sarja-oppimateriaalit:after, .sarja-kehittaa:after,
.is-style-yleinen:after, .is-style-tutkii:after, .is-style-inspiroi:after, .is-style-oppimateriaalit:after, .is-style-kehittaa:after  {
    content: "";
    position: absolute;
    width: 100%;
    aspect-ratio: 25 / 1;
    bottom: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
}
.sarja-yleinen:after, .is-style-yleinen:after {
    background-image: url(./images/xamk_julkaisusarja_musta.svg);
}
.sarja-tutkii:after, .is-style-tutkii:after {
    background-image: url(./images/xamk_julkaisusarja_turkoosi.svg);
}
.sarja-inspiroi:after, .is-style-inspiroi:after {
    background-image: url(./images/xamk_julkaisusarja_lila.svg);
}
.sarja-oppimateriaalit:after, .is-style-oppimateriaalit:after {
    background-image: url(./images/xamk_julkaisusarja_keltainen.svg);
}
.sarja-kehittaa:after, .is-style-kehittaa:after {
    background-image: url(./images/xamk_julkaisusarja_vihrea.svg);
}
.wpml-ls-legacy-list-horizontal.wpml-ls-statics-footer {
	background-color: black;
	margin-bottom: 0;
}
.wpml-ls-statics-footer .wpml-ls-item > a {
	background-color: black;
	color: white;
}
.wpml-ls-statics-footer .wpml-ls-item > a:is(:hover, :focus) {
	background-color: black;
	color: var(--hv);
}
h2, h3, h4, h5, h6 {
    margin-top: 0.5em;
}
:where(.wp-block-columns.is-layout-flex) {
    gap: 3em
}
.hero-ingressi {
    font-size: 1.5rem;
    font-weight: 500;
    background-color: white;
    width: fit-content;
    width: -moz-fit-content;
    padding: 0 5px;
}