/**
 * Theme Name:	ZLP Theme
 * Template:	twentytwentyfive
 * Version:	1.0
 * Author:	creandi
 */

/* noto-sans-regular - latin */
@font-face {
    font-display: swap;
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 400;
    src: url('/wp-content/uploads/fonts/noto-sans-v42-latin-regular.woff2') format('woff2');
}

/* noto-sans-500 - latin */
@font-face {
    font-display: swap;
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 500;
    src: url('/wp-content/uploads/fonts/noto-sans-v42-latin-500.woff2') format('woff2');
}

/* noto-sans-display-700 - latin */
@font-face {
    font-display: swap;
    font-family: 'Noto Sans Display';
    font-style: normal;
    font-weight: 700;
    src: url('/wp-content/uploads/fonts/noto-sans-display-v30-latin-700.woff2') format('woff2');
}

/* noto-serif-regular - latin */
@font-face {
    font-display: swap;
    font-family: 'Noto Serif';
    font-style: normal;
    font-weight: 400;
    src: url('/wp-content/uploads/fonts/noto-serif-v33-latin-regular.woff2') format('woff2');
}

body {
    hyphens: auto;
}

footer {
    margin-block-start: 0;
}

.footer-nav ul {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(12rem + 4vw), 1fr));
    row-gap: var(--wp--preset--spacing--8);
    column-gap: var(--wp--preset--spacing--24);
}

.deco {
    justify-content: stretch;
    align-items: flex-end;
    width: 100%;

    & .line {
        height: 3px;
        background-color: var(--wp--preset--color--accent-1);
        flex: 1 auto;
    }
}

.is-sans {
    font-family: var(--wp--preset--font-family--noto-sans);
}

/*---- Buttons/Icons ----*/

