/* ═══════════════════════════════════════════════════
   AI RDV Immo — Widget CSS
   Namespace : ARDVI
   ═══════════════════════════════════════════════════ */

:root {
  --ardvi-color      : #1A3C6E;
  --ardvi-color-light: #2E86C1;
  --ardvi-white      : #ffffff;
  --ardvi-bg         : #f8f9fa;
  --ardvi-border     : #dee2e6;
  --ardvi-text       : #2c3e50;
  --ardvi-muted      : #6c757d;
  --ardvi-error      : #e74c3c;
  --ardvi-success    : #27ae60;
  --ardvi-radius     : 16px;
  --ardvi-shadow     : 0 8px 32px rgba(0,0,0,.18);
  --ardvi-z          : 999999;
  --ardvi-w          : 380px;
  --ardvi-h          : 560px;
}

/* ── Conteneur principal ──────────────────────────── */
.ardvi-widget {
  position : fixed;
  bottom   : 24px;
  z-index  : var(--ardvi-z);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  font-size: 14px;
  line-height: 1.5;
}

.ardvi-pos-right { right: 24px; }
.ardvi-pos-left  { left : 24px; }

/* ── Bouton déclencheur ───────────────────────────── */
.ardvi-trigger {
  display        : flex;
  align-items    : center;
  gap            : 10px;
  background     : var(--ardvi-color);
  color          : var(--ardvi-white);
  border         : none;
  border-radius  : 50px;
  padding        : 14px 20px;
  cursor         : pointer;
  box-shadow     : 0 4px 16px rgba(0,0,0,.25);
  transition     : transform .2s, box-shadow .2s, background .2s;
  font-size      : 14px;
  font-weight    : 600;
}

.ardvi-trigger:hover,
.ardvi-trigger.ardvi-active {
  background  : var(--ardvi-color-light);
  transform   : translateY(-2px);
  box-shadow  : 0 6px 20px rgba(0,0,0,.3);
}

.ardvi-trigger-label { white-space: nowrap; }

/* ── Fenêtre de chat ──────────────────────────────── */
.ardvi-window {
  position      : absolute;
  bottom        : 72px;
  width         : var(--ardvi-w);
  height        : var(--ardvi-h);
  background    : var(--ardvi-white);
  border-radius : var(--ardvi-radius);
  box-shadow    : var(--ardvi-shadow);
  display       : flex;
  flex-direction: column;
  overflow      : hidden;
  opacity       : 0;
  transform     : translateY(16px) scale(.97);
  pointer-events: none;
  transition    : opacity .25s, transform .25s;
}

.ardvi-pos-right .ardvi-window { right : 0; }
.ardvi-pos-left  .ardvi-window { left  : 0; }

.ardvi-window.ardvi-open {
  opacity       : 1;
  transform     : translateY(0) scale(1);
  pointer-events: all;
}

/* ── Header ───────────────────────────────────────── */
.ardvi-header {
  display        : flex;
  align-items    : center;
  justify-content: space-between;
  padding        : 16px 18px;
  background     : var(--ardvi-color);
  color          : var(--ardvi-white);
  flex-shrink    : 0;
}

.ardvi-header-info {
  display    : flex;
  align-items: center;
  gap        : 10px;
}

.ardvi-avatar {
  width          : 38px;
  height         : 38px;
  border-radius  : 50%;
  background     : rgba(255,255,255,.25);
  display        : flex;
  align-items    : center;
  justify-content: center;
  font-weight    : 700;
  font-size      : 16px;
  flex-shrink    : 0;
}

.ardvi-header strong { display: block; font-size: 15px; }

.ardvi-status {
  font-size  : 12px;
  opacity    : .85;
}
.ardvi-status::before {
  content      : '●';
  color        : #2ecc71;
  margin-right : 4px;
  font-size    : 10px;
}

