/*
Theme Name: SFK - Charta Child
Author: Calle Bokedal
Description: A child theme for Charta, to be used by Sjövalla FK
Requires at least: 5.8
Tested up to: 5.9
Requires PHP: 5.6
Version: 0.14
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: charta-child
Template: charta
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments

Charta Child WordPress Theme, (C) 2021 WordPress.org
Charta Child is distributed under the terms of the GNU GPL.
*/

/*--------------------------------------------------------------
# - Theme Layout
--------------------------------------------------------------*/
:root {
	--charta--layout-spacing: 0.25rem;
}

@media only screen and (min-width: 640px) {
	:root {
		--charta--layout-spacing: 0.5rem;
	}
}

@media only screen and (min-width: 960px) {
	:root {
		--charta--layout-spacing: 1rem;
	}
} 

/* Override Columns Block */
@media (max-width: 599px) {
	.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column:not(:first-child) {
		margin-top: var(--wp--style--block-gap, 1em);
	}
}

/* Override List styles */
main ul {
	list-style-type: disc;
	padding-left: 15px;
	line-height: 1.3rem;
}
main ul li {
	margin-bottom: 0.5rem;
}
.sidebar ul, .sidebar ol,
header ul, header ol,
footer ul, footer ol {
	margin: var(--wp--custom--spacing--elements) 0;
	padding: 0 0 0 0;
}
.sidebar ul, .sidebar ol,
header ul, header ol,
footer ul, footer ol {
	list-style: none;
}
.sidebar .wp-block-group li:first-child {
	border-top: 1px solid #e8e8e8;
}
.sidebar .wp-block-group li {
	border-bottom: 1px solid #e8e8e8;
}

a {
	text-decoration: none;
}
/*header a.wp-block-navigation-item__content :not(.wp-block-navigation__submenu-container),
footer a {
	color: white;
}
/*header .wp-block-navigation__submenu-container >  a.wp-block-navigation-item__content span.wp-block-navigation-item__label {
	color: var(--wp--preset--color--dark-gray);
}*/
header.wp-block-navigation-link a {
	color: white;
}
.is-style-post-meta a {
	font-weight: 700;
}
.wp-block-post-title a {
	color: var(--wp--preset--color--primary);
}

li.has-light-gray-background-color > a {
	color: var(--wp--preset--color--dark-gray);
}

.todo footer .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-container {
	padding-top: 100px;
}

/* Override Widget Title */
.is-style-widget-title {
	padding-bottom: 0;
	border-bottom: 0;
}

.wp-block-site-logo img,
.wp-block-image img {
    filter: none;
}

.wp-block-site-logo {
	padding: 10px;
}
.wp-block-site-logo img, 
.wp-block-site-logo .components-placeholder__illustration, 
.wp-block-site-logo .components-placeholder::before {
    filter: none;
}

/* :not(.is-menu-open) below might not be working as intended */ 

/* Style for current item in header + footer menu (not opened menu) */ 
/*:not(.is-menu-open) .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item.current-menu-item .wp-block-navigation-item__content*/
.wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item.current-menu-item .wp-block-navigation-item__content {
	text-decoration: none;
}

/* Style of sub menu item (not opened menu) */ 
/*:not(.is-menu-open) .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container*/
.wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container {
	padding: 0;
	box-shadow: 1px 1px 4px 2px rgba(0,0,0,.11);
	border-radius: 2px;
}

/* TODO Fix */
header div.wp-block-navigation__responsive-container.has-modal-open ul.wp-block-navigation__submenu-container {
	padding-top: 5px !important;
	padding-bottom: 5px !important;
}

/* Opened header menu in responsive mode */
/*.wp-block-navigation__responsive-container.is-menu-open.has-modal-open a span.wp-block-navigation-item__label*/
/*.wp-block-navigation__responsive-container.is-menu-open.has-modal-open a span.wp-block-navigation-item__label*/
header .wp-block-navigation__responsive-container.is-menu-open.has-modal-open a {
	color: var(--wp--preset--color--dark-gray);
}

/*header .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation-item__content*/
header .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation-item__content:hover,
header .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation-item__content:focus,
header .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation-item__content:active {
	transition: background-color .5s;
	background-color: #45A550;
	text-decoration: none;
}
header .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	transition: background-color .5s;
	background-color: #E8E8E8;
}
header .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container {
	border-bottom: 1px solid #E8E8E8;
	padding: 0;
	box-shadow: 1px 1px 4px 2px rgba(0,0,0,.11);
	border-radius: 2px;
}
header .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	border-bottom: 1px solid #E8E8E8;
}

