/*======================================
Theme Name: kraehativ
Description: Child-Theme von Krähativ
Version: 1.0
Author: krähativ design gmbh
Author URI: https://www.kraehativ.de/
Template: Divi
======================================*/



/* FontAwesome 6.7.1 – Start */

@import url('./css/fontawesome.min.css'); 
@import url('./css/brands.min.css');

/* @import url('./css/light.min.css');  */
@import url('./css/regular.min.css');
@import url('./css/solid.min.css');
/* @import url('./css/thin.min.css'); */

/* 
@import url('./css/duotone-light.min.css'); 
@import url('./css/duotone-regular.min.css');
@import url('./css/duotone-thin.min.css');
@import url('./css/duotone.min.css'); 
*/

/* 
@import url('./css/sharp-duotone-light.min.css'); 
@import url('./css/sharp-duotone-regular.min.css');
@import url('./css/sharp-duotone-solid.min.css');
@import url('./css/sharp-duotone-thin.min.css');
@import url('./css/sharp-light.min.css'); 
@import url('./css/sharp-regular.min.css');
@import url('./css/sharp-solid.min.css');
@import url('./css/sharp-thin.min.css'); 
*/

/* FontAwesome – End */


/* ---------------------------- */


/* BASICS – Start */


:root {
  --primaerfarbe: #DC1F14;
  --sekundaerfarbe: #000;
  --zusatzfarbe: #aeaeae;
  --hintergrundfarbe: #f8f8f8;
}

    .p-small-red {
        color: var(--primaerfarbe);
        font-size: 12px;
    }

address {
    font-style: normal;
    font-size: 16px;
}


a.dmach-acf-value.et_pb_button {
    padding-left: 2em !important;
    border-radius: 5px !important;
}

/* BASICS – End */


/* ---------------------------- */


