/* =========== DoctorFIN Chat – SCOPED CSS =========== */
/* lớp cha: <div class="doctorfin-wrapper df-chat-widget"> */

.doctorfin-wrapper.df-chat-widget .row{
    display:flex;flex-flow:row wrap;width:100%;max-width:none;
}

/* reset margin nội bộ */
.doctorfin-wrapper.df-chat-widget p,
.doctorfin-wrapper.df-chat-widget form,
.doctorfin-wrapper.df-chat-widget input{margin:0;}

.doctorfin-wrapper.df-chat-widget svg{display:flex;}

.doctorfin-wrapper.df-chat-widget li{list-style:none;margin:0;}
.doctorfin-wrapper.df-chat-widget ul{margin:0;}

/* khung */
.doctorfin-wrapper.df-chat-widget{
    display:flex;flex-flow:row wrap;width:100%;max-width:none;
}
.doctorfin-wrapper.df-chat-widget>.doctorfin-main{
    display:flex;gap:10px;flex-direction:row;width:100%;max-width:1800px;
}
.doctorfin-wrapper.df-chat-widget .doctorfin-body{
    margin:1.25rem 0 2.5rem;width:100%;
}

/* header */
.doctorfin-wrapper.df-chat-widget .doctorfin-header{
    display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;
}
.doctorfin-wrapper.df-chat-widget .doctorfin-title{
    font-size:1.125rem;font-weight:600;color:#6b21a8;
}

/* chat container */
.doctorfin-wrapper.df-chat-widget .doctorfin-chat-container{
    background:#faf6ff;border:1px solid #d8b4fe;border-radius:.5rem;
    padding:1rem;width:100%;box-shadow:0 4px 6px rgba(0,0,0,.1);
}
.doctorfin-wrapper.df-chat-widget .doctorfin-chat-box{
    overflow-y:auto;max-height:16rem;min-height:620px;margin-bottom:1rem;
}

/* message */
.doctorfin-wrapper.df-chat-widget .doctorfin-message{
    padding:.5rem;border-radius:.5rem;width:fit-content;margin-bottom:.5rem;
}
.doctorfin-wrapper.df-chat-widget .doctorfin-message>p{font-size:16px;margin:0;}

.doctorfin-wrapper.df-chat-widget .doctorfin-message.bot{background:#ddd6fe;}
.doctorfin-wrapper.df-chat-widget .doctorfin-message.user{
    background:#e9d5ff;margin-left:auto;text-align:right;
}

/* markdown trong bot */
.doctorfin-wrapper.df-chat-widget .doctorfin-message.bot h1,
.doctorfin-wrapper.df-chat-widget .doctorfin-message.bot h2,
.doctorfin-wrapper.df-chat-widget .doctorfin-message.bot h3{
    margin:.4em 0 .2em;font-weight:600;
}
.doctorfin-wrapper.df-chat-widget .doctorfin-message.bot ul,
.doctorfin-wrapper.df-chat-widget .doctorfin-message.bot ol{
    padding-left:1.4em;margin:.3em 0;
}
.doctorfin-wrapper.df-chat-widget .doctorfin-message.bot li{
    list-style:disc;margin:.15em 0;
}
.doctorfin-wrapper.df-chat-widget .doctorfin-message.bot pre,
.doctorfin-wrapper.df-chat-widget .doctorfin-message.bot code{
    background:#f0f0f0;border-radius:.25rem;padding:.2em .4em;
    font-family:monospace;font-size:.9em;
}

/* gợi ý */
.doctorfin-wrapper.df-chat-widget .doctorfin-suggested{margin-bottom:1rem;}
.doctorfin-wrapper.df-chat-widget .doctorfin-suggested p{
    font-weight:600;margin:0 0 .5rem;
}
.doctorfin-wrapper.df-chat-widget .doctorfin-suggestion{
    background:#f3e8ff;border-radius:.5rem;padding:.5rem;margin-bottom:.25rem;
    cursor:pointer;transition:background .2s;
}


/* form nhập */
.doctorfin-wrapper.df-chat-widget .doctorfin-input-form{display:flex;}
.doctorfin-wrapper.df-chat-widget .doctorfin-message-input{
    border:1px solid #d8b4fe;border-radius:.5rem;padding:.5rem .75rem;
    flex-grow:1;margin-right:.5rem;
}
.doctorfin-wrapper.df-chat-widget .doctorfin-send-button{
    background:#7e22ce;color:#fff;font-weight:bold;border:0;border-radius:.5rem;
    cursor:pointer;margin:0;
}
.doctorfin-wrapper.df-chat-widget .doctorfin-send-button:hover{
    background:#6b21a8;
}

/* --------- SIDEBAR --------- */
.doctorfin-wrapper.df-chat-widget .doctorfin-sidebar{display:none;}

@media (min-width:1280px){
  .doctorfin-wrapper.df-chat-widget .doctorfin-sidebar{
      display:block;width:20rem;padding:0 1.25rem;margin:2.5rem 0;
      border-radius:1.5rem 0 0 1.5rem;
      background:linear-gradient(to right,#f9a8d4,#bfdbfe);color:#000;
  }
  .doctorfin-wrapper.df-chat-widget .doctorfin-sidebar nav ul{
      margin-top:1rem;display:flex;flex-direction:column;gap:.5rem;
  }
  .doctorfin-wrapper.df-chat-widget .doctorfin-sidebar nav ul li a{
      display:block;padding:.65rem 1rem;font-size:1.1rem;font-weight:800;
      border-radius:.75rem;transition:background .2s;
  }
  .doctorfin-wrapper.df-chat-widget .doctorfin-sidebar nav ul li a:hover{
      background:#e9d5ff;
  }
  .doctorfin-wrapper.df-chat-widget .doctorfin-sidebar .active{
      background:linear-gradient(to right,#9333ea,#f472b6);color:#fff;
  }
}
/* =========== End DoctorFIN Chat =========== */