.radio-card .radio-card__input label,
input[type=radio]:not(.volcano-input-boolean) ~ label,
input[type=checkbox]:not(.volcano-input-boolean) ~ label {
    font-size: 1rem;
    transform: none !important;
    margin: 0;
    white-space: unset;
    pointer-events: auto;
    line-height: 1.5;
    cursor: pointer;}

.radio-card :checked~ label,
input[type=radio]:not(.volcano-input-boolean):checked~ label,
input[type=checkbox]:not(.volcano-input-boolean):checked~ label {

    /*font-weight: var(--font-weight-bold);*/
}
.radio-card input:disabled~ label,
input[type=radio]:not(.volcano-input-boolean):disabled ~ label,
input[type=checkbox]:not(.volcano-input-boolean):disabled ~ label {
    color:var(--color-gray-4) }

.form-field-helper-container {
    padding-right: 0;
    padding-left: 0;}
/*check*/
.input-type-checkbox .volcano-input-inner-container {
    flex-direction: row;
}
input[type=checkbox]:not(.volcano-input-boolean) + div {
    border: 1px solid var(--color-black);
    width: 1.5rem;
    height: 1.5rem;
    background: #fff;
    position: absolute;
    left: 0;
    transition: box-shadow var(--animation-timing) var(--animation-transition);
    top: 0;
    pointer-events: none;
}

input[type=checkbox]:not(.volcano-input-boolean) {
    width: 1.5rem;
    opacity: 0;
    flex: 0 0 1.5rem;
}

input[type=checkbox]:not(.volcano-input-boolean) + div + div {
    position: absolute;
    width: 0.875rem;
    top: 0.3rem;
    left: 0.3rem;
    height: 0.875rem;
    display: block;
    pointer-events: none;
}
input[type=checkbox]:not(.volcano-input-boolean):checked + div + div {

    background: var(--color-green-2);
}

input[type=checkbox]:not(.volcano-input-boolean):focus + div {
    box-shadow: 0 0 0px 2px #fff, 0 0 0px 4px var(--color-green-2);
}

input[type=checkbox].is-invalid:not(.volcano-input-boolean):focus + div {
    box-shadow: 0 0 0px 2px #fff, 0 0 0px 4px var(--color-error-1);
}

.form-danger input[type=checkbox]:not(.volcano-input-boolean):checked + div + div {
    background: var(--color-error-1);
}

input[type=checkbox]:not(.volcano-input-boolean):disabled + div,
input[type=checkbox]:not(.volcano-input-boolean)[readonly] + div {
    background-color: var(--color-gray-1);
    border-color: var(--color-gray-4);
}

input[type=checkbox]:not(.volcano-input-boolean):checked:disabled + div + div,
input[type=checkbox][readonly]:not(.volcano-input-boolean):checked + div + div {
    background: var(--color-gray-3);
}


/*radio*/
.volcano-input-solid-dynamic .form-dyn input[type=checkbox].form-control,
.volcano-input-solid-dynamic .form-dyn input[type=radio].form-control {
    height: 1.5rem;
    min-height: auto;
}
input[type=radio] + div {
    border: 1px solid var(--color-black);
    width: 1.5rem;
    border-radius: 100%;
    height: 1.5rem;
    background: #fff;
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    transition: box-shadow var(--animation-timing) var(--animation-transition);
}

input[type=radio] {
    width: 1.5rem;
    flex: 0 0 1.5rem;
    opacity: 0 !important;
    margin-right: 0.5rem;
}

input[type=radio]:checked + div + div {
    position: absolute;
    border-radius: 100%;
    width: 0.875rem;
    background: var(--color-green-2);
    top: 0.3rem;
    left: 0.3rem;
    height: 0.875rem;
    display: block;
    pointer-events: none;
}

input[type=radio]:focus + div {
    box-shadow: 0 0 0px 2px #fff, 0 0 0px 4px var(--color-green-2);
}

input[type=radio].is-invalid:focus + div {
    box-shadow: 0 0 0px 2px #fff, 0 0 0px 4px var(--color-error-1);
}

input[type=radio].is-invalid:checked + div + div {
    background: var(--color-error-1);
}

input[type=radio]:disabled + div,
input[type=radio][readonly] + div {
    background-color: var(--color-gray-1);
    border-color: var(--color-gray-4);
}

input[type=radio]:checked:disabled + div + div,
input[type=radio][readonly]:checked + div + div {
    background: var(--color-gray-3);
}
/*radio-card*/
.radio-card {
    margin-bottom: 1rem;
    position: relative;
    padding: 1rem;
}
.radio-card__input>div {
    padding: 0;
    position: static;
    margin: 0;
}
.radio-card .volcano-input-solid-dynamic .form-dyn {
    position: static;
    will-change: auto;
}
.radio-card label::before {
    content: "";
    position: absolute;
    border: 1px solid var(--color-gray-3);
    left: 0;
    right: 0;
    top: 0;
    transition:border  var(--animation-timing)  var(--animation-transition);
    bottom: 0;    z-index: -1;
    display: block;
    border-radius: 0.25rem;
}
.radio-card :checked ~ label::before {
    border: 1px solid var(--color-black);
}
.radio-card :focus ~ label::before {
    border: 2px solid var(--color-green-2);
}.radio-card label  {
     position: static !important;
     will-change: auto;
 }

.radio-card input:disabled~ label::before {
    background: var(--color-gray-2);
}
.radio-card input[type=radio] + div,
.radio-card input[type=radio] + div + div{
    left: auto;
    top: auto;}
