/* Custom styles for koch2025 */

/* Breakpoints:
     320     - minimum supported (checked by me)
     360-430 - standard for modern smartphones
     768     - classic iPad width
     1024    - desktop

   Olivero breakpoints
     500  - 31.25rem
     700  - 43.75rem
     1000 - 62.5rem
     1200 - 75rem

*/

/* koch2025 Grundfarbe: #8f7e38 */

:root {
    --max-width: 960px; /* .container elements (content, header) */
    --max-bg-color: calc(960px + 0*var(--content-left)); /* .page-wrapper */
    --content-left: 48px;
    --container-padding: 0px;
    --burt-border-radius: 3px;
    --burt-grundfarbe: #8f7e38;
    --burt-color-container: #fffdf5;
    --burt-content-padding-sm: 0.5rem;

    /* cards */
    --burt-box-shadow: 0 1px 2px rgba(0,0,0,0.07),
		       0 2px 4px rgba(0,0,0,0.07), 
		       0 4px 8px rgba(0,0,0,0.07), 
		       0 8px 16px rgba(0,0,0,0.07),
		       0 16px 32px rgba(0,0,0,0.07), 
		       0 32px 64px rgba(0,0,0,0.07);
    --burt-box-shadow-down: 0 1px 1px rgba(0,0,0,0.15), 
			    0 2px 2px rgba(0,0,0,0.15), 
			    0 4px 4px rgba(0,0,0,0.15);
    --burt-border: 1px solid #e2e8f0; 

}

/* Top Layout (layout.css) */
body {
    background-image: url("../images/hintergrund-loeffel.png"); 
}
.page-wrapper {
  background: unset; /* unset to show wallpaper */
}
.main-content__container {
    padding-block-start: var(--sp2);
    padding-left: var(--burt-content-padding-sm);
    padding-right: var(--burt-content-padding-sm);
}

@media (min-width: 43.75rem) {
  .main-content__container {
      padding-block-start: var(--sp3);
      padding-left: 0;
      padding-right: 0;
  }
}
.main-content {
    background-color: var(--burt-color-container);
    box-shadow: var(--burt-box-shadow);
}
@media (min-width: 75rem) { /* social-bar is enabled */
    :root {
	--max-bg-color: calc(960px + 1*var(--content-left)); /* .page-wrapper now includes social-bar */
	--container-padding: 0px;
    }
}
/* wider format */
@media (min-width: 62.5rem) {
  .layout--content-medium,
  .layout--pass--content-medium > * {
      grid-column: 2 / 14;
  }
}
/* content grid layout */
@media (min-width: 43.75rem) {
    :root {
	--grid-gap: var(--sp);
    }
}


/* base.css */
html {
    font-family: var(--font-serif);
}
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-serif);
    font-style: italic; 
/*    letter-spacing: 0.04rem; */
/*  color: var(--color-text-neutral-medium); */
}
h1 {
    text-shadow: lightgray 4px 4px 2px;
    line-height: var(--sp);
}
@media (min-width: 43.75rem) {
    h1 {
	font-size: 2.75rem;
	line-height: var(--sp2);
    }
}
/* Title of blocks was made too small */
h2.block__title {
  letter-spacing: -0.01em;
  font-size: 1.5rem;
  line-height: var(--sp2);
  color: var(--color--black);
  padding-left: 36px;
  border-left: 6px solid var(--color--primary-50);
}

/* footer.css */
.site-footer {
    background: unset;
    color: black;
}


/* primary and secondary menu */
.region--secondary-menu {
    flex-direction: column; /* different secondary menus below each other */
}
.secondary-nav__menu {
    flex-direction: column;
    align-items: flex-start !important;  /* justify left */
}
.secondary-nav__menu-item {
    padding: 0.5rem 0;
}

/* Textbloecke vom koch2025 Modul */
.block-koch2025-eigene-kochecke-anlegen-block,
.block-koch2025-rezept-erstellen-block {
    display: flex;
    justify-content: center;
    text-align: center; /* needed when words wrap in small screens */
    background-color: #eff3e2;
    padding: 0.2rem;
}