/* Footer menu customization */
footer div.wp-block-navigation__responsive-container.has-modal-open ul.wp-block-navigation__submenu-container {
	color: white;
}

footer .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation-item__content:hover,
footer .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation-item__content:focus,
footer .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation-item__content:active {
	transition: background-color .5s;
	background-color: #3D3D3D;
	text-decoration: none;
}
footer .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container {
	padding: 0;
}
footer .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	transition: background-color .5s;
	background-color: #3D3D3D;
}
footer .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	border: 1px solid var(--wp--preset--color--dark-gray);
	border-top: 0;
}
footer .wp-block-navigation__responsive-container:not(.has-modal-open) .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container li:first-child {
	border-top: 1px solid var(--wp--preset--color--dark-gray);
}

/* Not working so well - start */
/*
:not(.is-menu-open) .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation-item__content:hover, 
:not(.is-menu-open) .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation-item__content:focus, 
:not(.is-menu-open) .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation-item__content:active {
	transition: background-color .5s;
	background-color: var(--wp--preset--color--primary);
	text-decoration: none;
}
:not(.is-menu-open) .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover, 
:not(.is-menu-open) .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus, 
:not(.is-menu-open) .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content:active {
	background-color: #E8E8E8;
}
:not(.is-menu-open) .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content, 
:not(.is-menu-open) .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content, 
:not(.is-menu-open) .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	border-bottom: 1px solid #E8E8E8;
}
:not(.is-menu-open) footer .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover, 
:not(.is-menu-open) footer .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus, 
:not(.is-menu-open) footer .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content:active {
	background-color: #3D3D3D;
}
:not(.is-menu-open) footer .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content, 
:not(.is-menu-open) footer .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content, 
:not(.is-menu-open) footer .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	border: 1px solid var(--wp--preset--color--dark-gray);
	border-top: 0;
}
:not(.is-menu-open) footer .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container li:first-child, 
:not(.is-menu-open) footer .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container li:first-child, 
:not(.is-menu-open) footer .wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-container li:first-child {
	border-top: 1px solid var(--wp--preset--color--dark-gray);
}*/
/* Not working so well - end */

footer .is-style-flip-link-hover a:hover {
	transition: color .2s;
	color: white;
	/*color: var(--wp--preset--color--primary);*/
	text-decoration: none;
}

/* Use other submenu indicator */
.wp-block-navigation__submenu-icon::before {
	content: "";
	background-image: url('/wp-content/themes/charta-child/assets/img/caret-down-fill.svg');
	background-size: 8px 8px;
	background-repeat: no-repeat;
	content:"";
	display: inline-block;
	width: 10px;
	height: 10px;
}
.wp-block-navigation__submenu-icon svg:not(.bi) {
	display: none;
	visibility: hidden;
}/*
.wp-block-navigation__submenu-icon svg.bi {
	font-size: 5.5rem;
	fill: #45A550;
}*/

.wp-block-navigation__responsive-container-open::before {
	content: "";
	background-image: url('/wp-content/themes/charta-child/assets/img/list.svg');
	background-size: 18px 18px;
	background-repeat: no-repeat;
	content:"";
	display: inline-block;
	width: 18px;
	height: 18px;
	padding-right: 20px;
}
.wp-block-navigation__responsive-container-open svg:not(.bi) {
	display: none;
	visibility: hidden;
}

header.site-header > section {
	padding: 0 !important;
}

