/**
 * Theme Name:     Kinderbüro gGmbH Child Theme
 * Author:         togger@togger.org
 * Template:       twentytwentyfive
 * Text Domain:    kb-playground
 * Description:    Kinderbüro Child Theme - togger@togger.org 
 */
:root{
    --main-text-color: #032138;
    --main-font-weight: 400;
    --main-headline-font-color: #032138;
    --headline-font-color: #1a89a8; /* kinderbüro petrol - main headline */
     --accent-color-default: #1a89a8; /* kinderbüro petrol - main accents */
    --accent-color-light: #f8d74e;
    --accent-color-orange: #FF8552;
    --accent-color-purple: #CA8ADB;
    --background-color-light: #f2f4f5;
    --background-color-dark: #c4c4c4;
  /*   --link-color: #1a89a8; */ /* petrol - links */
    --link-color: #1a89a8; /* kinderbüro petrol - links */
    --color-dark: #032138; /* uni darkblue - footer */
    --color-yellow: #ffdb4c; /* uni yellow - accents */
    --color-orange: #ff8652; /* uni orange - accents */
    --color-green-light: #a4c56c; /* uni light green - accents */
    --color-purple: #ca8adb; /* uni purple - accents */
    --color-green-mint: #2ba4a6; /* uni mint green - accents */
    --color-orange-red: #e65640; /* uni orange-red - accents */

    --meta-color: #777;
    --max-container-width: 1560px;
    --max-text-width: 900px;
    --group-background-gray: #f2f4f5;
    --global-border-radius: 5px;
    --global-box-padding: 20px; /** global padding for blocks **/
    --global-box-shadow: 0 4px 16px rgba(0,0,0,0.10);
    --global-box-shadow-hover: 0 4px 16px rgba(0,0,0,0.25);
    --global-box-shadow-transition: box-shadow 0.2s;
}
*, *::before, *::after {
    transition: var(--global-box-shadow-transition);
}

body {
    color: var(--main-text-color);
    font-weight: var(--main-font-weight);
/*     background-color: var(--background-color-light); */
}
.home .togger-grid.quick-links .grid-item-inner .item-title {
    font-size: 1.6rem;
}
p:empty {
    display: none;
}
footer a[href^="tel:"],
footer a[href^="mailto:"] {
    font-size: 14px;
}
footer .kb-tel-mail,
footer .kb-address {
    line-height: 1.8em;
}
footer .kb-logo-uni img {
    height: 90px;
}
.togger-grid.archive-grid{
    position: relative;
}
select.themen-filter-select {
    padding: 0.1rem 0.5rem;
    border: 1px solid #ccc;
    border-radius: var(--global-border-radius);
    background-color: #fff;
    height: 35px;
    position: absolute;
    right: 0;
}
.wp-singular .breadcrumbs{
    margin-top: 40px;
}
.breadcrumbs a {
    color: var(--main-text-color);
}

/** image animationen **/
main img {
    opacity: 0;
    transition: opacity 2s ease-in-out;
}

main img.in-view {
    opacity: 1;
}

.wp-singular .post-date {
    color: var(--meta-color);
    font-size: inherit;
    margin-top: 10px;
}
/*** top menu - language selector and search Icon**/
#main-menu {
    z-index: 10;
}
.header-main{
    padding-top: 20px !important;
    padding-bottom: 0 !important;
}
.main-navigation{
    margin-top: 10px !important;
    font-weight: 400;
}
.wp-block-site-logo {
  padding-bottom: 15px;
}

nav ul {
    list-style: none;
}
nav.menu-quick-menu-top-container ul {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
}
nav.menu-quick-menu-top-container ul li {
    display: inline-block;
    margin-right: 20px;
}

nav.menu-quick-menu-top-container ul li.toggle-search{
    width: 44px;
    height: 44px;
    background: url('./elements/search-icon.svg') no-repeat center center;
}
.search-active nav.menu-quick-menu-top-container ul li.toggle-search{
    background: url('./elements/close-search-icon.svg') no-repeat center center;
}
nav.menu-quick-menu-top-container ul li.toggle-search a{
    color: transparent;
    display: block;
    height: 44px;
}
#lang-navi{
    position: absolute;
    top: 15px;
    right: 25px;
}
#lang-navi a{
    text-decoration: none;
}

/** Social Icons **/
.social-links-wrapper {
    display: flex;
    gap: 10px;
    margin-left: -10px !important;
}
.social-links-wrapper a {
    display: inline-block;
    width: 35px;
    height: 35px;
}
.social-links-wrapper a.social-facebook {
    background: url('./elements/facebook-icon.svg') no-repeat center center;
}

.social-links-wrapper a.social-instagram {
    background: url('./elements/instagram-icon.svg') no-repeat center center;
}
.social-links-wrapper a.social-linkedin {
    background: url('./elements/linkedin-icon.svg') no-repeat center center;
}
.social-links-wrapper a.social-youtube {
    background: url('./elements/youtube-icon.svg') no-repeat center center;
}

.home #news .grid-item::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 12px;
    width: 100%;
    border-radius: 5px 5px 0 0;
    z-index: 2;
}
.home #news .grid-item:nth-child(1)::before {
    background-color: var(--color-yellow);
}
.home #news .grid-item:nth-child(2)::before {
    background-color: var(--color-green-light);
}
.home #news .grid-item:nth-child(3)::before {
    background-color: var(--color-purple);
}
/** fix first letter of menu items and headlines **/
.wp-block-navigation-item__label {
  display: inline-block;
}
.wp-block-navigation-item__label::first-letter,
h1::first-letter,
h2::first-letter,
h3::first-letter,
h4::first-letter,
h5::first-letter,
h6::first-letter {
  text-transform: uppercase;
}

@media (max-width: 1560px) {
    .flexible-content-grid.alignwide .flexible-grid-content-wrap,
    .taxonomy-grid.alignwide .grid-container,
    .togger-grid.archive-grid.alignwide{
        padding-left: 20px;
        padding-right: 20px;
    }
    select.themen-filter-select {
        right: 20px !important;
    }
}
.tax-themen .togger-grid.archive-grid.alignwide,
.tax-zielgruppe .togger-grid.archive-grid.alignwide,
.tax-bildungsangebote .togger-grid.archive-grid.alignwide{
    padding-left: 0 !important;
    padding-right: 0 !important;
}