/* share button */
div#block-koch2025-koch2025sharebutton {
    margin-block-end: unset; /* remove empty space */
}
.mn-share-button {
  text-indent: -9999px;
  background-repeat: no-repeat;
  display: block;
  border: none;
  width: 48px;
  height: 48px;
  background-color: #93b135;
  box-shadow: var(--burt-box-shadow); /* 0 2px 4px -1px rgba(0,0,0,0.2), 0 4px 5px 0 rgba(0,0,0,0.14), 0 1px 10px 0 rgba(0,0,0,0.12); */
  border-radius: 50px;
  background-size: 40%;
  background-position: center center;
  background-image: url("data:image/svg+xml,%3Csvg fill='%23FFFFFF' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 483 483'%3E%3Cg%3E%3Cpath d='M352,277.333333 C330.312533,277.333333 310.953173,286.729173 297.312427,301.494827 L148.109227,236.136747 C148.763093,232.164053 149.333333,228.157653 149.333333,224 C149.333333,216.23168 147.8112,208.889387 145.610667,201.8464 L297.605547,125.527467 C311.231787,140.096427 330.477867,149.333333 352,149.333333 C393.236907,149.333333 426.666667,115.903573 426.666667,74.6666667 C426.666667,33.42976 393.236907,3.55271368e-14 352,3.55271368e-14 C310.763093,3.55271368e-14 277.333333,33.42976 277.333333,74.6666667 C277.333333,79.0065067 277.899733,83.2004267 278.610773,87.3371733 L121.455787,166.246187 C108.619733,155.832107 92.4829867,149.333333 74.6666667,149.333333 C33.42976,149.333333 3.55271368e-14,182.763093 3.55271368e-14,224 C3.55271368e-14,265.236907 33.42976,298.666667 74.6666667,298.666667 C96.3541333,298.666667 115.713493,289.270827 129.35424,274.505173 L278.55744,339.863253 C277.903573,343.835947 277.333333,347.842347 277.333333,352 C277.333333,393.236907 310.763093,426.666667 352,426.666667 C393.236907,426.666667 426.666667,393.236907 426.666667,352 C426.666667,310.763093 393.236907,277.333333 352,277.333333 Z' id='Shape'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.mn-share-button:hover {
  border: none;
}
.mn-share-button.fixed-icon {
  position: fixed;
  bottom: 50px;
  right: 20px;
  z-index: 600;
  padding: 10px;
}

/* pager.css */
.pager__items {
    justify-content: center;
}

/* region.css */
@media (min-width: 62.5rem) {
    .region > *:where(:not([data-big-pipe-placeholder-id])) {
	margin-block-end: var(--sp2); 
    }
}
@media (min-width: 43.75rem) {
    .region > *:where(:not([data-big-pipe-placeholder-id])) {
        margin-block-end: var(--sp); 
    }
}

/* *********************************************** */
/* ******************* Kopfzeile ***************** */
/* *********************************************** */

/* site-header__inner__container
     order
       0. .site-branding
       1. .block-koch2025-header-koch-block
       2. .block-views-exposed-filter-blockrezeptsuche-suchseite
       3. .mobile-buttons
*/

.site-header__inner__container {
    /* Olivero sets this as flexbox */
    background-color: var(--burt-color-container); /* #e3edc1; */
/*    display: flex; */
/*    justify-content: space-evenly; */
    flex-wrap: wrap; 
    padding-inline: unset;
/*    align-items: center; */
}

/* Site Branding */
.site-branding {
/*    width: 100%; */ /* takes the full row */
    flex: 1;
/*    flex: 100 auto;  */
    order: 0;
    background-image: none;
    padding-block: unset;
    padding-inline-end: unset;
    margin-inline-end: unset;
}
/* Koch Ich Block */
.block-koch2025-header-koch-block {
    order: 0;
    flex-shrink: 0;
    margin: auto 0.5rem auto 0;
    z-index: 100;
}
.block-koch2025-header-koch-block a.koch2025-header-link { /* kein Koch, sondern Link auf Köche */
    text-decoration: none;
    display: block;
    width: 70px;
    height: 70px;
    margin-block: 0;
    background-color: white; /* #eff3e2; */
    border: 1px dashed #653014;
    border-radius: 50%;
    text-align: center;
    padding-top: 28px; 
    color: #653014;
    font-weight: 700;
    background-image: url("../images/luigi-umriss-braun.png");
    background-size: 24px;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: 10px;
}
.block-koch2025-header-koch-block img { /* Autor */
    display: block;
    width: 70px;
    height: 70px;
    margin-block: 0;
    background-color: white; /* #eff3e2; */
    border: 1px dashed #653014;
    border-radius: 50%;
}
.block-koch2025-header-koch-block .author-name-wrapper { /* Autor */
    max-width: 70px;
    width: 70px;
}
.block-koch2025-header-koch-block .author-name { /* Autor */
    white-space: nowrap;
    display: block;
    width: 70px;
    text-align: center;
    text-decoration: none;
    color: #653014;
    overflow: hidden;
    text-overflow: ellipsis;
}
.block-koch2025-header-koch-block .field:not(:last-child) {
    margin-block-end: unset;
}
.block-koch2025-header-koch-block a.koch2025-header-link:hover {
    border: 2px solid #653014;
}
.block-koch2025-header-koch-block .field--name-user-picture a:hover {
    border: unset;
}
.site-branding__inner {
    align-items: flex-end;
    flex: 5;
    gap: unset;
    position: relative;
    left: -8px;
}
.site-branding__inner a{
    outline: none;
}
.site-branding__logo img {
    max-height: 85px;
}
.site-branding__text {
    align-self: center;
    flex: 5;
}
.site-branding__name {
    justify-self: center;
    margin-top: 5px;
}
.site-branding__name a {
    background-image: url("../images/text-kochecke-braun.svg"); /* 402x126 */
    background-repeat: no-repeat;
    display: block;
    text-indent: -9999px;
/*    width: 201px;
    height: 63px;
*/
    width: 181px;
    height: 57px;
/*    background-size: 201px 63px; */
    background-size: 181px 57px; 
}
.site-branding__slogan {
    color: #653014;
    margin-top: 0.2rem;
    justify-self: center;
    white-space: nowrap;
}

/* Suche */
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite {
    flex: 1; /* initially all children take full width */
    width: auto;
    min-width: 80%; /* verhindert, dass das Element in die erste Zeile rutscht */
    order: 1;
    background-color: #93b135;
}
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite .block__content {
    display: block;
    padding: 0.5rem 10px;
    margin: 0px;
}
/* Animation & Versteckte Felder */
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form .form-item-koch-name,
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form .form-actions,
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form label {
    max-height: 0;
    max-width: 0;
    opacity: 0;
    overflow: hidden;
    transition: opacity 0.5s ease-in-out, max-height 0.5s ease-in-out, max-width 0.5s ease-in-out; /* beim Zuklappen */
}
/* aufgeklappt */
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form.is-open .form-item-koch-name,
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form.is-open .form-actions,
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form.is-open label {
    max-height: 100px; /* Genug Platz für den Inhalt */
    max-width: 1000px;
    opacity: 1;
    transition: max-height 1s ease-in-out, opacity 0 ease-in-out; /* beim Aufklappen */
}
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form {
    display: flex; /* Use flexbox to align items horizontally */
    justify-content: space-between; /* Align text left, button right */
    width: 100%;
/*    max-width: 420px;  Set a max-width for better appearance */
    margin: 0 auto; /* Center the search bar */
    border: 2px solid var(--burt-grundfarbe); 
    border-radius: unset; 
    overflow: hidden; /* Clips the children (input/button) to the rounded shape */
    background-color: #f9f9f9;
}
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form div {
    margin: 0;
}
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite .form-item__label {
    color: #8f7e38;
}
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite .form-item-rezeptsuche {
    flex: 1;
    padding-left: 5px;
}
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite .form-item-koch-name {
    flex: 1;
    padding-left: 5px;
    border-left: 1px solid #8f7e38;
}
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form div.form-item-search-api-fulltext {
    width: 100%;
}
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form input {
    width: 100%;
    min-height: unset;
    border: none; /* Remove default border */
    /*    padding: 4px 20px;  Add space inside the input */
    padding: 0;
    background-color: transparent; /* Make background transparent to show container's bg */
    color: #333;
}
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form input:focus {
    outline: none;
}
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form .button {
    text-indent: -9999px;
    overflow: hidden;
    font-size: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 20px 20px;
    padding: 0 30px 0 20px;
    cursor: pointer;
    display: flex; /* Helps center the SVG icon */
    align-items: center;
    justify-content: center;
    border: none; /* Remove default border */
    background-color: #a89751; 
    transition: background-color 0.2s ease;
    border-radius: unset;
    margin-inline-end: unset;
    height: 100%;
}
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form .button:hover {
    background-color: #61531a;
}
.site-header .block-views-exposed-filter-blockrezeptsuche-suchseite form .button:focus {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M 5 2 H 19' /%3E%3Cpath d='M 5 22 H 19' /%3E%3Cpath d='M 5 2 C 5 8, 11 10, 11 12 C 11 14, 5 16, 5 22' /%3E%3Cpath d='M 19 2 C 19 8, 13 10, 13 12 C 13 14, 19 16, 19 22' /%3E%3Cpath d='M 7 4 H 17 V 9 C 14 7, 10 7, 7 9 Z' fill='%23fff' stroke='none' opacity='0.4' /%3E%3Cpath d='M 7 20 H 17 V 17 C 14 19, 10 19, 7 17 Z' fill='%23fff' stroke='none' opacity='0.4' /%3E%3Cpath d='M 12 11 V 15' stroke-width='1' opacity='0.6' /%3E%3C/svg%3E");
    background-color: #a89751;
}

.mobile-buttons {
    padding-right: 1rem;
    margin-block-start: 0;
    order: 2;
    flex-shrink: 0; /* keep the width also on small screens */
    background-color: #93b135;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.mobile-nav-button__label {
    display: none;
}
.mobile-nav-button__icon::before, .mobile-nav-button__icon::after,
.mobile-nav-button__icon {
    border-color: var(--color--primary-40);
}

@media (min-width: 31.25rem) {
    .mobile-nav-button {
	padding-inline-start: 0.375rem;
    }
}
@media (min-width: 43.75rem) {
    .site-branding__inner {
	position: relative;
	left: -17px;
    }
    .site-branding__logo img {
	max-height: 170px;
    }
    .site-branding__name a {
	width: 402px;
	height: 126px;
	background-size: 402px 126px;
    }
    .site-branding__slogan {
	margin-top: -1rem;
    }
    .block-koch2025-header-koch-block a.koch2025-header-link {
	width: 120px;
	height: 120px;
	margin-right: 1rem;
	padding-top: 60px;
	font-size: 1.75rem;
	background-size: 40px;
	background-position-y: 15px;
    }
    .block-koch2025-header-koch-block img { /* Autor */
	width: 120px;
	height: 120px;
	margin-right: 1rem;
    }
    .block-koch2025-header-koch-block .author-name-wrapper { /* Autor */
        margin-top: 10px;
    }
    .block-koch2025-header-koch-block .author-name { /* Autor */
	width: 120px;
    }
}

@media (min-width: 75rem) {
    .site-branding {
	min-height: unset;
    }
    .site-branding__inner {
	height: unset;
	padding-block: unset;
	position: relative;
	left: -15px;
    }
    .site-header__initial {
	background-color: transparent;
    }
    .site-header {
	border-block-end: unset; /* Olivero had transparent border */
    }
    .social-bar {
	background-color: transparent;
    }
}


/* Rezeptliste Kochliste Kategorieliste */
.xxx-deleted-view-display-id-alle .views-view-responsive-grid__item,
.xxx-deleted-view-display-id-aus_kategorie .views-view-responsive-grid__item,
.xxx-deleted-view-display-id-neueste_mit_bild .views-view-responsive-grid__item,
.xxx-deleted-view-display-id-kochliste .views-view-responsive-grid__item,
.xxx-deleted-view-display-id-block_von_koch .views-view-responsive-grid__item,
.xxx-deleted-view-id-kategorien .views-view-responsive-grid__item,
.view-id-kochliste   .views-view-responsive-grid__item,
.view-id-rezeptliste .views-view-responsive-grid__item {
    background-color: white; /*  #eff3e2; #f9f1da; */
    text-align: center;
    padding: 5px 5px 10px 5px;
    border-radius: var(--burt-border-radius);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    border: var(--burt-border); 
    box-shadow: var(--burt-box-shadow);
    transform: translate(0, 0);
}
.view-id-kategorien .views-view-responsive-grid__item {
    padding: 5px;
}
.xxx-deleted-view-display-id-alle .views-view-responsive-grid__item:hover,
.xxx-deleted-view-display-id-aus_kategorie .views-view-responsive-grid__item:hover,
.xxx-deleted-view-display-id-neueste_mit_bild .views-view-responsive-grid__item:hover,
.xxx-deleted-view-display-id-kochliste .views-view-responsive-grid__item:hover,
.xxx-deleted-view-display-id-block_von_koch .views-view-responsive-grid__item:hover,
.xxx-deleted-view-id-kategorien .views-view-responsive-grid__item:hover,
.view-id-kochliste   .views-view-responsive-grid__item:hover,
.view-id-rezeptliste .views-view-responsive-grid__item:hover {
    transform: translate(5px, 5px);
    box-shadow: var(--burt-box-shadow-down);
}
.views-view-responsive-grid__item img {
    display: block;
    margin: auto;
}
.views-field.views-field-field-foto, .views-field.views-field-user-picture {
    padding-bottom: 10px;
}
@media (min-width: 43.75rem) {
    .view-id-kategorien .views-view-responsive-grid__item h2 {
	font-size: 1rem;
    }
}

.view-id-kategorien .views-view-responsive-grid__item {
    min-height: 15rem;
}
.view-id-kategorien .views-view-responsive-grid__item-inner,
.view-id-kategorien .views-view-responsive-grid__item-inner > div,
.view-id-kategorien .views-view-responsive-grid__item-inner h2 a,
.view-id-kategorien .views-view-responsive-grid__item-inner h2 {
    display: flex; 
    justify-content: center; 
    align-items: center;
    width: 100%;
    height: 100%;
}
.view-id-kategorien .views-view-responsive-grid__item h2 a {
    background-image: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)), url('/themes/contrib/koch2025/images/logo-luigi.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    /* Text-Styling, damit er auf dem Bild lesbar ist */
    color: white;
    text-decoration: none;
    font-size: 2rem;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.7); /* Schatten für Lesbarkeit */
}



