.modal-alert-component 
	--max-height: 80% 
	--width: 100% 
	align-items: flex-end 
	backdrop-filter: blur(3px) 
	background-color: var(--ion-color-primary-tint) 
	ion-backdrop 
		backdrop-filter: blur(100px) 
	.separator 
		border-bottom: 8px solid #FAFAFA 
	div[role="dialog"] 
		box-shadow: 0 0 10px 0 rgba(0,0,0,0.15) 
		border-radius: 30px 30px 0px 0px 
		div 
			&.ion-page 
				border-radius: 30px 30px 0px 0px 
	div 
		&.modal-alert-component-content 
			ion-header 
				padding: 32px 32px 40px 
				.close-button 
					text-align: right 
					font-size: 26px 
				ion-toolbar 
					--border-width: 0px 
			.content 
				display: flex 
				justify-content: center 
				flex-direction: column 
				text-align: center 
				align-items: center 
				height: 100% 
				& > img 
					width: 215px 
					height: 215px 
				h1 
					font-family: Open Sans 
					font-style: normal 
					font-weight: bold 
					font-size: 24px 
					line-height: 24px 
					text-align: center 
					letter-spacing: -0.05em 
				.main 
					display: flex 
					justify-content: center 
					align-items: center 
					flex-grow: 1 
				.buttons 
					width: 90% 
					display: flex 
					flex-direction: column 
					justify-content: space-between 
					gap: 0.5rem 
			ion-footer 
				div 
					&.pad-buttons 
						ion-button 
							margin-bottom: 0.5rem