@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap');

:root{
  --gpd-stone-grey: #EDEDED;
  --gpd-regal-red:  #C8102E;
  --gpd-soft-grey:  #F5F5F5;
  --gpd-charcoal:   #3A3A3A;
  --gpd-white:      #FFFFFF;
  --gpd-border:     #DADADA;
  --gpd-red-tint:   #E03C31;
  --gpd-radius-lg: 12px;
  --gpd-radius-md: 10px;
  --gpd-shadow: 0 8px 24px rgba(0,0,0,.08);
  --gpd-send-btn-bg: #C8102E;
  --gpd-send-btn-icon: #FFFFFF;
}

.nova-ai-widget.pro, .nova-ai-widget.pro * {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--gpd-charcoal);
  box-sizing: border-box;
}

.nova-ai-widget.pro{ position:fixed; z-index:99999; }
.nova-fab{ width:60px; height:60px; border-radius:16px; border:1px solid var(--gpd-border); background:var(--gpd-white); box-shadow:var(--gpd-shadow); display:flex; align-items:center; justify-content:center; cursor:pointer; }
.nova-fab .icon svg{ width:26px; height:26px; fill:var(--gpd-regal-red); }
.nova-fab img { width: 100%; height: 100%; object-fit: cover; border-radius: 16px; }

