:root {
   --color-bg-body: #eee;
   --color-bg: #fff;
   --color-tx: #2f2c2a;

   /* Adobe Julia vorschlag Miriam Email 15.10. */
   --color-header-bg: #e3a978;
   --color-header-tx: #ffffff;

   --color-menu-bg: #f0d9b5;
   --color-menu-tx: #2f2c2a;
   --color-menu-tx-hover: #5c5855;

   --color-link-tx: #e3a978;
   --color-link-tx-hover: #f0d9b5;

   --color-button-bg: var(--color-menu-bg);
   --color-button-bg-hover: var(--color-header-bg);
   --color-button-tx-hover: #fff;

   --color-footer-bg: var(--color-menu-bg);

   --font-size-basic: 20px;
   --font-size-menue: 16px;
   --font-size-small: 16px;

   --font-size-site-title: 48px;
   --font-size-header-widget: 24px;
}

.wrap {
   max-width: 1024px;
}

body, .content {
   font-size: var(--font-size-basic);
   color: var(--color-tx);
}

body {
   background-color: var(--color-bg-body);
}

.title-area a {
   font-size: var(--font-size-site-title);
   padding-left: 10px;
}

.content {
   background-color: var(--color-bg);
   box-shadow:
      0 4px 8px 0 rgba(0, 0, 0, 0.2),
      0 6px 20px 0 rgba(0, 0, 0, 0.19);
   border-radius: 10px;
}

.content {
   margin: 0;
}

.site-header {
   background-color: var(--color-header-bg);
}

.site-header .widget-area {
   width: auto;
   max-width: 600px;
   padding-right: 10px;
}

.site-title a, .site-title a:hover, .title-area a, .textwidget a:hover {
   color: var(--color-header-tx);
}

.header-widget-area h2 {
   font-size: var(--font-size-header-widget); 
}

.nav-primary {
   background-color: var(--color-menu-bg);
   position: sticky;
   top: 0;
   z-index: 9999;
}

.site-footer,
.site-footer a{
   font-size: 16px;
   color: #ccc;
   padding:20px 0;
}

.genesis-nav-menu .sub-menu a, .nav-primary a {
   color: var(--color-menu-tx);
   font-size: var(--font-size-menue);
}

button, .wpcf7-submit {
   background-color: var(--color-header-bg) !important;
   color: var(--color-tx) !important;
   border-radius: 5px !important;
   margin-top: 10px !important;
}

button:focus, button:hover {
   background-color: var(--color-menu-bg);
   color: var(--color-menu-tx);
}

input, textarea {
   font-size: var(--font-size-input);
   color: var(--color-tx);
   padding: 10px;
   margin: 5px 0 20px 0;
   border-radius: 5px;
   border-width: 2px;
   box-shadow: 2px 3px 6px hsla(0, 0%, 0%, 0.2);
}


.textarea-exercise:focus {
   border: none;
}

.textarea-exercise {
   height: 95%;
   width: 100%;
   border: none;
   box-shadow: none;
   resize: none;
   padding: 0px;
   margin-top: -10px;
}


/* Container für die beiden Fieldsets (Textfeld + Eigenschaften */
.fieldset-container {
   display: flex;
   flex-wrap: wrap;
   align-items: stretch;
   gap: 20px;
   margin: 0;
   padding: 0;
}

/* Fieldset rechts mit fester Breite für Textfeld*/
.fieldset-container .flexible {
   flex: 1;
   padding-bottom: 0;
   border: none;
   border: 2px solid #dcdcdc;
   border-radius: 10px;
   box-shadow: 2px 3px 6px hsla(0, 0%, 0%, 0.2);
}

/* Fieldset rechts mit fester Breite für die Eigenschaften*/
.fieldset-container .fixed {
   width: 240px;
   border: none;
   padding: 0 15px 15px 15px;
   border: 2px solid #dcdcdc;
   border-radius: 10px;
   box-shadow: 2px 3px 6px hsla(0, 0%, 0%, 0.2);
}

.fieldset-container legend {
   font-weight: bold;
   margin-left: 10px;
   padding: 5px;
}

.property-group:not(:last-child) {
   margin-bottom: 15px;
}

.property-group:has(input[type='checkbox']) {
   margin: 0px;
}

.property-group label {
   font-size: 18px;
   display: block;
}

.properties dt, .properties dd {
   margin: 0;
}

.properties dt select, .properties dd select, .fixed select {
   max-height: 32px;
   color: black;
   padding: 5px;
}

.check-container {
   display: flex;
   align-items: center;
   font-size: 18px;
   line-height: 1.2;
   padding-left: 5px;
}

.check-container input[type='checkbox'] {
   transform: scale(1.5);
   margin-right: 8px;
   position: relative;
   top: 8px;
   flex-shrink: 0;
}

.statistic{
   font-size:smaller;
   font-style:italic;
}

.noafd{
   font-weight: bold;
   background-color: #FFFACD;
   padding: 0 15px;
   box-shadow: 2px 3px 6px hsla(0, 0%, 0%, 0.2);
   margin: 10px 0 5px 0;;
}

.hidden {
   display: none;
}

.red {
   color: red;
}


@media only screen and (max-width: 1023px) {
   .site-header .widget-area, .title-area {
      width: 100%; /* volle Breite auf Mobile */
      float: none; /* nicht mehr rechts! */
      margin: 10px auto 0;
      text-align: center;
   }

   .responsive-menu-icon::before,
   .genesis-nav-menu .menu-item a,
   .genesis-nav-menu .current-menu-item a {
      color: var(--color-menu-tx);
   }

   .genesis-nav-menu .menu-item a:hover,
   .genesis-nav-menu .menu-item a:focus {
      background-color: #fff;
      color: var(--color-menu-tx-hover);
   }

   .genesis-nav-menu .current-menu-item a {
      background-color: #fff;
   }
}

@media only screen and (max-width: 600px){
   .genesis-nav-menu.responsive-menu a,
   .genesis-nav-menu.responsive-menu a:hover,
   .genesis-nav-menu.responsive-menu .sub-menu a,
   .genesis-nav-menu.responsive-menu .sub-menu a:hover{
      color: var(--color-menu-tx)!important;
   }
}


@media only screen and (max-width: 480px) {
   .site-inner,
   .site-inner .wrap {
      padding: 0;
   }

   .content{
      padding:20px;
   }

}