.ardvi-close {
  background  : transparent;
  border      : none;
  color       : var(--ardvi-white);
  font-size   : 18px;
  cursor      : pointer;
  opacity     : .8;
  line-height : 1;
  padding     : 4px;
  transition  : opacity .15s;
}
.ardvi-close:hover { opacity: 1; }

/* ── Bandeau RGPD ─────────────────────────────────── */
.ardvi-rgpd-banner {
  background : #fff8e1;
  border-bottom: 1px solid #ffe082;
  padding    : 14px 16px;
  flex-shrink: 0;
}
.ardvi-rgpd-banner p {
  margin     : 0 0 10px;
  font-size  : 12px;
  color      : var(--ardvi-text);
  line-height: 1.5;
}
.ardvi-rgpd-banner a { color: var(--ardvi-color); }

/* ── Messages ─────────────────────────────────────── */
.ardvi-messages {
  flex       : 1;
  overflow-y : auto;
  padding    : 16px;
  display    : flex;
  flex-direction: column;
  gap        : 10px;
  scroll-behavior: smooth;
}

.ardvi-messages::-webkit-scrollbar { width: 4px; }
.ardvi-messages::-webkit-scrollbar-thumb { background: var(--ardvi-border); border-radius: 2px; }

.ardvi-msg {
  display    : flex;
  align-items: flex-end;
  gap        : 8px;
  max-width  : 85%;
  animation  : ardviFadeIn .2s ease;
}

@keyframes ardviFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.ardvi-msg-agent { align-self: flex-start; }
.ardvi-msg-user  { align-self: flex-end; flex-direction: row-reverse; }

.ardvi-msg-avatar {
  width          : 30px;
  height         : 30px;
  border-radius  : 50%;
  background     : var(--ardvi-color);
  color          : var(--ardvi-white);
  display        : flex;
  align-items    : center;
  justify-content: center;
  font-size      : 12px;
  font-weight    : 700;
  flex-shrink    : 0;
}

.ardvi-msg-bubble {
  padding      : 10px 14px;
  border-radius: 18px;
  font-size    : 13.5px;
  line-height  : 1.5;
  word-break   : break-word;
}

.ardvi-msg-agent .ardvi-msg-bubble {
  background    : var(--ardvi-bg);
  color         : var(--ardvi-text);
  border-bottom-left-radius: 4px;
}

.ardvi-msg-user .ardvi-msg-bubble {
  background    : var(--ardvi-color);
  color         : var(--ardvi-white);
  border-bottom-right-radius: 4px;
}

.ardvi-msg-error .ardvi-msg-bubble {
  background : #fdecea;
  color      : var(--ardvi-error);
  border     : 1px solid #f5c6cb;
}

/* ── Indicateur de frappe ─────────────────────────── */
.ardvi-typing .ardvi-msg-bubble {
  display    : flex;
  align-items: center;
  gap        : 4px;
  padding    : 12px 16px;
}
.ardvi-typing .ardvi-msg-bubble span {
  width           : 7px;
  height          : 7px;
  border-radius   : 50%;
  background      : var(--ardvi-muted);
  animation       : ardviDot 1.2s infinite;
}
.ardvi-typing .ardvi-msg-bubble span:nth-child(2) { animation-delay: .2s; }
.ardvi-typing .ardvi-msg-bubble span:nth-child(3) { animation-delay: .4s; }

@keyframes ardviDot {
  0%, 60%, 100% { transform: translateY(0); opacity: .4; }
  30%           { transform: translateY(-5px); opacity: 1; }
}

/* ── Calendrier ───────────────────────────────────── */
.ardvi-calendar {
  border-top  : 1px solid var(--ardvi-border);
  padding     : 14px 16px;
  background  : var(--ardvi-bg);
  max-height  : 260px;
  overflow-y  : auto;
  flex-shrink : 0;
}

.ardvi-calendar-title {
  font-weight  : 600;
  font-size    : 13px;
  margin       : 0 0 10px;
  color        : var(--ardvi-text);
}

