/*
Name: 			custom.css
Written by: 	Medialine Group
Theme Version:	1.0.0
*/
@font-face {
	font-family: 'ChronicleDisplay-Bold';
	src: url('../fonts/ChronicleDisp-Bold.woff') format('woff'),
		url('../fonts/ChronicleDisp-Bold.svg#ChronicleDisplay-Bold') format('svg');
}

@font-face {
	font-family: 'ChronicleDisplay-Roman';
	src: url('../fonts/ChronicleDisp-Roman.woff') format('woff'),
		url('../fonts/ChronicleDisp-Roman.svg#ChronicleDisplay-Roman') format('svg');
}

@font-face {
	font-family: 'ChronicleDisplay-BoldItalic';
	src: url('../fonts/ChronicleDisp-BoldItal.woff') format('woff'),
		url('../fonts/ChronicleDisp-BoldItal.svg#ChronicleDisplay-BoldItalic') format('svg');
}

@font-face {
	font-family: 'Bebas Neue Bold';
	src: url('fonts/BebasNeueBold.eot');
	src: url('fonts/BebasNeueBold-.eot#iefix') format('embedded-opentype'),
		url('fonts/BebasNeueBold.woff2') format('woff2'),
		url('fonts/BebasNeueBold.woff') format('woff'),
		url('fonts/BebasNeueBold.svg#BebasNeueBold') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Museo Sans 700';
	src: url('fonts/MuseoSans_700.eot');
	src: url('fonts/MuseoSans_700-.eot#iefix') format('embedded-opentype'),
		url('fonts/MuseoSans_700.woff2') format('woff2'),
		url('fonts/MuseoSans_700.woff') format('woff'),
		url('fonts/MuseoSans_700.svg#MuseoSans-700') format('svg');
	font-weight: normal;
	font-style: normal;
}


.font-noto {
	font-family: 'Noto Serif', Serif !important;

}

.font-chronicle {
	font-family: 'ChronicleDisplay-Roman', serif !important;

}

.font-chronicle-1 {
	font-family: 'ChronicleDisplay-Bold', serif !important;

}

.font-chronicle-2 {
	font-family: 'ChronicleDisplay-BoldItalic', serif !important;

}

.font-opensans {
	font-family: 'Open Sans', sans-serif !important;

}

/* Border Radius */
.border-radius {
	border-radius: 4px !important;
}

.color-red {
	color: #D30003 !important;
}

.img-thumbnail.img-thumbnail-hover-icon::before {
	border-radius: 0px !important;
}


@media (max-width: 575px) {

	/* Individua il div creato dal plugin che contiene lo sfondo e lo sovrascrive */
	.slide-responsive-bg-1 .slotholder .tp-bgimg {
		background-image: url("../img/slides1/slide-mobile_001.jpg") !important;
		background-position: center center !important;
		background-repeat: no-repeat !important;
		background-size: cover !important;
	}

	.slide-responsive-bg-2 .slotholder .tp-bgimg {
		background-image: url("../img/slides1/slide-mobile_002.jpg") !important;
		background-position: center center !important;
		background-repeat: no-repeat !important;
		background-size: cover !important;
	}

	.slide-responsive-bg-3 .slotholder .tp-bgimg {
		background-image: url("../img/slides1/slide-mobile_003.jpg") !important;
		background-position: center center !important;
		background-repeat: no-repeat !important;
		background-size: cover !important;
	}

	.slide-responsive-bg-4 .slotholder .tp-bgimg {
		background-image: url("../img/slides1/slide-mobile_004.jpg") !important;
		background-position: center center !important;
		background-repeat: no-repeat !important;
		background-size: cover !important;
	}
}

.call-to-action {
	padding: 32px 32px !important;
}

/* ===== Modal Menu Premium - Stile Gift Card ===== */

/* Quando la modale è aperta, nascondi scrollbar del body e della pagina */
body.modal-open {
	overflow: hidden !important;
	padding-right: 0 !important;
}

/* La modale stessa non deve avere scrollbar esterna */
.modal-menu-premium.modal {
	overflow: hidden !important;
}

/* Posizionamento: in alto con un po' di margine */
.modal-menu-premium .modal-dialog {
	display: flex;
	align-items: flex-start;
	margin-top: 0px;
	max-height: calc(100vh - 100px);
}

.modal-menu-premium .modal-content {
	background: #1a1a1a;
	border: none;
	border-radius: 16px;
	overflow: hidden;
	position: relative;
	box-shadow: 0 25px 60px rgba(0, 0, 0, 0.7), 0 0 50px rgba(201, 169, 97, 0.1);
}

/* Cornicetta dorata interna */
.modal-menu-premium .modal-content::before {
	content: '';
	position: absolute;
	top: 10px;
	left: 10px;
	right: 10px;
	bottom: 10px;
	border: 1.5px solid #c9a961;
	border-radius: 10px;
	pointer-events: none;
	z-index: 1;
}

