/* ============================================================
   Alito Holdings AI Chatbot — chatbot.css  v1.2.3
   ALL rules scoped under #alito-chat-root to prevent
   WordPress theme styles from bleeding in or out.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=DM+Sans:wght@400;500;600&display=swap');

#alito-chat-root,
#alito-chat-root *,
#alito-chat-root *::before,
#alito-chat-root *::after {
  box-sizing: border-box !important;
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  line-height: normal;
}

#alito-chat-root {
  --ac-navy:      #0f1f3d;
  --ac-gold:      #c9a84c;
  --ac-gold2:     #a8852e;
  --ac-cream:     #f9f6f0;
  --ac-chat:      #f3efe8;
  --ac-border:    #e4ddd2;
  --ac-gray:      #7a8394;
  --ac-white:     #ffffff;
  --ac-green:     #3d9e5f;
  --ac-shadow:    0 24px 64px rgba(15,31,61,0.22);
  --ac-shadow-sm: 0 2px 10px rgba(15,31,61,0.08);
}

/* TRIGGER */
#alito-trigger {
  position: fixed !important; bottom: 28px !important; right: 28px !important;
  width: 64px !important; height: 64px !important;
  background: linear-gradient(145deg, var(--ac-gold), var(--ac-gold2)) !important;
  border-radius: 50% !important; border: none !important; cursor: pointer !important;
  box-shadow: 0 8px 30px rgba(201,168,76,0.45) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  transition: transform .25s ease, box-shadow .25s ease !important;
  z-index: 2147483646 !important; padding: 0 !important; margin: 0 !important;
  outline: none !important; text-decoration: none !important;
}
#alito-trigger:hover { transform: scale(1.08) !important; box-shadow: 0 12px 42px rgba(201,168,76,0.55) !important; }
#alito-trigger::before {
  content: '' !important; position: absolute !important; inset: 0 !important;
  border-radius: 50% !important; background: var(--ac-gold) !important; opacity: 0.22 !important;
  animation: alito-pulse 2.8s ease-out infinite !important; pointer-events: none !important;
}
@keyframes alito-pulse { 0%{transform:scale(1);opacity:.22} 70%{transform:scale(1.65);opacity:0} 100%{transform:scale(1.65);opacity:0} }

.alito-icon-chat, .alito-icon-close {
  position: absolute !important; width: 26px !important; height: 26px !important;
  fill: white !important; transition: opacity .2s, transform .2s !important; display: block !important;
}
.alito-icon-chat  { opacity: 1 !important; transform: scale(1) !important; }
.alito-icon-close { opacity: 0 !important; transform: scale(.5) !important; }
#alito-trigger.open .alito-icon-chat  { opacity: 0 !important; transform: scale(.5) !important; }
#alito-trigger.open .alito-icon-close { opacity: 1 !important; transform: scale(1) !important; }

/* WINDOW */
#alito-window {
  position: fixed !important; bottom: 108px !important; right: 28px !important;
  width: 390px !important; height: 600px !important; max-height: calc(100vh - 140px) !important; min-height: 0 !important;
  background: var(--ac-white) !important; border-radius: 22px !important;
  box-shadow: var(--ac-shadow) !important; display: flex !important; flex-direction: column !important;
  overflow: hidden !important; z-index: 2147483645 !important;
  transform: translateY(24px) scale(.94) !important; opacity: 0 !important; pointer-events: none !important;
  transition: all .32s cubic-bezier(.34,1.56,.64,1) !important;
  border: none !important; text-align: left !important; float: none !important;
  top: auto !important; left: auto !important;
}
#alito-window.open { transform: translateY(0) scale(1) !important; opacity: 1 !important; pointer-events: all !important; }