/* Kochrezept */
/* ********* */

.node--type-kochrezept .block-field-blocknodekochrezeptfield-zutaten,
.node--type-kochrezept .block-field-blocknodekochrezeptfield-zubereitung,
.path-rezeptsuche .field--name-field-foto,
.node--type-kochrezept .field--name-field-foto,
.path-user .block-field-blockuseruseruser-picture .field--name-user-picture {
    border: var(--burt-border);
    box-shadow: var(--burt-box-shadow);
    border-radius: var(--burt-border-radius);
    padding: 0.5rem;
    background-color: white;
}
.field--name-field-foto img {
    display: block;
    margin: 0 auto;
}
.node--type-kochrezept .block-field-blocknodekochrezeptfield-zutaten {
    background-color: #EDE589; /* gruen: #e3edc1 gelb: #EDE589; */ 
    border: 1px solid #eddc24; /* gruen: #92b033 gelb: #eddc24; */
    padding: 1rem;
}
.node--type-kochrezept .block-field-blocknodekochrezeptfield-zubereitung {
/*  background-color: white;
    border: 1px solid lightgray; */
    background-color: #eff3e2;
    border: 1px solid #ddf19c;
    padding: 1rem;
}
.node--type-kochrezept .block-field-blocknodekochrezeptfield-zutaten .block__title,
.node--type-kochrezept .block-field-blocknodekochrezeptfield-zubereitung .block__title {
    border: unset;
    padding: 0 5px 0.5rem 5px;
    margin-left: -5px;
    margin-right: -5px;
    border-bottom: 2px solid #a89751;
}
.node--type-kochrezept .block-field-blocknodekochrezeptfield-zutaten .block__subtitle,
.node--type-kochrezept .block-field-blocknodekochrezeptfield-zubereitung .block__subtitle {
    border: unset;
    padding-left: unset;
    text-shadow: unset;
}
/* Label Styling, damit die ganze Zeile klickbar ist */
.node--type-kochrezept .block-field-blocknodekochrezeptfield-zutaten .zutat {
  display: flex;
  align-items: flex-start;
  padding: 4px 0;
  cursor: pointer;
}
.node--type-kochrezept .block-field-blocknodekochrezeptfield-zutaten .zutat-checkbox {
  margin-right: 10px;
  margin-top: 5px; /* Ausrichtung an der ersten Textzeile */
  transform: scale(1.2); /* Checkbox etwas größer machen */
  cursor: pointer;
}
.node--type-kochrezept .block-field-blocknodekochrezeptfield-zutaten .zutat-text {
  line-height: 1.4;
}
.node--type-kochrezept .block-field-blocknodekochrezeptfield-zutaten .zutat-checkbox {
    width: unset;
    height: unset;
    appearance: auto;
}
.node--type-kochrezept .block-field-blocknodekochrezeptfield-zutaten .zutat-checkbox:checked + .zutat-text {
  text-decoration: line-through;
  color: #888;
}
.node--type-kochrezept .block-field-blocknodekochrezeptfield-zutaten input[type="checkbox"]:focus {
    border: unset;
    outline: unset;
}
@supports (outline-style: double) {
  .node--type-kochrezept .block-field-blocknodekochrezeptfield-zutaten input[type="checkbox"]:focus {
      border-width: unset;
      outline-width: unset;
      outline-style: unset;
      outline-offset: unset;
  }
}
@media (min-width: 43.75rem) {
    .node--type-kochrezept #block-koch2025-page-title {
	margin-block-end: var(--sp);
    }
    .path-rezeptsuche .layout__region--second .field__label,
    .node--type-kochrezept .layout__region--second .field__label {
	float: unset;
    }
    .path-rezeptsuche h2 {
	margin-block: 0 var(--sp);
    }
    .node--type-kochrezept .block-field-blocknodekochrezeptfield-zutaten .block__subtitle,
    .node--type-kochrezept .block-field-blocknodekochrezeptfield-zubereitung .block__subtitle {
	margin-block: var(--sp);
	font-size: 1.25rem;
	line-height: var(--sp1-5);
    }
}
.path-rezeptsuche #node__title {
    margin-block: unset;
}
.path-rezeptsuche .layout.layout--twocol-section.layout--twocol-section--50-50 {
    margin-block-end: unset;
}
.path-rezeptsuche .node__content {
    padding-block-end: unset;
}

