.modal-header{
	padding: 1rem 1.875rem;
	border-color: var(--border-color);
    .btn-close{
        background: none;
		padding: 0;
		margin: 0;
		font-size: 18px;
		opacity: 0.3;
		line-height: 1;
    }
	.close{
		padding: 0.875rem 1.815rem;
		margin: 0;
		position: absolute;
		right: 0;
		float: none;
		top: 0;
		font-size: 1.875rem;
		font-weight: 100;
	}
	
	@include respond('phone') {
		padding: 1rem 1rem 1rem;
	}
}
.modal-body{
	padding: 1.875rem;
	
	@include respond('phone') {
		padding: 1rem;
    }
}
.modal-footer{
	padding: 10px 10px;
    border-top: var(--bg-white);
	
	@include respond('phone') {
		padding: 1rem;
    }
}
.modal-content{
	border-radius:$radius;
	border: 1px solid var(--border-color);
    background: var(--bg-white);
}
.dz-modal-btn{
	width: 90px;
	min-width: 90px;
	height: 35px;
	line-height: 30px;
	text-align: center;
	font-size: 12px;
	font-weight: 600;
	color: $body-color;
	background: var(--bg-white);
	border-radius: var(--border-radius-sm);
	border: 2px dashed var(--border-color);
}

// DZ PWA Modal Box ===
.dz-pwa-modal{
	text-align: center;
	.modal-dialog{
		margin: auto;
		padding: 15px;
		min-height: 100%;
	}
	.modal-content{
		padding: 15px 25px;
		background-color: var(--rgba-primary-8);
		border: 2px solid #F6DBB3;
		backdrop-filter: blur(10px);
		border-radius: var(--border-radius-xl);
		gap: 15px;
		align-items: center;
		overflow: hidden;
	}
	.btn-close{
		text-align: center;
		line-height: unset;
		top: -5px;
		right: -5px;
		position: absolute;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: var(--secondary);
		padding: 20px 20px 18px 18px;
		border-radius: 0 0 0 30px;
		i{
			font-size: 24px;
			font-weight: 600;
			color: #000;
		}
	}
	.title{
		margin-bottom: 0;
		color: #fff;
	}
	.logo{
		width: 114px;
		margin: 0 auto;
		display: block;
		&.dark{
			display: none;
		}
	}
	p{
		margin-bottom: 0;
		color: #fff;
		line-height: 1.6;
		font-size: 13px;
	}
	&.show{
		visibility: visible;
		transition: opacity 0.15s linear;
	}
	.pwa-btn{
		border-radius: 8px;
		background-color: #FFF;
		box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.25);
		gap: 10px;
		padding: 10px 12px;
		color: #000;
		font-size: 14px;
		font-weight: 500;
		&:active,
		&:hover{
			background-color: var(--primary);
			color: #FFF;
			svg{
				path{
					stroke: #FFF;
				}
			}
		}
	}
}