/* =========== © 2025 Centroarts.com - https://aipoint.space =========== */

/* --- Footer --- */
.ai-footer { user-select: none; font-size: 14px; padding-bottom: 40px; line-height: 24px; }
.ai-footer a { color: inherit !important; text-decoration: none !important; }

.ai-foot-copyright .centroarts { opacity: .7; }

.ai-foot-menu { white-space: nowrap; }
.ai-foot-menu > a { display: block; position: relative; z-index: 1; transition: opacity .2s ease; }
.ai-foot-menu > a:hover { opacity: .8; }
.ai-foot-menu > a::after { content: ""; position: absolute; inset: -8px; z-index: -1; }

@media (min-width: 640px) {
	.ai-foot-menu { display: flex; flex-wrap: wrap; gap: 24px; }
	.ai-foot-copyright { display: flex; gap: 24px; margin-top: 4px; }
}
@media (max-width: 639px) {
	.ai-foot-menu, .ai-foot-copyright { text-align: center; }
	.ai-foot-menu > a + a { margin-top: 8px; }

	.ai-foot-copyright {
		position: relative; z-index: 1;
		padding-top: 32px; padding-bottom: 32px; margin-top: 32px;
	}
	.ai-foot-copyright::after {
		content: ""; position: absolute; top: 0; left: calc(var(--p-wrp)/-1); right: calc(var(--p-wrp)/-1);
		height: 1px; background-color: var(--c-border);
	}
}

.ai-social { display: flex; align-items: center; gap: 12px; }
.ai-social > a {
	display: flex; align-items: center; justify-content: center;
	width: 48px; height: 48px; transition: opacity .2s ease;
}
.ai-social > a .ic { width: 32px; height: 32px; }
.ai-social > a:hover { opacity: .8; }

@media (min-width: 1100px) {
	.ai-footer .wrp { display: flex; }
	.footer-cont { flex: 1 1 auto; }
	.ai-foot-copyright .centroarts { order: -1; }
	.ai-foot-menu, .ai-foot-copyright { justify-content: end; }
	.ai-social { order: -1; margin-left: 172px; }
}

/* Scroll UP & Dark Mod */
.fixed-btn { position: fixed; left: 0; right: 0; bottom: 40px; z-index: 101; pointer-events: none; }
.fixed-btn .wrp { display: flex; align-items: center; gap: 12px; }
.fixed-btn a, .fixed-btn button { pointer-events: all; }

@media (min-width: 576px) and (max-width: 1099px) {
	.fixed-btn .wrp { flex-direction: row-reverse; }
	.footer-cont { margin-bottom: 32px; }
	.ai-social { margin-left: -8px; }
}

@media (max-width: 575px) {
	.ai-social { padding: 32px 0; justify-content: center; }
	.fixed-btn .btn {
		display: block !important; flex: 1 1 auto; opacity: 0; visibility: hidden;
		transition: opacity .2s ease, visibility .2s ease;
	}
	html.scroll .fixed-btn .btn { opacity: 1; visibility: visible; }
	.fixed-btn {
		position: fixed; z-index: 101; bottom: 0; left: 0; right: 0;
		background-image: linear-gradient(180deg, hsla(var(--c-body), 0.0) 0%, hsl(var(--c-body)) 100%);
	}
	.fixed-btn .wrp { padding: 12px; padding-bottom: 20px; }
	.fixed-btn ~ .ai-footer { padding-bottom: 96px; }
}

.scroll-up, .darkmod-btn {
	position: relative; z-index: 1;
	display: flex; align-items: center; justify-content: center;
	width: 48px; height: 48px; border-radius: 50%; cursor: pointer;
	border: 0 none; background: none !important; outline: none; user-select: none; color: inherit; 
}
.scroll-up::after, .darkmod-btn::after {
	content: ""; position: absolute; inset: 0; z-index: -1;
	border-radius: 50%; transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
}
.scroll-up:hover::after, .darkmod-btn:hover::after { transform: scale(1.03); }
.scroll-up:active::after, .darkmod-btn:active::after { transform: scale(0.98); }

.scroll-up .ic, .darkmod-btn .ic { flex: 0 0 24px; height: 24px; }
.scroll-up {
	cursor: pointer; width: 48px; height: 48px; padding: 0 !important;
	border: 0 none !important; background: none !important;
	color: var(--cb-invert-t);
}
.scroll-up::after {
	background-color: var(--cb-invert);
}
.scroll-up:hover::after {
	background-color: var(--cb-invert-h);
}
.scroll-up:active::after {
	background-color: var(--cb-invert-a);
}
.scroll-up .ic { width: 24px; height: 24px; } 

/* Dark Mod */
.darkmod-btn {
	cursor: pointer; position: relative; z-index: 1;
	border: 0 none; background: none !important; outline: none; user-select: none; color: inherit; 
}
.darkmod-btn::after {
	background-color: hsla(var(--cb-scroll-up), 0.5);
	backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
}
.darkmod-btn:hover::after {
	background-color: hsla(var(--cb-scroll-up), 0.7);
}

.darkmod-btn .ic { display: block; width: 24px; height: 24px; opacity: .8; transition: transform .2s ease, opacity .2s ease; }
.darkmod-btn:hover .ic-dm1 { opacity: 1; }
.darkmod-btn .ic-dm2 { margin-left: -24px; transform: translateX(100%); opacity: 0; }

html.dark .darkmod-btn .ic-dm1 { transform: translateX(-100%); opacity: 0; }
html.dark .darkmod-btn .ic-dm2 { transform: translateX(0); opacity: 0.8; }
html.dark .darkmod-btn:hover .ic-dm2 { opacity: 1; }