/* HEADER */
#alito-window .alito-header {
  background: var(--ac-navy) !important; padding: 16px 18px !important; flex-shrink: 0 !important;
  display: flex !important; align-items: center !important; gap: 12px !important;
  border-radius: 0 !important; border: none !important; margin: 0 !important; width: 100% !important;
}
#alito-window .alito-avatar {
  width: 42px !important; height: 42px !important; min-width: 42px !important;
  background: linear-gradient(145deg, var(--ac-gold), var(--ac-gold2)) !important;
  border-radius: 50% !important; display: flex !important; align-items: center !important;
  justify-content: center !important; font-family: 'DM Serif Display', serif !important;
  font-style: italic !important; color: white !important; font-size: 19px !important;
  flex-shrink: 0 !important; border: none !important;
}
#alito-window .alito-header-name {
  font-family: 'DM Serif Display', serif !important; color: white !important;
  font-size: 15px !important; letter-spacing: .3px !important; display: block !important; line-height: 1.3 !important;
}
#alito-window .alito-header-status {
  display: flex !important; align-items: center !important; gap: 5px !important;
  font-size: 11px !important; color: rgba(255,255,255,0.5) !important; margin-top: 2px !important;
}
#alito-window .alito-dot {
  width: 7px !important; height: 7px !important; background: #4caf50 !important;
  border-radius: 50% !important; display: inline-block !important;
  animation: alito-blink 2s infinite !important; flex-shrink: 0 !important;
}
@keyframes alito-blink { 0%,100%{opacity:1} 50%{opacity:.3} }

/* LEAD SCREEN */
#alito-lead-screen {
  flex: 1 !important; padding: 24px 22px !important; background: var(--ac-cream) !important;
  flex-direction: column !important; overflow-y: auto !important;
  min-height: 0 !important; border-radius: 0 !important; margin: 0 !important;
}
#alito-lead-screen { display: flex; }
#alito-lead-screen.alito-hidden { display: none !important; }
#alito-lead-screen .alito-lead-title {
  font-family: 'DM Serif Display', serif !important; font-size: 22px !important;
  color: var(--ac-navy) !important; line-height: 1.3 !important; margin: 0 0 6px !important;
  padding: 0 !important; border: none !important; background: none !important;
}
#alito-lead-screen .alito-lead-sub {
  font-size: 13px !important; color: var(--ac-gray) !important; line-height: 1.55 !important;
  margin: 0 0 20px !important; padding: 0 !important;
}
#alito-lead-screen .alito-lf { margin-bottom: 13px !important; }
#alito-lead-screen .alito-lf label {
  display: block !important; font-size: 11px !important; font-weight: 600 !important;
  letter-spacing: .7px !important; text-transform: uppercase !important;
  color: var(--ac-navy) !important; margin: 0 0 5px !important; padding: 0 !important; line-height: 1.4 !important;
}
#alito-lead-screen .alito-lf input {
  display: block !important; width: 100% !important; padding: 10px 13px !important;
  border: 1.5px solid var(--ac-border) !important; border-radius: 9px !important;
  font-family: 'DM Sans', sans-serif !important; font-size: 13.5px !important;
  color: var(--ac-navy) !important; background: white !important; outline: none !important;
  transition: border-color .2s !important; box-shadow: none !important; margin: 0 !important;
  height: auto !important; line-height: 1.4 !important; -webkit-appearance: none !important;
}
#alito-lead-screen .alito-lf input:focus { border-color: var(--ac-gold) !important; box-shadow: 0 0 0 3px rgba(201,168,76,0.12) !important; }
#alito-lead-screen .alito-lf input::placeholder { color: var(--ac-gray) !important; opacity: 1 !important; }
#alito-lead-screen .alito-primary-btn {
  display: block !important; width: 100% !important; padding: 13px !important;
  background: linear-gradient(135deg, var(--ac-gold), var(--ac-gold2)) !important;
  color: white !important; border: none !important; border-radius: 11px !important;
  font-family: 'DM Sans', sans-serif !important; font-size: 14px !important; font-weight: 600 !important;
  cursor: pointer !important; margin: 4px 0 0 !important; box-shadow: 0 4px 16px rgba(201,168,76,0.35) !important;
  transition: transform .2s, box-shadow .2s !important; text-align: center !important;
  line-height: 1.4 !important; -webkit-appearance: none !important;
}
#alito-lead-screen .alito-primary-btn:hover { transform: translateY(-1px) !important; box-shadow: 0 6px 22px rgba(201,168,76,0.45) !important; }
#alito-lead-screen .alito-privacy {
  font-size: 11px !important; color: var(--ac-gray) !important; text-align: center !important;
  margin: 10px 0 0 !important; padding: 0 !important; line-height: 1.45 !important;
}

