/* Al Remal Clay Atelier — the v7 message-first layout; behaviour remains in chat.js. */
#chat-launcher,#chat-panel{font-family:var(--body,"Inter",Arial,sans-serif);-webkit-tap-highlight-color:transparent}
#chat-launcher{position:fixed;right:24px;bottom:24px;z-index:75;width:72px;height:72px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:8px;border:1px solid #a97666;border-radius:50%;background:#713d32;color:#fff;font-size:12px;font-weight:600;line-height:1.2;cursor:pointer;box-shadow:0 6px 20px #31231f30;transition:background .15s ease,box-shadow .15s ease}
#chat-launcher svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#chat-launcher:hover{background:#542a24;box-shadow:0 8px 28px #31231f33}
#chat-panel{box-sizing:border-box;position:fixed;inset:auto 24px 24px auto;margin:0;width:400px;max-width:calc(100vw - 48px);height:650px;max-height:calc(100dvh - 48px);padding:0;border:1px solid #dad3cc;border-radius:24px;background:#faf8f5;color:#31231f;box-shadow:0 12px 50px #31231f45;font-size:14px;line-height:1.5;overflow:hidden;z-index:100;color-scheme:light}
#chat-panel::backdrop{background:#31231f33}
#chat-panel[open]{display:block}
#chat-panel .chat-shell{display:flex;flex-direction:column;height:100%;min-height:0}
#chat-panel *{box-sizing:border-box}
#chat-panel [hidden]{display:none!important}
#chat-panel button,#chat-panel textarea{font:inherit}
#chat-panel button,#chat-panel a{-webkit-tap-highlight-color:transparent}
#chat-panel a{color:#713d32;text-decoration:underline;text-underline-offset:3px}
#chat-panel p{font-size:inherit;line-height:inherit;color:inherit;margin:0}
#chat-panel .chat-header{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;padding:19px 18px 15px;border-bottom:1px solid #dad3cc;background:#faf8f5;flex:none}
#chat-panel .chat-header>div:first-child{min-width:0}
#chat-panel #chat-title{font:600 18px/1.3 var(--body,"Inter",Arial,sans-serif);letter-spacing:-.025em;color:#31231f;margin:0 0 5px}
#chat-panel #chat-description{max-width:225px;color:#73645a;font-size:10.5px;line-height:1.45}
#chat-panel .chat-header-actions{display:flex;gap:6px;align-items:center;flex-shrink:0}
#chat-panel .chat-header button{padding:0;border:0;background:transparent;color:#73645a;cursor:pointer;min-height:36px}
#chat-panel #chat-clear{font-size:10px;white-space:nowrap;text-decoration:none;min-width:49px}
#chat-panel #chat-close{font-size:25px;font-weight:400;line-height:1;width:34px;border-radius:50%;background:#eae6e1;color:#73645a}
#chat-panel .chat-header button:hover{color:#713d32;background:#ebdfd1;border-radius:18px}
#chat-panel .chat-notice{display:flex;align-items:flex-start;gap:6px;padding:11px 16px;border-bottom:1px solid #ebdfd1;background:#f4ebe0;color:#73645a;font-size:10.5px;line-height:1.55;flex:none}
#chat-panel .chat-notice p{flex:1}
#chat-panel #chat-notice-dismiss{border:0;background:transparent;color:#73645a;min-height:32px;width:28px;flex:none;font-size:22px;line-height:1;cursor:pointer}
#chat-panel .chat-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#b5a392 transparent;padding:18px 20px 22px;scroll-behavior:auto}
#chat-panel .chat-messages{display:flex;flex-direction:column;gap:0}
/* Labels come from the existing accessible speaker names. Consecutive bubbles group without changing the DOM. */
#chat-panel .chat-message{position:relative;isolation:isolate;max-width:88%;margin-top:30px;padding:11px 15px;border:0;border-radius:18px;font-size:14px;line-height:1.55;overflow-wrap:anywhere;text-align:start}
#chat-panel .chat-message::before{content:attr(aria-label);position:absolute;top:-20px;left:10px;right:auto;white-space:nowrap;color:#73645a;font-size:10px;font-weight:500;line-height:16px;letter-spacing:0;direction:ltr}
#chat-panel .chat-message:first-child{margin-top:22px}
#chat-panel .chat-message-assistant{align-self:flex-start;background:#eae6e1;color:#31231f}
#chat-panel .chat-message-user{align-self:flex-end;background:#713d32;color:#fff;white-space:pre-wrap}
#chat-panel .chat-message-user::before{left:auto;right:10px}
#chat-panel .chat-message-assistant+.chat-message-assistant,#chat-panel .chat-message-user+.chat-message-user{margin-top:4px}
#chat-panel .chat-message-assistant+.chat-message-assistant::before,#chat-panel .chat-message-user+.chat-message-user::before{display:none}
#chat-panel .chat-message::after{content:"";position:absolute;z-index:-1;bottom:0;width:15px;height:15px;background:inherit}
#chat-panel .chat-message-assistant::after{left:-5px;clip-path:polygon(65% 0,100% 0,100% 100%,0 100%,28% 76%,43% 45%)}
#chat-panel .chat-message-user::after{right:-5px;clip-path:polygon(0 0,35% 0,57% 45%,72% 76%,100% 100%,0 100%)}
#chat-panel .chat-message-assistant:has(+.chat-message-assistant)::after,#chat-panel .chat-message-user:has(+.chat-message-user)::after{display:none}
#chat-panel .chat-message p+p{margin-top:5px}
#chat-panel .chat-message ul{margin:6px 0;padding-inline-start:19px;list-style:disc}
#chat-panel .chat-message li{margin:4px 0;padding:0;font-size:inherit;color:inherit}
#chat-panel .chat-message a{color:#713d32;unicode-bidi:isolate;text-decoration:underline;text-decoration-thickness:1px}
#chat-panel .chat-message[dir=auto]{unicode-bidi:plaintext}
/* Keep the existing spoken typing text; visually replace it with three quiet dots. */
#chat-panel .chat-typing{position:relative;align-self:flex-start;width:62px;height:36px;min-height:36px;margin:24px 0 0!important;padding:0;border-radius:18px;background:#eae6e1;color:#73645a!important;font-size:0!important;line-height:0}
#chat-panel .chat-typing::before{content:"";position:absolute;top:15px;left:16px;width:6px;height:6px;border-radius:50%;background:#73645a;box-shadow:12px 0 #73645a,24px 0 #73645a;animation:chat-dots 1.25s ease-in-out infinite}
@keyframes chat-dots{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
#chat-panel .chat-starters{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:5px 0}
#chat-panel .chat-welcome{font:600 21px/1.25 var(--body,"Inter",Arial,sans-serif);letter-spacing:-.025em;color:#31231f;margin:0 0 2px}
#chat-panel .chat-welcome-detail{color:#73645a;font-size:12px;line-height:1.55;margin-bottom:10px}
#chat-panel .chat-starter{background:#f4ebe0;border:1px solid #d8c9bb;border-radius:22px;min-height:38px;padding:9px 13px;text-align:left;color:#713d32;font-size:11.5px;line-height:1.45;cursor:pointer}
#chat-panel .chat-starter:hover{background:#ebdfd1;border-color:#a18a79}
#chat-panel .chat-compose{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:12px 16px 16px;border-top:1px solid #dad3cc;background:#faf8f5;flex:none}
#chat-panel .chat-compose>div,#chat-panel .chat-compose>form,#chat-panel .chat-retry{grid-column:1/-1}
#chat-panel .chat-status:empty{display:none}
#chat-panel .chat-status{color:#31231f;background:#f4ebe0;border-radius:12px;font-size:12px;line-height:1.5;padding:9px 11px;overflow-wrap:anywhere}
#chat-panel .chat-retry{justify-self:start;background:#f4ebe0;color:#713d32;border:1px solid #a18a79;border-radius:20px;min-height:36px;padding:6px 15px;cursor:pointer;font-size:12px}
#chat-panel .chat-security{margin:0 0 2px;min-height:0}
#chat-panel #chat-security-label{font-size:10px;line-height:1.5;color:#73645a;margin-bottom:5px}
#chat-panel #chat-turnstile{min-width:0;max-width:100%}
#chat-panel #chat-turnstile iframe{max-width:100%;border-radius:9px}
#chat-panel .chat-input-label{display:block;font-size:10px;font-weight:500;margin:0 0 6px 12px;color:#73645a}
#chat-panel .chat-input-row{display:flex;gap:5px;align-items:center;padding:4px;border:1px solid #a18a79;border-radius:28px;background:#fff}
#chat-panel #chat-input{display:block;min-width:0;flex:1;resize:none;width:100%;height:42px;min-height:42px;max-height:100px;margin:0;border:0;border-radius:22px;background:#fff;color:#31231f;padding:9px 8px 9px 11px;font-size:16px;font-weight:400;line-height:24px;box-shadow:none}
#chat-panel #chat-input::placeholder{color:#73645a;opacity:1}
#chat-panel #chat-send,#chat-panel #chat-stop{position:relative;display:grid;place-items:center;flex:0 0 42px;width:42px;min-width:42px;height:42px;min-height:42px;padding:0;border:0;border-radius:50%;background:#713d32;color:#fff;font-size:0;cursor:pointer}
#chat-panel #chat-send::before{content:"";width:12px;height:12px;margin-top:3px;border:2px solid #fff;border-right:0;border-bottom:0;transform:rotate(45deg)}
#chat-panel #chat-send::after{content:"";position:absolute;left:20px;top:13px;width:2px;height:18px;background:#fff;border-radius:2px}
#chat-panel #chat-stop::before{content:"";width:13px;height:13px;border-radius:3px;background:#fff}
#chat-panel #chat-send:hover,#chat-panel #chat-stop:hover{background:#542a24}
#chat-panel button:disabled{opacity:1;cursor:default;background:#ebdfd1;color:#514138}
#chat-panel #chat-send:disabled{background:#73645a;color:#fff}
#chat-panel .chat-counter{font-size:10px;color:#73645a;text-align:right;margin:4px 8px 0}
/* All four actions share one wrapping, two-column row group, including the existing person link. */
#chat-panel .chat-quick{display:contents;font-size:10px;line-height:1.4}
#chat-panel .chat-quick a,#chat-panel .chat-person{display:flex;align-items:center;justify-content:center;min-width:0;min-height:30px;padding:6px 8px;border:1px solid #d8c9bb;border-radius:20px;background:#f4ebe0;color:#713d32;font-size:10px;line-height:1.4;font-weight:500;text-align:center;text-decoration:none;margin:0}
#chat-panel .chat-quick a:hover,#chat-panel .chat-person:hover{background:#ebdfd1;border-color:#a18a79}
#chat-launcher:focus-visible{outline:3px solid #fff;outline-offset:4px;box-shadow:0 0 0 7px #713d32}
#chat-panel :focus-visible{outline:2px solid #713d32;outline-offset:3px}
#chat-panel .chat-input-row:has(#chat-input:focus-visible){border-color:#713d32;outline:2px solid #713d32;outline-offset:2px}
#chat-panel #chat-input:focus-visible{outline:none}
html.chat-open{overflow:hidden}
#chat-panel.chat-compact{overflow-y:auto}
#chat-panel.chat-compact .chat-shell{height:auto;min-height:100%}
#chat-panel.chat-compact .chat-header{position:sticky;top:0;z-index:2;padding-block:10px}
#chat-panel.chat-compact .chat-notice{max-height:90px;overflow:auto}
#chat-panel.chat-compact .chat-scroll{flex:none;max-height:220px;min-height:90px}
#chat-panel.chat-compact .chat-compose{padding-top:8px}
@media(max-width:767px){
 body.chat-enabled{padding-bottom:max(var(--chat-bar-height,0px),calc(var(--bar,72px) + env(safe-area-inset-bottom,0px)))}
 .mobile-contact.chat-bar{grid-template-columns:1fr 1.55fr .64fr;gap:0}
 .mobile-contact.chat-bar.retail-contact{grid-template-columns:1fr 1fr .7fr}
 .mobile-contact.chat-bar .btn{min-height:48px;padding:8px 7px;font-size:12px;line-height:1.2;white-space:normal;text-align:center}
 .mobile-contact.chat-bar #chat-launcher{position:static;min-width:0;width:100%;height:auto;min-height:48px;border-radius:0;padding:5px;box-shadow:none;gap:2px;font-size:10px;background:transparent;color:#713d32;border:0;border-left:1px solid #d5c8ba}
 .mobile-contact.chat-bar #chat-launcher svg{width:20px;height:20px}
 #chat-launcher{bottom:calc(88px + env(safe-area-inset-bottom,0px));right:16px;width:64px;height:64px}
 #chat-panel{inset:var(--chat-view-top,0px) 0 auto 0;width:100%;max-width:none;height:var(--chat-view-height,100dvh);max-height:none;border:0;border-radius:0}
 #chat-panel .chat-header{padding:calc(16px + env(safe-area-inset-top,0px)) 16px 14px}
 #chat-panel #chat-title{font-size:18px}
 #chat-panel #chat-close{width:38px;min-height:38px}
 #chat-panel .chat-compose{padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}
 #chat-panel .chat-scroll{padding:18px 20px 24px}
 #chat-panel .chat-message{font-size:16px}
 #chat-panel .chat-quick a,#chat-panel .chat-person{font-size:10.5px;min-height:32px}
}
@media(max-height:550px){
 #chat-panel .chat-notice{max-height:90px;overflow:auto}
 #chat-panel .chat-header{padding-top:10px;padding-bottom:10px}
 #chat-panel .chat-compose{padding-top:8px;gap:5px}
 #chat-panel #chat-security-label{font-size:10px}
}
@media(prefers-reduced-motion:reduce){#chat-panel *,#chat-panel *::before,#chat-panel *::after,#chat-launcher{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{#chat-launcher,#chat-panel{display:none!important}}