.nova-panel{ position:fixed; width:380px; max-width:92vw; height:640px; max-height:80vh; display:none; flex-direction:column; background:var(--gpd-white); border:1px solid var(--gpd-border); border-radius:16px; box-shadow:var(--gpd-shadow); overflow:hidden; }
.nova-panel.open{ display:flex }
.nova-header{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px; border-bottom:1px solid var(--gpd-border); background:var(--gpd-stone-grey); }
.nova-logo{ width:34px; height:34px; border-radius:10px; object-fit:cover; background:var(--gpd-white); border:1px solid var(--gpd-border); }
.nova-logo.placeholder{ display:flex; align-items:center; justify-content:center; background:var(--gpd-regal-red); color:#fff; font-weight:700; }
.h-left{ display:flex; align-items:center; gap:10px; min-width:0 }
.titlewrap{ display:flex; flex-direction:column; line-height:1.15; min-width:0 }
.nova-title{ font-size:20px; font-weight:600; color:var(--gpd-regal-red); font-variant: small-caps; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.nova-sub{ font-size:12px; color:#6b7280; display:flex; align-items:center; gap:6px }
.status-dot{ width:8px; height:8px; border-radius:50%; background:#16a34a }
.h-actions{ display:flex; gap:8px; flex-shrink:0 }

.iconbtn{ background:var(--gpd-white); border:1px solid #C0C0C0; border-radius:10px; padding:6px; width:36px; height:36px; display:grid; place-items:center; cursor:pointer; transition: background 0.2s; }
.iconbtn:hover { background: #EAEAEA; }
.iconbtn .icon svg, .iconbtn svg{ width:20px; height:20px; stroke: #222 !important; fill:none; stroke-width:2.2 !important; color: #222 !important; }

.nova-msgs{ flex:1; overflow:auto; padding:12px 10px 8px; display:flex; flex-direction:column; gap:8px; background:#FAFAFA; }
.msg-row{ display:flex; gap:10px; align-items:flex-end }
.msg-row .avatar{ width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex:0 0 30px; overflow: hidden; }
.msg-row .avatar img { width: 100%; height: 100%; object-fit: cover; }
.msg-row.bot .avatar { background: var(--gpd-regal-red); color: #fff !important; }
.msg-row.bot .avatar .icon svg { width:18px; height:18px; fill: #ffffff !important; color: #ffffff !important; }
.msg-row.user .avatar { background: #111827; color: #fff !important; order: 2; }
.msg-row.user .avatar .icon svg { width:18px; height:18px; stroke: #ffffff !important; color: #ffffff !important; fill: none; }
.msg-row.user { justify-content: flex-end; }
.bubble{ max-width:76%; padding:10px 12px; border-radius:var(--gpd-radius-lg); line-height:1.5; word-wrap:break-word; overflow-wrap:anywhere; }
.msg-row.user .bubble{ background:var(--gpd-soft-grey); color:var(--gpd-charcoal); border:1px solid var(--gpd-border); border-top-right-radius:10px; order: 1; }
.msg-row.bot .bubble{ background:var(--gpd-regal-red); color:#fff; border:1px solid var(--gpd-regal-red); border-top-left-radius:10px; }
.msg-row.bot .bubble > div { color: #fff; }
.bubble.typing{ display:flex; gap:6px; align-items:center; }
.dot{ width:6px; height:6px; border-radius:50%; background:#fff; opacity:.7; animation:blink 1.2s infinite ease-in-out }
.dot:nth-child(2){ animation-delay:.2s } .dot:nth-child(3){ animation-delay:.4s }
@keyframes blink{ 0%,80%,100%{opacity:.4} 40%{opacity:1} }

.nova-composer{ display:flex; gap:8px; align-items:center; padding:10px 12px; border-top:1px solid var(--gpd-border); background: #fcfcfc; }
.nova-input{ flex:1; box-sizing: border-box; height: 48px; padding: 12px 20px; border-radius: 12px; border: 1px solid #D1D1D1; resize: none !important; overflow: hidden !important; white-space: nowrap !important; background: var(--gpd-white); font-size:16px; line-height: 24px !important; color: var(--gpd-charcoal); transition: border-color .2s ease, box-shadow .2s ease; }
.nova-input:focus{ outline:none; border-color: var(--gpd-regal-red); box-shadow:0 0 0 3px rgba(200,16,46,.12); }
.nova-send{ width: 48px; height: 48px; border: none; border-radius: 12px; background:var(--gpd-send-btn-bg); display:grid; place-items:center; cursor:pointer; flex-shrink: 0; }
.nova-send .icon svg{ width:20px; height:20px; fill:var(--gpd-send-btn-icon); }
.nova-send:hover{ opacity: 0.9; }

.nova-lead{ position:absolute; left:0; right:0; bottom:0; display:none; flex-direction:column; gap:12px; background:var(--gpd-white); padding:16px; border-top:1px solid var(--gpd-border); max-height:100%; overflow-y:auto; -webkit-overflow-scrolling: touch; }
.nova-panel.contact-open .nova-lead{ display:flex; }
.nova-panel.contact-open .nova-composer { display: none; }
.nova-lead-header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:4px; }
.nova-lead-header h3{ margin:0; font-size:18px; font-weight:600; }
.nova-lead-close{ background:var(--gpd-white); border:1px solid var(--gpd-border); width:32px; height:32px; border-radius:8px; display:grid; place-items:center; cursor:pointer; }
.nova-lead-close .icon svg, .nova-lead-close svg { stroke: var(--gpd-charcoal) !important; stroke-width: 2.5; width: 16px; height: 16px; }

.nova-lead input[type="text"], .nova-lead input[type="email"], .nova-lead input[type="tel"], .nova-lead select, .nova-lead textarea {
  width: 100%; padding:10px 12px; border-radius:10px; border:1px solid var(--gpd-border); background:var(--gpd-white); font-size:16px; color: var(--gpd-charcoal);
}
.nova-lead textarea { resize: vertical; min-height: 60px; font-family: inherit; }
.nova-lead select { -webkit-appearance: none; appearance: none; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e"); background-position: right .5rem center; background-repeat: no-repeat; background-size: 1.5em 1.5em; padding-right: 2.5rem; }
.nova-lead div > p { margin: 0 0 4px; font-weight: 500; font-size: 15px; }
.nova-lead div > label { display: inline-flex; align-items: center; gap: 6px; margin-right: 16px; font-size: 15px; }
.nova-lead input[type="radio"], .nova-lead input[type="checkbox"] { width: 1em; height: 1em; accent-color: var(--gpd-regal-red); }
.checkbox-group { display: flex; flex-direction: column; gap: 8px; padding: 8px; border: 1px solid var(--gpd-border); border-radius: 10px; background: #fafafa; }
.checkbox-group label { margin: 0; display: flex; align-items: center; gap: 8px; font-size: 15px; cursor: pointer; }
.nova-lead .consent { font-size: 14px; }
.nova-lead .consent a { color: var(--gpd-regal-red); text-decoration: underline; }
.nova-lead .nova-lead-btn{ padding:11px 14px; border:none; border-radius:12px; background:var(--gpd-regal-red); color:#fff; cursor:pointer; font-size:16px; font-weight:500; }
.nova-lead .nova-lead-btn:hover{ background:var(--gpd-red-tint) }
.nova-lead input:focus, .nova-lead select:focus, .nova-lead textarea:focus { outline: none; border-color: var(--gpd-regal-red); box-shadow: 0 0 0 3px rgba(200, 16, 46, .14); }
@media (max-width: 480px){ .nova-panel{ width: calc(100vw - 24px); height: 75vh; } .nova-fab{ width:56px; height:56px; } }