.path-rezeptsuche .views-row {
    border: var(--burt-border);
    box-shadow: var(--burt-box-shadow);
    padding: 1rem;
    background-color: #eff3e2;
    border-radius: 3px;
}

/* Kommentare: comments.css */
@media (min-width: 43.75rem) {
    .comment {
	padding-inline-start: var(--sp3);
    }
}
@media (min-width: 43.75rem) {
    .add-comment__picture,
    .comment__picture {
	inset-inline-start: 0;
        width: var(--sp2);
	height: var(--sp2);
    }
}

@media (min-width: 43.75rem) {
  .indented .comment__picture {
    inset-inline-start: calc(-1 * var(--sp4));
  }
}

/* vertical distance in info-list */
.block-layout-builder:not(:last-child) .field {
    margin-block-end: unset;
}


/* Koch, Benutzer */
.view-display-id-koch_rezeptstatistik .views-label {
    display: block;
    font-weight: bold;
}

/* Remove Privatemsg threads interface */
.privatemsg-thread-tags,
.privatemsg-add-tag-form {
    display: none;
}

.header-nav {
    background-color: #e3edc1;
    border-block-start: unset;
    padding-top: 3rem;
}

/* Place the navigation below the search bar */
.header-nav {
    position: unset;
    order: 4;
    display: none;
    max-width: unset;
}
.header-nav.is-active {
    transform: unset;
    display: unset;
}
body.is-fixed {
    position: unset; 
    overflow: unset;
}
@media (min-width: 43.75rem) {
    .header-nav {
	padding-inline-end: var(--sp3);
    }
}
@media (min-width: 75rem) {
    .header-nav {
	max-width: unset !important;
	padding-inline-end: var(--sp3) !important;
    }
}
@media (min-width: 90rem) {
    body.is-always-mobile-nav .header-nav {
	padding-inline-end: var(--sp3);
    }
}

