.form-container {
     background: #fff;
     color: #333;
     max-width: 600px;
     margin: 0 auto;
     border-radius: 10px;
 }

 .form-group {
     margin-bottom: 55px;
 }

 .form-label {
     display: block;
     font-size: 20px;
     font-weight: 700;
     color: #071A35;
     margin-bottom: 22px;
 }

 .select-wrapper {
     position: relative;
 }


 .form-select { 
	 font-family: "Manrope", Sans-serif !important;
     width: 100%;
     padding: 12px 16px;
     border-radius: 10px;
     border: 1px solid #071A35;
     font-size: 16px;
     background: white;
     appearance: none;
     cursor: pointer;
     color: #666;
 }

.form-select option {

}
 .form-select:focus {
     outline: none;
     border-color: #CE1782;
 }

 .monthly-save{
    color: #2FC5A7 !important;
 }
 .anualy-save{
    color: #2FC5A7 !important;
 }

 /* Select arrow */
 .select-wrapper::after {
     content: '▼';
     position: absolute;
     right: 16px;
     top: 50%;
     transform: translateY(-50%);
     pointer-events: none;
     color: #666;
     font-size: 12px;
 }

 /* === Radios como botones toggle === */
 .checkbox-group {
     display: flex;
     gap: 15px;
     margin-top: 8px;
 }

 .checkbox-item {
     position: relative;
 }

 .checkbox-input {
     display: none;
     /* ocultamos radio nativo */
 }

 .checkbox-label {
     display: inline-block;
     padding: 10px 20px;
     border: 2px solid #071A35;
     border-radius: 8px;
     font-size: 14px;
     font-weight: 600;
     color: #071A35;
     cursor: pointer;
     transition: all 0.2s ease;
     background: #fff;
 }

 .checkbox-input:checked+.checkbox-label {
     background-color: #071A35;
     color: #fff;
 }

 .info-icon {
     transform: translateY(-4px);
     display: inline-block;
     text-align: center;
     margin-left: 4px;
     cursor: help;
 }

 .slider-header {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-bottom: 16px;
 }

 .slider-value {
     font-size: 20px;
     color: #071A35;
     margin-bottom: 22px;
 }

 .content-sliders {
     display: flex;
     width: 100%;
     gap: 20px;
     align-items: baseline;
 }

 .content-sliders>span {
     font-size: 14px;
     color: #666;
     min-width: 20px;
 }

 .slider-container {
     position: relative;
     margin-bottom: 8px;
     flex-grow: 1;
 }

 .slider-track {
     width: 100%;
     height: 10px;
     background: #e1e5e9;
     border-radius: 9999999px;
     position: relative;
 }

 .slider-fill {
     height: 100%;
     background: #CE1782;
     border-radius: 9999999px;
     position: absolute;
     top: 0;
     left: 0;
 }

 .slider-thumb {
     width: 32px;
     height: 32px;
     background: #1a365d;
     border-radius: 50%;
     position: absolute;
     top: 50%;
     transform: translate(-50%, -50%);
     cursor: pointer;
     color: white;
     display: flex;
     justify-content: center;
     align-items: center;
 }

 /* Slider labels */
 .slider-labels {
     display: flex;
     justify-content: space-between;
     margin-top: 8px;
     font-size: 12px;
     color: #666;
 }

 /* Tooltip */
 .tooltip {
     position: absolute;
     background: rgba(0, 0, 0, 0.8);
     color: white;
     padding: 8px 12px;
     border-radius: 4px;
     font-size: 12px;
     white-space: nowrap;
     z-index: 1000;
     opacity: 0;
     pointer-events: none;
     transition: opacity 0.3s;
 }

 .tooltip.show {
     opacity: 1;
 }

 .slider-thumb:hover {
     transform: translate(-50%, -50%) scale(1.1);
 }

 .slider-thumb:active {
     cursor: grabbing;
 }

 /* Estilos para la sección de ahorros */
 .savings-container {
     max-width: 600px;
     margin: 20px auto 0;
     background: white;
     padding: 30px;
     border-radius: 10px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
 }

 .savings-group {
     display: flex;
     justify-content: space-around;
     gap: 30px;
 }

 .savings-item {
     text-align: center;
     flex: 1;
 }

 .savings-label {
     display: block;
     font-weight: bold;
     margin-bottom: 10px;
     color: #333;
     font-size: 16px;
 }

 .savings-value {
     display: block;
     font-size: 28px;
     font-weight: bold;
     color: #CE1782;
     transition: filter 0.5s ease, opacity 0.5s ease;
 }

 .savings-value.blurred {
     filter: blur(5px);
     opacity: 0.3;
     user-select: none;
 }

 .savings-value.unblurred {
     filter: blur(0px);
     opacity: 1;
 }

 /* Botón Calcular */
 .btn-calcular {
     background: #CE1782;
     color: white;
     border: none;
     padding: 15px 40px;
     font-size: 18px;
     font-weight: 700;
     border-radius: 10px;
     cursor: pointer;
     transition: all 0.3s ease;
     font-family: "Manrope", Sans-serif;
 }

 .btn-calcular:hover {
     background: #a0125f;
     transform: translateY(-2px);
     box-shadow: 0 4px 12px rgba(206, 23, 130, 0.3);
 }

 .btn-calcular:active {
     transform: translateY(0);
 }

 .btn-calcular:disabled {
     background: #ccc;
     cursor: not-allowed;
     transform: none;
 }

 /* Responsive */
 @media (max-width: 768px) {

     .form-container,
     .savings-container {
         padding: 20px;
         margin: 10px;
     }

     .checkbox-group {
         flex-direction: column;
         gap: 10px;
     }

     .savings-group {
         flex-direction: column;
         gap: 20px;
     }
 }