/* ==========================================================================
   Atkinson AI — concierge chat widget
   Brand: champagne-gold gradient + warm near-black ink. Fonts: Jost / Cormorant.
   ========================================================================== */

.ar-chat{
	--c-ink:#15110C; --c-ink2:#1c1812;
	--c-gold-deep:#8C6B3D; --c-gold:#BD9658; --c-gold-light:#D8B679;
	--c-champagne:#FBEFC8; --c-paper:#FCFAF5; --c-cream:#F6F1E8;
	--c-line:rgba(140,107,61,.22);
	--c-grad:linear-gradient(95deg,#8C6B3D 0%,#BD9658 28%,#F1DBA8 52%,#D8B679 74%,#8C6B3D 100%);
	--c-ease:cubic-bezier(.16,1,.3,1);
	position:fixed; right:clamp(14px,3vw,28px); bottom:clamp(14px,3vw,28px);
	z-index:9990; font-family:"Jost","Century Gothic",system-ui,sans-serif;
}

/* ---------- Launch button ---------- */
.ar-chat__launch{
	display:inline-flex; align-items:center; gap:.55rem;
	background:var(--c-ink); color:var(--c-champagne);
	border:1px solid rgba(241,219,168,.28); border-radius:100px;
	padding:.72rem 1.15rem .72rem .95rem; cursor:pointer;
	box-shadow:0 14px 40px -12px rgba(0,0,0,.55); position:relative;
	transition:transform .5s var(--c-ease), box-shadow .5s var(--c-ease), background .4s;
	-webkit-tap-highlight-color:transparent;
}
.ar-chat__launch:hover{ transform:translateY(-2px); box-shadow:0 20px 48px -14px rgba(0,0,0,.6); }
.ar-chat__launch svg{ width:22px; height:22px; display:block; }
.ar-chat__launch-ic{ color:var(--c-gold-light); display:inline-flex; }
.ar-chat__launch-close{ display:none; color:var(--c-gold-light); }
.ar-chat__launch-label{
	font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; font-weight:500;
}
.ar-chat.is-open .ar-chat__launch-ic{ display:none; }
.ar-chat.is-open .ar-chat__launch-close{ display:inline-flex; }
.ar-chat.is-open .ar-chat__launch-label{ display:none; }
.ar-chat.is-open .ar-chat__launch{ padding:.72rem; }
/* Gentle attention pulse before first open */
.ar-chat:not(.is-open) .ar-chat__launch::after{
	content:""; position:absolute; inset:-1px; border-radius:100px;
	border:1.5px solid var(--c-gold); opacity:0; animation:arPulse 3.4s var(--c-ease) infinite;
}
@keyframes arPulse{ 0%{ opacity:.5; transform:scale(1);} 60%,100%{ opacity:0; transform:scale(1.18);} }

/* ---------- Panel ---------- */
.ar-chat__panel{
	position:absolute; right:0; bottom:calc(100% + 14px);
	width:min(92vw,392px); height:min(72vh,620px);
	background:var(--c-paper); color:var(--c-ink);
	border:1px solid var(--c-line); border-radius:16px; overflow:hidden;
	display:none; flex-direction:column;
	box-shadow:0 30px 80px -24px rgba(20,15,8,.5);
	transform-origin:bottom right;
}
/* Visibility is driven by the .is-open class (not the [hidden] attribute,
   which an explicit display value would override). */
.ar-chat.is-open .ar-chat__panel{
	display:flex;
	animation:arPop .42s var(--c-ease) both;
}
@keyframes arPop{ from{ opacity:0; transform:translateY(14px) scale(.97);} to{ opacity:1; transform:none;} }

/* ---------- Header ---------- */
.ar-chat__head{
	display:flex; align-items:center; justify-content:space-between; gap:.8rem;
	padding:.9rem 1rem; background:var(--c-ink); color:var(--c-champagne);
	border-bottom:1px solid rgba(241,219,168,.16);
}
.ar-chat__head-brand{ display:flex; align-items:center; gap:.6rem; }
/* Dark disc so the gold badge emblem reads clearly (gold-on-gold was invisible). */
.ar-chat__avatar{
	width:40px; height:40px; border-radius:50%; background:#0f0b07;
	padding:6px; object-fit:contain;
	box-shadow:inset 0 0 0 1px rgba(241,219,168,.35), 0 2px 8px -3px rgba(0,0,0,.6);
}
.ar-chat__title{ display:block; font-family:"Cormorant Garamond",Georgia,serif; font-size:1.4rem; font-weight:600; line-height:1; }
.ar-chat__min{ background:none; border:0; color:var(--c-gold-light); cursor:pointer; padding:.3rem; border-radius:8px; display:inline-flex; transition:background .3s; }
.ar-chat__min:hover{ background:rgba(241,219,168,.12); }
.ar-chat__min svg{ width:20px; height:20px; }

/* ---------- Body ---------- */
.ar-chat__body{
	flex:1; overflow-y:auto; padding:1.1rem .95rem .4rem;
	background:linear-gradient(180deg,var(--c-cream),var(--c-paper) 140px);
	scrollbar-width:thin; scrollbar-color:var(--c-line) transparent;
}
.ar-chat__body::-webkit-scrollbar{ width:7px; }
.ar-chat__body::-webkit-scrollbar-thumb{ background:var(--c-line); border-radius:10px; }

.ar-msg{ display:flex; gap:.5rem; margin-bottom:.7rem; align-items:flex-end; }
.ar-msg__av{ flex:0 0 auto; width:26px; height:26px; border-radius:50%; background:var(--c-ink); display:inline-flex; align-items:center; justify-content:center; overflow:hidden; }
.ar-msg__av img{ width:18px; height:18px; object-fit:contain; }
.ar-msg__bubble{
	max-width:82%; padding:.68rem .85rem; border-radius:14px; font-size:.9rem; line-height:1.5;
	box-shadow:0 2px 10px -6px rgba(20,15,8,.25); word-wrap:break-word;
}
.ar-msg--bot .ar-msg__bubble{ background:#fff; border:1px solid var(--c-line); border-bottom-left-radius:4px; color:var(--c-ink); }
.ar-msg--user{ flex-direction:row-reverse; }
.ar-msg--user .ar-msg__bubble{ background:var(--c-ink); color:var(--c-champagne); border-bottom-right-radius:4px; }
.ar-msg__bubble a{ color:var(--c-gold-deep); font-weight:500; text-decoration:underline; text-underline-offset:2px; }
.ar-msg--user .ar-msg__bubble a{ color:var(--c-gold-light); }
.ar-msg__bubble strong{ font-weight:600; }

/* Contact block inside a bubble */
.ar-contact{ display:flex; flex-direction:column; gap:.4rem; margin-top:.6rem; }
.ar-contact__row{ display:flex; align-items:center; gap:.55rem; padding:.5rem .6rem; background:var(--c-cream); border:1px solid var(--c-line); border-radius:10px; font-size:.86rem; text-decoration:none !important; color:var(--c-ink) !important; font-weight:500; }
.ar-contact__row span{ font-size:1rem; }
.ar-contact__row--static{ background:transparent; }
a.ar-contact__row:hover{ border-color:var(--c-gold); }

/* Typing indicator */
.ar-typing{ display:inline-flex; gap:4px; align-items:center; }
.ar-typing span{ width:6px; height:6px; border-radius:50%; background:var(--c-gold); opacity:.4; animation:arDots 1.2s infinite; }
.ar-typing span:nth-child(2){ animation-delay:.2s; } .ar-typing span:nth-child(3){ animation-delay:.4s; }
@keyframes arDots{ 0%,60%,100%{ opacity:.3; transform:translateY(0);} 30%{ opacity:1; transform:translateY(-3px);} }

/* ---------- Chips ---------- */
.ar-chips{ display:flex; flex-wrap:wrap; gap:.4rem; margin:0 0 .9rem 34px; }
.ar-chips--follow, .ar-chips--actions{ margin-top:-.2rem; }
.ar-chip{
	font-family:inherit; font-size:.8rem; line-height:1.3; text-align:left;
	background:#fff; color:var(--c-ink); border:1px solid var(--c-line);
	border-radius:100px; padding:.42rem .8rem; cursor:pointer;
	transition:border-color .3s, background .3s, color .3s, transform .3s var(--c-ease);
}
.ar-chip:hover{ border-color:var(--c-gold); background:var(--c-ink); color:var(--c-champagne); transform:translateY(-1px); }
.ar-chips--actions .ar-chip{ background:var(--c-cream); font-weight:500; }

/* ---------- Composer ---------- */
.ar-chat__composer{ border-top:1px solid var(--c-line); padding:.7rem .8rem .55rem; background:var(--c-paper); }
.ar-chat__touch-btn{
	width:100%; display:flex; align-items:center; justify-content:center; gap:.5rem;
	font-family:inherit; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; font-weight:500;
	background:var(--c-grad); color:var(--c-ink); border:0; border-radius:100px;
	padding:.6rem; cursor:pointer; margin-bottom:.55rem; transition:filter .3s, transform .4s var(--c-ease);
}
.ar-chat__touch-btn:hover{ filter:brightness(1.05); transform:translateY(-1px); }
.ar-chat__touch-btn svg{ width:16px; height:16px; }
.ar-chat__form{ display:flex; gap:.4rem; align-items:center; }
.ar-chat__input{
	flex:1; font-family:inherit; font-size:.9rem; color:var(--c-ink);
	background:#fff; border:1px solid var(--c-line); border-radius:100px; padding:.62rem .9rem;
	outline:none; transition:border-color .3s;
}
.ar-chat__input:focus{ border-color:var(--c-gold); }
.ar-chat__input::placeholder{ color:#9a8f79; }
.ar-chat__send{
	flex:0 0 auto; width:42px; height:42px; border-radius:50%; border:0; cursor:pointer;
	background:var(--c-ink); color:var(--c-champagne); display:inline-flex; align-items:center; justify-content:center;
	transition:background .3s, transform .4s var(--c-ease);
}
.ar-chat__send:hover{ background:var(--c-gold-deep); transform:scale(1.05); }
.ar-chat__send svg{ width:18px; height:18px; }
.ar-chat__disclaimer{ font-size:.64rem; color:#8a7f68; text-align:center; margin:.5rem .2rem 0; line-height:1.4; }

/* ---------- Proactive greeting bubble ---------- */
.ar-chat__greeting{
	position:absolute; right:0; bottom:calc(100% + 14px);
	width:min(78vw,260px); background:#fff; color:var(--c-ink);
	border:1px solid var(--c-line); border-radius:14px 14px 4px 14px;
	padding:.85rem 1rem; box-shadow:0 18px 44px -16px rgba(20,15,8,.5);
	cursor:pointer; animation:arGreet .5s var(--c-ease) both;
}
.ar-chat__greeting::after{
	content:""; position:absolute; right:22px; bottom:-7px; width:14px; height:14px;
	background:#fff; border-right:1px solid var(--c-line); border-bottom:1px solid var(--c-line);
	transform:rotate(45deg);
}
.ar-chat__greeting p{ margin:0; font-size:.86rem; line-height:1.45; }
.ar-chat__greeting-x{
	position:absolute; top:-9px; left:-9px; width:22px; height:22px; border-radius:50%;
	background:var(--c-ink); color:var(--c-champagne); border:0; cursor:pointer;
	font-size:15px; line-height:22px; text-align:center; padding:0;
	box-shadow:0 2px 8px -2px rgba(0,0,0,.5);
}
@keyframes arGreet{ from{ opacity:0; transform:translateY(10px) scale(.96);} to{ opacity:1; transform:none;} }

/* ---------- In-chat interactive map ---------- */
.ar-msg--map{ display:block; margin:0 0 .8rem 0; }
.ar-msg__bubble--map{ max-width:100%; width:100%; padding:5px; border-radius:14px; }
.ar-chat__map{ width:100%; height:230px; border-radius:10px; overflow:hidden; background:#241a0e; position:relative; }
.ar-chat__map .mapboxgl-ctrl-bottom-right{ transform:scale(.82); transform-origin:bottom right; }
.ar-chat__map-loading{
	position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
	color:var(--c-champagne); font-size:.78rem; letter-spacing:.05em;
}
.ar-chat__map-link{
	display:block; text-align:center; font-size:.78rem; font-weight:500;
	color:var(--c-gold-deep) !important; padding:.5rem .3rem .25rem; text-decoration:none !important;
}
.ar-chat__map-link:hover{ text-decoration:underline !important; }

/* ---------- Mobile ---------- */
@media (max-width:600px){
	.ar-chat{ right:12px; bottom:12px; }
	.ar-chat__panel{
		position:fixed; right:0; left:0; bottom:0; top:0;
		width:100vw; height:100dvh; border-radius:0; border:0;
	}
	.ar-chat__launch-label{ display:none; }
	.ar-chat__launch{ padding:.85rem; }
}

@media (prefers-reduced-motion:reduce){
	.ar-chat *,.ar-chat *::after,.ar-chat *::before{ animation:none !important; transition:none !important; }
}