.radio-card input[type=radio] + div + div{
    position: absolute;
    margin: 0.3rem;}
.radio-card__text {
    font-size: var(--text-size-XXS);
    line-height: var(--text-line-height-XXS);
    letter-spacing: var(--text-letter-spacing-XXS);
    color: var(--color-gray-5);
}.radio-card__body {
     display: inline-flex;
     gap: 1rem;
     flex-wrap: wrap;
     align-items: center;
     justify-content: space-between;
     width: 100%;
 }.radio-card__optional {
      text-align: right;
      text-wrap: nowrap;
  }.radio-card__additional-content {
       flex: 0 0 100%;
   }
@media(max-width: 575px) {
    .radio-card__body {
        flex-direction: column;
        align-items: flex-end;
    }
}
/*
switch*/
.form-switcher-container label,
.form-switcher input:not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]):not(:placeholder-shown) ~ label {
    transform: none !important;

    font-size: var(--text-size-XS);
}
.form-switcher input[type="checkbox"] {
    position: absolute;
}
.form-switcher-bar {
    width: var(--switcherWidth);
    position: relative;
    min-width: var(--switcherWidth);
    min-height: 1.5rem;
    height: 1.5rem;
}.form-switcher label {
     margin: 0;
 }.form-switcher-point{
       min-height: 1.5rem;
       height: 1.5rem;}
.volcano-input-solid-dynamic .form-switcher .form-switcher-point::before,
.form-dyn .form-switcher .form-switcher-point::before,
.volcano-input-solid-dynamic .form-switcher .form-switcher-point::before {

    width: 1.125rem;
    height: 1.125rem;
    background: #fff;
    content: "";
    left: 0.25rem;
}
.volcano-input-solid-fixed-top .form-switcher input[type="checkbox"]:checked + .form-switcher-point::before, .volcano-input-outline-dynamic .form-switcher input[type="checkbox"]:checked + .form-switcher-point::before, .volcano-input-outline-fixed-top-inside .form-switcher input[type="checkbox"]:checked + .form-switcher-point::before, .volcano-input-line-dynamic .form-switcher input[type="checkbox"]:checked + .form-switcher-point::before, .volcano-input-outline-fixed-top-inline .form-switcher input[type="checkbox"]:checked + .form-switcher-point::before, .volcano-input-solid-dynamic .form-switcher input[type="checkbox"]:checked + .form-switcher-point::before {
    left: 1.125rem;
}
.volcano-input-solid-fixed-top .form-switcher input[type="checkbox"]:active + .form-switcher-point::before, .volcano-input-outline-dynamic .form-switcher input[type="checkbox"]:active + .form-switcher-point::before, .volcano-input-outline-fixed-top-inside .form-switcher input[type="checkbox"]:active + .form-switcher-point::before, .volcano-input-line-dynamic .form-switcher input[type="checkbox"]:active + .form-switcher-point::before, .volcano-input-outline-fixed-top-inline .form-switcher input[type="checkbox"]:active + .form-switcher-point::before, .volcano-input-solid-dynamic .form-switcher input[type="checkbox"]:active + .form-switcher-point::before {
    width: 2rem;
}.form-switcher input[type="checkbox"]:checked:active + .form-switcher-point::before {
     margin-left: -14px;
 }.volcano-input-solid-dynamic .form-switcher {
       height: auto;
       margin: 0;
      overflow: visible;
      gap: 0.25rem;
       display: flex;
       flex-direction: row;
       max-width: 100%;
       align-items: center;
       width: 100%;
       justify-content: flex-start;
   }

.volcano-input-solid-dynamic .form-switcher input[type="checkbox"]:checked + .form-switcher-point::before {

    content: "";
    background: #fff;
}
input:hover ~ .form-switcher-bar,
.volcano-input-solid-dynamic .form-switcher-bar {
    background-color: var(--color-gray-3);
}
input:hover:checked ~ .form-switcher-bar,
.volcano-input-solid-dynamic input:hover:checked ~.form-switcher-bar {
    background-color: var(--colorBackgroundPrimaryLight);
}.form-switcher-bar::before {
     content: "";
     border: 2px solid transparent;
     position: absolute;
     left: -0.25rem;
     right: -0.25rem;
     top: -0.25rem;
     bottom: -0.25rem;
     border-radius: 0.25rem
 ;
     transition: border-color var(--animation-timing) var(--animation-transition);
 }input:hover ~ .form-switcher-bar::before {

      border-color: var(--colorBackgroundPrimaryLight)}
.volcano-input-outline-fixed-top-inline .form-switcher + label, .volcano-input-solid-dynamic .form-switcher + label, .volcano-input-outline-fixed-top-inside .form-switcher + label, .volcano-input-solid-fixed-top .form-switcher + label, .volcano-input-outline-dynamic .form-switcher + label, .volcano-input-line-dynamic .form-switcher + label {
    transform: none;
    top: 0;
    position: relative;
}
.input-type-switcher .volcano-input-inner-container {
    display: flex;
    flex-direction: row;
    align-items: center;
}
  .form-switcher input[type="checkbox"]:disabled  ~ .form-switcher-bar {

    background-color: var(--color-gray-3);
}
.form-switcher input[type="checkbox"]:disabled ~ label {
    color: var(--color-gray-4);

     cursor: not-allowed;
 }
/*// mi serve che nella label ci sia il for="idcheckbox"*/