/* MESSAGES */
#alito-messages {
  flex: 1 !important; overflow-y: auto !important; padding: 14px 13px 8px !important;
  background: var(--ac-chat) !important; flex-direction: column !important;
  gap: 10px !important; scroll-behavior: smooth !important; min-height: 0 !important;
  border-radius: 0 !important; margin: 0 !important;
}
#alito-messages { display: none; }
#alito-messages.alito-show { display: flex !important; }
#alito-messages::-webkit-scrollbar { width: 4px; }
#alito-messages::-webkit-scrollbar-thumb { background: var(--ac-border); border-radius: 4px; }

#alito-messages .alito-msg {
  max-width: 88% !important; animation: alito-fadeup .28s ease forwards !important;
  display: flex !important; flex-direction: column !important;
}
@keyframes alito-fadeup { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
#alito-messages .alito-msg.bot  { align-self: flex-start !important; }
#alito-messages .alito-msg.user { align-self: flex-end !important; }

#alito-messages .alito-bubble {
  padding: 11px 14px !important; border-radius: 16px !important; font-size: 13.5px !important;
  line-height: 1.6 !important; word-break: break-word !important; overflow-wrap: break-word !important; display: block !important;
}
#alito-messages .alito-msg.bot .alito-bubble {
  background: white !important; color: var(--ac-navy) !important;
  border-bottom-left-radius: 4px !important; box-shadow: var(--ac-shadow-sm) !important;
}
#alito-messages .alito-msg.user .alito-bubble {
  background: var(--ac-navy) !important; color: white !important;
  border-bottom-right-radius: 4px !important; box-shadow: none !important;
}
#alito-messages .alito-bubble strong { font-weight: 700 !important; }
#alito-messages .alito-bubble em     { font-style: italic !important; }
#alito-messages .alito-bubble h3 {
  font-family: 'DM Serif Display', serif !important; font-size: 14px !important;
  color: var(--ac-navy) !important; margin: 10px 0 5px !important; padding-bottom: 3px !important;
  border-bottom: 1px solid var(--ac-border) !important; display: block !important;
}
#alito-messages .alito-bubble ul { padding-left: 18px !important; margin: 6px 0 !important; list-style: disc !important; }
#alito-messages .alito-bubble ul li { margin-bottom: 3px !important; }
#alito-messages .alito-bubble a { color: var(--ac-gold) !important; text-decoration: underline !important; }
#alito-messages .alito-bubble p { margin-bottom: 6px !important; display: block !important; }
#alito-messages .alito-bubble p:last-child { margin-bottom: 0 !important; }
#alito-messages .alito-msg.user .alito-bubble h3 { color: white !important; border-color: rgba(255,255,255,.2) !important; }
#alito-messages .alito-time {
  font-size: 10px !important; color: var(--ac-gray) !important; margin-top: 4px !important;
  padding: 0 4px !important; display: block !important;
}
#alito-messages .alito-msg.user .alito-time { text-align: right !important; }