/* nav-primary.css */
.primary-nav__menu {
    display: flex;
    background-color: #eff3e2;
    justify-content: space-evenly;
    border: 1px solid #738b2b;
    border-radius: var(--burt-border-radius);
}
.primary-nav__menu-item {
    margin-block-end: unset;
}
.primary-nav__menu-item a {
    width: 160px;
    height: 160px;
    display: block;
    background-image: url(/themes/contrib/koch2025/images/navigation2.png);
    padding-top: 80px;
    text-align: center;
}
.primary-nav__menu-link {
    color: white;
}
.primary-nav__menu-link:hover {
  color: white;
}
.primary-nav__menu-link-inner {
    position: unset; 
    display: unset; 
    align-items: unset;
    padding-block: unset;
    padding-inline-start: unset;
    padding-inline-end: unset;
}
.primary-nav__menu-link-inner::after {
  border-top: unset;
}
.primary-nav__menu-link--rezepte {
    background-position: 0 0;
}
.primary-nav__menu-link--rezepte:hover {
    background-position: -800px 0;
}
.primary-nav__menu-link--koeche {
    background-position: -200px 0;
}
.primary-nav__menu-link--koeche:hover {
    background-position: -1000px 0;
}
.primary-nav__menu-link--ich {
    background-position: -600px 0;
    color: #93b135;
}
.primary-nav__menu-link--ich:hover {
    background-position: -1400px 0;
    color: white;
}

