/* ═══════════════════════════════════════════════════════════════
   FalcoTik Liquid Glass — global design layer for the whole website
   Applies frosted-glass styling to every tool: inputs, cards, navs,
   tables, dropdowns, modals and buttons, on every page.
   ═══════════════════════════════════════════════════════════════ */

:root {
	--lg-teal: #00A884;
	--lg-teal-dark: #007a60;
	--lg-purple: #7C3FA8;
	--lg-sky: #0ea5e9;
	--lg-glass: rgba(255, 255, 255, .55);
	--lg-glass-strong: rgba(255, 255, 255, .7);
	--lg-edge: rgba(255, 255, 255, .65);
	--lg-line: rgba(13, 27, 42, .08);
	--lg-shine: inset 0 1px 0 rgba(255, 255, 255, .7);
	--lg-shadow: 0 12px 30px rgba(13, 27, 42, .07);
}

/* ── Living aurora behind every page ── */
body {
	position: relative;
}

	body::before {
		content: '';
		position: fixed;
		inset: -12%;
		z-index: -1;
		pointer-events: none;
		background: radial-gradient(44% 38% at 10% 8%, rgba(0, 168, 132, .16), transparent 70%), radial-gradient(38% 32% at 88% 16%, rgba(124, 63, 168, .12), transparent 70%), radial-gradient(42% 36% at 82% 86%, rgba(14, 165, 233, .12), transparent 70%), radial-gradient(32% 28% at 14% 88%, rgba(0, 212, 168, .12), transparent 70%);
		filter: blur(60px) saturate(1.25);
		animation: lg-aurora 32s ease-in-out infinite alternate;
		will-change: transform;
	}

@keyframes lg-aurora {
	0% {
		transform: translate3d(-2%, -1%, 0) scale(1) rotate(-1deg)
	}

	50% {
		transform: translate3d(2%, 2%, 0) scale(1.07) rotate(1deg)
	}

	100% {
		transform: translate3d(-1%, 1%, 0) scale(1.03) rotate(0)
	}
}

@keyframes lg-shine-sweep {
	0% {
		left: -80%;
		opacity: 0
	}

	25% {
		opacity: 1
	}

	100% {
		left: 130%;
		opacity: 0
	}
}

/* ── Selection + slim glass scrollbars ── */
::selection {
	background: rgba(0, 168, 132, .28);
}

::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

::-webkit-scrollbar-track {
	background: transparent;
}

::-webkit-scrollbar-thumb {
	background: rgba(13, 27, 42, .22);
	border-radius: 999px;
	border: 3px solid transparent;
	background-clip: content-box;
}

	::-webkit-scrollbar-thumb:hover {
		background: rgba(0, 168, 132, .55);
		border: 3px solid transparent;
		background-clip: content-box;
	}

/* ── Liquid light sweep on every button-like tool ── */
.btn,
button:not(.nav-toggle),
[role="button"],
input[type="submit"],
input[type="button"],
.ct-submit,
.ct-back,
.nav-cta,
.cta-btn,
.pkg-btn {
	position: relative;
	overflow: hidden;
}

	.btn::after,
	button:not(.nav-toggle)::after,
	[role="button"]::after,
	.ct-submit::after,
	.ct-back::after,
	.nav-cta::after,
	.cta-btn::after,
	.pkg-btn::after {
		content: '';
		position: absolute;
		top: -20%;
		left: -80%;
		width: 70%;
		height: 140%;
		background: linear-gradient(105deg, transparent 0%, rgba(255, 255, 255, .18) 30%, rgba(255, 255, 255, .7) 50%, rgba(255, 255, 255, .18) 70%, transparent 100%);
		filter: blur(3px);
		transform: skewX(-20deg);
		opacity: 0;
		pointer-events: none;
	}

	.btn:hover::after,
	button:not(.nav-toggle):hover::after,
	[role="button"]:hover::after,
	.ct-submit:hover::after,
	.ct-back:hover::after,
	.nav-cta:hover::after,
	.cta-btn:hover::after,
	.pkg-btn:hover::after {
		animation: lg-shine-sweep .9s cubic-bezier(.25, .6, .35, 1);
	}