/* QUICK REPLIES */
#alito-messages .alito-qr-wrap {
  display: flex !important; flex-wrap: wrap !important; gap: 6px !important;
  align-self: flex-start !important; animation: alito-fadeup .35s ease forwards !important; max-width: 100% !important;
}
#alito-messages .alito-qr {
  background: white !important; border: 1.5px solid var(--ac-gold) !important;
  color: var(--ac-navy) !important; font-family: 'DM Sans', sans-serif !important;
  font-size: 12px !important; font-weight: 500 !important; padding: 6px 13px !important;
  border-radius: 20px !important; cursor: pointer !important; white-space: nowrap !important;
  transition: all .18s ease !important; line-height: 1.4 !important; -webkit-appearance: none !important;
}
#alito-messages .alito-qr:hover { background: var(--ac-gold) !important; color: white !important; transform: translateY(-1px) !important; }

/* TYPING */
#alito-messages .alito-typing {
  align-self: flex-start !important; background: white !important; border-radius: 16px !important;
  border-bottom-left-radius: 4px !important; padding: 11px 15px !important;
  box-shadow: var(--ac-shadow-sm) !important; display: flex !important; gap: 4px !important; align-items: center !important;
}
#alito-messages .alito-tdot {
  width: 7px !important; height: 7px !important; background: var(--ac-gold) !important;
  border-radius: 50% !important; animation: alito-bounce 1.2s infinite !important; display: inline-block !important;
}
#alito-messages .alito-tdot:nth-child(2) { animation-delay: .2s !important; }
#alito-messages .alito-tdot:nth-child(3) { animation-delay: .4s !important; }
@keyframes alito-bounce { 0%,60%,100%{transform:translateY(0)} 30%{transform:translateY(-7px)} }

/* TOUR CARD */
#alito-messages .alito-tour-card {
  align-self: flex-start !important; width: 100% !important; max-width: 330px !important;
  background: white !important; border-radius: 14px !important; border: 1.5px solid var(--ac-border) !important;
  box-shadow: var(--ac-shadow-sm) !important; animation: alito-fadeup .3s ease forwards !important;
  overflow: visible !important;
}
#alito-messages .alito-tour-head {
  background: var(--ac-navy) !important; color: white !important; padding: 11px 15px !important;
  font-family: 'DM Serif Display', serif !important; font-size: 14px !important;
  display: flex !important; align-items: center !important; gap: 8px !important;
  border-radius: 12px 12px 0 0 !important;
}
#alito-messages .alito-tour-head svg { width: 15px !important; height: 15px !important; fill: var(--ac-gold) !important; flex-shrink: 0 !important; }
#alito-messages .alito-tour-body { padding: 14px !important; }
#alito-messages .alito-tf { margin-bottom: 10px !important; }
#alito-messages .alito-tf label {
  display: block !important; font-size: 10px !important; font-weight: 600 !important;
  letter-spacing: .7px !important; text-transform: uppercase !important; color: var(--ac-gray) !important;
  margin: 0 0 4px !important; padding: 0 !important;
}
#alito-messages .alito-tf select,
#alito-messages .alito-tf input[type="date"] {
  width: 100% !important; padding: 8px 11px !important; border: 1.5px solid var(--ac-border) !important;
  border-radius: 8px !important; font-family: 'DM Sans', sans-serif !important; font-size: 13px !important;
  color: var(--ac-navy) !important; background: var(--ac-cream) !important; outline: none !important;
  transition: border-color .2s !important; -webkit-appearance: none !important; height: auto !important;
  margin: 0 !important; box-shadow: none !important; display: block !important;
}
#alito-messages .alito-tf select:focus,
#alito-messages .alito-tf input[type="date"]:focus { border-color: var(--ac-gold) !important; }
#alito-messages .alito-tour-submit {
  display: block !important; width: 100% !important; padding: 11px !important;
  background: linear-gradient(135deg, var(--ac-gold), var(--ac-gold2)) !important;
  color: white !important; border: none !important; border-radius: 8px !important;
  font-family: 'DM Sans', sans-serif !important; font-size: 13.5px !important; font-weight: 600 !important;
  cursor: pointer !important; box-shadow: 0 3px 12px rgba(201,168,76,.3) !important;
  transition: transform .2s, box-shadow .2s !important; margin: 4px 0 0 !important;
  text-align: center !important; -webkit-appearance: none !important; line-height: 1.4 !important;
}
#alito-messages .alito-tour-submit:hover { transform: translateY(-1px) !important; box-shadow: 0 5px 16px rgba(201,168,76,.4) !important; }
#alito-messages .alito-tour-submit:disabled { opacity: .5 !important; cursor: not-allowed !important; transform: none !important; }

