/**
 * Mobile support to likert webform element that converts radios in table
 * grid to inline vertical radios.
 * 
 * Super dark: #396ea4;
 * Dark blue: #5c8cbd;
 * Medium blue: #80a5cb;
 * Medium blue lighter: #c5d4e3;
 * Light blue: #d5e2ee;
 *
 * orange light: #ff9966;
 * orange medium: #fc8c54;
 * orange dark: #fc7430;
 */
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
@media (max-width: 1000px) {

  .indented
  {
      margin-left:50px;
  }
  .indented-2
  {
      margin-left:75px;
  }
  .indented-3
  {
      margin-left:100px;
  }

  .form-type-webform-likert table.sticky-header {
    display: none;
  }

  .form-type-webform-likert table {
    border-collapse: collapse;
    font-size: inherit;
  }

  .form-type-webform-likert thead {
    display: none;
  }

  .form-type-webform-likert tr,
  .form-type-webform-likert tr.odd {
    border: 0;
    background: transparent;
  }
  
  .webform-likert-table-wrapper th, .webform-likert-table-wrapper td {
    text-align: left;
}

 .webform-likert-table-wrapper td span.webform-likert-label 
 {
    margin-left: 20px !important;
    top: 4px;
    position: relative !important;
}

.form-type-webform-likert td
{
border: 0px solid #fff;
}
  
  
  
  /* 1000 only */
    .form-type-webform-likert td {
    display: block;
    }
    
    .form-check .form-check-input {
    float: left;
    text-align: left;
    margin-left: 1em;
}

/* END 1000 only END */
/*
  .form-type-webform-likert td {
    display: block;
    padding: 0;
    text-align: inherit;
    border: 0;
    background: transparent;
    width: 100%;
  } */

  .webform-likert-table[data-likert-answers-count] th,
  .webform-likert-table[data-likert-answers-count] th:first-child,
  .webform-likert-table td,
  .webform-likert-table td:first-child {
    width: 100%;
  }

  /**
   * Show visually hidden radio title and description
   * when Likert is displayed inline on mobile.
   * @see \Drupal\webform\Element\WebformLikert::processWebformLikert
   * @see core/modules/system/css/components/hidden.module.css
   */
  .webform-likert-table .visually-hidden {
    position: inherit !important;
    overflow: inherit;
    clip: inherit;
    width: inherit;
    height: inherit;
  }

  .webform-likert-label.visually-hidden {
  /*
    display: inline;
    */
  }

  .webform-likert-description.hidden {
    display: block;
  }

  .webform-likert-help.hidden {
    display: inline;
  }

  .form-type-webform-likert td:last-child {
    margin-bottom: 1em;
  }
}


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

.container, .container-sm {
    max-width: 600px !important;
}

.form-check .form-check-input {
    margin-left: 0.6em;
    margin-right: 1em;
}
  

    
  .form-type-webform-likert .table-hover > tbody > tr {  
   --bs-table-accent-bg:transparent !important;  
   } 
   
     .form-type-webform-likert .table-hover > tbody > tr td:first-child{  
        padding-top:20px !important; 
        padding-bottom:20px !important; 
        padding-left:10px !important; 
        padding-right:10px !important; 
        
   } 
   

    
  .form-type-webform-likert .table-hover > tbody > tr:hover {
  /*
    --bs-table-accent-bg: var(--bs-table-hover-bg);
    color: var(--bs-table-hover-color);
    */
    
    --bs-table-accent-bg:transparent !important;
    color: #222 !important;
    
}  

.form-type-webform-likert  span.webform-likert-label
{
    position: relative !important;
    top:2px !important;
} 


  #main
  {
      padding:15px !important;
  }


}



















/* reines Styling Custom */

.path-webform th
{
    color:#fff !important;
    background-color:#5c8cbd;
}


.path-webform label
{
   font-size:18px; 
   margin-top:auto;
   margin-bottom:auto;
   /* font-weight:100; */
}
.path-webform .radios--wrapper .form-radio
{
    font-size:20px;
}

.path-webform .webform-likert-table-wrapper .form-radio
{
    font-size:22px;
   
}


/*
tr:nth-of-type(2n+1),
.path-webform div.radio div.js-form-type-radio:nth-of-type(2n+1)
{
background-color:#f3f5fa !important;
padding-top: 4px;
padding-bottom: 8px;
}


tr:nth-of-type(2n+0),
.path-webform div.radio div.js-form-type-radio:nth-of-type(2n+0)
{
background-color:#e0e5ea !important;
padding-top: 4px;
padding-bottom: 8px;
}
*/

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