.wp-block-search__button {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.wp-block-search__button svg {
    height: 1.8em;
    width: 1.8em;
}

.wp-element-button:not(.wp-block-search__button)::after {
    content: '›';
    margin-left: 1ch;
    font-size: 1.2em;
    line-height: 0;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
    border-color: var(--wp--preset--color--accent-2);
    color: var(--wp--preset--color--accent-2);
}

a.button-gray {
    width: 42px;
    height: 42px;
    display: flex;
    justify-content: center;
    align-items: baseline;
    background: var(--wp--preset--color--accent-6);
    text-decoration: none;
    font-size: 1.2em;
    font-weight: 500;
}

/*--- Header ----*/

.wp-block-site-logo img {
    width: 100%;
	height: clamp(3.125rem, 9vw, 5rem);
}

.nav-desktop .wp-block-navigation {
	align-items: stretch;
	& ul>li {
		height: 100%;
	}
}

.nav-mobile .wp-block-navigation__responsive-dialog .wp-block-navigation__responsive-container-content li.wp-block-navigation-item:has(.archive-search-icon) {
    position: absolute;
    top: -3.6rem;
}

.nav-mobile .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-icon {
 	display: inline-block;
	position: absolute;
  	align-self: flex-end;
  	margin-top: 1.35rem;
  	margin-right: 0.75rem;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
	padding-left: 1rem;
	padding-right: 1rem;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-container {
  	padding-top: var(--wp--preset--spacing--8, 1em);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container>.wp-block-navigation-item:not(:last-child):not(:has(.archive-search-icon)) {
	border-bottom: 2px solid var(--wp--preset--color--accent-1);
}

.wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open svg {
    fill: var(--wp--preset--color--accent-1);
    height: var(--wp--preset--spacing--40);
    width: var(--wp--preset--spacing--40);
}

.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {
  	margin-bottom: 0!important;
	border-block-end: 1px solid var(--wp--preset--color--accent-6);
}

.wp-block-navigation .has-child .wp-block-navigation__submenu-container>.wp-block-navigation-item>.wp-block-navigation-item__content,
.nav-mobile .wp-block-navigation__responsive-container-content>ul>li:not(:has(.archive-search-icon)) :is(a,button) {
	border-inline: 3px solid transparent;
	padding: 0.875rem 0.75rem!important;
}

.wp-block-navigation .has-child .wp-block-navigation__submenu-container>.wp-block-navigation-item>.wp-block-navigation-item__content:hover,
.nav-mobile .wp-block-navigation__responsive-container-content>ul>li:not(:has(.archive-search-icon)) :is(a,button):hover{
	border-inline-start: 3px solid var(--wp--preset--color--accent-1);
}

.nav-mobile ul li.wp-block-navigation-submenu:has(button[aria-expanded="true"]) ul.wp-block-navigation__submenu-container.wp-block-navigation-submenu {
 	display: flex;
}

.nav-mobile ul li.wp-block-navigation-submenu:has(button[aria-expanded="false"]) ul.wp-block-navigation__submenu-container.wp-block-navigation-submenu {
 	display: none;
	visibility: hidden;
}

/*--- Lists ----*/

/* Reset the counter on the main ordered list */
ol.custom-list {
    padding-inline-start: 0;
    counter-reset: section;
}

ol.custom-list li {
    display: block;
}

/* Style for the main list items */
ol.custom-list>li {
    counter-increment: section;
    margin-block: 0.83em;
}

/* Before each list item in the main list, insert the counter */
ol.custom-list>li::before {
    content: counter(section) ". ";
    font-weight: bold;
}

/* For nested lists (2nd level), add a new counter and reset */
ol.custom-list>li>ol {
    padding-inline-start: 1em;
    counter-reset: subsection;
}

/* For nested list items, increment the subsection counter */
ol.custom-list>li>ol>li {
    counter-increment: subsection;
}

/* Format the second-level list items with main section and subsection */
ol.custom-list>li>ol>li::before {
    content: counter(section) "." counter(subsection) " ";
    margin-inline-end: 0.2em;
}

@media (max-width:480px) {
    a {
        overflow-wrap: anywhere;
    }
}

/*-----Blog------*/

.shariff-widget-align-flex-start {
    margin-block-start: var(--wp--preset--spacing--40);
}

main :not(article) figure.wp-block-post-featured-image {
    aspect-ratio: 3 / 2;
    overflow: hidden;
}

.wp-block-image :where(figcaption) {
    border-top: 1px solid var(--wp--preset--color--accent-6);
}

.wp-block-post-title :where(a) {
    color: inherit;
}

.wp-block-post {
    position: relative;
}

.wp-block-post .wp-block-post-title :where(a)::after {
    content: '';
    inset: 0;
    position: absolute;
    z-index: 1;
}
    
ul.is-breaking-news :is(li:nth-child(2), li:nth-child(3)) figure {
    display: none;
}

body:not(.paged) ul.has-featured :is(li:nth-child(2),li:nth-child(3),li:nth-child(4)) > div,
ul.tertiary li > div,
.archiveSearch li > div {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 50%));
    column-gap: var(--wp--preset--spacing--16);
    width: 100%;
}

body:not(.paged) ul.has-featured :is(li:nth-child(2),li:nth-child(3),li:nth-child(4)) > div,
ul.tertiary li > div {
    & figure {
        width: 100%;
        grid-column: span 2;
    }
    & .post-description {
        grid-column: span 5;
        justify-content: center;
    }
    & hr.post-divider {
        grid-column: span 5;
    }
}

.archiveSearch li > div {
	& figure {
		display: none;
	}
	& .post-description {
		grid-column: span 5;
	}
	& hr.post-divider {
		grid-column: span 5;
	}
}

/*----- Suche -----*/

.archive-filter-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: var(--wp--preset--spacing--16);
    row-gap: var(--wp--preset--spacing--16);
    width: 100%;
}

.archive-filter-form input[type="search"],
.archive-filter-form select {
    border: 2px solid var(--wp--preset--color--accent-1);
    padding: 0.8rem;
    font-size: 1em;
}

.archive-filter-form select {
    flex: auto;
}

.archive-filter-form input[type="search"],
.archive-filter-form > span {
    flex: 1 100%;
}

.archive-filter-form button {
    cursor: pointer;
    border: none;
}

a.archive-filter-reset {
    flex: 1 100%;
}

/*----- Autor -----*/

.profil:not(.wp-block-post) {
    align-items: stretch;
    & figure {
        line-height: 0;
    }
    & > div {
        justify-content: space-between;
        padding-block: var(--wp--preset--spacing--8);
    }
}

.profil figure img {
    object-fit: cover;
    max-width: 150px;
    aspect-ratio: 1;
}

/*---- Media Query -----*/

@media (max-width:600px){
    .nav-desktop {
        display: none!important;
		visibility: hidden;
    }
    ul.is-breaking-news li:nth-child(n+5) > div {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 50%));
        column-gap: var(--wp--preset--spacing--16);
        width: 100%;
        & figure {
            width: 100%;
            grid-column: span 2;
        }
        & .post-description {
            grid-column: span 5;
            justify-content: center;
        }
        & hr.post-divider {
            grid-column: span 5;
        }  
    }
    ul.is-breaking-news li:nth-child(n+5) > div:has(figure) {
        row-gap: 0;
        & .post-description {
            grid-column: span 3;
        }
    }
    body:not(.paged) ul.has-featured :is(li:nth-child(2),li:nth-child(3),li:nth-child(4)),
    ul.is-breaking-news li:nth-child(n+4),
    ul.secondary li:nth-child(n+2),
    ul.tertiary li {
        & .wp-block-post-excerpt {
            display: none;
        }
    }
    ul.secondary li:nth-child(n+2) figure {
        display: none;
    }
}