/* SUCCESS */
#alito-messages .alito-success {
  align-self: flex-start !important; background: var(--ac-green) !important; color: white !important;
  padding: 10px 14px !important; border-radius: 10px !important; font-size: 13px !important;
  font-weight: 500 !important; display: flex !important; align-items: center !important;
  gap: 8px !important; animation: alito-fadeup .3s ease forwards !important;
}
#alito-messages .alito-success svg { width: 16px !important; height: 16px !important; fill: white !important; flex-shrink: 0 !important; }

/* INPUT AREA */
#alito-input-area {
  padding: 10px 12px 8px !important; background: white !important;
  border-top: 1px solid var(--ac-border) !important;
  gap: 9px !important; align-items: flex-end !important; flex-shrink: 0 !important;
  margin: 0 !important; border-radius: 0 !important;
}
#alito-input-area { display: none; }
#alito-input-area.alito-show { display: flex !important; }
#alito-input {
  flex: 1 !important; border: 1.5px solid var(--ac-border) !important; border-radius: 11px !important;
  padding: 9px 13px !important; font-family: 'DM Sans', sans-serif !important; font-size: 13.5px !important;
  color: var(--ac-navy) !important; background: var(--ac-cream) !important; resize: none !important;
  outline: none !important; max-height: 90px !important; min-height: 40px !important;
  line-height: 1.45 !important; transition: border-color .2s !important; box-shadow: none !important;
  display: block !important; -webkit-appearance: none !important; overflow-y: auto !important;
}
#alito-input:focus { border-color: var(--ac-gold) !important; box-shadow: none !important; }
#alito-input::placeholder { color: var(--ac-gray) !important; opacity: 1 !important; }

#alito-send {
  width: 40px !important; height: 40px !important; min-width: 40px !important; flex-shrink: 0 !important;
  background: linear-gradient(145deg, var(--ac-gold), var(--ac-gold2)) !important;
  border: none !important; border-radius: 11px !important; cursor: pointer !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  box-shadow: 0 4px 14px rgba(201,168,76,.35) !important; transition: transform .2s, box-shadow .2s !important;
  padding: 0 !important; margin: 0 !important; -webkit-appearance: none !important;
}
#alito-send:hover { transform: scale(1.06) !important; box-shadow: 0 6px 20px rgba(201,168,76,.45) !important; }
#alito-send:disabled { opacity: .45 !important; cursor: not-allowed !important; transform: none !important; }
#alito-send svg { width: 17px !important; height: 17px !important; fill: white !important; display: block !important; }

/* POWERED BY */
#alito-powered {
  text-align: center !important; font-size: 10px !important; color: #aaa !important;
  padding: 5px 0 7px !important; background: white !important;
  margin: 0 !important; border: none !important; line-height: 1.4 !important;
}
#alito-powered { display: none; }
#alito-powered.alito-show { display: block !important; }
#alito-powered a { color: var(--ac-gold) !important; text-decoration: none !important; font-weight: 600 !important; }
#alito-powered a:hover { text-decoration: underline !important; }

@media (max-width: 440px) {
  #alito-window { width: calc(100vw - 16px) !important; right: 8px !important; bottom: 96px !important; }
  #alito-trigger { bottom: 16px !important; right: 16px !important; }
}

/* Logo image in avatar */
#alito-window .alito-avatar img {
  width: 30px !important;
  height: auto !important;
  display: block !important;
  object-fit: contain !important;
  filter: brightness(0) invert(1) !important;
}