/*
.form-composite
{
    margin-left:100px;
}
*/

  .indented
  {
      margin-left:100px;
  }
  .indented-2
  {
      margin-left:150px;
  }
  .indented-3
  {
      margin-left:200px;
  }

  .path-webform .form-type-webform-likert label {
    margin-left: 10px !important;
    }

  .form-check .form-check-input {
      float: left;
      margin-left: 0.5em;
  }

  .form-type-webform-likert .form-check .form-check-input {
      float: left;
      text-align: center;
      margin-left: calc(50% - 0.5em);
  }
  
  legend,
  .js-form-type-date label {
    margin-top:25px;
    font-size: 1.25rem !important;
    color:#181818;
    }
    
    .path-webform label {
    margin-left: 50px !important;
    hyphens: auto;
    display: list-item;
    list-style-type: none;
    }
    
    .path-webform .description {
    position:relative; 
    left: 20px !important;
    hyphens: auto;
    display: list-item;
    list-style-type: none;
    }  
    
    .form-type-webform-likert .description
    {
        font-size:1.25em;
        color:#396ea4 !important;
        margin-left:-15px !important;
    }
    
    .path-webform .webform-element-description
    {
        display:table !important;
    }

/*
  .path-webform label
  {
      margin-left:15px !important;
  }
*/
/*
    .path-webform .radios--wrapper div.fieldset-wrapper
    {
        max-width:50% !important;
    }
*/

.js-form-type-date,
.js-form-type-number div.input-group
{
    max-width:30% !important;
}

.js-form-type-date label,
.js-form-type-number label
{
    margin-left:0px !important; 
}
    
}   
    

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

.mb-3
{
    margin-bottom: 0rem !important; 
}
  legend,
  .js-form-type-date label {
    margin-top:25px;
    font-size: 1.25rem !important;
    color:#181818;

    }

    .path-webform label {
    margin-left: 50px !important;
    hyphens: auto;
    display: list-item;
    list-style-type: none;
    }
    
    .path-webform .form-type-webform-likert label {
    margin-left: 0px !important;
    hyphens: auto;
    }


  tr td:nth-of-type(2n+1)
  {
    background-color:#dbe7f2 !important; 
    padding-top: 4px;
    padding-bottom: 8px;
  }
  
  tr td:nth-of-type(2n+0)
  {
     background-color:#c6d4e3 !important; 
    padding-top: 4px;
    padding-bottom: 8px;
  }
  
  /*
  
    .form-type-webform-likert tr.even:hover,
  .form-type-webform-likert tr.even:hover td {
        border: 0;
        background: #d5e4f3 !important;
        background-color: #d5e4f3 !important;
    }
    
   .form-type-webform-likert tr.odd:hover,
  .form-type-webform-likert tr.odd:hover td {
        border: 0;
        background: #e1edf6 !important;
        background-color: #e1edf6 !important;
    }
    */
    
    .webform-likert-table tr td:first-child
    {
            background: #ffffff !important;
        background-color: #ffffff !important;
    }
    .form-type-webform-likert td:last-child {
    margin-bottom: 0em !important;
    }
    .path-webform label
    {
       /* margin-left:-15px !important; */
    }
    
      .form-type-webform-likert .form-check .form-check-input {
        margin-left: 0em !important;
        margin-right: 0.25em !important;
      }
    .webform-likert-table tr td:last-child .form-check .form-check-input {
      /*  margin-left: -2px !important; */
    }
    
    .last-item-gray tr td:last-child
    {
        background: #eeeeee !important;
        background-color: #eeeeee !important;
        /* padding-top: 20px !important;
        padding-bottom: 30px !important; */
    
    }
    .form-type-webform-likert .table-hover > tbody > tr td:first-child {
    padding-top: 35px !important;
    }
    
    .webform-likert-table fieldset label
    {
        margin-left:5px !important;
        margin-right:5px !important;
    }
    
    .path-webform .webform-element-description
    {
        display:table !important;
    }
    
}

.path-webform .webform-button--submit,
.path-webform .webform-button--next
{
    float:right;
    margin-top:20px;
}

.path-webform .webform-button--previous
{
    float:left;
    margin-top:20px;
}

/*
.js-form-type-webform-likert label
{
    font-size:1.25em;
    
    
} */

.form-item-einleitung-f4b-3,
.form-item-einleitung-f4b-2
{
 margin-top:50px !important;
 margin-bottom:0px !important;
}