.input-group>.form-control,
		.input-group>.form-select,
		.input-group>.form-floating {
			width: 100%;
		}

		:root {
			--primary-color: #2F420A;
			--secondary-color: #E8EECF;
			--accent-color: #FFF7EC;
			--green-color: #2E7D32;
			--green-bg: #E8F5E9;
			--dark-text: #333333;
			--light-text: #666666;
			--white: #FFFFFF;
			--error-color: #D32F2F;
			--success-color: #4CAF50;
			--border-radius: 8px;
			--box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
		}

		/* Container principale più compatto */
		.mortgage-calculator {
			padding: 10px 0;
			font-family: 'Inter', sans-serif;
		}

		/* Titolo principale ridotto */
		.mortgage-calculator__title {
			font-size: 1.8rem;
			font-weight: 700;
			color: var(--primary-color);
			margin-bottom: 15px;
		}

		/* Contenitore del form */
		.mortgage-calculator__form-container {
			/* background-color: var(--white); */
			border-radius: var(--border-radius);
			box-shadow: var(--box-shadow);
			overflow: hidden;
			height: 100%;
		}

		/* Header del form */
		.mortgage-calculator__form-header {
			background-color: var(--primary-color);
			color: var(--white);
			padding: 12px 15px;
			text-align: center;
			font-weight: 600;
			font-size: 1.1rem;
		}

		/* Form interno */
		.mortgage-calculator__form {
			padding: 15px;
			background-color: var(--secondary-color);
		}

		/* Nuove righe compatte a 2 colonne */
		.form-row-compact {
			display: flex;
			justify-content: space-between;
			margin-bottom: 12px;
		}

		/* Gruppi di input */
		.input-group {
			flex: 0 0 48%;
			display: flex;
			flex-direction: column;
		}

		/* Etichette ridotte */
		.form-label {
			font-weight: 500;
			color: var(--dark-text);
			font-size: 0.85rem;
			margin-bottom: 3px;
		}

		/* Input e select ridotti */
		.mortgage-calculator .form-control,
		.mortgage-calculator .form-select {
			border-radius: 4px;
			font-size: 0.9rem;
			padding: 6px 10px;
			border: 1px solid #ddd;
			transition: border-color 0.2s, box-shadow 0.2s;
		}

		/* Rimuovi frecce dagli input numerici */
		.mortgage-calculator input[type=number]::-webkit-inner-spin-button,
		.mortgage-calculator input[type=number]::-webkit-outer-spin-button {
			-webkit-appearance: none;
			margin: 0;
		}

		.mortgage-calculator input[type=number] {
			-moz-appearance: textfield;
		}

		/* Pulsante calcola */
		.mortgage-calculator__calculate-button {
			background-color: var(--primary-color);
			color: var(--white);
			border: none;
			border-radius: 5px;
			padding: 8px 20px;
			font-size: 0.95rem;
			font-weight: 600;
			cursor: pointer;
			transition: background-color 0.3s, transform 0.2s;
			display: block;
			margin: 0 auto;
			text-transform: uppercase;
			letter-spacing: 1px;
			box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
			width: 100%;
		}

		.mortgage-calculator__calculate-button:hover {
			background-color: #3a5313;
			transform: translateY(-1px);
		}

		/* Container dei risultati */
		.results-container {
			display: block;
			background-color: var(--white);
			border-radius: var(--border-radius);
			box-shadow: var(--box-shadow);
			overflow: hidden;
			height: 100%;
		}

		/* Header risultati */
		.results-header {
			background-color: var(--primary-color);
			color: var(--white);
			padding: 12px 15px;
			text-align: center;
			font-weight: 600;
			font-size: 1.1rem;
		}

		/* Contenuto risultati */
		.results-content {
			padding: 15px;
		}

		/* Riga info di base compatta */
		.basic-info-row {
			display: flex;
			flex-wrap: wrap;
			background-color: #f8f9fa;
			border-radius: 6px;
			padding: 10px;
			margin-bottom: 15px;
		}

		.basic-info-item {
			flex: 1 0 25%;
			min-width: 120px;
			padding: 3px 8px;
			font-size: 0.85rem;
		}

		.basic-info-item span {
			color: var(--light-text);
		}

		.basic-info-item strong {
			display: block;
			color: var(--dark-text);
		}

		/* Sezioni mutuo */
		.mortgage-section {
			margin-bottom: 15px;
			padding: 10px;
			border: 1px solid #eee;
			border-radius: 6px;
			background-color: #fafafa;
		}

		.mortgage-section-title {
			color: var(--primary-color);
			font-size: 1rem;
			font-weight: 600;
			margin: 0 0 10px;
			padding-bottom: 5px;
			border-bottom: 1px solid #eee;
		}

		/* Griglia dei risultati compatta */
		.compact-results-grid {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			gap: 10px;
		}

		/* Elementi della griglia dei risultati */
		.result-item {
			background-color: var(--accent-color);
			padding: 10px;
			border-radius: 6px;
			text-align: center;
			box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
		}

		.result-item--highlight {
			background-color: var(--primary-color);
			color: var(--white);
		}

		.result-item--green {
			background-color: var(--green-bg);
		}

		.result-item--green.result-item--highlight {
			background-color: var(--green-color);
			color: var(--white);
		}

		/* Titolo elemento risultato */
		.result-title {
			font-size: 0.75rem;
			color: var(--light-text);
			margin-bottom: 3px;
			font-weight: 500;
		}

		.result-item--highlight .result-title {
			color: rgba(255, 255, 255, 0.8);
		}

		.result-item--green .result-title {
			color: var(--green-color);
		}

		.result-item--green.result-item--highlight .result-title {
			color: rgba(255, 255, 255, 0.8);
		}

		/* Valore elemento risultato */
		.result-value {
			font-size: 1.2rem;
			font-weight: 700;
			color: var(--dark-text);
		}

		.result-item--highlight .result-value {
			color: var(--white);
		}

		.result-item--green .result-value {
			color: var(--green-color);
		}

		.result-item--green.result-item--highlight .result-value {
			color: var(--white);
		}

		/* Sezione costi aggiuntivi compatta */
		.expenses-compact {
			margin: 15px 0;
		}

		.expenses-title {
			color: var(--primary-color);
			font-size: 1rem;
			font-weight: 600;
			margin: 0 0 10px;
			padding-bottom: 5px;
			border-bottom: 1px solid #eee;
		}

		/* Griglia delle spese compatta */
		.expenses-grid {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			gap: 10px;
		}

		.expense-item {
			background-color: #f8f9fa;
			padding: 8px;
			border-radius: 4px;
			text-align: center;
		}

		.expense-label {
			font-size: 0.7rem;
			color: var(--light-text);
			margin-bottom: 2px;
		}

		.expense-value {
			font-size: 0.9rem;
			font-weight: 600;
			color: var(--dark-text);
		}

		/* Footer dei risultati */
		.results-footer {
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			justify-content: space-between;
			margin-top: 15px;
			padding-top: 10px;
			border-top: 1px solid #eee;
		}

		.results-note-compact {
			font-size: 0.7rem;
			color: var(--light-text);
			margin: 0;
			flex: 1;
			padding-right: 15px;
		}

		/* Pulsante contattaci compatto */
		.contact-button {
			display: inline-block;
			padding: 8px 15px;
			background-color: var(--primary-color);
			color: var(--white);
			border: none;
			border-radius: 5px;
			font-weight: 600;
			font-size: 0.8rem;
			text-transform: uppercase;
			letter-spacing: 0.5px;
			cursor: pointer;
			transition: background-color 0.3s, transform 0.2s;
			text-decoration: none;
			box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
			white-space: nowrap;
		}

		.contact-button:hover {
			background-color: #3a5313;
			transform: translateY(-1px);
			color: var(--white);
			text-decoration: none;
		}

		.contact-button-small {
			display: inline-block;
			padding: 5px 10px;
			background-color: var(--primary-color);
			color: var(--white);
			border: none;
			border-radius: 5px;
			font-weight: 500;
			font-size: 0.8rem;
			cursor: pointer;
			transition: background-color 0.3s;
			text-decoration: none;
			margin-top: 5px;
		}

		.contact-button-small:hover {
			background-color: #3a5313;
			color: var(--white);
			text-decoration: none;
		}

		/* Messaggi di avviso compatti */
		.alert-message {
			display: none;
			margin: 10px 0;
			padding: 10px 15px;
			border-radius: 6px;
			background-color: var(--accent-color);
			border-left: 3px solid var(--primary-color);
		}

		.alert-message--error {
			background-color: rgba(211, 47, 47, 0.1);
			border-left-color: var(--error-color);
		}

		.alert-message__title {
			font-weight: 600;
			color: var(--primary-color);
			margin-bottom: 2px;
			font-size: 0.9rem;
		}

		.alert-message--error .alert-message__title {
			color: var(--error-color);
		}

		/* Responsive design */
		@media (max-width: 991px) {
			.basic-info-item {
				flex: 1 0 50%;
			}

			.expenses-grid {
				grid-template-columns: repeat(2, 1fr);
			}

			/* .results-footer {
				flex-direction: column; 
			}*/

			.results-note-compact {
				margin-bottom: 10px;
				padding-right: 0;
			}
		}

		@media (max-width: 767px) {
			.form-row-compact {
				flex-direction: column;
			}

			.input-group {
				flex: 0 0 100%;
				margin-bottom: 8px;
			}

			.compact-results-grid {
				grid-template-columns: 1fr;
			}

			.basic-info-item {
				flex: 1 0 100%;
			}
		}


		.expense-value--green {
			display: none;
			margin-top: 2px;
			border-top: 1px dashed #e0e0e0;
			padding-top: 2px;
		}

		/* Quando visibile, aggiungiamo un po' di spazio in più all'elemento principale */
		.expense-item.show-green {
			padding-bottom: 5px;
		}

		/*
		
		*/