/* ═══════════════════════════════════════════════════════════════
   TXIKI MAGAZINE — txiki.css
   Widget chat flottant pour Magazine Immo
   Charte : noir #1a1a1a + orange #E08A30
   ═══════════════════════════════════════════════════════════════ */

/* ─── BULLE FLOTTANTE ─── */
.tx-bubble{
  position:fixed;
  bottom:24px;
  right:24px;
  z-index:9998;
  width:64px;
  height:64px;
  border-radius:50%;
  background:linear-gradient(135deg, #E08A30 0%, #C57220 100%);
  color:#1a1a1a;
  border:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 12px 36px -8px rgba(224,138,48,.55), 0 4px 14px -2px rgba(0,0,0,.25);
  transition:transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s;
  -webkit-tap-highlight-color:transparent;
}
.tx-bubble:hover{
  transform:scale(1.08);
  box-shadow:0 18px 44px -8px rgba(224,138,48,.7), 0 6px 18px -2px rgba(0,0,0,.3);
}
.tx-bubble:active{transform:scale(.95)}
.tx-bubble svg{width:28px;height:28px}
.tx-bubble.open svg.tx-chat-icon{display:none}
.tx-bubble.open svg.tx-close-icon{display:block}
.tx-bubble svg.tx-close-icon{display:none}

/* Notification dot */
.tx-bubble::after{
  content:"";
  position:absolute;
  top:8px;
  right:8px;
  width:12px;
  height:12px;
  border-radius:50%;
  background:#22c55e;
  border:2px solid #fff;
  opacity:0;
  transform:scale(0);
  transition:all .3s;
}
.tx-bubble.pulse::after{
  opacity:1;
  transform:scale(1);
  animation:txPulse 2s ease-in-out infinite;
}
@keyframes txPulse{
  0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(34,197,94,.6)}
  50%{transform:scale(1.15);box-shadow:0 0 0 6px rgba(34,197,94,0)}
}

/* ─── FENÊTRE CHAT ─── */
.tx-window{
  position:fixed;
  bottom:100px;
  right:24px;
  z-index:9999;
  width:380px;
  max-width:calc(100vw - 32px);
  height:580px;
  max-height:calc(100vh - 130px);
  background:#fff;
  border-radius:20px;
  box-shadow:0 30px 80px -16px rgba(0,0,0,.3), 0 12px 24px -8px rgba(0,0,0,.12);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  opacity:0;
  transform:translateY(20px) scale(.95);
  pointer-events:none;
  transition:all .35s cubic-bezier(.16,1,.3,1);
  font-family:'Barlow', system-ui, sans-serif;
}
.tx-window.open{
  opacity:1;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}

