/* Clearview AI assistant widget. Uses the landing-page tokens (--navy, --gold, --cream) with fallbacks. */
.cva-launcher {
  position: fixed; right: 20px; bottom: 20px; z-index: 9998;
  display: flex; align-items: center; gap: 10px;
  padding: 14px 20px 14px 16px; border: 0; border-radius: 999px;
  background: var(--gold, #c9a227); color: var(--navy-dark, #0f2840);
  font: 600 16px/1 'Source Sans 3', system-ui, sans-serif;
  box-shadow: 0 10px 30px rgba(15, 40, 64, .35); cursor: pointer;
  transition: transform .2s, box-shadow .2s;
}
.cva-launcher:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(15, 40, 64, .45); }
.cva-launcher .cva-spark {
  width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center;
  background: var(--navy-dark, #0f2840); color: var(--gold-light, #e8c84a); font-size: 16px;
}
.cva-launcher.cva-hidden, .cva-launcher.cva-inline-visible { display: none; }
.cva-label { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; text-align: left; }
.cva-label b { font-weight: 700; font-size: 16px; }
.cva-short { display: none; }
.cva-label small { font-size: 13px; font-weight: 600; color: var(--navy, #1a3a5c); }

.cva-teaser {
  position: fixed; right: 20px; bottom: 88px; z-index: 9998; max-width: 290px;
  padding: 14px 34px 14px 16px; border-radius: 14px; background: #fff; cursor: pointer;
  border: 1px solid rgba(201, 162, 39, .5); box-shadow: 0 12px 34px rgba(15, 40, 64, .25);
  font: 15px/1.4 'Source Sans 3', system-ui, sans-serif; color: var(--text, #2d3748);
  opacity: 0; transform: translateY(8px); pointer-events: none; transition: opacity .3s, transform .3s;
}
.cva-teaser.cva-teaser-show { opacity: 1; transform: none; pointer-events: auto; }
.cva-teaser strong { display: block; margin-bottom: 4px; font: 600 16px/1.3 'Playfair Display', Georgia, serif; color: var(--navy, #1a3a5c); }
.cva-teaser-x {
  position: absolute; top: 6px; right: 6px; width: 26px; height: 26px; border: 0; border-radius: 50%;
  background: transparent; color: var(--gray, #6b7280); font-size: 13px; cursor: pointer;
}

.cva-inline {
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
  max-width: 1100px; margin: 28px auto; padding: 22px 26px;
  background: var(--cream, #faf8f3); border: 1px solid rgba(201, 162, 39, .45); border-radius: 16px;
  font-family: 'Source Sans 3', system-ui, sans-serif; color: var(--text, #2d3748);
}
.cva-inline-icon { font-size: 30px; }
.cva-inline-text { flex: 1 1 260px; }
.cva-inline-text strong { display: block; font: 600 21px/1.3 'Playfair Display', Georgia, serif; color: var(--navy, #1a3a5c); margin-bottom: 4px; }
.cva-inline-text span { font-size: 16px; color: var(--gray, #6b7280); }
.cva-inline button {
  padding: 13px 22px; border: 0; border-radius: 10px; cursor: pointer;
  background: var(--gold, #c9a227); color: var(--navy-dark, #0f2840); font: 700 16px/1 'Source Sans 3', system-ui, sans-serif;
}

.cva-panel {
  position: fixed; right: 20px; bottom: 20px; z-index: 9999;
  width: 400px; height: min(660px, calc(100vh - 40px));
  display: none; flex-direction: column; overflow: hidden;
  background: #fff; border-radius: 18px; box-shadow: 0 20px 60px rgba(15, 40, 64, .35);
  font: 16px/1.45 'Source Sans 3', system-ui, sans-serif; color: var(--text, #2d3748);
}
.cva-panel.cva-open { display: flex; }
.cva-head {
  display: flex; align-items: center; gap: 12px; padding: 14px 16px;
  background: var(--navy, #1a3a5c); color: #fff;
}
.cva-head .cva-spark { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--gold, #c9a227); color: var(--navy-dark, #0f2840); }
.cva-head-text { flex: 1; min-width: 0; }
.cva-head-text strong { display: block; font: 600 18px/1.2 'Playfair Display', Georgia, serif; }
.cva-head-text span { font-size: 13px; opacity: .8; }
.cva-head a, .cva-head button {
  color: #fff; background: rgba(255, 255, 255, .12); border: 0; border-radius: 8px;
  height: 34px; min-width: 34px; padding: 0 10px; display: grid; place-items: center;
  font-size: 14px; font-weight: 600; font-family: inherit; text-decoration: none; cursor: pointer;
}

.cva-log { flex: 1; overflow-y: auto; padding: 16px; background: var(--cream, #faf8f3); display: flex; flex-direction: column; gap: 10px; }
.cva-msg { max-width: 86%; padding: 10px 14px; border-radius: 16px; white-space: pre-wrap; word-wrap: break-word; }
.cva-bot { align-self: flex-start; background: #fff; border: 1px solid #e8e3d6; border-bottom-left-radius: 4px; }
.cva-user { align-self: flex-end; background: var(--navy, #1a3a5c); color: #fff; border-bottom-right-radius: 4px; }
.cva-user img { display: block; max-width: 100%; border-radius: 10px; margin-bottom: 6px; }
.cva-video { align-self: stretch; background: #fff; border: 1px solid #e8e3d6; border-radius: 14px; overflow: hidden; }
.cva-video iframe { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; }
.cva-video span { display: block; padding: 8px 12px; font-size: 14px; color: var(--gray, #6b7280); }
.cva-done { align-self: stretch; padding: 14px; border-radius: 14px; background: #eef7ef; border: 1px solid #b9dfbf; color: #1d5a2a; font-weight: 600; }
.cva-typing { align-self: flex-start; padding: 12px 14px; background: #fff; border: 1px solid #e8e3d6; border-radius: 16px; display: flex; gap: 4px; }
.cva-typing i { width: 7px; height: 7px; border-radius: 50%; background: #b8b0a0; animation: cva-bounce 1.2s infinite; }
.cva-typing i:nth-child(2) { animation-delay: .15s; } .cva-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes cva-bounce { 0%, 60%, 100% { transform: translateY(0); opacity: .5; } 30% { transform: translateY(-4px); opacity: 1; } }

.cva-chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 16px 12px; background: var(--cream, #faf8f3); }
.cva-chips button {
  padding: 8px 12px; border-radius: 999px; border: 1px solid var(--gold, #c9a227); background: #fff;
  color: var(--navy, #1a3a5c); font: 600 14px/1.2 'Source Sans 3', system-ui, sans-serif; cursor: pointer;
}
.cva-chips button:hover { background: #fdf6df; }

.cva-compose { display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px; border-top: 1px solid #ece7da; background: #fff; }
.cva-compose textarea {
  flex: 1; resize: none; max-height: 120px; padding: 10px 12px; border: 1px solid #d9d3c4; border-radius: 12px;
  font: 16px/1.4 'Source Sans 3', system-ui, sans-serif; color: inherit; outline: none;
}
.cva-compose textarea:focus { border-color: var(--gold, #c9a227); }
.cva-icon-btn {
  width: 42px; height: 42px; flex: none; border-radius: 12px; border: 0; cursor: pointer;
  display: grid; place-items: center; font-size: 19px;
}
.cva-photo { background: #f1ede2; color: var(--navy, #1a3a5c); }
.cva-send { background: var(--gold, #c9a227); color: var(--navy-dark, #0f2840); font-weight: 700; }
.cva-send:disabled { opacity: .5; cursor: default; }
.cva-foot { padding: 0 12px 10px; background: #fff; font-size: 12px; color: var(--gray, #6b7280); text-align: center; }

@media (max-width: 600px) {
  /* Phones: a round icon beside the site's centered Call Now button. */
  .cva-launcher { right: 14px; bottom: 22px; padding: 8px 14px 8px 8px; }
  .cva-short { display: inline; font-weight: 700; font-size: 15px; }
  .cva-launcher .cva-label { display: none; }
  .cva-launcher .cva-spark { width: 38px; height: 38px; font-size: 18px; }
  .cva-teaser { right: 14px; left: 14px; bottom: 84px; max-width: none; }
  .cva-panel { inset: 0; width: auto; height: 100%; border-radius: 0; right: 0; bottom: 0; }
}

/* Hero button next to "Get Estimate" and "Call". White so it reads on photo and navy heroes alike. */
.cva-has-ai .cva-hero-btn { background: #fff; color: var(--navy-dark, #0f2840); box-shadow: 0 4px 16px rgba(15, 40, 64, .18); }
.cva-has-ai .cva-hero-btn:hover { background: #fdf6df; transform: translateY(-3px); }
.cva-hero-btn .cva-spark {
  width: 26px; height: 26px; border-radius: 50%; display: inline-grid; place-items: center;
  background: var(--navy-dark, #0f2840); color: var(--gold-light, #e8c84a); font-size: 14px;
}
@media (max-width: 768px) {
  .cva-has-ai { flex-wrap: wrap !important; } /* some pages force nowrap !important (about.html) */
  .cva-has-ai a.btn.cva-hero-btn { flex: 1 1 100%; justify-content: center; } /* beat page rules like .about-cta-bar .btn */
}

/* Booking card inside the chat */
.cva-book {
  align-self: stretch; display: flex; flex-wrap: wrap; gap: 10px 8px; padding: 14px;
  background: #fff; border: 1px solid var(--gold, #c9a227); border-radius: 14px;
}
.cva-book-title { flex: 1 1 100%; font: 600 18px/1.2 'Playfair Display', Georgia, serif; color: var(--navy, #1a3a5c); }
.cva-field { flex: 1 1 100%; display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 600; color: var(--gray, #6b7280); }
.cva-field.cva-half { flex: 1 1 calc(50% - 4px); min-width: 0; }
.cva-field input, .cva-field select {
  width: 100%; box-sizing: border-box; padding: 10px 11px; border: 1px solid #d9d3c4; border-radius: 10px; background: #fff;
  font: 16px/1.3 'Source Sans 3', system-ui, sans-serif; color: var(--text, #2d3748); /* 16px keeps iOS from zooming */
}
.cva-field input:focus, .cva-field select:focus { outline: none; border-color: var(--gold, #c9a227); box-shadow: 0 0 0 3px rgba(201, 162, 39, .18); }
.cva-times { display: flex; gap: 6px; }
.cva-times button {
  flex: 1; padding: 9px 4px; border-radius: 10px; border: 1px solid #d9d3c4; background: #fff; cursor: pointer;
  font: 600 14px/1 'Source Sans 3', system-ui, sans-serif; color: var(--navy, #1a3a5c);
}
.cva-times button.cva-on { background: var(--navy, #1a3a5c); border-color: var(--navy, #1a3a5c); color: #fff; }
.cva-book-err { flex: 1 1 100%; color: #b42318; font-size: 14px; font-weight: 600; }
.cva-book-err:empty { display: none; }
.cva-book-go {
  flex: 1 1 100%; padding: 14px; border: 0; border-radius: 12px; cursor: pointer;
  background: var(--gold, #c9a227); color: var(--navy-dark, #0f2840); font: 700 16px/1 'Source Sans 3', system-ui, sans-serif;
}
.cva-book-go:disabled { opacity: .6; cursor: default; }
.cva-book-note { flex: 1 1 100%; text-align: center; font-size: 13px; color: var(--gray, #6b7280); }

.cva-field input.cva-flash { animation: cva-flash 1.6s ease-out; }
@keyframes cva-flash { 0% { background: #fdf0c4; border-color: var(--gold, #c9a227); } 100% { background: #fff; } }

.cva-mic { background: #f1ede2; color: var(--navy, #1a3a5c); }
.cva-mic.cva-listening { background: #b42318; color: #fff; animation: cva-pulse 1.2s infinite; }
@keyframes cva-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(180, 35, 24, .45); } 50% { box-shadow: 0 0 0 7px rgba(180, 35, 24, 0); } }

/* Google address suggestions must show above the chat panel */
.pac-container { z-index: 10001 !important; }
