/* ═══════════════════════════════════════════════════════
   FRASEG — Estilos del Widget de Chat IA
══════════════════════════════════════════════════════ */

  #fraseg-chat { position:fixed; bottom:24px; right:24px; z-index:9999; font-family:var(--ff-body); }

  /* Toggle button */
  #chat-toggle {
    width:62px; height:62px; border-radius:50%;
    background:var(--navy); border:3px solid var(--gold);
    display:flex; align-items:center; justify-content:center;
    cursor:pointer; box-shadow:0 8px 28px rgba(10,31,68,.35);
    transition:transform .2s, box-shadow .2s; position:relative;
    margin-left:auto;
  }
  #chat-toggle:hover { transform:scale(1.08); box-shadow:0 12px 36px rgba(10,31,68,.45); }
  #chat-toggle svg   { width:28px; height:28px; }
  #chat-notif {
    position:absolute; top:-4px; right:-4px;
    width:18px; height:18px; border-radius:50%;
    background:var(--gold); color:var(--navy);
    font-size:.6rem; font-weight:700;
    display:flex; align-items:center; justify-content:center;
    animation: pulse 2s infinite;
  }
  @keyframes pulse { 0%,100%{transform:scale(1)}50%{transform:scale(1.2)} }

  /* Chat window */
  #chat-window {
    width:360px; max-height:560px;
    background:var(--white); border-radius:20px;
    box-shadow:0 24px 80px rgba(10,31,68,.22);
    display:flex; flex-direction:column;
    overflow:hidden; margin-bottom:14px;
    border:1px solid rgba(10,31,68,.08);
    transform:scale(.92) translateY(16px);
    opacity:0; pointer-events:none;
    transition:all .3s cubic-bezier(.34,1.56,.64,1);
  }
  #chat-window.open { transform:scale(1) translateY(0); opacity:1; pointer-events:all; }

  /* Header */
  .chat-header {
    background:var(--navy); padding:16px 18px;
    display:flex; align-items:center; gap:12px;
  }
  .chat-avatar {
    width:40px; height:40px; border-radius:50%;
    background:var(--gold); display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
  }
  .chat-avatar svg { width:22px; height:22px; stroke:var(--navy); }
  .chat-header-info { flex:1; }
  .chat-header-info strong { display:block; color:var(--white); font-size:.92rem; }
  .chat-header-info span   { color:rgba(255,255,255,.6); font-size:.75rem; }
  .chat-status { width:8px; height:8px; border-radius:50%; background:#4ade80; flex-shrink:0; }
  #close-chat { background:none; border:none; cursor:pointer; color:rgba(255,255,255,.6); font-size:1.2rem; line-height:1; transition:color .2s; }
  #close-chat:hover { color:white; }

  /* Quick actions */
  .quick-actions {
    padding:10px 14px; background:#f8f7f4;
    border-bottom:1px solid #eee;
    display:flex; gap:7px; flex-wrap:wrap;
  }
  .qa-btn {
    font-size:.72rem; padding:5px 12px;
    border-radius:50px; border:1px solid var(--navy);
    background:transparent; color:var(--navy); cursor:pointer;
    font-family:var(--ff-body); font-weight:500;
    transition:background .2s, color .2s; white-space:nowrap;
  }
  .qa-btn:hover { background:var(--navy); color:white; }

  /* Messages */
  #chat-messages {
    flex:1; overflow-y:auto; padding:16px 14px;
    display:flex; flex-direction:column; gap:10px;
    scroll-behavior:smooth;
  }
  #chat-messages::-webkit-scrollbar { width:4px; }
  #chat-messages::-webkit-scrollbar-thumb { background:rgba(10,31,68,.15); border-radius:4px; }

  .msg { display:flex; gap:8px; align-items:flex-end; }
  .msg.bot { flex-direction:row; }
  .msg.user { flex-direction:row-reverse; }

  .msg-avatar {
    width:28px; height:28px; border-radius:50%;
    background:var(--navy); display:flex; align-items:center; justify-content:center;
    flex-shrink:0; font-size:.7rem; color:var(--gold); font-weight:700;
  }
  .msg-bubble {
    max-width:80%; padding:10px 14px; border-radius:16px;
    font-size:.84rem; line-height:1.55;
  }
  .msg.bot  .msg-bubble { background:#f0f2f7; color:var(--dark); border-bottom-left-radius:4px; }
  .msg.user .msg-bubble { background:var(--navy); color:white; border-bottom-right-radius:4px; }
  .msg-bubble a { color:var(--gold); text-decoration:underline; }
  .msg-bubble strong { font-weight:600; }

  /* Typing indicator */
  .typing-dots { display:flex; gap:4px; padding:4px 0; }
  .typing-dots span {
    width:7px; height:7px; border-radius:50%; background:var(--gray);
    animation:bounce .9s infinite;
  }
  .typing-dots span:nth-child(2){animation-delay:.15s}
  .typing-dots span:nth-child(3){animation-delay:.3s}
  @keyframes bounce{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-6px)}}

  /* SOAT card */
  .soat-card {
    background:linear-gradient(135deg,var(--navy),var(--teal));
    border-radius:12px; padding:14px 16px; margin-top:4px;
    color:white;
  }
  .soat-card h4 { font-size:.88rem; margin-bottom:6px; }
  .soat-card p  { font-size:.78rem; opacity:.8; margin-bottom:10px; }
  .soat-card a  {
    display:inline-block; background:var(--gold); color:var(--navy);
    font-weight:700; font-size:.78rem; padding:8px 16px; border-radius:50px;
    text-decoration:none;
  }

  /* Input area */
  .chat-input-area {
    padding:12px 14px; border-top:1px solid #eee;
    display:flex; gap:8px; align-items:center;
    background:white;
  }
  #chat-input {
    flex:1; border:1px solid #dde3ed; border-radius:50px;
    padding:10px 16px; font-family:var(--ff-body); font-size:.84rem;
    outline:none; transition:border-color .2s; resize:none;
    background:#fafafa;
  }
  #chat-input:focus { border-color:var(--navy); }
  #chat-send {
    width:38px; height:38px; border-radius:50%;
    background:var(--navy); border:none; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    transition:background .2s, transform .15s; flex-shrink:0;
  }
  #chat-send:hover { background:var(--teal); transform:scale(1.08); }
  #chat-send svg { width:16px; height:16px; stroke:white; }

  /* WA float */
  .wa-float {
    display:flex; align-items:center; gap:6px;
    font-size:.7rem; color:var(--gray); padding:4px 14px 8px;
    justify-content:center;
  }
  .wa-float a { color:#25d366; font-weight:600; }

  @media(max-width:400px){
    #chat-window{ width:calc(100vw - 24px); right:0; }
  }