/**
 * Novixa Tooltip widget.
 * Loaded only on pages that contain the widget. Every class is prefixed
 * `novixa-tooltip`. Colours and sizes are CSS variables so the six design
 * presets and every Elementor control only have to set a few of them.
 */

/* ---------- Base tokens (= Luxury Gold) ---------- */
.novixa-tooltip {
	--nt-bg-color: #12100c;
	--nt-bg-image: none;
	--nt-border: rgba(201, 169, 110, .55);
	--nt-title: #ebd9ae;
	--nt-text: #cfc6b4;
	--nt-accent: #c9a96e;
	--nt-arrow-bg: #12100c;
	--nt-shadow: 0 24px 48px -20px rgba(0, 0, 0, .55), 0 4px 12px rgba(0, 0, 0, .18);
	--nt-radius: 10px;
	--nt-bw: 1px;
	--nt-blur: 0px;
	--nt-title-font: "Cormorant Garamond", Georgia, "Times New Roman", serif;
	--nt-title-size: 19px;
	--nt-glow: rgba(201, 169, 110, .55);

	--nt-p-color: #8a6d32;
	--nt-p-line: rgba(168, 134, 63, .7);
	--nt-p-hover-color: #5e4817;
	--nt-p-hover-bg: rgba(201, 169, 110, .16);
	--nt-btn-bg: #14110c;
	--nt-btn-color: #ebd9ae;
	--nt-btn-border: #14110c;
	--nt-btn-hover-bg: #2a2418;
	--nt-btn-hover-color: #fff3d1;
	--nt-btn-hover-border: #2a2418;

	--nt-arrow: 10px;
	--nt-dur: 220ms;
	--nt-ease: cubic-bezier(.22, .61, .36, 1);

	position: relative;
	box-sizing: border-box;
}

.novixa-tooltip *,
.novixa-tooltip *::before,
.novixa-tooltip *::after {
	box-sizing: border-box;
}

/* ---------- Presets ---------- */
.novixa-tooltip--preset-minimal-light {
	--nt-bg-color: #ffffff;
	--nt-border: #e6e4df;
	--nt-title: #141414;
	--nt-text: #55524c;
	--nt-accent: #141414;
	--nt-arrow-bg: #ffffff;
	--nt-shadow: 0 16px 36px -14px rgba(20, 20, 20, .22), 0 2px 6px rgba(20, 20, 20, .06);
	--nt-radius: 10px;
	--nt-title-font: inherit;
	--nt-title-size: 15px;
	--nt-glow: rgba(20, 20, 20, .25);
	--nt-p-color: #1a1a1a;
	--nt-p-line: rgba(26, 26, 26, .45);
	--nt-p-hover-color: #000000;
	--nt-p-hover-bg: #f1efea;
	--nt-btn-bg: #1a1a1a;
	--nt-btn-color: #ffffff;
	--nt-btn-border: #1a1a1a;
	--nt-btn-hover-bg: #000000;
	--nt-btn-hover-color: #ffffff;
	--nt-btn-hover-border: #000000;
}

.novixa-tooltip--preset-dark-premium {
	--nt-bg-color: #12141a;
	--nt-border: rgba(255, 255, 255, .1);
	--nt-title: #f4f5f7;
	--nt-text: #a8adba;
	--nt-accent: #93a4ff;
	--nt-arrow-bg: #12141a;
	--nt-shadow: 0 26px 50px -18px rgba(0, 0, 0, .65), 0 2px 8px rgba(0, 0, 0, .25);
	--nt-radius: 12px;
	--nt-title-font: inherit;
	--nt-title-size: 15px;
	--nt-glow: rgba(147, 164, 255, .5);
	--nt-p-color: #1b1e27;
	--nt-p-line: rgba(27, 30, 39, .45);
	--nt-p-hover-color: #0b0d12;
	--nt-p-hover-bg: #e9ecf5;
	--nt-btn-bg: #12141a;
	--nt-btn-color: #f4f5f7;
	--nt-btn-border: #12141a;
	--nt-btn-hover-bg: #232734;
	--nt-btn-hover-color: #ffffff;
	--nt-btn-hover-border: #232734;
}