/* Linea dorata sottile esterna top */
.modal-menu-premium .modal-content::after {
	content: '';
	position: absolute;
	top: 0;
	left: 40px;
	right: 40px;
	height: 2px;
	background: linear-gradient(90deg, transparent, #c9a961, transparent);
	z-index: 2;
}

.modal-menu-premium .modal-header {
	border: none;
	padding: 32px 36px 12px 36px;
	position: relative;
	z-index: 2;
}

.modal-menu-premium .modal-title {
	color: #c9a961 !important;
	font-size: 1.4rem;
	letter-spacing: 3px;
	text-transform: uppercase;
	font-weight: 600;
	text-align: center;
	width: 100%;
	padding-right: 30px;
}

.modal-menu-premium .btn-close {
	position: absolute;
	top: 18px;
	right: 20px;
	z-index: 5;
	opacity: 0.6;
	transition: opacity 0.3s ease, transform 0.3s ease;
}

.modal-menu-premium .btn-close:hover {
	opacity: 1;
	transform: scale(1.1);
}

/* Separatore dorato sotto l'header */
.modal-menu-premium .modal-header::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 36px;
	right: 36px;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(201, 169, 97, 0.5), transparent);
}

/* Body della modale con scrollbar interna */
.modal-menu-premium .modal-body {
	padding: 24px 36px 20px 36px;
	position: relative;
	z-index: 2;
	max-height: calc(100vh - 300px);
	overflow-y: auto;
}

/* Scrollbar personalizzata dorata */
.modal-menu-premium .modal-body::-webkit-scrollbar {
	width: 4px;
}

.modal-menu-premium .modal-body::-webkit-scrollbar-track {
	background: transparent;
}

.modal-menu-premium .modal-body::-webkit-scrollbar-thumb {
	background: rgba(201, 169, 97, 0.3);
	border-radius: 4px;
}

.modal-menu-premium .modal-body::-webkit-scrollbar-thumb:hover {
	background: rgba(201, 169, 97, 0.5);
}

/* Firefox scrollbar */
.modal-menu-premium .modal-body {
	scrollbar-width: thin;
	scrollbar-color: rgba(201, 169, 97, 0.3) transparent;
}

.modal-menu-premium .modal-body .text-color-light {
	color: #e0e0e0 !important;
	line-height: 1.85;
	font-size: 0.95rem;
}

/* Separatore dorato sopra il footer */
.modal-menu-premium .modal-footer::before {
	content: '';
	position: absolute;
	top: 0;
	left: 36px;
	right: 36px;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(201, 169, 97, 0.5), transparent);
}

.modal-menu-premium .modal-footer {
	border: none;
	padding: 16px 36px 28px 36px;
	position: relative;
	z-index: 2;
	justify-content: center;
}

/* Pulsante CHIUDI dorato */
.modal-menu-premium .modal-footer .btn {
	background: transparent;
	color: #c9a961;
	border: 1px solid #c9a961;
	border-radius: 6px;
	padding: 8px 32px;
	letter-spacing: 2px;
	font-size: 0.8rem;
	transition: all 0.3s ease;
}

.modal-menu-premium .modal-footer .btn:hover {
	background: #c9a961;
	color: #1a1a1a;
	box-shadow: 0 4px 15px rgba(201, 169, 97, 0.3);
}

/* Pulsante REGALA ORA dorato pieno */
.modal-menu-premium .modal-footer .btn-regala {
	background: #c9a961;
	color: #1a1a1a;
	border: 1px solid #c9a961;
	font-weight: 700;
}

.modal-menu-premium .modal-footer .btn-regala:hover {
	background: #d4b872;
	border-color: #d4b872;
	box-shadow: 0 4px 20px rgba(201, 169, 97, 0.4);
}

/* Animazione di apertura */
.modal-menu-premium.fade .modal-dialog {
	transform: scale(0.92) translateY(-20px);
	transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease;
}

.modal-menu-premium.show .modal-dialog {
	transform: scale(1) translateY(0);
}

/* Backdrop molto scuro */
.modal-backdrop.show {
	background-color: rgba(0, 0, 0, 0.85) !important;
	opacity: 1 !important;
}

/* Responsive */
@media (max-width: 768px) {
	.modal-menu-premium .modal-dialog {
		margin-top: 20px;
		margin-left: 10px;
		margin-right: 10px;
	}

	.modal-menu-premium .modal-header {
		padding: 24px 24px 10px 24px;
	}

	.modal-menu-premium .modal-body {
		padding: 18px 24px 16px 24px;
		max-height: calc(100vh - 220px);
	}

	.modal-menu-premium .modal-footer {
		padding: 14px 24px 22px 24px;
	}

	.modal-menu-premium .modal-title {
		font-size: 1.1rem;
		letter-spacing: 2px;
	}

	.modal-menu-premium .modal-content::before {
		top: 8px;
		left: 8px;
		right: 8px;
		bottom: 8px;
	}
}