/* Kategorien von alter Kochecke */
.kategorien {
    margin: 0;
    padding: 0;
    background-color: #e3edc1;
}

.kategorien ul {
    margin: 0;
    list-style-type: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.kategorien li {
    width: 265px;
    min-width: max-content;
    margin: 4px 0;
}

.kategorien a {
    text-decoration: none;
    color: black;
    display: block;
    height: 55px;
}

.kategorien a:hover {
    color: #93B035;
}

.kategorien li a .icon {
    width: 55px;
    height: 55px;
    display: inline-block;
    background-image: url(/themes/contrib/koch2025/images/kategorien.png);
    vertical-align: middle;
}

.kategorien li a .text {
    vertical-align: middle;
    margin-left: 7px;
}

.kategorien li.vorspeisen a .icon {
    background-position: 0 0;
}

.kategorien li.suppen a .icon {
    background-position: -65px 0;
}

.kategorien li.salate a .icon {
    background-position: -130px 0;
}

.kategorien li.pasta a .icon {
    background-position: -195px 0;
}

.kategorien li.fisch a .icon {
    background-position: -260px 0;
}

.kategorien li.fleisch a .icon {
    background-position: -325px 0;
}

.kategorien li.gemuese a .icon {
    background-position: -390px 0;
}

.kategorien li.mehlspeisen a .icon {
    background-position: -455px 0;
}

.kategorien li.getraenke a .icon {
    background-position: -520px 0;
}

.kategorien li.anderes a .icon {
    background-position: -585px 0;
}

.kategorien li.alle a .icon {
    background-position: -650px 0;
}

.kategorien li.vorspeisen a:hover .icon {
    background-position: 0 -65px;
}

.kategorien li.suppen a:hover .icon {
    background-position: -65px -65px;
}

.kategorien li.salate a:hover .icon {
    background-position: -130px -65px;
}

.kategorien li.pasta a:hover .icon {
    background-position: -195px -65px;
}

.kategorien li.fisch a:hover .icon {
    background-position: -260px -65px;
}

.kategorien li.fleisch a:hover .icon {
    background-position: -325px -65px;
}

.kategorien li.gemuese a:hover .icon {
    background-position: -390px -65px;
}

.kategorien li.mehlspeisen a:hover .icon {
    background-position: -455px -65px;
}

.kategorien li.getraenke a:hover .icon {
    background-position: -520px -65px;
}

.kategorien li.anderes a:hover .icon {
    background-position: -585px -65px;
}

.kategorien li.alle a:hover .icon {
    background-position: -650px -65px;
}