/* ─── HEADER ─── */
.tx-header{
  background:linear-gradient(135deg, #1a1a1a 0%, #2a2521 100%);
  color:#fff;
  padding:18px 20px;
  display:flex;
  align-items:center;
  gap:12px;
  position:relative;
  overflow:hidden;
}
.tx-header::before{
  content:"";
  position:absolute;
  top:-40px;
  right:-40px;
  width:120px;
  height:120px;
  background:radial-gradient(circle, rgba(224,138,48,.3), transparent 65%);
  filter:blur(20px);
  pointer-events:none;
}
.tx-avatar{
  position:relative;
  z-index:1;
  width:44px;
  height:44px;
  border-radius:50%;
  background:linear-gradient(135deg, #E08A30, #C57220);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#1a1a1a;
  font-family:'DM Serif Display', serif;
  font-style:italic;
  font-size:22px;
  font-weight:400;
  flex-shrink:0;
  box-shadow:0 4px 12px -2px rgba(224,138,48,.5);
}
.tx-avatar::after{
  content:"";
  position:absolute;
  bottom:0;
  right:0;
  width:12px;
  height:12px;
  border-radius:50%;
  background:#22c55e;
  border:2px solid #1a1a1a;
}
.tx-header-info{
  position:relative;
  z-index:1;
  flex:1;
}
.tx-header-name{
  font-family:'Barlow Condensed', sans-serif;
  font-weight:800;
  font-size:18px;
  letter-spacing:.02em;
  line-height:1.1;
}
.tx-header-status{
  font-family:'DM Mono', monospace;
  font-size:10px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:rgba(255,255,255,.65);
  margin-top:2px;
}
.tx-header-status .dot{
  display:inline-block;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#22c55e;
  margin-right:6px;
  animation:txDot 2s ease-in-out infinite;
}
@keyframes txDot{0%,100%{opacity:1}50%{opacity:.4}}

/* ─── BODY (messages) ─── */
.tx-body{
  flex:1;
  overflow-y:auto;
  padding:20px 18px 12px;
  background:#FBF8F0;
  display:flex;
  flex-direction:column;
  gap:14px;
  scroll-behavior:smooth;
}
.tx-body::-webkit-scrollbar{width:6px}
.tx-body::-webkit-scrollbar-thumb{background:rgba(0,0,0,.12);border-radius:3px}
.tx-body::-webkit-scrollbar-track{background:transparent}

.tx-msg{
  max-width:84%;
  padding:11px 16px;
  border-radius:18px;
  font-size:14.5px;
  line-height:1.5;
  word-wrap:break-word;
  animation:txMsgIn .35s cubic-bezier(.16,1,.3,1);
}
@keyframes txMsgIn{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}
.tx-msg.assistant{
  align-self:flex-start;
  background:#fff;
  color:#1a1a1a;
  border-top-left-radius:6px;
  box-shadow:0 2px 8px -2px rgba(0,0,0,.06);
  border:1px solid rgba(0,0,0,.05);
}
.tx-msg.user{
  align-self:flex-end;
  background:linear-gradient(135deg, #1a1a1a, #2a2521);
  color:#fff;
  border-top-right-radius:6px;
}
.tx-msg strong{color:#E08A30}
.tx-msg.user strong{color:#E08A30}
.tx-msg a{
  color:#E08A30;
  font-weight:600;
  text-decoration:none;
  border-bottom:1px solid currentColor;
}

/* Typing indicator */
.tx-typing{
  align-self:flex-start;
  display:flex;
  gap:4px;
  padding:14px 16px;
  background:#fff;
  border-radius:18px;
  border-top-left-radius:6px;
  border:1px solid rgba(0,0,0,.05);
  box-shadow:0 2px 8px -2px rgba(0,0,0,.06);
}
.tx-typing span{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#E08A30;
  animation:txTyping 1.4s ease-in-out infinite;
}
.tx-typing span:nth-child(2){animation-delay:.2s}
.tx-typing span:nth-child(3){animation-delay:.4s}
@keyframes txTyping{
  0%,60%,100%{transform:translateY(0);opacity:.4}
  30%{transform:translateY(-6px);opacity:1}
}

/* Suggestions chips */
.tx-suggestions{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding:4px 0 8px;
}
.tx-chip{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  color:#1a1a1a;
  padding:8px 14px;
  border-radius:50px;
  font-family:'Barlow', sans-serif;
  font-size:12.5px;
  font-weight:500;
  cursor:pointer;
  transition:all .2s;
  white-space:nowrap;
}
.tx-chip:hover{
  background:#E08A30;
  border-color:#E08A30;
  color:#1a1a1a;
  transform:translateY(-1px);
  box-shadow:0 4px 10px -2px rgba(224,138,48,.35);
}

/* ─── FOOTER (input) ─── */
.tx-footer{
  padding:12px 14px 14px;
  background:#fff;
  border-top:1px solid rgba(0,0,0,.06);
  display:flex;
  gap:10px;
  align-items:flex-end;
}
.tx-input{
  flex:1;
  background:#FBF8F0;
  border:1px solid rgba(0,0,0,.06);
  border-radius:22px;
  padding:11px 16px;
  font-family:'Barlow', sans-serif;
  font-size:14.5px;
  line-height:1.4;
  color:#1a1a1a;
  resize:none;
  outline:none;
  min-height:44px;
  max-height:120px;
  transition:border-color .2s, background .2s;
}
.tx-input:focus{
  border-color:#E08A30;
  background:#fff;
}
.tx-input::placeholder{color:#8B8579}
.tx-send{
  width:44px;
  height:44px;
  border-radius:50%;
  background:linear-gradient(135deg, #E08A30, #C57220);
  color:#1a1a1a;
  border:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  transition:transform .2s, opacity .2s;
}
.tx-send svg{width:20px;height:20px}
.tx-send:hover{transform:scale(1.05)}
.tx-send:active{transform:scale(.95)}
.tx-send:disabled{opacity:.4;cursor:not-allowed;transform:none}

/* Disclaimer en bas */
.tx-disclaimer{
  text-align:center;
  font-size:10px;
  font-family:'DM Mono', monospace;
  color:#8B8579;
  letter-spacing:.05em;
  padding:6px 12px 8px;
  background:#fff;
}
.tx-disclaimer a{color:#E08A30;text-decoration:none}

/* ─── MOBILE ─── */
@media (max-width:480px){
  .tx-bubble{
    bottom:78px;
    right:18px;
    width:56px;
    height:56px;
  }
  .tx-bubble svg{width:24px;height:24px}
  .tx-window{
    bottom:0;
    right:0;
    left:0;
    width:100%;
    max-width:100%;
    height:100vh;
    max-height:100vh;
    border-radius:0;
  }
}

/* Si bottom-nav présent sur mobile, décale la bulle */
@media (max-width:768px){
  body.has-bottom-nav .tx-bubble{bottom:78px}
}


/* PN_TXIKI_LINKS_v1 BEGIN */
/* Style des liens dans les messages Txiki */
.tx-msg .tx-link, .tx-msg a{
  display:inline-flex;
  align-items:center;
  gap:5px;
  background:rgba(224,138,48,.14);
  color:#C57220 !important;
  padding:2px 10px;
  margin:1px 1px;
  border-radius:50px;
  text-decoration:none !important;
  font-weight:600;
  font-size:13.5px;
  border:1px solid rgba(224,138,48,.3);
  transition:all .2s;
  border-bottom:1px solid rgba(224,138,48,.3) !important;
  line-height:1.4;
}
.tx-msg .tx-link::after, .tx-msg a:not([target='_blank'])::after{
  content:'→';
  font-size:13px;
  transition:transform .2s;
}
.tx-msg a[target='_blank']::after{
  content:'↗';
  font-size:13px;
}
.tx-msg .tx-link:hover, .tx-msg a:hover{
  background:#E08A30;
  color:#1a1a1a !important;
  border-color:#E08A30;
  transform:translateY(-1px);
  box-shadow:0 4px 12px -2px rgba(224,138,48,.4);
}
.tx-msg .tx-link:hover::after, .tx-msg a:not([target='_blank']):hover::after{
  transform:translateX(2px);
}
/* Cas spécial : liens dans message USER (fond noir) */
.tx-msg.user .tx-link, .tx-msg.user a{
  background:rgba(224,138,48,.2);
  color:#E08A30 !important;
  border-color:rgba(224,138,48,.4);
}
/* PN_TXIKI_LINKS_v1 END */