.ardvi-conseiller-list {
  display    : flex;
  flex-wrap  : wrap;
  gap        : 8px;
  margin-bottom: 12px;
}

.ardvi-conseiller-btn {
  background    : var(--ardvi-white);
  border        : 1.5px solid var(--ardvi-border);
  border-radius : 8px;
  padding       : 6px 12px;
  font-size     : 13px;
  cursor        : pointer;
  transition    : border-color .15s, background .15s;
  color         : var(--ardvi-text);
}

.ardvi-conseiller-btn:hover,
.ardvi-conseiller-btn.ardvi-selected {
  border-color : var(--ardvi-color);
  background   : #e8f0fb;
  color        : var(--ardvi-color);
  font-weight  : 600;
}

.ardvi-slot-group { margin-bottom: 12px; }

.ardvi-slot-date {
  font-size   : 12px;
  font-weight : 600;
  color       : var(--ardvi-muted);
  text-transform: capitalize;
  margin      : 0 0 6px;
}

.ardvi-slots-list {
  display    : flex;
  flex-wrap  : wrap;
  gap        : 6px;
}

.ardvi-slot-btn {
  background    : var(--ardvi-white);
  border        : 1.5px solid var(--ardvi-color-light);
  border-radius : 6px;
  padding       : 5px 10px;
  font-size     : 12px;
  color         : var(--ardvi-color);
  cursor        : pointer;
  font-weight   : 600;
  transition    : background .15s, color .15s;
}

.ardvi-slot-btn:hover {
  background : var(--ardvi-color);
  color      : var(--ardvi-white);
}

/* ── Footer / saisie ──────────────────────────────── */
.ardvi-footer {
  border-top  : 1px solid var(--ardvi-border);
  padding     : 12px 14px;
  flex-shrink : 0;
  background  : var(--ardvi-white);
}

.ardvi-rgpd-discret {
  font-size  : 10px;
  color      : var(--ardvi-muted);
  margin     : 0 0 8px;
  line-height: 1.4;
}
.ardvi-rgpd-discret a { color: var(--ardvi-color); }

.ardvi-input-row {
  display    : flex;
  align-items: flex-end;
  gap        : 8px;
}

