
    body {
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 0;
      background-color: #f4f4f4;
    }

    .chat-container {
      max-width: 400px;
      margin: 50px auto;
      background-color: #fff;
      border: 1px solid #ccc;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
      border-radius: 5px;
      overflow: hidden;
    }

    .chat-header {
      background-color: #ff2a00;
      color: #fff;
      padding: 10px;
      text-align: center;
      font-size: 18px;
    }

    .chat-body {
      padding: 10px;
      min-height: 300px;
      overflow-y: auto;
    }

    .chat-input {
      display: flex;
      padding: 10px;
    }

    .chat-input input {
      flex: 1;
      padding: 5px;
    }

    .chat-input button {
      background-color: #ff2a00;
      color: #fff;
      border: none;
      padding: 5px 10px;
      cursor: pointer;
    }

    .msg {
      display: flex;
      margin-bottom: 10px;
    }

    .right-msg {
      justify-content: flex-end;
    }

    .left-msg {
      justify-content: flex-start;
    }

    .msg-bubble {
      background-color: #f2f2f2;
      border-radius: 5px;
      padding: 10px;
      max-width: 70%;
    }

    .msg-info {
      font-weight: bold;
      margin-bottom: 5px;
    }

    .msg-text {
      word-wrap: break-word;
    }

    form {
      margin-top: 10px;
    }

    label {
      display: block;
      margin-bottom: 5px;
    }

    textarea {
      width: 100%;
      margin-bottom: 10px;
    }
    .chat-popup {
      display: none;
      position: fixed;
      bottom: 20px;
      right: 20px;
      max-width: 400px;
    }

    .open-chat-btn {
      position: fixed;
      bottom: 20px;
      right: 20px;
      background-color: #007bff00;
      color: #fff;
      padding: 0px;
      border: none;
      cursor: pointer;
    }
    .close-btn{
      float: right;
    }