.novixa-tooltip--preset-modern-gradient {
	--nt-bg-color: #7a5cf5;
	--nt-bg-image: linear-gradient(135deg, #6d5dfc 0%, #a45ee0 55%, #e66aa8 100%);
	--nt-border: rgba(255, 255, 255, .22);
	--nt-title: #ffffff;
	--nt-text: rgba(255, 255, 255, .92);
	--nt-accent: #ffffff;
	--nt-arrow-bg: #a45ee0;
	--nt-shadow: 0 26px 50px -18px rgba(109, 93, 252, .55), 0 4px 12px rgba(80, 40, 140, .18);
	--nt-radius: 16px;
	--nt-title-font: inherit;
	--nt-title-size: 15px;
	--nt-glow: rgba(109, 93, 252, .5);
	--nt-p-color: #5b4be0;
	--nt-p-line: rgba(91, 75, 224, .5);
	--nt-p-hover-color: #4636c4;
	--nt-p-hover-bg: rgba(109, 93, 252, .1);
	--nt-btn-bg: linear-gradient(135deg, #6d5dfc, #e66aa8);
	--nt-btn-color: #ffffff;
	--nt-btn-border: transparent;
	--nt-btn-hover-bg: linear-gradient(135deg, #5b4be0, #d4558f);
	--nt-btn-hover-color: #ffffff;
	--nt-btn-hover-border: transparent;
}

.novixa-tooltip--preset-glassmorphism {
	--nt-bg-color: rgba(24, 26, 40, .62);
	--nt-border: rgba(255, 255, 255, .28);
	--nt-title: #ffffff;
	--nt-text: rgba(255, 255, 255, .9);
	--nt-accent: #ffffff;
	--nt-arrow-bg: rgba(24, 26, 40, .62);
	--nt-shadow: 0 22px 44px -16px rgba(0, 0, 0, .35);
	--nt-radius: 16px;
	--nt-blur: 16px;
	--nt-title-font: inherit;
	--nt-title-size: 15px;
	--nt-glow: rgba(30, 34, 60, .35);
	--nt-p-color: #2a2d3a;
	--nt-p-line: rgba(42, 45, 58, .4);
	--nt-p-hover-color: #11131c;
	--nt-p-hover-bg: rgba(30, 34, 60, .07);
	--nt-btn-bg: rgba(40, 44, 70, .78);
	--nt-btn-color: #ffffff;
	--nt-btn-border: rgba(255, 255, 255, .35);
	--nt-btn-hover-bg: rgba(40, 44, 70, .95);
	--nt-btn-hover-color: #ffffff;
	--nt-btn-hover-border: rgba(255, 255, 255, .5);
}

.novixa-tooltip--preset-classic-bw {
	--nt-bg-color: #ffffff;
	--nt-border: #000000;
	--nt-bw: 2px;
	--nt-title: #000000;
	--nt-text: #222222;
	--nt-accent: #000000;
	--nt-arrow-bg: #ffffff;
	--nt-shadow: 5px 5px 0 #000000;
	--nt-radius: 0px;
	--nt-title-font: inherit;
	--nt-title-size: 15px;
	--nt-glow: rgba(0, 0, 0, .35);
	--nt-p-color: #000000;
	--nt-p-line: #000000;
	--nt-p-hover-color: #ffffff;
	--nt-p-hover-bg: #000000;
	--nt-btn-bg: #000000;
	--nt-btn-color: #ffffff;
	--nt-btn-border: #000000;
	--nt-btn-hover-bg: #ffffff;
	--nt-btn-hover-color: #000000;
	--nt-btn-hover-border: #000000;
}

/* ---------- Trigger ----------
   Selectors are doubled (.novixa-tooltip .novixa-tooltip__trigger) so theme
   rules for [type=button] / a:hover can't recolour it. */
.novixa-tooltip .novixa-tooltip__trigger {
	-webkit-appearance: none;
	appearance: none;
	display: inline-flex;
	align-items: center;
	gap: var(--nt-t-gap, .5em);
	margin: 0;
	padding: 2px 0;
	font: inherit;
	line-height: 1.4;
	letter-spacing: inherit;
	text-transform: none;
	text-decoration: none;
	color: var(--nt-t-color, var(--nt-p-color));
	background: var(--nt-t-bg, transparent);
	border: var(--nt-t-bw, 0) solid var(--nt-t-border, transparent);
	border-radius: var(--nt-t-radius, 0);
	box-shadow: none;
	cursor: pointer;
	transition: color .25s ease, background-color .25s ease, background .25s ease, border-color .25s ease, transform .3s ease, box-shadow .3s ease;
}

.novixa-tooltip--t-dotted .novixa-tooltip__trigger {
	border-width: 0 0 var(--nt-t-bw, 1px);
	border-style: dotted;
	border-color: var(--nt-t-border, var(--nt-p-line));
	border-radius: var(--nt-t-radius, 0);
}

.novixa-tooltip--t-button .novixa-tooltip__trigger {
	padding: 12px 26px;
	color: var(--nt-t-color, var(--nt-btn-color));
	background: var(--nt-t-bg, var(--nt-btn-bg));
	border: var(--nt-t-bw, 1px) solid var(--nt-t-border, var(--nt-btn-border));
	border-radius: var(--nt-t-radius, 999px);
	-webkit-backdrop-filter: blur(var(--nt-blur));
	backdrop-filter: blur(var(--nt-blur));
}

.novixa-tooltip--t-outline .novixa-tooltip__trigger {
	padding: 11px 26px;
	border: var(--nt-t-bw, 1px) solid var(--nt-t-border, var(--nt-p-line));
	border-radius: var(--nt-t-radius, 999px);
}

.novixa-tooltip--icon-only.novixa-tooltip--t-button .novixa-tooltip__trigger,
.novixa-tooltip--icon-only.novixa-tooltip--t-outline .novixa-tooltip__trigger {
	padding: 10px;
}

.novixa-tooltip__trigger-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: var(--nt-icon-size, 1.1em);
	line-height: 1;
}

.novixa-tooltip__trigger-icon i,
.novixa-tooltip__trigger-icon svg {
	width: 1em;
	height: 1em;
	font-size: inherit;
	line-height: 1;
	color: currentColor;
	fill: currentColor;
}

/* Hover + "tooltip is open" share one look (doubled selector = beats themes) */
.novixa-tooltip .novixa-tooltip__trigger:hover,
.novixa-tooltip[data-state="open"] .novixa-tooltip__trigger {
	color: var(--nt-t-hover-color, var(--nt-p-hover-color));
	background: var(--nt-t-hover-bg, var(--nt-p-hover-bg));
	border-color: var(--nt-t-hover-border, var(--nt-p-line));
	text-decoration: none;
}

.novixa-tooltip--t-button .novixa-tooltip__trigger:hover,
.novixa-tooltip--t-button[data-state="open"] .novixa-tooltip__trigger {
	color: var(--nt-t-hover-color, var(--nt-btn-hover-color));
	background: var(--nt-t-hover-bg, var(--nt-btn-hover-bg));
	border-color: var(--nt-t-hover-border, var(--nt-btn-hover-border));
}

.novixa-tooltip .novixa-tooltip__trigger:focus {
	outline: none;
}

.novixa-tooltip .novixa-tooltip__trigger:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

/* Hover effects */
.novixa-tooltip--h-lift .novixa-tooltip__trigger:hover,
.novixa-tooltip--h-lift[data-state="open"] .novixa-tooltip__trigger {
	transform: translateY(-2px);
}

.novixa-tooltip--h-scale .novixa-tooltip__trigger:hover,
.novixa-tooltip--h-scale[data-state="open"] .novixa-tooltip__trigger {
	transform: scale(1.05);
}

.novixa-tooltip--h-glow .novixa-tooltip__trigger:hover,
.novixa-tooltip--h-glow[data-state="open"] .novixa-tooltip__trigger {
	box-shadow: 0 10px 26px -10px var(--nt-glow);
}

/* ---------- Tooltip ---------- */
.novixa-tooltip__tip {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99999;
	width: var(--nt-w, max-content);
	max-width: min(var(--nt-maxw, 280px), calc(100vw - 16px));
	min-width: 0;
	margin: 0;
	padding: 0;
	color: var(--nt-text);
	font-size: 14px;
	line-height: 1.6;
	text-align: left;
	text-transform: none;
	letter-spacing: normal;
	white-space: normal;
	overflow-wrap: break-word;
	background-color: var(--nt-bg-color);
	background-image: var(--nt-bg-image, none);
	border: var(--nt-bw, 1px) solid var(--nt-border);
	border-radius: var(--nt-radius, 12px);
	box-shadow: var(--nt-shadow);
	-webkit-backdrop-filter: blur(var(--nt-blur, 0px));
	backdrop-filter: blur(var(--nt-blur, 0px));
	outline: none;
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
	transform: var(--nt-from, none);
	transform-origin: 50% 100%;
	transition: opacity var(--nt-dur, 220ms) ease, transform var(--nt-dur, 220ms) var(--nt-ease), visibility 0s linear var(--nt-dur, 220ms);
}

.novixa-tooltip__tip[data-state="open"] {
	visibility: visible;
	opacity: 1;
	transform: none;
	pointer-events: auto;
	transition: opacity var(--nt-dur, 220ms) ease, transform var(--nt-dur, 220ms) var(--nt-ease), visibility 0s linear 0s;
}

/* Non-interactive hover tooltips never catch the pointer (no flicker). */
.novixa-tooltip--passive .novixa-tooltip__tip {
	pointer-events: none !important;
}

/* Where the tooltip grows from, per side it ended up on */
.novixa-tooltip__tip[data-placement="top"]    { transform-origin: var(--nt-ax, 50%) 100%; }
.novixa-tooltip__tip[data-placement="bottom"] { transform-origin: var(--nt-ax, 50%) 0; }
.novixa-tooltip__tip[data-placement="left"]   { transform-origin: 100% var(--nt-ay, 50%); }
.novixa-tooltip__tip[data-placement="right"]  { transform-origin: 0 var(--nt-ay, 50%); }

/* Invisible bridge so the pointer can cross the gap to the tooltip */
.novixa-tooltip__tip::before {
	content: "";
	position: absolute;
}

.novixa-tooltip__tip[data-placement="top"]::before    { left: 0; right: 0; top: 100%; height: 24px; }
.novixa-tooltip__tip[data-placement="bottom"]::before { left: 0; right: 0; bottom: 100%; height: 24px; }
.novixa-tooltip__tip[data-placement="left"]::before   { top: 0; bottom: 0; left: 100%; width: 24px; }
.novixa-tooltip__tip[data-placement="right"]::before  { top: 0; bottom: 0; right: 100%; width: 24px; }

/* ---------- Animations ---------- */
.novixa-tooltip--anim-slide .novixa-tooltip__tip[data-placement="top"]    { --nt-from: translate3d(0, 8px, 0); }
.novixa-tooltip--anim-slide .novixa-tooltip__tip[data-placement="bottom"] { --nt-from: translate3d(0, -8px, 0); }
.novixa-tooltip--anim-slide .novixa-tooltip__tip[data-placement="left"]   { --nt-from: translate3d(8px, 0, 0); }
.novixa-tooltip--anim-slide .novixa-tooltip__tip[data-placement="right"]  { --nt-from: translate3d(-8px, 0, 0); }

.novixa-tooltip--anim-scale .novixa-tooltip__tip { --nt-from: scale(.92); }

.novixa-tooltip--anim-zoom .novixa-tooltip__tip {
	--nt-from: scale(.55);
	--nt-ease: cubic-bezier(.34, 1.45, .64, 1);
}

/* ---------- Arrow (a rotated square clipped to its outer half) ---------- */
.novixa-tooltip__arrow {
	--nt-k: calc(var(--nt-bw, 1px) * 1.5 + 1px);
	position: absolute;
	z-index: 0;
	width: var(--nt-arrow, 10px);
	height: var(--nt-arrow, 10px);
	background: var(--nt-arrow-bg);
	border: 0 solid var(--nt-border);
	-webkit-backdrop-filter: blur(var(--nt-blur, 0px));
	backdrop-filter: blur(var(--nt-blur, 0px));
	transform: rotate(45deg);
	pointer-events: none;
}

.novixa-tooltip--no-arrow .novixa-tooltip__arrow {
	display: none;
}

/* tooltip above the trigger -> arrow on its bottom edge */
.novixa-tooltip__tip[data-placement="top"] .novixa-tooltip__arrow {
	bottom: calc(var(--nt-arrow, 10px) / -2 - var(--nt-bw, 1px));
	left: calc(var(--nt-ax, 50%) - var(--nt-arrow, 10px) / 2 - var(--nt-bw, 1px));
	border-right-width: var(--nt-bw, 1px);
	border-bottom-width: var(--nt-bw, 1px);
	clip-path: polygon(calc(100% - var(--nt-k)) 0, 100% 0, 100% 100%, 0 100%, 0 calc(100% - var(--nt-k)));
}

/* tooltip below -> arrow on its top edge */
.novixa-tooltip__tip[data-placement="bottom"] .novixa-tooltip__arrow {
	top: calc(var(--nt-arrow, 10px) / -2 - var(--nt-bw, 1px));
	left: calc(var(--nt-ax, 50%) - var(--nt-arrow, 10px) / 2 - var(--nt-bw, 1px));
	border-top-width: var(--nt-bw, 1px);
	border-left-width: var(--nt-bw, 1px);
	clip-path: polygon(0 0, 100% 0, 100% var(--nt-k), var(--nt-k) 100%, 0 100%);
}

/* tooltip left of the trigger -> arrow on its right edge */
.novixa-tooltip__tip[data-placement="left"] .novixa-tooltip__arrow {
	right: calc(var(--nt-arrow, 10px) / -2 - var(--nt-bw, 1px));
	top: calc(var(--nt-ay, 50%) - var(--nt-arrow, 10px) / 2 - var(--nt-bw, 1px));
	border-top-width: var(--nt-bw, 1px);
	border-right-width: var(--nt-bw, 1px);
	clip-path: polygon(0 0, 100% 0, 100% 100%, calc(100% - var(--nt-k)) 100%, 0 var(--nt-k));
}

/* tooltip right of the trigger -> arrow on its left edge */
.novixa-tooltip__tip[data-placement="right"] .novixa-tooltip__arrow {
	left: calc(var(--nt-arrow, 10px) / -2 - var(--nt-bw, 1px));
	top: calc(var(--nt-ay, 50%) - var(--nt-arrow, 10px) / 2 - var(--nt-bw, 1px));
	border-left-width: var(--nt-bw, 1px);
	border-bottom-width: var(--nt-bw, 1px);
	clip-path: polygon(0 0, var(--nt-k) 0, 100% calc(100% - var(--nt-k)), 100% 100%, 0 100%);
}

/* ---------- Content ---------- */
.novixa-tooltip__media {
	position: relative;
	z-index: 1;
	overflow: hidden;
	border-radius: max(0px, calc(var(--nt-radius, 12px) - var(--nt-bw, 1px))) max(0px, calc(var(--nt-radius, 12px) - var(--nt-bw, 1px))) 0 0;
}

.novixa-tooltip__media img {
	display: block;
	width: 100%;
	max-width: none;
	height: var(--nt-img-h, auto);
	max-height: 220px;
	margin: 0;
	object-fit: cover;
}

.novixa-tooltip__body {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 16px 18px;
}

.novixa-tooltip__tip-icon {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	font-size: var(--nt-tip-icon-s, 20px);
	line-height: 1;
	color: var(--nt-tip-icon, var(--nt-accent));
	margin-top: 2px;
}

.novixa-tooltip__tip-icon i,
.novixa-tooltip__tip-icon svg {
	width: 1em;
	height: 1em;
	font-size: inherit;
	line-height: 1;
	color: currentColor;
	fill: currentColor;
}

.novixa-tooltip__content {
	flex: 1 1 auto;
	min-width: 0;
}

.novixa-tooltip__tip--closable .novixa-tooltip__content {
	padding-right: 20px;
}

.novixa-tooltip__title {
	margin: 0 0 6px;
	font-family: var(--nt-title-font, inherit);
	font-size: var(--nt-title-size, 15px);
	font-weight: 600;
	line-height: 1.3;
	color: var(--nt-title);
}

.novixa-tooltip__title:last-child {
	margin-bottom: 0;
}

.novixa-tooltip__desc,
.novixa-tooltip__html {
	color: var(--nt-text);
	font-size: 13.5px;
	line-height: 1.65;
}

.novixa-tooltip__html {
	margin-top: 8px;
}

.novixa-tooltip__desc:first-child,
.novixa-tooltip__html:first-child {
	margin-top: 0;
}

.novixa-tooltip__desc p,
.novixa-tooltip__html p {
	margin: 0 0 .6em;
	color: inherit;
}

.novixa-tooltip__desc p:last-child,
.novixa-tooltip__html p:last-child {
	margin-bottom: 0;
}

.novixa-tooltip__tip a:not(.novixa-tooltip__link) {
	color: var(--nt-accent);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.novixa-tooltip .novixa-tooltip__link {
	display: inline-flex;
	align-items: center;
	margin-top: 10px;
	color: var(--nt-accent);
	font-size: 13px;
	font-weight: 500;
	text-decoration: underline;
	text-underline-offset: 3px;
	transition: opacity .2s ease;
}

.novixa-tooltip .novixa-tooltip__link:hover {
	color: var(--nt-accent);
	opacity: .8;
}

.novixa-tooltip__tip a:focus-visible {
	outline: 2px solid var(--nt-accent);
	outline-offset: 2px;
	border-radius: 2px;
}

/* ---------- Close button ---------- */
.novixa-tooltip .novixa-tooltip__close {
	-webkit-appearance: none;
	appearance: none;
	position: absolute;
	top: 6px;
	right: 6px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	margin: 0;
	padding: 0;
	color: var(--nt-close, var(--nt-text));
	background: transparent;
	border: 0;
	border-radius: 50%;
	box-shadow: none;
	line-height: 1;
	opacity: .75;
	cursor: pointer;
	transition: opacity .2s ease, background-color .2s ease;
}

.novixa-tooltip .novixa-tooltip__close:hover,
.novixa-tooltip .novixa-tooltip__close:focus-visible {
	color: var(--nt-close, var(--nt-title));
	background: rgba(127, 127, 127, .2);
	opacity: 1;
}

.novixa-tooltip .novixa-tooltip__close:focus-visible {
	outline: 2px solid var(--nt-accent);
	outline-offset: 1px;
}

/* ---------- Touch + small screens ---------- */
@media (pointer: coarse) {
	.novixa-tooltip .novixa-tooltip__trigger {
		min-height: 40px;
	}

	.novixa-tooltip .novixa-tooltip__close {
		width: 36px;
		height: 36px;
		top: 4px;
		right: 4px;
	}
}

@media (max-width: 767px) {
	.novixa-tooltip__tip {
		max-width: min(var(--nt-maxw, 280px), calc(100vw - 24px));
	}
}

@media (prefers-reduced-motion: reduce) {
	.novixa-tooltip__tip,
	.novixa-tooltip .novixa-tooltip__trigger {
		transition-duration: .01ms !important;
		transition-delay: 0s !important;
	}
}
