/* Hubspost Forms */

/* Form Flexbox */
.hs-form {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    row-gap: 10px;
    font-size: 1rem;
}

.hs-form ul span{
    font-size: 1rem;
}

.hs-form ul label {
    cursor: pointer;
}

.hs-form .field .input input:not([type="radio"], [type="checkbox"]),
.hs-form .field .input select,
.hs-form .field .input textarea {
    border-radius: var(--radius-small);
    outline: none;
    border: 1px solid var(--db-border-grey);
    display: block;
    font-size: 1rem;
    padding: 0.3125rem 0.5rem;
    width: 100% !important;
    min-height: 40px;
    color: var(--db-mainblue);
}
.hs-form .field .input textarea {
    min-height: 180px;
}

ul.no-list.hs-error-msgs.inputs-list {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 1rem;
    color: red;
}
.hs-form label:not(.hs-error-msg) {
    color: var(--db-mainblue);
}
.hs-form .hs_message~.legal-consent-container .hs-richtext p,
.hs-form .legal-consent-container .hs-richtext p {
    margin: 0;
    font-size: 1rem;
}

.hs-form .hs_submit input.hs-button.primary.large {
	color: var(--db-white);
    background-color: var(--db-mainblue);
    font-size: 1.125rem;
    font-weight: var(--fontweight-bold);
    border: none;
    white-space: pre-wrap;
    padding: 0.55em 1.25em;
    line-height: normal;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
    border-radius: 0.25rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	user-select: none;
	text-align: center;
    vertical-align: middle;
    display: inline-block;
    -webkit-appearance: button;
    margin: 15px 0 0 0;
}
.hs-form .hs_submit input.hs-button.primary.large:hover {
	color: var(--db-white);
    background-color: var(--db-orange);
    box-shadow: 0 3px 15px rgb(0 0 0 / 25%);
}

.ec-form .main-section .frame-container-default {
    max-width: 70rem;
}

.hs-form-6ead40cf-b674-4aa1-aa22-c345e3b3e674_0affdbca-ebcc-4dbe-8c0f-00e7800cd68b fieldset {
    max-width: 100%;
}

/* Custom Radio */

.hs-fieldtype-radio ul.inputs-list.multi-container {
    display: flex;
    gap: 20px;
}
.hs-fieldtype-radio ul.inputs-list.multi-container li.hs-form-radio {
    padding: 4px 15px;
    border-radius: var(--radius-small);
    background-color: var(--db-white);
    border: 1px solid var(--db-border-grey);
    min-width: 100px;
}

.hs-form-radio input[type=radio] {
  --s: 1.5625rem;     /* control the size */
  --c: var(--db-mainblue); /* the main color */
  --a: var(--db-neonblue); /* the active color */
  
  height: var(--s);
  aspect-ratio: 1;
  border: calc(var(--s)/10) solid var(--c);
  padding: calc(var(--s)/10);
  background: 
     radial-gradient(farthest-side,var(--c) 94%,#0000) 
     50%/0 0 no-repeat content-box;
  border-radius: 50%;
  outline-offset: calc(var(--s)/10);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
  font-size: inherit;
  transition: .3s;
  margin: 0;
}
.hs-form-radio input[type=radio]:checked {
  border-color: var(--a);
  background: 
     radial-gradient(farthest-side,var(--a) 94%,#0000) 
     50%/0 0 no-repeat content-box;
  background-size: 100% 100%;
}

.hs-form-radio input[type=radio]:disabled {
  background: 
     linear-gradient(#939393 0 0) 
     50%/100% 20% no-repeat content-box;
  opacity: .5;
  cursor: not-allowed;
}

.hs-form-radio label {
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin:5px 0;
  cursor: pointer;
}

.hs_db_newsletter_checkbox,
.hs_checkbox___schufa_art__15_ds_gvo,
.legal-consent-container
{
    hyphens: auto;
}

.hs_db_newsletter_checkbox + .hs_datenschutzerklarung_checkbox {
    margin-top: 20px;
}

/* Multi Select Checkbox */
ul.inputs-list.multi-container {
    display: grid;
    grid-template-columns: repeat(2,1fr);
}

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

	/* Form Flexbox */

	 .ec-form .hbspt-form label > span:first-child {
	    display: inline-block;
	    margin-bottom: 0.25rem;
	    margin-top: 10px;
    }

    .hs-form .form-columns-3 > .field:not(:last-child),
    .hs-dependent-field .hs-form-field:not(:first-child, :last-child),
    .hs-form .form-columns-3 .hs_mobilfunkanbieter {
        width: 50% !important;
    }

    .hs-dependent-field .hs-form-field:where(:first-child, :last-child) {
        width: 100% !important;
    } 

    /* Formular */

    #c30164 .hs-form {
        flex-direction: row;
    }
    
    #c30164 .hs-form div:where(.hs_firstname, .hs_lastname, .hs_kontaktgrund, .hs_email, .hs_phone, .hs_praferierte_kontaktaufnahme) {
        width: 50%;
        padding: 0 4px;
    }
    
    #c30164 div:where(.hs_message, .hs_submit)  {
        width: 100%;
    }

    /* Multi Select Checkbox */
    ul.inputs-list.multi-container {
        grid-template-columns: repeat(3,1fr);
        column-gap: 50px;
    }
}


/* End Media Query */	

.hs-dependent-field .hs-form-field {
    width: 100%;
}

.hs-form .form-columns-3,
.hs-dependent-fiel {
    display: flex;
    flex-wrap: wrap;
}

