/* CR-045 — full-viewport AI chat on restaurant pages (Order Online · Book Table · Contact) */
.rchat { position: fixed; inset: 0; z-index: 10000; display: none; background: rgba(20,21,46,.6); }
.rchat.is-open { display: flex; justify-content: center; }
.rchat-panel {
    --vvh: 100dvh;
    display: flex; flex-direction: column; width: 100%; max-width: 480px;
    height: var(--vvh); margin-top: var(--vvtop, 0px);
    background: #fff; color: var(--ink); font-family: var(--body);
}
.rchat-head {
    display: flex; align-items: center; gap: 12px; flex: 0 0 auto;
    padding: 10px 12px 10px 8px; background: var(--ink); color: #fff;
}
.rchat-close {
    flex: 0 0 auto; width: 44px; height: 44px; border: 0; border-radius: 12px; cursor: pointer;
    background: transparent; color: #fff; font-size: 1.9rem; line-height: 1;
}
.rchat-close:hover { background: rgba(255,255,255,.12); }
.rchat-title { min-width: 0; }
.rchat-name { margin: 0; font: 700 1.05rem/1.2 var(--display); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rchat-note { margin: 2px 0 0; font-size: .78rem; color: #C9CEEA; }

.rchat-list { flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; padding: 16px 14px 8px; display: flex; flex-direction: column; gap: 10px; background: #fff; }
.rchat-msg { max-width: 85%; padding: 10px 14px; border-radius: 18px; font-size: 1rem; line-height: 1.45; overflow-wrap: anywhere; }
.rchat-msg--bot { align-self: flex-start; background: var(--sky); border-bottom-left-radius: 6px; }
.rchat-msg--me { align-self: flex-end; background: var(--indigo); color: #fff; border-bottom-right-radius: 6px; }
.rchat-actions { align-self: flex-start; display: flex; flex-wrap: wrap; gap: 8px; }
.rchat-action {
    display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border-radius: 999px;
    background: var(--sun); color: var(--ink); font-weight: 700; text-decoration: none; border: 1px solid var(--sun-dark);
}
.rchat-action:hover, .rchat-action:focus-visible { background: var(--sun-dark); }
.rchat-chips { display: flex; flex-wrap: wrap; gap: 8px; align-self: flex-start; }
.rchat-chip {
    min-height: 44px; padding: 0 16px; border-radius: 999px; cursor: pointer;
    background: #fff; color: var(--indigo); border: 1.5px solid var(--indigo); font: 600 .95rem var(--body);
}
.rchat-chip:hover { background: var(--sky); }
.rchat-typing { align-self: flex-start; display: flex; gap: 5px; padding: 14px 16px; background: var(--sky); border-radius: 18px; border-bottom-left-radius: 6px; }
.rchat-typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); animation: rchat-dot 1.1s infinite ease-in-out; }
.rchat-typing i:nth-child(2) { animation-delay: .15s; }
.rchat-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes rchat-dot { 0%, 80%, 100% { opacity: .3; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }
.rchat-error { align-self: flex-start; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 14px; background: #FFF1EE; border: 1px solid #F3C4BA; color: #7A1F10; font-size: .95rem; }
.rchat-retry { min-height: 44px; padding: 0 16px; border-radius: 999px; border: 0; background: var(--indigo); color: #fff; font: 700 .95rem var(--body); cursor: pointer; }

.rchat-form { flex: 0 0 auto; display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: #fff; }
.rchat-input {
    flex: 1 1 auto; min-height: 44px; max-height: 120px; resize: none; padding: 11px 14px; border-radius: 22px;
    border: 1.5px solid var(--line); font: 400 1rem/1.35 var(--body); color: var(--ink); background: #fff;
}
.rchat-input:focus { outline: none; border-color: var(--indigo); box-shadow: 0 0 0 3px rgba(43,45,143,.15); }
.rchat-send {
    flex: 0 0 auto; min-width: 64px; min-height: 44px; padding: 0 18px; border: 0; border-radius: 22px; cursor: pointer;
    background: var(--indigo); color: #fff; font: 700 1rem var(--body);
}
.rchat-send:disabled, .rchat-input:disabled { opacity: .55; cursor: not-allowed; }
.rchat button:focus-visible, .rchat a:focus-visible { outline: 3px solid var(--sun); outline-offset: 2px; }
body.rchat-lock { overflow: hidden; }

@media (min-width: 640px) {
    .rchat-panel { border-radius: 0; box-shadow: 0 0 40px rgba(20,21,46,.35); }
}
@media (prefers-reduced-motion: reduce) { .rchat-typing i { animation: none; opacity: .7; } }