  .req { color:#f04 }
    

    .sexs .custom-radio {
    width: 100%;
}
.fraziona { display: none;}
#privacyText { width:100%; resize:none; position:relative; height:200px; border-radius:0px}
#privacyCheck { width:16px; height:16px; }
.checked-box {  width:100%;display:flex;flex-direction:row;justify-content: flex-start; gap:20px; line-height:16px }
.checked-box label { width:auto !important;}
   .sceltaoption {     display: flex
   ;
       flex-direction: row;
       width: 100%;
       height: auto;
       padding:50px 0
   
   }
   .indirizzonum {
    display: flex
;
    width: 100%;
    position: relative;
    gap: 20px;
}
   .form-container {
    
       
       width: 100%;
       padding: 20px 0px;
   }
   
   h1, h2 {
       color: #333333;
       font-size:22px;
       text-align: left;
   }
   
   h1 {
       margin-bottom: 20px;
   }
   
   h2 {
       margin-top: 0;
       font-size: 1.4rem;
       color: #555555;
       margin-bottom: 20px;
   }
   
   /* Form Styles */
   
   
   .form-group {
    margin-bottom: 15px;
    display: flex
;
    justify-content: space-between;
    flex-direction: column;
    position: relative;
    gap: 1px;
    align-content: flex-start;
    align-items: flex-start;
}
.hidds { display: none !important;}
.man { background:#e7f0fc !important;}
.woman { background:#fce7f5 !important;}
   .text-option { text-align: center; margin: 10px 0;}
   .op-option { display: flex
   ;
       flex-direction: column;
       flex: 33.3%;
       height: 120px; }
       .form-group label {
    color: #000000;
    margin-bottom: 5px;
    
    width: auto;
    display: flex
;
    text-align: left;
    font-weight: bold;
    justify-content: flex-start;
    align-items: center;
}
   input[type="date"] {
  width: 100%;   padding: 10px;   font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

   .form-group input,
   .form-group select {
       width: 100%;
       padding: 15px 5px;
       font-size: 1rem;
       border: 1px solid #cccccc;
       border-radius: 1px;
       box-sizing: border-box;
       transition: all 0.8s ease;
   }
   
   .form-group input:focus,
   .form-group select:focus {
       border:2px solid #007bff;;
       outline: none;
   }
   
   .form-group p {
    font-weight: bold;
    color: #000000;
    margin-bottom: 5px;
    width: 50%;
    line-height: 56px;
    position: relative;
    display: inline-block;
    text-align: right;
}
select {
      width: 100%;
      padding: 10px;
      border: 2px solid #007bff;
      border-radius: 8px;
      background: white;
      font-size: 18px;
      color: #333;
      outline: none;
      appearance: none;
      cursor: pointer;
      transition: box-shadow 0.3s ease, border-color 0.3s ease;
    }

    select:hover {
      border-color: #0056b3;
      box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    }
    .custom-select-container {
      position: relative;
      width: 100%;
      text-align: center;
    }
    .custom-select-container::after {
      content: '▼';
      position: absolute;
      top: 50%;
      right: 15px;
      transform: translateY(-50%);
      font-size: 18px;
      color: #007bff;
      pointer-events: none;
    }

    /* Animazione per l'ingresso */
    @keyframes fadeIn {
      from {
        transform: translateY(-20px);
        opacity: 0;
      }
      to {
        transform: translateY(0);
        opacity: 1;
      }
    }

    select option {
      animation: fadeIn 0.4s ease;
    }
   .form-group label input[type="radio"] {
       margin-right: 0 !important;
   }
   .prev-step { padding:10px 20px 10px 10px}
   button {
    padding: 10px 10px 10px 20px;
    background: #0a283a;
    border:none;
    /* border-radius:0 !important; */
    font-size: 18px;
    color: #fff;
    border-radius: 4px; */
    font-size: 1.4rem;
    cursor: pointer;
    margin-top: 10px;
    display: flex;
    float: right;
    transition: all 0.8s ease;
    text-transform: uppercase;
    font-weight: bold;
    justify-content: center;
    align-items: center;
    align-content: center;
}
   .textSLider { background: none; text-transform:uppercase; text-align:left !important; width: 100% !important; }
   .fgds   {  width: 100% !important;
       display: flex !important
   ;
       position: relative !important;
       justify-content: space-between;
       flex-direction: row-reverse;
   }
    h3 {
       color: #333333;
       font-size:14px;
       text-align: left;
   }
   
 
button:hover {
    background-color: #1c506e;
}
   button:active {
    background-color:#1c506e;
   }
   button:focus {
    background-color:#1c506e;
   }
   /* Navigation Buttons */
   button.prev-step,
   button.next-step,
   button#calcola-preventivo {
       width: auto;
   }
   button.prev-step {
       background-color: #6c757d;
       float: left;
       color: #fff;
       /* border: 2px solid #6c757d; */
   }
   
   button.prev-step:hover {
       background-color: #5a6268;
   }
   input:focus { touch-action:manipulation }
   .contentsceltaoption {width: 100%;
       display: flex
   ;
       flex-direction: row; }
       .lineassss {
    background-color: #ccc;
    width: 71%;
    height: 2px;
    position: absolute;
    top: 110px;
    left: 14.5%;
    display: flex
;
    align-items: center;
    justify-content: center;
    align-content: center;
    margin: auto;
}
       
   .option-scelta { display: flex
   ;
       justify-content: center;
       align-items: center;
       align-content: center;
       position: relative;
       width: 80px;
       height: 80px;
       border-radius: 40px;
       margin: auto;
       background: #bbb; }
       
.custom-radio {
    width: 48%;
    background: #eee;
    margin-right:0 !important;
    font-weight: bold;
    border-radius: 6px;
    display: flex !important
;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    padding: 10px 0;
    border: 1px solid #ddd;
}
       .radio-btn { }
   .option-scelta span { font-size: 26px;
       color: #fff !important; }
   .activ { background-color:rgb(167, 0, 117); color:#fff }
   .okfact { display: none;}
   .okfact img { fill:#fff !important; color:#fff !important; }
   .okey .okfact { display: block;/* width: 30px; *//* height: 30px; */background-color:rgb(167, 0, 117);border-radius: 20px;color: #fff !important;top: -5px;right: -5px;position: absolute;font-size: 15px;padding: 8px 12px;}
   button#calcola-preventivo {
       background-color: #28a745;
       border:2px solid #28a745;
       color:#fff
   }
   .sexs {
    display: flex !important
;
    flex-direction: row;
    position: relative !important;
    width: 100% !important;
    gap: 20px !important;
   }
   button#calcola-preventivo:hover {
       background-color: #218838;
   }
   
   /* Form Steps */
   .form-step {
    width: 90%;
    display: none;
    margin: 4% auto;
}
.riepilogo-box div { font-size:14px;display:flex;flex-direction:column;align-items: flex-start;}
 .riepilogo-box div strong { color:#000 ; font-weight:500}
.riepilogo-box div  { color:#1f438c; font-weight:bold; }
.riepilogo-box {gap: 8px;display:flex;flex-direction: column;align-content: flex-start;align-items: flex-start;}
   .riepilogo-box h3 { color:#1f438c; gap: 5px; text-transform:capitalize; font-weight:bold; font-size:18px }
.riepilogo-box i {color:#1f438c !important;  }  
.form-step.active {
       display: block;
   }
   .toggle-group {
       display: flex;
       flex-wrap: wrap;
       gap: 15px;
       width: 100%;
   }
   
   /* Toggle switch container */
   .toggle-switch {
       display: flex;
       align-items: center;
       cursor: pointer;
       user-select: none;
       position: relative;
   }
   
   /* Nascondi input checkbox originale */
   .toggle-switch input[type="checkbox"] {
       opacity: 0;
       width: 0;
       height: 0;
       position: absolute;
   }
   
   /* Slider del toggle */
   .slider {
       position: relative;
       width: 50px;
       height: 25px;
       background-color: #ccc;
       border-radius: 25px;
       transition: background-color 0.3s ease;
       margin-right: 10px;
   }
   .lineassss { }
   /* Pulsante dentro il toggle */
   .slider:before {
       content: "";
       position: absolute;
       width: 20px;
       height: 20px;
       background-color: white;
       border-radius: 50%;
       top: 2.5px;
       left: 2px;
       transition: transform 0.3s ease;
       box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
   }
   
   /* Quando il checkbox è attivo */
   .toggle-switch input[type="checkbox"]:checked + .slider {
       background-color: #b30018;
   
   }
   
   .toggle-switch input[type="checkbox"]:checked + .slider:before {
       transform: translateX(25px);
   }
   input[type="date"] {     
    width: 100%;
    padding: 14px 10px;
    font-size: 1rem;
    border: 1px solid #ccc;
    border-radius: 12px;
    background: #fafafa;
  }
  
   /* Etichetta accanto al toggle */
   .toggle-switch span {
       
       font-weight: normal;
       color: #000000;
        
       width: 56px;
       height: 25px;
       line-height: 25px;
   
       position: relative;
       display: inline-block;
   }
   .loadgifs {display: flex !important;justify-content: center;align-content: center;align-items: center;}
.load-polizza {
    width:100%; position:absolute; background:#ffffff90; height:100%; display:none; z-index:2
}
.center-l-p {width:auto;height:auto;position:relative;display:flex;align-content: center;justify-content: center;align-items: center;}
.gif-load-polizza {width:120px;height:120px;position:relative;display:flex;margin:auto;background:url(https://i.gifer.com/VAyR.gif) no-repeat center/cover;justify-content: center;align-content: center;align-items: center;}

   /* Responsive Design */
   @media (max-width: 768px) {
    .form-step {
    width: 90%;
    display: none;
    margin: 4% auto;
}
    .sceltaoption {
        left: 0;
        background-color: #fff;
        position: fixed;
        z-index: 2;
        border-bottom: 1px solid #ddd;
    }
       .prev-step { padding:8px 20px 8px 10px}
    button {
    padding: 8px 10px 8px 20px;
    background: #e65a3d;
    border:none;
    border-radius:0 !important;
    color: #fff;
    /* border-radius: 16px; */
    font-size: 1rem;
    cursor: pointer;
    margin-top: 10px;
    display: flex;
    float: right;
    transition: all 0.8s ease;
}
    .form-group {
    
     
    flex-direction: column;
    
    gap: 5px;
}
.form-group label {
   width: auto !important;  
    display: flex
;
      text-align: left;  
 
     justify-content:initial
    

}

.form-group p {
     
    width: auto !important;
    line-height: 56px;
     
    text-align: left !important;
}
.indirizzonum {
    display: flex
;
    width: 100%;
    position: relative;
    gap: 10px;
}

.okey .okfact {
        top: -8px !important;
        right: -12px !important;
        width: 36px;
        height: 36px;
        -webkit-text-fill-color: #fff;
        fill: #fff;
        color:#fff !important;
        text-align: center !important;
    }
        .lineassss { background-color: #ccc;
       width: 72%;
       height: 2px;
       position: absolute;
       top: 66px;
       left: 15%;
       display: flex
   ;
       align-items: center;
       justify-content: center;
       align-content: center;
       margin: auto; }
       .option-scelta span { font-size: 16px;
       color: #fff !important; margin:5px 8px}
        .option-scelta { display: flex;
       justify-content: center;
       align-items: center;
       align-content: center;
       position: relative;
       width:30px;
      
       border-radius: 40px;
       margin: auto;
       background: #bbb; }
         .op-option { display: flex
   ;
       flex-direction: column;
       flex: 33.3%;
       height: 50px; }
       
       .form-container {
             
       }
           .sexs .custom-radio {
        display: flex
;
        justify-content: center;
        align-items: center;
        align-content: center;
    }
    input[type="date"] {
    width: 100%;
    padding: 14px 10px;
    font-size: 1rem;
    height: 55px !important;
    border: 1px solid #ccc;
    border-radius: 12px;
    background: #fafafa;
    -webkit-appearance: none;
    appearance: none;
}
    select {height: 60px !important; } 
       h1, h2 {
           font-size: 1.2rem;
       }
   .toggle-group .fgds { width:100% !important}
       
   }
 