/* ============================================================
   RANA'S — AI CONCIERGE  ·  "Ask Rana"
   Floating chat agent: answers, recommends, navigates, books.
   ============================================================ */

.cz-launcher {
  position: fixed; right: 22px; bottom: 22px; z-index: 9000;
  display: flex; align-items: center; gap: 12px;
  background: linear-gradient(135deg, #5e1418, #3a0b0e);
  color: var(--cream); padding: 10px 18px 10px 12px;
  border-radius: 50px; cursor: pointer;
  box-shadow: 0 16px 40px -12px rgba(58,11,14,.6), 0 0 0 1px var(--gold);
  transition: transform .25s ease, box-shadow .25s ease;
}
.cz-launcher:hover { transform: translateY(-3px); box-shadow: 0 22px 48px -12px rgba(58,11,14,.7), 0 0 0 1px var(--gold-light); }
.cz-launcher__ic {
  width: 40px; height: 40px; border-radius: 50%; flex: none;
  background: linear-gradient(135deg, var(--gold-light), var(--gold));
  display: grid; place-items: center; color: var(--maroon-deep);
  position: relative;
}
.cz-launcher__ic svg { width: 22px; height: 22px; }
.cz-launcher__ic::after {
  content: ""; position: absolute; top: 1px; right: 1px; width: 11px; height: 11px;
  background: #2f9e44; border: 2px solid #3a0b0e; border-radius: 50%;
}
.cz-launcher__txt { line-height: 1.1; }
.cz-launcher__txt b { font-family: var(--serif); font-size: 1rem; font-weight: 700; display: block; }
.cz-launcher__txt span { font-size: .72rem; color: var(--gold-soft); letter-spacing: .04em; }
.cz-launcher.hidden { transform: scale(.4); opacity: 0; pointer-events: none; }
@media (max-width: 520px) { .cz-launcher__txt { display: none; } .cz-launcher { padding: 8px; right: 16px; bottom: 16px; } }

/* pulse ring */
.cz-launcher__ic .ring {
  position: absolute; inset: -6px; border-radius: 50%; border: 2px solid var(--gold);
  animation: czpulse 2.4s ease-out infinite; opacity: 0;
}
@keyframes czpulse { 0% { transform: scale(.8); opacity: .7; } 100% { transform: scale(1.5); opacity: 0; } }

/* panel */
.cz-panel {
  position: fixed; right: 22px; bottom: 22px; z-index: 9001;
  width: min(400px, calc(100vw - 32px)); height: min(620px, calc(100vh - 44px));
  background: var(--cream); border-radius: 16px; overflow: hidden;
  display: flex; flex-direction: column;
  box-shadow: 0 40px 100px -30px rgba(20,8,2,.7), 0 0 0 1px rgba(192,153,31,.4);
  transform: translateY(20px) scale(.96); opacity: 0; pointer-events: none;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), opacity .3s ease;
  transform-origin: bottom right;
}
.cz-panel.open { transform: none; opacity: 1; pointer-events: auto; }
@media (max-width: 520px) {
  .cz-panel { right: 8px; left: 8px; bottom: 8px; width: auto; height: min(82vh, 640px); }
}

/* header */
.cz-head {
  background: linear-gradient(135deg, #5e1418, #3a0b0e); color: var(--cream);
  padding: 16px 16px; display: flex; align-items: center; gap: 12px; flex: none;
  position: relative;
}
.cz-head::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: linear-gradient(90deg, var(--saffron), var(--gold), var(--saffron)); }
.cz-head__av { width: 44px; height: 44px; flex: none; }
.cz-head__t { flex: 1; line-height: 1.2; }
.cz-head__t b { font-family: var(--serif); font-size: 1.12rem; }
.cz-head__t span { display: flex; align-items: center; gap: 6px; font-size: .76rem; color: var(--gold-soft); margin-top: 2px; }
.cz-head__t span::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #46d06f; box-shadow: 0 0 0 0 rgba(70,208,111,.6); animation: czdot 2s infinite; }
@keyframes czdot { 0%{box-shadow:0 0 0 0 rgba(70,208,111,.5)} 70%{box-shadow:0 0 0 6px rgba(70,208,111,0)} 100%{box-shadow:0 0 0 0 rgba(70,208,111,0)} }
.cz-head__x { width: 34px; height: 34px; border-radius: 50%; color: var(--cream); display: grid; place-items: center; flex: none; transition: background .2s; }
.cz-head__x:hover { background: rgba(255,255,255,.12); }

