/* Regalo */
details#edit-v-configuratore-voci-t-16 {
	/* Riga per aprire/chiudere il details */
	summary {
		/* Testo */
		#v_configuratore_voci__t_17-list-row {
			align-items: start;
			gap: 0.5rem;

			.list-row-value {
				font-style: italic;
			}
		}
	}


	/* Contenuto */
	div.wrapper > .content {
    --color: #000;
    --border-color: #ccc;
		--child-width: 38%;
		--border-margin: 8px;
		gap: 0;

		/* Body con immagine e testo */
		#edit-body {
			width: 100%;

			.form-item-wrapper {
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				gap: 1rem;
				width: calc(var(--child-width) * 2 - var(--border-margin));
				max-width: 100%;
				border-right: 1px solid var(--border-color);

				img {
					width: 100%;
					max-width: 300px;
				}
			}
		}

		/* Fieldset opzioni e testo personalizzato */
		fieldset {
			display: flex;
			flex-wrap: wrap;
			align-items: start;
			justify-content: center;
			gap: 1rem 0.5rem;
			width: 100%;

			legend {
				display: none !important;
			}

			/* Opzioni */
			&#edit-v-configuratore-voci-t-18 {
				.wizard-options {
					align-items: start;
					justify-content: start;
					gap: 0.5rem 0;

					.form-item {
						flex: 0 0 30%;
						flex: 0 0 var(--child-width);

						&:nth-child(2) {
							display: flex;

							&::after {
								content: "|";
								display: block;
								width: 1px;
                color: var(--border-color);
								margin-left: var(--border-margin);
								margin-right: var(--border-margin);
								border-right: 1px solid var(--border-color);
							}
						}

						&:nth-child(3) {
							flex: 0 0 calc(100% - var(--child-width) - var(--child-width));
						}

						.form-item-wrapper {
							gap: 1rem 0;
						}

						/* Immagine */
						.wizard-label-container {
							.wizard-label-image img {
								width: auto;
								height: 130px;
							}
						}

						/* Biglietto personale stampato da noi */
						label#GIFT-DEFAULT-label .wizard-label-image img {
							margin-right: -18%;
						}

						/* Body */
						.wizard-label-body {
							display: flex;
							flex-direction: column;
							align-items: start;
							justify-content: start;
							gap: 0.5rem 0;

							&,
							* {
								text-align: left;
							}

							.wizard-label-title {
								display: block !important;
								text-align: left;
							}

							.wizard-label-testo {
								font-size: 0.9rem;
							}

							&#NO-GIFT-body .wizard-label-testo {
								display: none;
							}
						}
					}
				}
			}

			/* Testo personalizzato */
			&#edit-v-configuratore-voci-t-17 {
				display: block !important;

				.fieldset-wrapper {
					display: flex;
					width: 100%;

					.wizard-options {
						display: flex !important;
						justify-content: start;
						width: 100%;
						margin-bottom: 1rem;

						&::before,
						.form-item-wrapper {
							flex: 0 0 var(--child-width);
						}

						&::before {
							content: "-";
							display: block;
							width: var(--child-width);
              color: transparent !important
						}

						.form-item-wrapper {
							flex-basis: calc(var(--child-width) - var(--border-margin) - 1rem);
							padding-right: 1rem;
							border-right: 1px solid var(--border-color);
						}
					}
				}

				/* Label */
				label {
					display: flex;
					align-items: center;
					justify-content: start;
				}

				/* Textarea */
				textarea {
					width: 100%;
					min-height: 150px;
					max-height: 150px;
					resize: none;
				}
			}
		}
	}
}

/* Solo versione mobile */
body.is-mobile details#edit-v-configuratore-voci-t-16 {
	/* Contenuto */
	div.wrapper > .content {
		--child-width: 100%;
		--border-margin: 0px;
		gap: 0;

		/* Body con immagine e testo */
		div#edit-body {
			width: 100%;
			margin-bottom: 1.5rem;

			.form-item-wrapper {
				border: 0;
			}
		}

		/* Opzioni */
		fieldset#edit-v-configuratore-voci-t-18 {
			margin-bottom: 1.5rem;

			.form-item {
				flex: 0 0 100% !important;

				&:after {
					content: none !important;
				}
			}

			.wizard-options {
				gap: 1.5rem 0;

				.form-item > .form-item-wrapper {
					flex-direction: row;
					align-items: stretch;
					justify-content: start;
					flex-wrap: nowrap;
					gap: 0.5rem !important;
					padding: 0 !important;

					label {
						display: flex;
						flex-direction: column;
						align-items: start;
						justify-content: start;
					}

					p {
						margin: 0 !important;
					}

					/* Immagine */
					.wizard-label-container {
						flex: 0 0 90px;

						.wizard-label-image {
							display: flex;
							flex-direction: column;
							align-items: start;
							justify-content: start;

							img {
								width: auto;
								height: 80px;
							}
						}
					}

					/* Biglietto personale stampato da noi */
					label#GIFT-DEFAULT-label .wizard-label-image img {
						margin-right: 0 !important;
					}

					/* Checkbox */
					.wizard-input-checkbox {
						flex: 0 0 30px;
						align-items: center;
						padding-top: 1px;
					}

					/* Testo */
					.wizard-label-body {
						flex: 1 1 auto;

						.wizard-label-title {
							text-align: left;
							padding-top: 4px;
						}

						.wizard-label-testo {
							font-size: 12px;
						}
					}
				}

				/* Fieldset con Textarea Testo */
				fieldset#edit-v-configuratore-voci-t-17 {
					.wizard-options {
						&:before {
							content: none !important;
						}

						> .form-item-wrapper {
							flex-direction: column;
							flex-basis: auto !important;
							gap: 0.25rem !important;
							padding-left: 110px !important;
							padding-left: calc(110px + 1rem) !important;
							border: 0 !important;

							label {
								flex-direction: row;
								align-items: center;
							}
						}
					}
				}
			}
		}
	}
}