.hs-form .inputs-list {
    padding-left: 0;
    margin: 0;
}

.input .hs-input {
    margin-right: 1rem;
}

fieldset {
    max-width: none !important;
}

.input ul {
    list-style: none;
}

.hs-dependent-field .field,
.hs-form .form-columns-3 .hs_mobilephone,
.hs-form .form-columns-3 .hs_mobilfunkanbieter {
    width: 100% !important;
}

input:not([type="checkbox"]), select {
    margin-bottom: 1rem;
} 

/* Pkv Check Form */

@media only screen and (min-width: 992px) {
    
    .pkv-check-formular .contentcontainer {
        max-width: 50%;
        margin: auto;
    }
}

@media only screen and (min-width: 1400px) {
    
    .pkv-check-formular .hs_art_des_gluckspiels__dd_ label {
        white-space: nowrap;
    }
}

@media only screen and (min-width: 768px) and (max-width: 992px) {
    
    .pkv-check-formular .hs_art_des_gluckspiels__dd_ label {
        white-space: nowrap;
    }
}

.pkv-check-formular .hs-form .hs_submit input.hs-button.primary.large {
    background-color: #FFB300;
    text-transform: uppercase;
}

.pkv-check-formular .hs-form .hs_submit input.hs-button.primary.large:hover {
    background-color: #00164B;
}

.pkv-check-formular.frame-layout-embedded > .frame-group-container > .frame-group-inner {
    background: #F2F9FF;
}

/* Pkv Contributions Form */

@media only screen and (min-width: 992px) {
    .pkv-contributions .contentcontainer {
        max-width: 50%;
        margin: auto;
    }
}

/* Life Insurance Form */

.life-insurance-form .hs-form .form-columns-3 .field.field:not(:last-child).hs_anrede__formular_ {
    width: 100% !important;
}

.life-insurance-form .hs-form fieldset.form-columns-3 .hs_lastname,
.life-insurance-form .hs-form fieldset.form-columns-3 .hs_firstname {
    width: 50% !important;
}

.life-insurance-form .hs-form .form-columns-2 .hs_abfrage_rentenversicherung_oder_lebensversicherung_dd,
.life-insurance-form .hs-form .form-columns-2 .hs_abschluss_lv_rv___dd,
.life-insurance-form .hs-form .form-columns-2 .hs_datenschutzerklarung_checkbox,
.life-insurance-form .hs-form .form-columns-2 .hs_db_newsletter_checkbox,
.life-insurance-form .hs-form .form-columns-2 .hs_monatliche_beitrage_pkv__klassiert,
.life-insurance-form .hs-form .form-columns-2 .hs_rechtsschutzversicherung {
    width: 100% !important;
}

@media only screen and (min-width: 767px) {
    .life-insurance-form .hs-form .form-columns-3 .field.field:not(:last-child).hs_anrede__formular_ {
        width: 30% !important;
    }
    
    .life-insurance-form .hs-form fieldset.form-columns-3 .hs_firstname,
    .life-insurance-form .hs-form fieldset.form-columns-3 .hs_lastname {
        width: 35% !important;
    }
}

/* Check lps Form */

.check-lps-form .hs-form fieldset.form-columns-2 .hs_db_newsletter_checkbox,
.check-lps-form .hs-form fieldset.form-columns-2 .hs_datenschutzerklarung_checkbox {
    width: 100%;
}

.check-lps-form .hs-form .form-columns-3 .field.field:not(:last-child).hs_anrede__formular_ {
    width: 100% !important;
}

.check-lps-form .hs-form fieldset.form-columns-3 .hs_firstname ,
.check-lps-form .hs-form fieldset.form-columns-3 .hs_lastname {
    width: 50%;
}

.check-lps-form .hs-form .hs_submit input.hs-button.primary.large {
    background-color: #E46C0A;
    text-transform: uppercase;
}

@media only screen and (min-width: 767px) {
    .check-lps-form .hs-form .form-columns-3 .field.field:not(:last-child).hs_anrede__formular_ {
        width: 30% !important;
    }
    
    .check-lps-form  .hs-form .form-columns-3 > .field {
        width: 35% !important;
    }
}

/* 3 column form  */

@media only screen and (min-width: 1201px) {
    .column3-form .frame-group-container {
        max-width: 50%;
        margin: auto;
    }
}

.column3-form form {
    gap: 0;
}

.column3-form .hs-form fieldset.form-columns-2 .hs_db_newsletter_checkbox,
.column3-form .hs-form fieldset.form-columns-2 .hs_datenschutzerklarung_checkbox,
.column3-form .hs-form fieldset.form-columns-2 .hs_abfrage_rentenversicherung_oder_lebensversicherung_dd,
.column3-form .hs-form fieldset.form-columns-2 .hs_abschluss_lv_rv___dd {
    width: 100%;
}

.column3-form .hs-form .form-columns-3 .field.field:not(:last-child).hs_anrede__formular_ {
    width: 100% !important;
}

.column3-form .hs-form fieldset.form-columns-3 .hs_firstname ,
.column3-form .hs-form fieldset.form-columns-3 .hs_lastname {
    width: 50%;
}

@media only screen and (min-width: 767px) {
    .column3-form .hs-form .form-columns-3 .field.field:not(:last-child).hs_anrede__formular_ {
        width: 30% !important;
    }
    
    .column3-form .hs-form .form-columns-3 > .field {
        width: 35% !important;
    }
}