/* Amnetix — Faisal AI chat (built-in assistant) */

:root {
	--fc-green: var(--brand-primary, #0a5c36);
	--fc-accent: var(--brand-accent, #6edb8f);
	--fc-bg: var(--surface, #fff);
	--fc-bg2: var(--surface-2, #eef4f0);
	--fc-text: var(--text, #0d1a14);
	--fc-muted: var(--muted, #4d5f57);
	--fc-line: var(--line, rgba(6, 53, 31, .12));
}

/* ---------- attention: shake + online dot ---------- */
@keyframes amxf-shake {
	0%, 100% { transform: rotate(0) scale(1); }
	10% { transform: rotate(-14deg) scale(1.08); }
	20% { transform: rotate(12deg) scale(1.08); }
	30% { transform: rotate(-10deg) scale(1.08); }
	40% { transform: rotate(8deg) scale(1.06); }
	50% { transform: rotate(-5deg) scale(1.04); }
	60% { transform: rotate(3deg) scale(1.02); }
	70% { transform: rotate(0) scale(1); }
}
@keyframes amxf-ring {
	0% { box-shadow: 0 0 0 0 rgba(110, 219, 143, .55), 0 8px 22px -6px rgba(3, 29, 17, .38); }
	100% { box-shadow: 0 0 0 18px rgba(110, 219, 143, 0), 0 8px 22px -6px rgba(3, 29, 17, .38); }
}
.amxf-fab.amxf-attn, .amxf-handle.amxf-attn { animation: amxf-shake 1.1s cubic-bezier(.36, .07, .19, .97) both, amxf-ring 1.2s ease-out 1; }
.amxf-online { position: absolute; top: 2px; inset-inline-end: 2px; width: 13px; height: 13px; border-radius: 50%; background: #2ecc71; border: 2px solid #fff; pointer-events: none; }
.amxf-online::after { content: ""; position: absolute; inset: -2px; border-radius: 50%; border: 2px solid #2ecc71; animation: amxf-pulse 2.4s ease-out infinite; }
@keyframes amxf-pulse { 0% { transform: scale(1); opacity: .9; } 70%, 100% { transform: scale(2.1); opacity: 0; } }
.amxf-fab.is-chat-open .amxf-online { display: none; }
body.amxc-sheet-open .amxf-fab { visibility: hidden; }

/* ---------- greeting bubble ---------- */
.amxc-greet {
	position: fixed; z-index: 1501; max-width: calc(100vw - 20px);
	padding: 14px 16px 12px; border-radius: 16px;
	background: var(--fc-bg); color: var(--fc-text);
	border: 1px solid var(--fc-line);
	box-shadow: 0 18px 40px -14px rgba(3, 29, 17, .35), 0 2px 8px rgba(3, 29, 17, .08);
	font-family: var(--font, system-ui, sans-serif); font-size: 15px; line-height: 1.45;
	opacity: 0; transform: translateY(8px) scale(.96); transform-origin: var(--tail-x, 50%) 100%;
	transition: opacity .25s ease, transform .3s cubic-bezier(.2, .8, .2, 1.2);
}
.amxc-greet.is-below { transform-origin: var(--tail-x, 50%) 0; transform: translateY(-8px) scale(.96); }
.amxc-greet.is-on { opacity: 1; transform: none; }
.amxc-greet::after {
	content: ""; position: absolute; bottom: -7px; left: calc(var(--tail-x, 50%) - 7px);
	width: 14px; height: 14px; background: inherit; border: inherit; border-top: 0; border-inline-start: 0;
	transform: rotate(45deg); border-radius: 0 0 3px 0;
}
.amxc-greet.is-below::after { bottom: auto; top: -7px; transform: rotate(-135deg); }
.amxc-greet__txt { margin: 0 22px 10px 0; cursor: pointer; }
html[dir="rtl"] .amxc-greet__txt { margin: 0 0 10px 22px; }
.amxc-greet__x { position: absolute; top: 8px; inset-inline-end: 8px; display: grid; place-items: center; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--fc-muted); cursor: pointer; }
.amxc-greet__x:hover { background: var(--fc-bg2); }
.amxc-greet__x .amx-icon { width: 15px; height: 15px; }
.amxc-greet__acts { display: flex; flex-wrap: wrap; gap: 8px; }
.amxc-greet__acts button { font: inherit; font-size: 14px; font-weight: 600; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--fc-green); background: transparent; color: var(--fc-green); cursor: pointer; }
.amxc-greet__acts button:first-child { background: var(--fc-green); color: #fff; }
html[data-theme="dark"] .amxc-greet__acts button { border-color: var(--fc-accent); color: var(--fc-accent); }
html[data-theme="dark"] .amxc-greet__acts button:first-child { background: var(--fc-accent); color: #04140b; }

/* ---------- panel ---------- */
.amxc-panel {
	position: fixed; z-index: 1502; display: flex; flex-direction: column;
	width: 390px; height: 600px; max-height: calc(100dvh - 24px);
	border-radius: 20px; overflow: hidden;
	background: var(--fc-bg); color: var(--fc-text);
	border: 1px solid var(--fc-line);
	box-shadow: 0 30px 70px -20px rgba(3, 29, 17, .45), 0 4px 14px rgba(3, 29, 17, .1);
	font-family: var(--font, system-ui, sans-serif); font-size: 15px;
	opacity: 0; transform: translateY(12px) scale(.98); transition: opacity .18s ease, transform .22s cubic-bezier(.2, .8, .2, 1);
}
.amxc-panel.is-open { opacity: 1; transform: none; }
.amxc-panel.is-sheet { inset: auto 0 0 0; width: auto; height: 88dvh; max-height: 88dvh; border-radius: 20px 20px 0 0; padding-bottom: env(safe-area-inset-bottom, 0); }

.amxc-head { display: flex; align-items: center; gap: 12px; padding: 14px 12px 14px 16px; background: linear-gradient(135deg, var(--fc-green), #08472a); color: #fff; }
html[dir="rtl"] .amxc-head { padding: 14px 16px 14px 12px; }
.amxc-avatar { flex: 0 0 auto; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: #fff; border: 2px solid var(--fc-accent); }
.amxc-avatar img { height: 62%; width: auto; }
.amxc-avatar.is-custom, .amxc-mini.is-custom { background: transparent; border: 0; }
.amxc-avatar.is-custom img, .amxc-mini.is-custom img { height: 100%; width: 100%; object-fit: contain; }
.amxc-head__txt { flex: 1 1 auto; min-width: 0; }
.amxc-head h2 { margin: 0; font-size: 17px; font-weight: 700; color: #fff; line-height: 1.2; }
.amxc-head p { margin: 2px 0 0; display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: rgba(255, 255, 255, .85); }
.amxc-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--fc-accent); box-shadow: 0 0 0 3px rgba(110, 219, 143, .25); }
.amxc-iconbtn { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 10px; background: transparent; color: #fff; cursor: pointer; }
.amxc-iconbtn:hover { background: rgba(255, 255, 255, .14); }
.amxc-iconbtn:focus-visible, .amxc-panel button:focus-visible, .amxc-panel a:focus-visible, .amxc-greet button:focus-visible { outline: 3px solid #2f7df6; outline-offset: 2px; }
.amxc-iconbtn .amx-icon { width: 19px; height: 19px; }

.amxc-log { flex: 1 1 auto; overflow-y: auto; overflow-x: hidden; padding: 16px 14px 8px; display: flex; flex-direction: column; gap: 10px; background: var(--fc-bg); overscroll-behavior: contain; }
.amxc-msg { display: flex; align-items: flex-end; gap: 8px; flex-wrap: wrap; }
.amxc-msg.is-new { animation: amxc-in .25s ease both; }
@keyframes amxc-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.amxc-msg--user { justify-content: flex-end; }
.amxc-mini { flex: 0 0 auto; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #fff; border: 1.5px solid var(--fc-green); align-self: flex-start; }
.amxc-mini img { height: 62%; width: auto; }
.amxc-bubble { max-width: calc(100% - 44px); padding: 10px 13px; border-radius: 16px; line-height: 1.5; word-wrap: break-word; overflow-wrap: anywhere; white-space: normal; }
.amxc-msg--bot .amxc-bubble { background: var(--fc-bg2); color: var(--fc-text); border-start-start-radius: 4px; }
.amxc-msg--user .amxc-bubble { background: var(--fc-green); color: #fff; border-end-end-radius: 4px; max-width: 85%; }
.amxc-bubble a { color: inherit; text-decoration: underline; }
.amxc-msg--bot .amxc-bubble a { color: var(--fc-green); }
html[data-theme="dark"] .amxc-msg--bot .amxc-bubble a { color: var(--fc-accent); }
.amxc-typing .amxc-bubble { display: inline-flex; gap: 4px; padding: 14px 14px; }
.amxc-typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--fc-muted); opacity: .5; animation: amxc-dots 1.1s infinite ease-in-out; }
.amxc-typing i:nth-child(2) { animation-delay: .15s; }
.amxc-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes amxc-dots { 0%, 60%, 100% { transform: translateY(0); opacity: .45; } 30% { transform: translateY(-4px); opacity: 1; } }

.amxc-acts { flex: 1 0 100%; box-sizing: border-box; min-width: 0; display: flex; flex-wrap: wrap; gap: 6px; padding-inline-start: 36px; }
.amxc-act { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--fc-green); background: var(--fc-bg); color: var(--fc-green); font: inherit; font-size: 13.5px; font-weight: 600; text-decoration: none; cursor: pointer; }
.amxc-act:hover { background: var(--fc-green); color: #fff; }
.amxc-act.is-wa { border-color: #1f9e55; color: #1f9e55; }
.amxc-act.is-wa:hover { background: #1f9e55; color: #fff; }
.amxc-act .amx-icon { width: 16px; height: 16px; }
html[dir="rtl"] .amxc-act .amx-icon:last-child:not(:first-child), html[dir="rtl"] .amxc-send .amx-icon { transform: scaleX(-1); }
html[data-theme="dark"] .amxc-act { border-color: var(--fc-accent); color: var(--fc-accent); }
html[data-theme="dark"] .amxc-act:hover { background: var(--fc-accent); color: #04140b; }

.amxc-chips { box-sizing: border-box; display: flex; flex-wrap: wrap; gap: 6px; padding-inline-start: 36px; }
.amxc-chip { font: inherit; font-size: 13.5px; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--fc-line); background: var(--fc-bg); color: var(--fc-text); cursor: pointer; text-align: start; }
.amxc-chip:hover { border-color: var(--fc-green); color: var(--fc-green); }
html[data-theme="dark"] .amxc-chip:hover { border-color: var(--fc-accent); color: var(--fc-accent); }

.amxc-input { display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--fc-line); background: var(--fc-bg); }
.amxc-input textarea { flex: 1 1 auto; min-height: 42px; max-height: 120px; resize: none; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--fc-line); background: var(--fc-bg2); color: var(--fc-text); font: inherit; font-size: 15px; line-height: 1.4; }
.amxc-input textarea:focus { outline: none; border-color: var(--fc-green); box-shadow: 0 0 0 3px rgba(10, 92, 54, .15); }
.amxc-send { flex: 0 0 auto; display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 12px; background: var(--fc-green); color: #fff; cursor: pointer; }
.amxc-send:disabled { opacity: .5; cursor: default; }
.amxc-send .amx-icon { width: 19px; height: 19px; }
.amxc-note { margin: 0; padding: 0 14px 10px; font-size: 11.5px; color: var(--fc-muted); background: var(--fc-bg); }

/* ---------- booking ---------- */
.amxc-book, .amxc-booked { box-sizing: border-box; flex: 0 0 auto; width: calc(100% - 36px); min-width: 0; margin-inline-start: 36px; padding: 14px; border-radius: 14px; border: 1px solid var(--fc-line); background: var(--fc-bg); }
.amxc-book h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 15px; color: var(--fc-green); }
html[data-theme="dark"] .amxc-book h3 { color: var(--fc-accent); }
.amxc-book h3 .amx-icon { width: 18px; height: 18px; }
.amxc-book label, .amxc-lab { display: block; margin: 10px 0 4px; font-size: 13px; font-weight: 600; color: var(--fc-text); }
.amxc-lab small { font-weight: 400; color: var(--fc-muted); }
.amxc-book input:not(.amxc-hp) { width: 100%; box-sizing: border-box; padding: 9px 11px; border-radius: 10px; border: 1px solid var(--fc-line); background: var(--fc-bg2); color: var(--fc-text); font: inherit; font-size: 14.5px; }
.amxc-book input:focus { outline: none; border-color: var(--fc-green); box-shadow: 0 0 0 3px rgba(10, 92, 54, .15); }
.amxc-two { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.amxc-two label { margin-top: 10px; }
.amxc-hp { position: absolute !important; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.amxc-hint, .amxc-muted { margin: 6px 0 0; font-size: 12.5px; color: var(--fc-muted); }
.amxc-days, .amxc-times { max-width: 100%; display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.amxc-times { flex-wrap: wrap; overflow: visible; }
.amxc-days button, .amxc-times button { flex: 0 0 auto; font: inherit; font-size: 13px; padding: 7px 10px; border-radius: 10px; border: 1px solid var(--fc-line); background: var(--fc-bg); color: var(--fc-text); cursor: pointer; white-space: nowrap; }
.amxc-days button[aria-checked="true"], .amxc-times button[aria-checked="true"] { background: var(--fc-green); border-color: var(--fc-green); color: #fff; }
.amxc-err { margin: 10px 0 0; padding: 8px 10px; border-radius: 8px; background: var(--danger-bg, #fdecea); color: var(--danger, #c0392b); font-size: 13px; }
.amxc-submit { width: 100%; margin-top: 12px; padding: 11px; border: 0; border-radius: 12px; background: var(--fc-green); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.amxc-submit:disabled { opacity: .55; cursor: default; }
.amxc-booked { display: flex; gap: 10px; align-items: flex-start; border-color: var(--fc-green); background: rgba(10, 92, 54, .06); }
.amxc-booked .amx-icon { flex: 0 0 auto; width: 22px; height: 22px; color: var(--fc-green); }
.amxc-booked p { margin: 0; line-height: 1.5; }

@media (max-width: 600px) {
	.amxc-two { grid-template-columns: 1fr; }
	.amxc-greet { font-size: 14.5px; }
}
@media (prefers-reduced-motion: reduce) {
	.amxf-fab.amxf-attn, .amxf-online::after, .amxc-msg.is-new, .amxc-typing i { animation: none !important; }
	.amxc-panel, .amxc-greet { transition: none; }
}
@media print { .amxc-panel, .amxc-greet { display: none !important; } }