/* Site logo text */
header > section .sfk-section {
	background-image: url("/wp-content/themes/charta-child/assets/img/sfk-frisksportklubb.png");
	background-repeat: no-repeat;
	background-size: 210px 45px;
	width: 210px;
	height: 45px;
}
/* Set section-specifik logo by adding additional class (like 'sfk-ol') to logo group in component: header */
header > section .sfk-section.sfk-admin {background-image: url("/wp-content/themes/charta-child/assets/img/sfk-admin.png");}
header > section .sfk-section.sfk-fotboll {background-image: url("/wp-content/themes/charta-child/assets/img/sfk-fotboll.png");}
header > section .sfk-section.sfk-friidrott {background-image: url("/wp-content/themes/charta-child/assets/img/sfk-friidrott.png");}
header > section .sfk-section.sfk-frisksportungdom {background-image: url("/wp-content/themes/charta-child/assets/img/sfk-frisksportungdom.png");}
header > section .sfk-section.sfk-innebandy {background-image: url("/wp-content/themes/charta-child/assets/img/sfk-innebandy.png");}
header > section .sfk-section.sfk-mountainbike {background-image: url("/wp-content/themes/charta-child/assets/img/sfk-mountainbike.png");}
header > section .sfk-section.sfk-ol {background-image: url("/wp-content/themes/charta-child/assets/img/sfk-orientering.png");}
header > section .sfk-section.sfk-sacro {background-image: url("/wp-content/themes/charta-child/assets/img/sfk-sacro.png");}
header > section .sfk-section.sfk-seniorer {background-image: url("/wp-content/themes/charta-child/assets/img/sfk-seniorer.png");}
header > section .sfk-section.sfk-skateboard {background-image: url("/wp-content/themes/charta-child/assets/img/sfk-skateboard.png");}
header > section .sfk-section.sfk-skidor {background-image: url("/wp-content/themes/charta-child/assets/img/sfk-skidor.png");}
header > section .sfk-section.sfk-trampolin {background-image: url("/wp-content/themes/charta-child/assets/img/sfk-trampolin.png");}
header > section .sfk-section.sfk-volleyboll {background-image: url("/wp-content/themes/charta-child/assets/img/sfk-volleyboll.png");}

/*.wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open svg {
	fill: #ff00f2 !important;
}*/
/*
button.wp-block-navigation__submenu-icon svg {
	content: "...";
	color: "#ff00ff";
}

button.wp-block-navigation__submenu-icon,
.wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-icon {
	color: "#ff00ff";
	content: "...";
	margin-top: 200px !important;
}

.wp-block-navigation .wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation__submenu-icon svg {
	color: "#ff00ff";
	fill: "#ff00f1";
}

.wp-block-navigation .wp-block-navigation__submenu-icon svg path {
	fill: "#ff00f1";
}
*/

/* Display gaps as white on small screens */
@media only screen and (max-width: 500px) {
	main.has-light-background-background-color {
		background-color: white !important;
	}

	main.wp-block-group.has-background {
		padding-left: 0;
		padding-right: 0;
	}
	main div.wp-block-group.has-background {
	/*main div.is-layout-flow.wp-block-column :not(.post-wrapper) {*/
		padding-left: 10px;
		padding-right: 10px;
	}

	main ul {
		padding-left: 20px;
	}

	li.post {
		margin-bottom: 15px;
		box-shadow: 0px 12px 0px 0px var(--wp--preset--color--light-gray);
	}
	.sidebar-wrapper {
		margin-top: 5px !important;
	}
}

hr.wp-block-separator {
	width: 100% !important;
	max-width: 100% !important;
	background-color: var(--wp--preset--color--primary);
}


/* ÄNDRINGAR ATT EVENTUELLT FLYTTA ÖVER TILL THEME.JS */


/* Sidbredd */
.wp-block-group.wp-container-6 > :where(:not(.alignleft):not(.alignright):not(.alignfull)), .wp-block-group.wp-container-21 > :where(:not(.alignleft):not(.alignright):not(.alignfull)), .wp-block-group.wp-container-36 > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: 980px;
}

/* Text och stycke */
body {
	line-height: 1.4; 
}
p {
	margin-bottom: 15px;
}

@media only screen and (min-width: 980px) {

/* Bakgrund och ram huvudkolumn */
	
.post-wrapper div.is-layout-flow.wp-block-group.has-white-background-color.has-background {
	padding: 30px 40px !important;
	border: 1px solid #eee;
	border-radius: 3px;
	margin-right: 9px;
}

/* Kolumnmellanrum tvåspalt i post */	

.wp-block-column.is-vertically-aligned-top:first-child {
	margin-right: 20px;
}

/* Bakgrund och länkutseende sidebar */	
	
.post-wrapper div.is-layout-flow.wp-block-column.sidebar-wrapper {
	background-color: #eee;
}

.sidebar .is-layout-flow.wp-block-group.widget.has-white-background-color.has-background {
	background-color: #f5f5f5 !important;
	padding: 25px;
	border-radius: 3px;
}

.sidebar .wp-block-group li:first-child {
	border-top: none;
}

.sidebar .wp-block-group li {
	border-bottom: none;
}
}