/* ── Inputs: every text field, textarea and select is frosted glass ── */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="date"],
input[type="url"],
textarea,
select,
.form-control,
.form-select,
.ct-input {
	background: var(--lg-glass) !important;
	-webkit-backdrop-filter: blur(10px) saturate(1.4);
	backdrop-filter: blur(10px) saturate(1.4);
	border: 1px solid var(--lg-line) !important;
	border-radius: 12px !important;
	box-shadow: var(--lg-shine);
	transition: box-shadow .2s ease, background-color .2s ease, border-color .2s ease;
}

	input[type="text"]:focus,
	input[type="email"]:focus,
	input[type="tel"]:focus,
	input[type="number"]:focus,
	input[type="password"]:focus,
	input[type="search"]:focus,
	input[type="date"]:focus,
	input[type="url"]:focus,
	textarea:focus,
	select:focus,
	.form-control:focus,
	.form-select:focus,
	.ct-input:focus {
		outline: none;
		border-color: rgba(0, 168, 132, .5) !important;
		background: rgba(255, 255, 255, .78) !important;
		box-shadow: 0 0 0 3px rgba(0, 168, 132, .18), 0 6px 18px rgba(0, 168, 132, .10), var(--lg-shine) !important;
	}

input[type="checkbox"],
input[type="radio"] {
	accent-color: var(--lg-teal);
}

/* ── Cards, panels, and containers ── */
.card,
.ct-card,
.ct-form-wrap,
.guide-section,
.guide-topics,
.guide-header,
.modal-content,
.dropdown-menu,
.accordion-item,
.toast,
.offcanvas {
	background: var(--lg-glass-strong) !important;
	-webkit-backdrop-filter: blur(18px) saturate(1.6);
	backdrop-filter: blur(18px) saturate(1.6);
	border: 1px solid var(--lg-edge) !important;
	box-shadow: var(--lg-shadow), var(--lg-shine) !important;
	border-radius: 18px !important;
	overflow: hidden;
}

.list-group-item {
	background: var(--lg-glass) !important;
	-webkit-backdrop-filter: blur(12px) saturate(1.5);
	backdrop-filter: blur(12px) saturate(1.5);
	border-color: var(--lg-line) !important;
}

.ct-card,
.card {
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

	.ct-card:hover,
	.card:hover {
		transform: translateY(-4px);
		border-color: rgba(0, 168, 132, .45) !important;
		box-shadow: 0 18px 44px rgba(0, 168, 132, .12), var(--lg-shine) !important;
	}

/* ── Sticky navigation bars (contact / guides) ── */
.ct-nav,
.guide-nav {
	background: rgba(255, 255, 255, .6) !important;
	-webkit-backdrop-filter: blur(24px) saturate(1.7);
	backdrop-filter: blur(24px) saturate(1.7);
	border-bottom: 1px solid rgba(13, 27, 42, .06);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6) !important;
}

/* ── Tables: frosted headers, translucent rows ── */
table {
	background: transparent;
}

	table thead th {
		background: rgba(0, 168, 132, .10) !important;
		border-color: var(--lg-line) !important;
	}

	table tbody tr {
		background: rgba(255, 255, 255, .45);
		transition: background-color .15s ease;
	}

		table tbody tr:hover {
			background: rgba(0, 168, 132, .07);
		}

	table td,
	table th {
		border-color: var(--lg-line) !important;
	}

/* ── Accessibility & print safety ── */
@media (prefers-reduced-motion: reduce) {
	body::before {
		animation: none;
	}
}

@media print {
	body::before {
		display: none;
	}

	.card,
	.ct-card,
	.ct-form-wrap,
	.guide-section,
	.guide-topics,
	.guide-header,
	.modal-content,
	input,
	textarea,
	select,
	.form-control,
	.form-select,
	.ct-input,
	table tbody tr {
		background: #ffffff !important;
		-webkit-backdrop-filter: none !important;
		backdrop-filter: none !important;
		box-shadow: none !important;
	}
}