/*
|--------------------------------------------------------------------------
| Stili comuni del sito (prima ripetuti in ogni pagina dentro <style>)
|--------------------------------------------------------------------------
*/

/* Main content & sidebar top line */
#sidebar .panel,
#main-box #main {
	border-top: 5px solid #256193;
}

a.featured-select,
#slider-info .padding-box ul li:before,
.home-article.right ul li a:hover {
	background-color: #256193;
}

.panel-duel-voting .panel-duel-vote a {
	background-color: #256193;
}

#menu-bottom.blurred #menu > .blur-before:after {
	background-color: #000;
}

#header-top {
	background: #0D0D0D;
}

#sidebar .panel > h2 {
	color: #333333;
}

#main h2 span {
	color: #353535;
}

::selection {
	background: #256193;
}

.article-icons a:hover,
a:hover {
	color: #256193;
}

.article-image-out,
.article-image {
	background: #256193;
}

span.article-image span .fa {
	color: #256193;
}

h1 {
	text-shadow: #999 3px 4px 5px;
}

/* Font dei vecchi telefoni (ancora usato se il centralino invia il vecchio formato) */
@font-face {
	font-family: 'Phones';
	src: url('../Phones-NormalA.woff2') format('woff2'),
	     url('../Phones-NormalA.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: block;
}

.giallo  { color: #000; background-color: yellow; }
.orange  { color: #000; background-color: orange; }
.verde   { color: #000; background-color: #33FF00; }
.azzurro { color: #000; background-color: #08E8DE; }
.rosso   { color: #fff; background-color: red; }

@media only screen and (max-width: 600px) {
	.promo2x10 {
		font-size: 24px;
	}
}

.lamp {
	text-align: left;
	font-weight: 700;
	color: #3d3ba2;
	animation: scrollamento 1500ms ease 0s infinite normal;
}
.lamp a {
	color: #3d3ba2;
}
@keyframes scrollamento {
	0%, 30%, 70%, 100% { transform: translate(0, 0); }
	35%, 45%, 55%, 65% { transform: translate(-5px, 0); }
	40%, 50%, 60%      { transform: translate(5px, 0); }
}

/* Box "Servizio Clienti VIP" (prima solo in index.php) */
.containerr {
	background-color: rgba(0, 0, 0, 0.6);
	border-radius: 20px;
	padding: 30px;
	display: inline-block;
	border: 5px solid #ffdd00;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
}
.specialp {
	font-size: 0.9em;
	margin: 20px 0 0;
}
.highlight {
	color: #ff5722;
	font-weight: bold;
}
.vip {
	font-size: 1.4em;
	color: #ffdd00;
	text-shadow: 1px 1px 3px #000;
}

/* Recensioni */
.recensione {
	margin-top: 8px;
	padding: 8px;
	background-color: #c9d2ff;
}

/*
|--------------------------------------------------------------------------
| Titolo di pagina: ora e' un <h1> (SEO) ma con lo stesso aspetto del vecchio <h2>
|--------------------------------------------------------------------------
*/
#main > h1.page-title {
	font-size: 1.5em;
	text-shadow: none;
	padding: 0 28px;
	background: url(../images/content-title-bg.png) repeat-x left center;
	margin-bottom: 20px;
}
#main > h1.page-title span {
	background: #f4f4f4;
	font-size: 22px;
	color: #353535;
	padding: 0 10px;
	margin-left: -10px;
}
h1.nk-h2like {
	font-size: 1.5em;
	text-shadow: none;
}
@media only screen and (max-width: 1020px) {
	#main > h1.page-title span {
		font-size: 19px;
		line-height: 30px;
	}
}
@media only screen and (max-width: 750px) {
	#main > h1.page-title span {
		font-size: 20px;
		line-height: 18px;
	}
	#main > h1.page-title {
		background: none;
		line-height: 20px;
		padding: 0 15px;
	}
}

/* Immagini responsive con dimensioni dichiarate (evita salti di layout) */
.nk-img {
	max-width: 100%;
	height: auto;
}

/* Link legali nel footer (sostituiscono i pulsanti Iubenda) */
.nk-legal-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.footer .nk-legal-links a {
	display: inline-block;
	padding: 5px 12px;
	border-radius: 4px;
	background: #fff;
	color: #1f2d3d;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .15);
}
.footer .nk-legal-links a:hover {
	background: #1565c0;
	color: #fff;
}

/* Moduli: link nelle caselle di consenso e informativa breve */
.nk-consent-field {
	margin-bottom: 8px;
}
.nk-consent-field label a,
.nk-info-breve a {
	text-decoration: underline;
	color: #1a4f7a;
}
.nk-info-breve {
	font-size: 13px;
	color: #555;
	margin: 6px 0 14px !important;
}

/*
|--------------------------------------------------------------------------
| Telefoni delle cartomanti in tempo reale
|--------------------------------------------------------------------------
*/
.carto-box,
.carto-box-vip {
	position: relative;
}
.carto-box .carto-link::after,
.carto-box-vip .carto-link-vip::after {
	/* tutta la scheda diventa cliccabile */
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
}
.nk-phone {
	--nk-c: #95a5a6;
	order: 0;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 62px;
	height: 62px;
	margin: 2px 0 10px;
	border-radius: 50%;
	color: #fff;
	background: var(--nk-c);
	box-shadow: 0 6px 14px -4px var(--nk-c), inset 0 -3px 0 rgba(0, 0, 0, .15);
}
.nk-phone svg {
	width: 30px;
	height: 30px;
	fill: currentColor;
	display: block;
}
.nk-phone--green  { --nk-c: #1fa855; }
.nk-phone--red    { --nk-c: #e0392b; }
.nk-phone--blue   { --nk-c: #e0392b; }
.nk-phone--orange { --nk-c: #f08c00; }
.nk-phone--gray   { --nk-c: #9aa5a6; box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .12); }

/* Disponibile: onda luminosa che invita a chiamare */
.nk-phone--green::before,
.nk-phone--green::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 2px solid var(--nk-c);
	animation: nk-ring 2.2s ease-out infinite;
}
.nk-phone--green::after {
	animation-delay: 1.1s;
}
.nk-phone--green svg {
	animation: nk-shake 2.2s ease-in-out infinite;
	transform-origin: 50% 60%;
}
@keyframes nk-ring {
	0%   { transform: scale(1);   opacity: .7; }
	100% { transform: scale(1.6); opacity: 0; }
}
@keyframes nk-shake {
	0%, 60%, 100% { transform: rotate(0); }
	65% { transform: rotate(-14deg); }
	70% { transform: rotate(12deg); }
	75% { transform: rotate(-10deg); }
	80% { transform: rotate(8deg); }
	85% { transform: rotate(0); }
}

/* Etichetta dello stato sotto il nome */
.nk-state {
	order: 2;
	display: inline-block;
	margin-top: 7px;
	padding: 3px 10px;
	border-radius: 20px;
	font-family: 'Open Sans', Arial, sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	line-height: 1.4;
	color: #fff;
	background: #9aa5a6;
}
.nk-state--green  { background: #1fa855; }
.nk-state--red,
.nk-state--blue   { background: #e0392b; }
.nk-state--orange { background: #f08c00; }
.nk-state--gray   { background: #9aa5a6; }
.carto-box .carto-link,
.carto-box-vip .carto-link-vip {
	order: 1;
}
.carto-box-vip .nk-phone--gray {
	background: #4b5253;
	color: #b9c0c1;
}

@media (max-width: 768px) {
	.nk-phone {
		width: 54px;
		height: 54px;
	}
	.nk-phone svg {
		width: 26px;
		height: 26px;
	}
}
@media (prefers-reduced-motion: reduce) {
	.nk-phone--green::before,
	.nk-phone--green::after,
	.nk-phone--green svg {
		animation: none;
	}
}

/*
|--------------------------------------------------------------------------
| Pagine legali (Privacy, Cookie, Termini)
|--------------------------------------------------------------------------
*/
.nk-legal {
	font-size: 15px;
	line-height: 1.6;
	color: #333;
}
.nk-legal h2 {
	font-size: 19px;
	margin: 26px 0 10px;
	color: #256193;
}
.nk-legal h3 {
	font-size: 16px;
	margin: 18px 0 8px;
	color: #353535;
}
.nk-legal p,
.nk-legal ul,
.nk-legal table {
	margin: 0 0 12px !important;
}
.nk-legal ul {
	padding-left: 20px;
}
.nk-legal ul li {
	list-style: disc;
	margin-bottom: 4px;
}
.nk-legal a {
	color: #1a4f7a;
	text-decoration: underline;
}
.nk-legal .nk-table-wrap {
	overflow-x: auto;
	margin-bottom: 12px;
}
.nk-legal table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
	background: #fff;
}
.nk-legal th,
.nk-legal td {
	border: 1px solid #d5d5d5;
	padding: 7px 8px;
	text-align: left;
	vertical-align: top;
}
.nk-legal th {
	background: #e9eef3;
}
.nk-legal .nk-box {
	background: #fff;
	border-left: 4px solid #256193;
	padding: 12px 14px;
	margin: 0 0 16px;
}
.nk-btn-prefs {
	display: inline-block;
	padding: 9px 16px;
	border: 0;
	border-radius: 6px;
	background: #1565c0;
	color: #fff !important;
	font-weight: 600;
	font-size: 14px;
	cursor: pointer;
	text-decoration: none !important;
}
.nk-btn-prefs:hover {
	background: #0d47a1;
}

/* Nomi dei segni negli oroscopi: titoli <h2> (SEO) con l'aspetto del testo in grassetto */
#main h2.nk-sign {
	font: inherit;
	font-weight: 700;
	text-transform: none;
	line-height: 150%;
	margin: 0;
	padding: 0;
	background: none;
	color: inherit;
}

/* Titolo dell'articolo del blog (prima era un <h3>) */
#main h2.nk-article-title {
	font-size: 1.17em;
}

/* Honeypot anti-bot del modulo contatti: presente nel codice ma fuori dallo schermo */
.contact-website-field {
	position: absolute !important;
	left: -10000px !important;
	top: -10000px !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
}

/* Gruppo "Valutazione" del modulo recensioni (stesso aspetto di prima) */
.nk-fieldset {
	border: 0;
	margin: 0;
	padding: 0;
	min-width: 0;
}
.nk-fieldset legend {
	padding: 0;
}

/* Paginazione recensioni */
.nk-pagination a {
	margin-right: 4px;
}
.nk-pagination a[aria-current="page"] {
	font-weight: 700;
	text-decoration: underline;
}

/* Mobile: campi dei moduli e tabelle non escono dallo schermo */
.article-full textarea,
.article-full input[type="text"],
.article-full input[type="email"],
.article-full input[type="tel"] {
	max-width: 100%;
	box-sizing: border-box;
}
.nk-legal .nk-table-wrap {
	max-width: 100%;
}
.nk-legal th,
.nk-legal td {
	overflow-wrap: anywhere;
}
.nk-legal a {
	overflow-wrap: anywhere;
}
