/* Aapanam AI Product Assistant - styling (navy #14375A / cyan #1CA9E0 / gold #E5A93C) */

.aai-guide {
	margin: 26px 0;
	padding: 22px 24px;
	background: #f7fafd;
	border: 1px solid #e3ecf4;
	border-radius: 14px;
}
.aai-guide-title {
	margin: 0 0 12px;
	font-size: 20px;
	color: #14375A;
	border-left: 4px solid #E5A93C;
	padding-left: 10px;
}
.aai-guide-body p { margin: 0 0 10px; color: #2b3a47; }
.aai-guide-body ul { margin: 0; padding-left: 20px; }
.aai-guide-body li { margin: 6px 0; color: #2b3a47; line-height: 1.5; }

/* Ask-AI widget */
.aai-ask { margin: 16px 0; }
.aai-ask-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #E5A93C;
	color: #14233a;
	border: 0;
	border-radius: 10px;
	padding: 12px 18px;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 3px 10px rgba(229,169,60,.30);
	transition: transform .12s ease, box-shadow .12s ease;
}
.aai-ask-btn:hover { transform: translateY(-1px); box-shadow: 0 5px 16px rgba(229,169,60,.42); }

.aai-panel {
	max-width: 420px;
	border: 1px solid #dce6ef;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 12px 34px rgba(20,55,90,.18);
	background: #fff;
}
.aai-head {
	background: #14375A;
	color: #fff;
	padding: 12px 16px;
	font-weight: 700;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.aai-x { cursor: pointer; font-size: 22px; line-height: 1; opacity: .9; }
.aai-x:hover { opacity: 1; }

.aai-log {
	max-height: 280px;
	overflow-y: auto;
	padding: 14px;
	background: #f7fafd;
}
.aai-msg {
	margin: 0 0 10px;
	padding: 9px 12px;
	border-radius: 12px;
	font-size: 14px;
	line-height: 1.45;
	max-width: 85%;
	word-wrap: break-word;
}
.aai-bot { background: #eaf4fb; color: #14375A; border-bottom-left-radius: 4px; }
.aai-me { background: #14375A; color: #fff; margin-left: auto; border-bottom-right-radius: 4px; }
.aai-typing { opacity: .6; font-style: italic; }

.aai-row { display: flex; gap: 8px; padding: 12px; border-top: 1px solid #eef3f8; }
.aai-input {
	flex: 1;
	border: 1px solid #cfdbe7;
	border-radius: 8px;
	padding: 10px 12px;
	font-size: 14px;
	outline: none;
}
.aai-input:focus { border-color: #1CA9E0; box-shadow: 0 0 0 2px rgba(28,169,224,.15); }
.aai-send {
	background: #1CA9E0;
	color: #fff;
	border: 0;
	border-radius: 8px;
	padding: 10px 16px;
	font-weight: 700;
	cursor: pointer;
}
.aai-send:hover { background: #14375A; }
.aai-foot { text-align: center; font-size: 11px; color: #9fb0c0; padding: 6px 0 10px; }

@media (max-width: 600px) {
	.aai-panel { max-width: 100%; }
	.aai-guide { padding: 18px 16px; }
}