/* messages */
.cz-body { flex: 1; overflow-y: auto; padding: 18px 16px; display: flex; flex-direction: column; gap: 14px; scroll-behavior: smooth; }
.cz-body::-webkit-scrollbar { width: 7px; }
.cz-body::-webkit-scrollbar-thumb { background: var(--line); border-radius: 4px; }
.cz-msg { display: flex; gap: 9px; max-width: 88%; animation: czin .35s ease; }
@keyframes czin { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.cz-msg__av { width: 28px; height: 28px; flex: none; border-radius: 50%; overflow: hidden; }
.cz-msg__b { padding: 11px 14px; border-radius: 14px; font-size: .94rem; line-height: 1.5; }
.cz-msg.bot { align-self: flex-start; }
.cz-msg.bot .cz-msg__b { background: var(--paper); border: 1px solid var(--line); border-top-left-radius: 4px; color: var(--ink); }
.cz-msg.me { align-self: flex-end; flex-direction: row-reverse; }
.cz-msg.me .cz-msg__b { background: linear-gradient(135deg, var(--saffron), var(--saffron-deep)); color: #fff; border-top-right-radius: 4px; }
.cz-msg__b p { margin: 0 0 7px; } .cz-msg__b p:last-child { margin: 0; }
.cz-msg__b strong { font-weight: 700; }
.cz-msg__b ul { margin: 6px 0; padding-left: 16px; list-style: disc; }
.cz-msg__b a { color: var(--saffron); font-weight: 600; text-decoration: underline; }
.cz-msg.me .cz-msg__b a { color: #fff; }

/* typing */
.cz-typing { display: inline-flex; gap: 4px; padding: 4px 2px; }
.cz-typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--ink-faint); animation: cztype 1.2s infinite; }
.cz-typing span:nth-child(2){animation-delay:.2s} .cz-typing span:nth-child(3){animation-delay:.4s}
@keyframes cztype { 0%,60%,100%{transform:translateY(0);opacity:.4} 30%{transform:translateY(-4px);opacity:1} }

/* quick chips + action buttons */
.cz-chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 16px 8px; }
.cz-chip {
  padding: 8px 13px; border: 1px solid var(--gold-soft); background: var(--paper);
  border-radius: 30px; font-size: .82rem; font-weight: 600; color: var(--maroon);
  transition: .2s; white-space: nowrap;
}
.cz-chip:hover { background: var(--maroon); color: var(--cream); border-color: var(--maroon); }
.cz-act { display: inline-flex; align-items: center; gap: 7px; margin-top: 8px; padding: 9px 15px; background: linear-gradient(135deg, var(--gold-light), var(--gold)); color: var(--maroon-deep); border-radius: 8px; font-weight: 700; font-size: .85rem; }
.cz-act:hover { filter: brightness(1.05); }

/* booking confirmation card */
.cz-confirm { background: var(--paper); border: 1px solid var(--gold); border-radius: 12px; padding: 16px; margin-top: 4px; box-shadow: var(--shadow-sm); }
.cz-confirm__h { display: flex; align-items: center; gap: 9px; color: #2f9e44; font-weight: 700; margin-bottom: 12px; font-family: var(--serif); font-size: 1.05rem; }
.cz-confirm__h .ck { width: 24px; height: 24px; border-radius: 50%; background: #2f9e44; color: #fff; display: grid; place-items: center; font-size: .8rem; flex: none; }
.cz-confirm__row { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px dashed var(--line); font-size: .9rem; }
.cz-confirm__row:last-child { border: none; }
.cz-confirm__row b { color: var(--ink); }
.cz-confirm__row span { color: var(--ink-soft); }

/* footer input */
.cz-foot { flex: none; padding: 12px 12px 14px; border-top: 1px solid var(--line); background: var(--paper); }
.cz-inputrow { display: flex; gap: 8px; align-items: flex-end; }
.cz-input {
  flex: 1; resize: none; max-height: 110px; min-height: 44px; padding: 12px 14px;
  border: 1.5px solid var(--line); border-radius: 12px; background: var(--cream);
  font-size: .92rem; line-height: 1.4; transition: border-color .2s;
}
.cz-input:focus { outline: none; border-color: var(--saffron); }
.cz-send {
  width: 44px; height: 44px; flex: none; border-radius: 12px;
  background: linear-gradient(135deg, var(--saffron), var(--saffron-deep)); color: #fff;
  display: grid; place-items: center; transition: transform .2s, opacity .2s;
}
.cz-send:hover { transform: translateY(-2px); }
.cz-send:disabled { opacity: .45; cursor: default; transform: none; }
.cz-foot__note { text-align: center; font-size: .68rem; color: var(--ink-faint); margin-top: 8px; }
.cz-foot__note a { color: var(--saffron); font-weight: 600; }

/* ============================================================
   NAMASTE AVATAR  (image + animation)
   ============================================================ */
.cz-launcher__ic { overflow: visible; }
.cz-launcher__ic img,
.cz-head__av img,
.cz-msg__av img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; border-radius: 50%; display: block;
}
.cz-launcher__ic img { background: #FBF6EC; }
.cz-head__av { position: relative; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 2px var(--gold-light); background: #FBF6EC; }
.cz-msg__av { position: relative; background: #FBF6EC; box-shadow: 0 0 0 1.5px var(--gold-soft); }

/* gentle breathing + occasional little bow */
@keyframes czidle {
  0%, 86%, 100% { transform: scale(1) rotate(0); }
  43%           { transform: scale(1.05) rotate(0); }
  90%           { transform: scale(1.03) rotate(-5deg); }
  94%           { transform: scale(1.03) rotate(5deg); }
}
.cz-launcher__ic img,
.cz-head__av img { animation: czidle 4.5s ease-in-out infinite; transform-origin: 50% 70%; }

/* each new bot message: a quick namaste bow */
@keyframes czbow {
  0%   { transform: translateY(-3px) rotate(-10deg); opacity: 0; }
  55%  { transform: translateY(0) rotate(5deg); opacity: 1; }
  100% { transform: none; }
}
.cz-msg.bot .cz-msg__av img { animation: czbow .6s ease both; transform-origin: 50% 75%; }
@media (prefers-reduced-motion: reduce) {
  .cz-launcher__ic img, .cz-head__av img, .cz-msg.bot .cz-msg__av img { animation: none; }
}