/* GENERAL STYLES – Start */

    /* Dynamisches Archive-Loop Grid */


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

        /* ===== 3 Spalten ===== */
        .dm-dyn-grid .grid-posts.loop-grid {
            display: flex !important;                /* Flexbox statt Grid */
            flex-wrap: wrap !important;              /* Bei vielen Items automatisch umbrechen */
            justify-content: center !important;      /* Gesamten Inhalt mittig ausrichten */
            gap: 30px !important;                   /* Abstand zwischen den Items */
            margin: 0 auto !important;               /* Sicherheitshalber Container selbst mittig */
            max-width: 100% !important;              /* Nicht über die Bildschirmbreite hinausragen */
            box-sizing: border-box !important;
        }

        /* Items innerhalb des Loops */
        .dm-dyn-grid .grid-posts.loop-grid .grid-col {
            flex: 0 1 30% !important;              /* Max. Breite pro Item (anpassen nach Bedarf) */
            box-sizing: border-box !important;
        }

            @media screen and (max-width: 767px) {
              /* Items innerhalb des Loops */
              .dm-dyn-grid .grid-posts.loop-grid .grid-col {
                  flex: unset !important;
              }
            }

        /* ===== 4 Spalten ===== */
        .dm-dyn-grid-4 .grid-posts.loop-grid {
            display: flex !important;                /* Flexbox statt Grid */
            flex-wrap: wrap !important;              /* Bei vielen Items automatisch umbrechen */
            justify-content: center !important;      /* Gesamten Inhalt mittig ausrichten */
            gap: 30px !important;                   /* Abstand zwischen den Items */
            margin: 0 auto !important;               /* Sicherheitshalber Container selbst mittig */
            max-width: 100% !important;              /* Nicht über die Bildschirmbreite hinausragen */
            box-sizing: border-box !important;
        }

        /* Items innerhalb des Loops */
        .dm-dyn-grid-4 .grid-posts.loop-grid .grid-col {
            flex: 0 1 22% !important;              /* Max. Breite pro Item (anpassen nach Bedarf) */
            box-sizing: border-box !important;
        }

    }
    
    .pdf-meta {
        font-size: 10px;
        color: var(--zusatzfarbe);
        line-height:1.2em;
    }

    .sternchentext {
      font-size: 14px;
      text-align: center;
      margin-top:40px;
    }

    .einheit {
      font-size: 14px;
    }



    /* WP FORMS – Start */

      /*Submit-Btn*/
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full input[type=submit]:not(:hover):not(:active), 
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full button[type=submit]:not(:hover):not(:active), 
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full .wpforms-page-button:not(:hover):not(:active),
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full button[type=submit]:hover {
          background-color: #666!important;
        border-radius: 5px;
          padding: 10px 30px;
      }
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full button[type=submit]:hover {
        background-color: #666!important;
          opacity: 0.7;
      }
      /*Upload*/
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full .wpforms-field-file-upload .wpforms-uploader.wpforms-focus, 
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full .wpforms-field-file-upload .wpforms-uploader:focus-within {
          border-color: #666;
          border-radius: 5px;
        box-shadow: 0 0 0 1px #555, 0px 1px 2px rgba(0, 0, 0, 0.15)!important;
      }
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full .wpforms-field-file-upload .wpforms-uploader {
        padding: 15px;
        border-radius: 5px;
      }

      /*Checkboxen*/
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full input[type=checkbox]:checked:before, 
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full input[type=radio]:checked:before, 
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full input[type=checkbox]:focus:before, 
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full input[type=radio]:focus:before {
          border-color: #494b58;
          box-shadow: 0 0 0 1px #555, 0px 1px 2px rgba(0, 0, 0, 0.15);
      }
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full input[type=checkbox]:checked:after {
          border-left: 4px solid #555;
          border-bottom: 4px solid #555;
      }
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full input[type=radio]:checked:after {
          background-color: #555!important;
      }

      /*Border*/

      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full input, 
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full select, 
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full textarea {
          border-radius: 5px !important;
      }
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full input:focus,
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full select:focus,
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full textarea:focus,
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full .choices__list.choices__list--dropdown,
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full .wpforms-form .wpforms-field.wpforms-field-select-style-modern .choices.is-focused .choices__inner,
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full .wpforms-form .wpforms-field.wpforms-field-select-style-modern .choices.is-open .choices__list--dropdown {
          border-color: #555!important;
          box-shadow: 0 0 0 1px #555, 0px 1px 2px rgba(0, 0, 0, 0.15)!important;   
      }

      .wpforms-field.wpforms-field-gdpr-checkbox.dsgvo-small label {
          font-size: 13px !important;
      }
      /*Dropdown*/
      .et-db #et-boc .et-l .et_pb_module div.wpforms-container-full .wpforms-form .wpforms-field.wpforms-field-select-style-modern .choices .choices__list--dropdown .choices__item--selectable.is-highlighted {
          background-color: #555!important;
      }
      .wpforms-page-indicator-page-progress {
          background-color: var(--primaerfarbe) !important;
      }

      /*Zusammenfassung 

      .wpforms-entry-preview-row {
        flex-direction:column !important;
      }

      .wpforms-entry-preview-column.wpforms-entry-preview-column-50 {
          display: flex;
          flex-direction: row;
          width: 100% !important;
          border-right: none !important;
      }

      .wpforms-entry-preview-label {
          width: 30% !important;
          border-bottom: none !important;
          border-left: none !important;
          border-right: none !important;
      }

      .wpforms-entry-preview-value {
          border-bottom: none !important;
          border-right: none !important;
      }

      .wpforms-entry-preview.wpforms-entry-preview-table_compact {
          background: #fff !important;
          border: 1px solid var(--primaerfarbe) !important;
          border-radius: 5px !important;
          padding: 30px !important;
          width: 50% !important;
      }

      .wpforms-entry-preview-rows,
      .wpforms-entry-preview-row {
        border-left:none !important;
        border-right:none !important;
      }

      .wpforms-entry-preview-notice,
      .wpforms-confirmation-container-full {
          border-radius: 5px !important;
          border-width: 2px !important;
          margin-bottom: 50px !important;
          padding: 30px !important;
      }

      .wpforms-entry-preview-notice {
      }

      .wpforms-confirmation-container-full {
          border-color: #b4d39b !important;
      }
      */

      .wpforms-entry-preview-wrapper {
          background-color: #fff !important;
          border: 1px solid var(--primaerfarbe) !important;
          border-radius: 5px !important;
          padding: 20px !important;
      }

      @media screen and (max-width:920px) {
        .wpforms-layout-column-50,
        .wpforms-layout-column-33,
        .wpforms-layout-column-25 {
          width: 100% !important;
        }

        .wpforms-entry-preview.wpforms-entry-preview-table_compact {
            width: 100% !important;
            padding: 10px !important;
        }

        button.wpforms-page-button.wpforms-page-next {
            margin-top: 20px !important;
        }
      }

      
    /* WP FORMS – End */


    /* FAQ Tabs */

        /* --- Tabs Look --- */
          .twh-tablist{
            display:flex; flex-wrap:wrap; gap:12px;
          }

          .twh-tab{
            font-size: 18px;
            display:inline-flex; 
            align-items:center; 
            gap:.5rem;
            border-bottom:2px solid #fff;
            padding-bottom: 15px;
            color:#fff; 
            font-weight:600;
          }

          .twh-tab:hover,
          .twh-tab.is-active {
            border-color: #000;
          }

          /* --- Panels --- */
          .twh-panel{ display:none; }       /* Script setzt display auf '' beim aktiven */
          .twh-panel.is-active{ display:block; }

          /* Mobile: Tab-Leiste scrollbar */
          @media (max-width:640px){
            .twh-tablist{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
          }




/* GENERAL STYLES – End */


/* ---------------------------- */


/* MENU / NAV  – Start */


@media screen and (max-width: 1250px) {
  header.et-l.et-l--header {
      height: 170px !important;
  }
}


.nav_meine-twh::after{
    content: '\f2bd';
    color: var(--primaerfarbe);
    padding: 0 7px;
    font-size: 20px;
    font-family: 'Font Awesome 6 Pro';
    font-weight: 500;
}

.nav_faq::after{
    content: '\3f';
    color: var(--primaerfarbe);
    padding: 0 7px;
    font-size: 20px;
    font-family: 'Font Awesome 6 Pro';
    font-weight: 500;
}

.nav_jurawell::after{
    content: '\f08e';
    color: var(--primaerfarbe);
    padding: 0 7px;
    font-size: 14px;
    font-family: 'Font Awesome 6 Pro';
    font-weight: 500;
}

.nav_meldeportal::after{
    content: '\f08e';
    color: var(--primaerfarbe);
    padding: 0 7px;
    font-size: 14px;
    font-family: 'Font Awesome 6 Pro';
    font-weight: 500;
}





/* MENU / NAV  – End */


/* ---------------------------- */


/* FOOTER  – Start */

    .download-box-footer {
        border: 1px solid var(--zusatzfarbe) ;
        padding: 40px 20px 0;
        border-radius: 5px;
    }


/* FOOTER  – End */

/* CONTENT – Start */



@media screen and (max-width: 767px) {
 .dipi-at-tab.dipi_advanced_tabs_item_0.dipi-at-tab--active {
    border-left: none;
    border-bottom: 3px solid var(--primaerfarbe);
}

.dipi_advanced_tabs_0 .dipi-at-panels {
        border-left-width: 0px !important; 
    }

}




.infobox a {
    color: var(--sekundaerfarbe);
    position: absolute;
    bottom: 0;
}

.text-button a {
    color: var(--sekundaerfarbe);
}

    .infobox a::after,
    .aktuelles a::after,
    .text-button a::after {
        content: '\f054';
        color: var(--primaerfarbe);
        padding: 0 7px;
        font-size: 14px;
        font-family: 'Font Awesome 6 Pro';
        font-weight: 500;
    }

    .infobox a:hover,
    .aktuelles a:hover,
    .text-button a:hover {
        color: var(--primaerfarbe);
    }

    .text-button a::after {
        font-size: 18px;
    }


@media screen and (max-width:280px) {

  .infobox {
    background-position: right -100px center !important;
}
  
}



/* CSS */
.table-responsive{
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border: 1px solid #d52b1e;  /* Rot */
  border-radius: 5px;
  overflow: scroll;  
}

.twh-table,
.news-beitrag table {
  width:100%;
  border-collapse:collapse;
  min-width:560px;                /* erlaubt horizontales Scrollen falls nötig */
  font-size:16px;
  background-color: #fff;
  margin-bottom: 0px !important;
}

.twh-table th,
.twh-table td,
.news-beitrag th,
.news-beitrag td {
  padding:10px 15px !important;
  text-align:left;
  height: 75px;
}

.twh-table thead th,
.news-beitrag thead th {
  background:#e8e8e8;
  font-weight:700;
}

/* Mobile: als Cards stapeln */
@media (max-width: 640px){
  .twh-table{ min-width:0; }
  .twh-table thead{ }
  .twh-table, .twh-table tbody, .twh-table tr, .twh-table td{
  }
  .twh-table tr{
    border:1px solid #eee;
    overflow:hidden;
    background:#fff;
  }
  .twh-table td{
    justify-content:space-between;
    gap:.75rem;
    border-bottom:1px solid #f2f2f2;
    padding:10px 15px !important;
  }
  .twh-table td:last-child{ border-bottom:0; }
  .twh-table td::before{
    content:attr(data-label);
    font-weight:600;
    color:#555;
  }
}



/* CONTENT – End */