/* --decision-defining-container-gap: 3vh */
:root {
	--decision-defining-container-flex-items-box-v2-percentage: 50%;
	--decision-defining-container-box-v2-min-height: 15vh;
}
#gift-type-decision-container {
	display: none;
}
#gift-type-decision-container .box-v2 {
    flex: 1 1 calc(var(--decision-defining-container-flex-items-box-v2-percentage) - var(--decision-defining-container-gap));
    min-width: var(--decision-defining-container-box-v2-min-height);
    height: var(--decision-defining-container-box-v2-min-height);
    background-color: var(--primary-color-dark);
    color: var(--secondary-color);
    font-weight: var(--font-weight-bold);
    display: flex;
    flex-direction: column;
    border-radius: 2vh;
    transition: transform 0.3s, outline 0.3, opacity 0.3;
	user-select: none;
	cursor: pointer;
}
#gift-type-decision-container .box-v2-other {
    justify-content: center;
    align-items: center;
    text-align: center;
	font-size: 3vh;
}
#gift-type-decision-container .box-v2:hover {
	transform: scale(1.05); /* Scale on hover */
}

#gift-type-decision-container .box-v2.selected {
	outline: 0.5vh solid var(--secondary-color-dark-s2); 
} 
#gift-type-decision-container .box-v2.not-actve {
	opacity: 0.5;
}

#gift-type-decision-container .box-v2 h1 {
    text-align: left;
    border-radius: 2vh 2vh 0 0;
    padding: 1vh 2vh;
    background-color: var(--primary-color-dark-s3);
    font-size: 3vh;
}
#gift-type-decision-container .box-v2 h2 {
    font-size: 2vh;
    padding: 2vh;
    margin: auto;
	width: 100%;
	font-weight: var(--font-weight-regular);
}
#gift-type-decision-container .decision-defining-data-container {
	margin-bottom: 10vh;
}


@media (max-width: 768px) or (orientation: portrait) {

	.decision-defining-container h1 {
	    font-size: 3vh;
	}

	#gift-type-decision-container .box-v2 {
		height: 18vh;
	}

	#gift-type-decision-container .box-v2 h1 {
	    min-height: 7.5vh;
	    align-items: center;
	    text-align: center;
	    justify-content: center;
	    display: flex;
    	font-size: 2vh;
	}

	#gift-type-decision-container .box-v2 h2 {
	    text-align: center;
        font-size: 1.5vh;
        padding: 1vh;
	}
	
	#gift-type-decision-container .box-v2-other {
	    font-size: 2vh;
	}
}