@media (min-width:601px) and (max-width:899px) {
    ul.columns-4.wp-block-post-template.is-layout-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    ul.is-breaking-news li:first-child,
    ul.tertiary li {
        grid-column: span 2;
    }
}

@media (max-width:899px) {
    body:not(.paged) ul.has-featured :is(li:nth-child(2),li:nth-child(3),li:nth-child(4)) > div:has(figure),
    ul.tertiary li > div:has(figure) {
        row-gap: 0;
        & .post-description {
            grid-column: span 3;
        }
    }
    body:not(.paged) ul.has-featured li:nth-child(n+5) figure{
        display: none;
    }
    body.paged ul.has-featured li figure{
        display: none;
    }
}

@media (min-width:601px) {
    .nav-desktop {
        display: flex!important;
		visibility: visible;
        align-items: stretch;
    }
    .nav-mobile {
        display: none!important;
		visibility: hidden;
    }
    .wp-block-post>.wp-block-group.is-layout-flex {
        align-items: stretch;
        height: 100%;
        justify-content: space-between;
        & .post-description {
            flex: auto;
        }
    }
    body:not(.paged) ul.has-featured li:first-child,
    body:not(.paged) ul.has-featured :is(li:nth-child(2),li:nth-child(3),li:nth-child(4)) {
        grid-column: span 2;
    }
    .archive-filter-form > span {
        flex: none;
    }
	.profil:not(.wp-block-post) {
		flex-direction: row;
	}
}

@media (min-width:900px) and (max-width:1271px) {
    body:not(.paged) ul.has-featured :is(li:nth-child(2),li:nth-child(3),li:nth-child(4)) figure,
    ul.tertiary li figure {
        display: none;
    }
}

@media (min-width:900px) {
    ul.is-breaking-news li:first-child {
        grid-column: span 3;
        grid-row: span 2;
    
        & > div {
            display: grid;
            grid-gap: var(--wp--preset--spacing--8);
            
            & .wp-block-post-title {
                font-size: var(--wp--preset--font-size--size-xl);
            }
        }
    }
    body:not(.paged) ul.has-featured li:first-child {
        grid-row: span 3;
        & > div {
            gap: var(--wp--preset--spacing--8);
        }
    }
	.archiveSearch li > div {
		& figure {
			display: block;
			width: 100%;
		}
	}
	.archiveSearch li > div:has(figure) {
		& .post-description {
			grid-column: span 4;
		}
	}
    .archive-filter-form input[type="search"] {
        flex: 5 auto;
    }
}

@media (min-width:1272px) {
    ul.is-breaking-news li:first-child {
        & > div {
            grid-template-columns: repeat(3, 1fr);
            grid-gap: var(--wp--preset--spacing--24);
            
            & .wp-block-post-title {
                font-size: var(--wp--preset--font-size--size-xxl);
            }
            & figure {
                order: 2;
                max-width: 100%;
                grid-column: span 2;
            }
            & > div {
                padding-block: var(--wp--preset--spacing--8);
                border-bottom: 1px solid var(--wp--preset--color--accent-6);
                gap: var(--wp--preset--spacing--16);
            }
            & hr {
                display: none;
            }
        }
    }
    
    ul.is-breaking-news li:nth-child(n+4),
    body:not(.paged) ul.has-featured li:nth-child(n+5) {
        grid-row: span 2;
    }
    body:not(.paged) ul.has-featured li:first-child {
        & .wp-block-post-title {
            font-size: var(--wp--preset--font-size--size-l);
        }
    }
    body:not(.paged) ul.has-featured :is(li:nth-child(2),li:nth-child(3),li:nth-child(4)) > div:has(figure),
    ul.tertiary li > div:has(figure) {
        row-gap: 0;
        & .post-description {
            grid-column: span 3;
        }
    }
    body:not(.paged) ul.has-featured :is(li:nth-child(2), li:nth-child(3), li:nth-child(4)) > div, ul.tertiary li > div {
        & .post-description {
          justify-content: start;
        }
    }
    .wp-block-post-featured-image :where(img) {
        height: 100%;
    }
}