.ardvi-input {
  flex       : 1;
  border     : 1.5px solid var(--ardvi-border);
  border-radius: 12px;
  padding    : 9px 14px;
  font-size  : 13.5px;
  resize     : none;
  outline    : none;
  font-family: inherit;
  line-height: 1.5;
  max-height : 120px;
  transition : border-color .15s;
  color      : var(--ardvi-text);
}
.ardvi-input:focus { border-color: var(--ardvi-color); }
.ardvi-input:disabled { background: #f1f3f5; color: var(--ardvi-muted); }

.ardvi-send-btn {
  width          : 40px;
  height         : 40px;
  border-radius  : 50%;
  background     : var(--ardvi-color);
  border         : none;
  color          : var(--ardvi-white);
  cursor         : pointer;
  display        : flex;
  align-items    : center;
  justify-content: center;
  flex-shrink    : 0;
  transition     : background .15s, transform .1s;
}
.ardvi-send-btn:hover:not(:disabled) {
  background : var(--ardvi-color-light);
  transform  : scale(1.05);
}
.ardvi-send-btn:disabled {
  background : var(--ardvi-border);
  cursor     : default;
}

/* ── Boutons génériques ───────────────────────────── */
.ardvi-btn {
  border        : none;
  border-radius : 8px;
  padding       : 9px 18px;
  font-size     : 13px;
  font-weight   : 600;
  cursor        : pointer;
  transition    : background .15s;
  font-family   : inherit;
}
.ardvi-btn-primary {
  background : var(--ardvi-color);
  color      : var(--ardvi-white);
}
.ardvi-btn-primary:hover { background: var(--ardvi-color-light); }

/* ── Loading ──────────────────────────────────────── */
.ardvi-loading {
  font-size  : 12px;
  color      : var(--ardvi-muted);
  text-align : center;
  padding    : 8px 0;
}

/* ── Admin back-office ────────────────────────────── */
.ardvi-admin { max-width: 1100px; }

.ardvi-kpi-grid {
  display              : grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap                  : 16px;
  margin               : 20px 0;
}

.ardvi-kpi {
  background    : #fff;
  border        : 1px solid var(--ardvi-border);
  border-radius : 10px;
  padding       : 20px;
  text-align    : center;
  box-shadow    : 0 2px 6px rgba(0,0,0,.05);
}

.ardvi-kpi-value {
  display    : block;
  font-size  : 36px;
  font-weight: 700;
  color      : #1A3C6E;
}

.ardvi-kpi-label {
  display    : block;
  font-size  : 13px;
  color      : var(--ardvi-muted);
  margin-top : 4px;
}


/* ── Responsive mobile ────────────────────────────── */
@media (max-width: 480px) {
  .ardvi-widget {
    bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    right: 12px !important;
    left: auto !important;
  }
  .ardvi-pos-right,
  .ardvi-pos-left {
    right: 12px !important;
    left: auto !important;
  }
  .ardvi-pos-right .ardvi-window,
  .ardvi-pos-left .ardvi-window {
    position: fixed;
    bottom: calc(72px + env(safe-area-inset-bottom, 0px));
    top: calc(12px + env(safe-area-inset-top, 0px));
    right: 8px;
    left: 8px;
    width: auto;
    max-width: calc(100vw - 16px);
    height: auto;
    max-height: none;
    border-radius: 12px;
    overflow: hidden;
  }
  .ardvi-messages {
    max-height: calc(100dvh - 300px);
    min-height: 180px;
  }
  .ardvi-calendar {
    max-height: 180px;
  }
  .ardvi-trigger {
    box-shadow: 0 4px 20px rgba(0,0,0,.35);
  }
  .ardvi-trigger-label { display: none; }
  .ardvi-trigger { padding: 14px; border-radius: 50%; }
}

/* ── Responsive tablette ──────────────────────────── */
@media (min-width: 481px) and (max-width: 768px) {
  :root {
    --ardvi-w: 360px;
    --ardvi-h: 480px;
  }
}

/* ── Thème sombre ─────────────────────────────────── */
.ardvi-theme-dark .ardvi-window { background: #1e2a3a; color: #e8edf2; }
.ardvi-theme-dark .ardvi-messages { background: #1e2a3a; }
.ardvi-theme-dark .ardvi-footer { background: #1e2a3a; border-color: #2d3f52; }
.ardvi-theme-dark .ardvi-msg-agent .ardvi-msg-bubble { background: #2d3f52; color: #e8edf2; }
.ardvi-theme-dark .ardvi-input { background: #2d3f52; border-color: #3d5266; color: #e8edf2; }
.ardvi-theme-dark .ardvi-input:focus { border-color: #5b9bd5; }
.ardvi-theme-dark .ardvi-calendar { background: #172030; border-color: #2d3f52; }
.ardvi-theme-dark .ardvi-slot-date { color: #8fa8c0; }
.ardvi-theme-dark .ardvi-conseiller-btn,
.ardvi-theme-dark .ardvi-slot-btn { background: #2d3f52; color: #a8c4dc; border-color: #3d5266; }

/* ── Fix iOS clavier virtuel ──────────────────────── */
@media (max-width: 480px) {
  body[style*='position: fixed'] .ardvi-window.ardvi-open {
    top: 12px !important;
    bottom: 72px !important;
    height: auto !important;
  }
  .ardvi-window.ardvi-open .ardvi-footer {
    position: sticky;
    bottom: 0;
  }
  .ardvi-window.ardvi-open .ardvi-input {
    font-size: 16px; /* Empêche le zoom auto iOS */
  }
}

/* ── Fix z-index Elementor ────────────────────────── */
.ardvi-widget {
  z-index: 999999 !important;
}
.ardvi-window.ardvi-open {
  z-index: 999999 !important;
}