:root {
		--primary: #8b5dff;
		/* Original 1TA Purple */
		--primary-light: #a374ff;
		--primary-dark: #7347e6;
		--dark-bg: #0a0a0a;
		--darker-bg: #050505;
		--glass-bg: rgba(20, 20, 30, 0.8);
		--text-primary: #ffffff;
		--text-secondary: #cccccc;
		--gray: #1a1a1a;
	}
	
	.chatbot-container {
		position: fixed;
		bottom: 20px;
		right: 20px;
		z-index: 1000;
		font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	}
	
	.chatbot-toggle {
		width: 50px;
		height: 50px;
		background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 50%, var(--primary-dark) 100%);
		border-radius: 16px;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		border: 2px solid transparent;
		position: relative;
		transition: all 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
		animation: floatPulse 4s infinite ease-in-out;
		transform-style: preserve-3d;
	}
	
	@keyframes floatPulse {
		0%,
		100% {
			transform: translateY(0px) rotateZ(0deg);
			box-shadow: 0 6px 20px rgba(139, 93, 255, 0.4), 0 0 30px rgba(139, 93, 255, 0.2);
		}
		25% {
			transform: translateY(-4px) rotateZ(2deg);
			box-shadow: 0 12px 25px rgba(139, 93, 255, 0.6), 0 0 40px rgba(139, 93, 255, 0.3);
		}
		50% {
			transform: translateY(-2px) rotateZ(0deg);
			box-shadow: 0 8px 22px rgba(139, 93, 255, 0.5), 0 0 35px rgba(139, 93, 255, 0.25);
		}
		75% {
			transform: translateY(-4px) rotateZ(-2deg);
			box-shadow: 0 12px 25px rgba(139, 93, 255, 0.6), 0 0 40px rgba(139, 93, 255, 0.3);
		}
	}
	
	.chatbot-toggle::before {
		content: '';
		position: absolute;
		inset: -2px;
		background: conic-gradient(from 0deg, var(--primary), var(--primary-light), var(--primary), var(--primary-dark), var(--primary));
		border-radius: 18px;
		z-index: -1;
		opacity: 0;
		transition: opacity 0.4s ease;
		animation: rotateBorder 3s linear infinite paused;
	}
	
	.chatbot-toggle:hover {
		transform: translateY(-2px) scale(1.05);
		border-radius: 20px;
	}
	
	.chatbot-toggle:hover::before {
		opacity: 1;
		animation-play-state: running;
	}
	
	@keyframes rotateBorder {
		0% {
			transform: rotate(0deg);
		}
		100% {
			transform: rotate(360deg);
		}
	}
	
	.chatbot-toggle svg {
		color: var(--text-primary);
		width: 22px;
		height: 22px;
		transition: all 0.3s ease;
		filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.6));
		position: relative;
		z-index: 2;
	}
	
	.chatbot-toggle:hover svg {
		transform: scale(1.1);
		filter: drop-shadow(0 0 15px rgba(255, 255, 255, 0.8));
	}
	
	.chatbot-window {
		position: absolute;
		bottom: 65px;
		right: 0;
		width: 320px;
		height: 450px;
		background: linear-gradient(145deg, var(--dark-bg) 0%, #0f0f0f 50%, var(--gray) 100%);
		border-radius: 20px;
		backdrop-filter: blur(20px) saturate(1.8);
		border: 1px solid rgba(139, 93, 255, 0.3);
		display: none;
		flex-direction: column;
		overflow: hidden;
		animation: windowMorph 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
		box-shadow: 0 20px 60px rgba(0, 0, 0, 0.7), 0 0 30px rgba(139, 93, 255, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.1), inset 0 -1px 6px rgba(139, 93, 255, 0.1);
		transform-style: preserve-3d;
	}
	
	@keyframes windowMorph {
		0% {
			opacity: 0;
			transform: translateY(30px) rotateX(20deg) scale(0.8);
			border-radius: 35px;
		}
		50% {
			transform: translateY(-5px) rotateX(-5deg) scale(1.05);
			border-radius: 15px;
		}
		100% {
			opacity: 1;
			transform: translateY(0) rotateX(0deg) scale(1);
			border-radius: 20px;
		}
	}
	
	.chatbot-header {
		background: linear-gradient(135deg, rgba(139, 93, 255, 0.2), rgba(115, 71, 230, 0.1));
		color: var(--text-primary);
		padding: 16px 20px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: relative;
		border-bottom: 1px solid rgba(139, 93, 255, 0.2);
	}
	
	.chatbot-header::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 1px;
		background: linear-gradient(90deg, transparent, var(--primary), var(--primary-light), var(--primary), transparent);
		animation: headerFlow 3s ease-in-out infinite;
	}
	
	@keyframes headerFlow {
		0%,
		100% {
			transform: translateX(-100%) scaleX(0.5);
			opacity: 0.5;
		}
		50% {
			transform: translateX(0%) scaleX(1);
			opacity: 1;
		}
	}
	
	.chatbot-header h4 {
		margin: 0;
		font-size: 16px;
		font-weight: 800;
		background: linear-gradient(45deg, var(--primary), var(--primary-light), var(--primary));
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		background-clip: text;
		letter-spacing: 0.3px;
		text-shadow: 0 0 15px rgba(139, 93, 255, 0.5);
	}
	
	.chatbot-close {
		background: rgba(139, 93, 255, 0.1);
		border: 1px solid rgba(139, 93, 255, 0.3);
		color: var(--text-primary);
		cursor: pointer;
		padding: 0;
		width: 28px;
		height: 28px;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 10px;
		transition: all 0.4s ease;
		position: relative;
		overflow: hidden;
	}
	
	.chatbot-close::before {
		content: '';
		position: absolute;
		inset: 0;
		background: linear-gradient(45deg, var(--primary), var(--primary-light));
		opacity: 0;
		transition: opacity 0.3s ease;
		border-radius: 10px;
	}
	
	.chatbot-close:hover::before {
		opacity: 0.2;
	}
	
	.chatbot-close:hover {
		transform: rotate(180deg) scale(1.1);
		border-color: var(--primary);
		box-shadow: 0 0 15px rgba(139, 93, 255, 0.6);
	}
	
	.chatbot-messages {
		flex: 1;
		padding: 16px;
		overflow-y: auto;
		background: transparent;
		display: flex;
		flex-direction: column;
		gap: 12px;
		position: relative;
	}
	
	.chatbot-messages::before {
		content: '';
		position: absolute;
		top: 0;
		left: 12px;
		width: 1px;
		height: 100%;
		background: linear-gradient(180deg, transparent, rgba(139, 93, 255, 0.3), rgba(139, 93, 255, 0.1), transparent);
		border-radius: 1px;
	}
	
	.chatbot-messages::-webkit-scrollbar {
		width: 6px;
	}
	
	.chatbot-messages::-webkit-scrollbar-track {
		background: rgba(139, 93, 255, 0.05);
		border-radius: 6px;
	}
	
	.chatbot-messages::-webkit-scrollbar-thumb {
		background: linear-gradient(180deg, var(--primary), var(--primary-light));
		border-radius: 6px;
		box-shadow: 0 0 10px rgba(139, 93, 255, 0.4);
	}
	
	.bot-message,
	.user-message {
		display: flex;
		margin-bottom: 12px;
		animation: messageSlideUp 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
	}
	
	@keyframes messageSlideUp {
		0% {
			opacity: 0;
			transform: translateY(20px) rotateX(90deg);
		}
		60% {
			transform: translateY(-3px) rotateX(-10deg);
		}
		100% {
			opacity: 1;
			transform: translateY(0) rotateX(0deg);
		}
	}
	
	.user-message {
		justify-content: flex-end;
	}
	
	.message-content {
		max-width: 85%;
		padding: 10px 14px;
		border-radius: 16px;
		font-size: 13px;
		line-height: 1.5;
		word-wrap: break-word;
		position: relative;
		backdrop-filter: blur(10px);
		transform-style: preserve-3d;
	}
	
	.bot-message .message-content {
		background: linear-gradient(135deg, rgba(139, 93, 255, 0.15), rgba(115, 71, 230, 0.1), rgba(139, 93, 255, 0.05));
		color: var(--text-primary);
		border: 1px solid rgba(139, 93, 255, 0.25);
		border-bottom-left-radius: 6px;
		box-shadow: 0 6px 25px rgba(139, 93, 255, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.1);
	}
	
	.bot-message .message-content::before {
		content: '';
		position: absolute;
		top: -1px;
		left: -1px;
		right: -1px;
		height: 1px;
		background: linear-gradient(90deg, var(--primary), var(--primary-light), var(--primary));
		border-radius: 16px 16px 0 0;
	}
	
	.user-message .message-content {
		background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 50%, var(--primary-dark) 100%);
		color: var(--text-primary);
		border: 1px solid rgba(139, 93, 255, 0.4);
		border-bottom-right-radius: 6px;
		box-shadow: 0 6px 25px rgba(139, 93, 255, 0.3), 0 0 15px rgba(139, 93, 255, 0.2);
	}
	
	.chatbot-input-area {
		padding: 16px;
		background: linear-gradient(135deg, rgba(139, 93, 255, 0.05), rgba(26, 26, 26, 0.8));
		border-top: 1px solid rgba(139, 93, 255, 0.2);
		display: flex;
		gap: 10px;
		position: relative;
	}
	
	.chatbot-input-area::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 1px;
		background: linear-gradient(90deg, var(--primary), var(--primary-light), var(--primary));
		opacity: 0.7;
	}
	
	.chatbot-input-area input {
		flex: 1;
		padding: 10px 14px;
		border: 1px solid rgba(139, 93, 255, 0.3);
		border-radius: 12px;
		background: rgba(139, 93, 255, 0.05);
		color: var(--text-primary);
		font-size: 13px;
		outline: none;
		transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
		backdrop-filter: blur(8px);
	}
	
	.chatbot-input-area input:focus {
		border-color: var(--primary);
		box-shadow: 0 0 20px rgba(139, 93, 255, 0.4), inset 0 0 15px rgba(139, 93, 255, 0.1);
		background: rgba(139, 93, 255, 0.1);
		transform: scale(1.01) translateY(-1px);
	}
	
	.chatbot-input-area input::placeholder {
		color: rgba(255, 255, 255, 0.5);
		font-style: italic;
	}
	
	.chatbot-input-area button {
		padding: 10px 16px;
		background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
		color: var(--text-primary);
		border: none;
		border-radius: 12px;
		cursor: pointer;
		font-size: 13px;
		font-weight: 700;
		transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
		position: relative;
		overflow: hidden;
		box-shadow: 0 5px 20px rgba(139, 93, 255, 0.4);
	}
	
	.chatbot-input-area button::before {
		content: '';
		position: absolute;
		top: 0;
		left: -100%;
		width: 100%;
		height: 100%;
		background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
		transition: left 0.6s;
	}
	
	.chatbot-input-area button:hover::before {
		left: 100%;
	}
	
	.chatbot-input-area button:hover {
		transform: translateY(-2px) scale(1.03);
		box-shadow: 0 8px 30px rgba(139, 93, 255, 0.6);
	}
	
	.faq-section {
		margin-top: 16px;
		display: flex;
		flex-direction: column;
		gap: 10px;
	}
	
	.faq-item {
		background: linear-gradient(135deg, rgba(139, 93, 255, 0.08), rgba(139, 93, 255, 0.03));
		border: 1px solid rgba(139, 93, 255, 0.2);
		border-radius: 12px;
		cursor: pointer;
		transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
		overflow: hidden;
		position: relative;
		backdrop-filter: blur(8px);
		transform-style: preserve-3d;
	}
	
	.faq-item::before {
		content: '';
		position: absolute;
		top: 0;
		left: -100%;
		width: 100%;
		height: 100%;
		background: linear-gradient(90deg, transparent, rgba(139, 93, 255, 0.15), transparent);
		transition: left 0.6s ease;
	}
	
	.faq-item:hover::before {
		left: 100%;
	}
	
	.faq-item:hover {
		border-color: var(--primary);
		transform: translateX(6px) scale(1.01) rotateY(3deg);
		box-shadow: 0 8px 25px rgba(139, 93, 255, 0.3);
	}
	
	.faq-question {
		padding: 12px 16px;
		color: var(--text-primary);
		font-size: 13px;
		font-weight: 600;
		display: flex;
		align-items: center;
		gap: 10px;
		position: relative;
		z-index: 1;
	}
	
	.faq-icon {
		width: 18px;
		height: 18px;
		background: linear-gradient(135deg, var(--primary), var(--primary-light));
		border-radius: 6px;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-shrink: 0;
		transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
		box-shadow: 0 4px 12px rgba(139, 93, 255, 0.4);
	}
	
	.faq-item:hover .faq-icon {
		transform: rotate(360deg) scale(1.2);
		box-shadow: 0 6px 18px rgba(139, 93, 255, 0.6);
	}
	
	.typing-indicator {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 10px 14px;
		background: linear-gradient(135deg, rgba(139, 93, 255, 0.15), rgba(115, 71, 230, 0.1));
		color: var(--text-primary);
		border-radius: 16px;
		border-bottom-left-radius: 6px;
		border: 1px solid rgba(139, 93, 255, 0.25);
		max-width: 85%;
		font-size: 13px;
		backdrop-filter: blur(10px);
	}
	
	.typing-dots {
		display: flex;
		gap: 5px;
	}
	
	.typing-dot {
		width: 6px;
		height: 6px;
		background: linear-gradient(135deg, var(--primary), var(--primary-light));
		border-radius: 50%;
		animation: morphicTyping 1.6s infinite ease-in-out;
		box-shadow: 0 0 8px rgba(139, 93, 255, 0.5);
	}
	
	.typing-dot:nth-child(1) {
		animation-delay: -0.32s;
	}
	
	.typing-dot:nth-child(2) {
		animation-delay: -0.16s;
	}
	
	@keyframes morphicTyping {
		0%,
		80%,
		100% {
			transform: scale(0.6) rotateZ(0deg);
			opacity: 0.4;
			box-shadow: 0 0 5px rgba(139, 93, 255, 0.3);
		}
		40% {
			transform: scale(1.4) rotateZ(180deg);
			opacity: 1;
			box-shadow: 0 0 15px rgba(139, 93, 255, 0.8);
		}
	}
	/* Responsive Design */
	
	@media (max-width: 360px) {
		.chatbot-window {
			width: 280px;
			height: 400px;
			right: -10px;
		}
		.chatbot-container {
			right: 15px;
			bottom: 15px;
		}
		.chatbot-toggle {
			width: 45px;
			height: 45px;
		}
	}
	/* Enhanced dark mode */
	
	@media (prefers-color-scheme: dark) {
		:root {
			--glass-bg: rgba(10, 10, 15, 0.95);
		}
	}